/* ═══════════════════════════════════════════════════
   HOMEPAGE V6 — Pixel-perfect clone of preview HTML
   Loaded only on front page for cache isolation
   ═══════════════════════════════════════════════════ */

/* HERO */
.hero-v6{background:linear-gradient(135deg,#1B4F72 0%,#2E86C1 50%,#3498DB 100%) !important;color:#fff !important;padding:4rem 1rem 3.5rem;text-align:center}
.hero-v6__inner{max-width:56rem;margin:0 auto}
.hero-v6__title{font-size:2.5rem;font-weight:800;line-height:1.15;margin-bottom:1rem;letter-spacing:-.5px;color:#fff !important}
.hero-v6__sub{color:#AED6F1 !important;font-size:1.125rem;line-height:1.7;max-width:42rem;margin:0 auto 2rem;font-weight:400}
.hero-v6__search{max-width:42rem;margin:0 auto 2.5rem;position:relative}
.hero-v6__search form{position:relative;display:flex;align-items:center}
.hero-v6__search svg{position:absolute;left:1.25rem;top:50%;transform:translateY(-50%);z-index:2;pointer-events:none}
.hero-v6__search input[type="text"]{width:100%;padding:1rem 1.5rem 1rem 3.5rem;border-radius:16px;border:none;font-size:1.125rem;color:#1f2937;box-shadow:0 12px 40px rgba(0,0,0,0.2);outline:none;background:#fff}
.hero-v6__search input[type="text"]:focus{box-shadow:0 12px 40px rgba(0,0,0,0.2),0 0 0 4px rgba(133,193,233,0.5)}
.hero-v6__search input[type="text"]::placeholder{color:#9ca3af}
.hero-v6__stats{display:flex !important;flex-direction:row !important;justify-content:center;gap:2rem;margin-top:2.5rem;font-size:.875rem}
.h-stat{text-align:center}
.h-stat__n{display:block;font-size:1.875rem;font-weight:700;color:#fff}
.h-stat__l{color:#AED6F1;margin-top:.125rem;display:block}

/* SECTION HEADS */
.sec-head{display:flex !important;align-items:center;justify-content:space-between;margin-bottom:2rem}
.sec-head h3{font-size:1.5rem;font-weight:700;color:#1f2937}
.sec-head a{font-size:.875rem;font-weight:500;color:#2E86C1}
.sec-head a:hover{text-decoration:underline}
.sec-title{font-size:1.5rem;font-weight:700;color:#1f2937;margin-bottom:1.5rem}

/* CATEGORIES — 5-col grid */
.cats-v6{padding:3rem 0}
.cats-v6__grid{display:grid !important;grid-template-columns:repeat(5,1fr) !important;gap:1rem}
.ccard6{display:flex !important;flex-direction:column !important;align-items:center !important;background:#fff;border-radius:16px;padding:1.25rem;text-align:center;border:1px solid #f5f5f4;box-shadow:0 1px 2px rgba(28,25,23,0.04);transition:all .3s ease;cursor:pointer}
.ccard6:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.12)}
.ccard6__em{font-size:2.25rem;margin-bottom:.75rem;line-height:1}
.ccard6__nm{font-weight:600;font-size:.875rem;color:#1f2937}
.ccard6__ct{font-size:.75rem;color:#9ca3af;margin-top:.25rem}

/* AD BANNER */
.ad-banner-wrap{margin-bottom:2rem}

/* FEATURED — 3 cards */
.feat-v6{padding:2rem 0}
.feat-v6__grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:1.5rem}
.fcard6{background:#fff;border-radius:16px;overflow:hidden;border:1px solid #f5f5f4;box-shadow:0 1px 2px rgba(28,25,23,0.04);transition:all .3s ease}
.fcard6:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.12)}
.fcard6__top{display:flex !important;align-items:center;justify-content:center;height:176px;position:relative}
.fcard6__top.from-primary{background:linear-gradient(135deg,#D6EAF8,#AED6F1) !important}
.fcard6__top.from-accent{background:linear-gradient(135deg,#D5F5E3,#ABEBC6) !important}
.fcard6__top.from-warning{background:linear-gradient(135deg,#FCF3CF,#F9E79F) !important}
.fcard6__em{font-size:3.75rem;line-height:1}
.bv6{position:absolute;top:.75rem;left:.75rem;background:#2ECC71;color:#fff;font-size:.7rem;font-weight:600;padding:2px 8px;border-radius:9999px;display:inline-flex;align-items:center}
.bs6{position:absolute;top:.75rem;right:.75rem;background:#FBBF24;color:#92400E;font-size:.7rem;font-weight:600;padding:2px 8px;border-radius:9999px;display:inline-flex;align-items:center}
.fcard6__body{padding:1.25rem}
.fcard6__cat{font-size:.75rem;font-weight:600;color:#2E86C1;margin-bottom:.25rem}
.fcard6__body h4{font-weight:700;font-size:1.125rem;color:#1f2937;margin-bottom:.25rem}
.fcard6__body h4 a{color:inherit;text-decoration:none}
.fcard6__addr{font-size:.875rem;color:#6b7280;display:flex;align-items:center;gap:.25rem;margin-top:.25rem}
.fcard6__btns{display:flex !important;gap:.5rem;margin-top:1rem}
.abtn6{flex:1;display:inline-flex !important;align-items:center;justify-content:center;gap:.25rem;padding:.625rem 0;font-size:.75rem;font-weight:600;border-radius:12px;color:#fff !important;text-decoration:none;transition:all .15s}
.abtn6--call{background:#2ECC71 !important}.abtn6--call:hover{background:#27AE60 !important}
.abtn6--wa{background:#22c55e !important}.abtn6--wa:hover{background:#16a34a !important}
.abtn6--dir{background:#3498DB !important}.abtn6--dir:hover{background:#2E86C1 !important}

/* LATEST */
.latest-v6{padding:2rem 0}
.latest-v6__list{display:flex !important;flex-direction:column;gap:.75rem}
.litem6{display:flex !important;align-items:center;gap:1rem;background:#fff;border-radius:12px;padding:1rem;border:1px solid #f5f5f4;box-shadow:0 1px 2px rgba(28,25,23,0.04);transition:all .3s ease;text-decoration:none;color:inherit}
.litem6:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.12)}
.litem6__ico{width:48px;height:48px;border-radius:12px;display:flex !important;align-items:center;justify-content:center;flex-shrink:0}
.litem6__ico span{font-size:1.5rem}
.litem6__info{flex:1;min-width:0}
.litem6__info h4{font-weight:600;color:#1f2937;font-size:.9375rem;margin:0}
.litem6__info p{font-size:.75rem;color:#9ca3af;margin:.125rem 0 0}
.litem6__right{display:flex;align-items:center;gap:.75rem;flex-shrink:0}
.bv6-sm{background:#EAFAF1;color:#229954;font-size:.7rem;font-weight:600;padding:2px 8px;border-radius:9999px;border:1px solid #ABEBC6;white-space:nowrap}
.litem6__time{font-size:.75rem;color:#9ca3af;white-space:nowrap}

/* GUIDES */
.guides-v6{background:rgba(235,245,251,0.5);padding:3rem 0}
.guides-v6__grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:1.5rem}
.gcard6{display:flex !important;flex-direction:column;background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 1px 2px rgba(28,25,23,0.04);transition:all .3s ease;text-decoration:none;color:inherit}
.gcard6:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.12)}
.gcard6__badges{display:flex;gap:.5rem;margin-bottom:.75rem}
.gbadge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:9999px;font-size:.7rem;font-weight:600}
.bg-easy{background:#D5F5E3;color:#229954}.bg-med{background:#FCF3CF;color:#D4AC0D}.bg-hard{background:#FFF1F2;color:#BE123C}
.bg-tag{background:#D6EAF8;color:#2471A3}
.gcard6 h4{font-weight:700;font-size:1.125rem;color:#1f2937;margin:0 0 .5rem}
.gcard6 p{font-size:.875rem;color:#6b7280;flex:1;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.gcard6__meta{display:flex;gap:.5rem;font-size:.75rem;color:#9ca3af;margin-top:1rem}

/* CTA */
.cta-v6{max-width:56rem;margin:0 auto;padding:3rem 1rem}
.cta-v6__box{background:linear-gradient(135deg,#2471A3,#1B4F72) !important;border-radius:24px;padding:2.5rem;text-align:center;color:#fff !important}
.cta-v6__box h3{font-size:1.875rem;font-weight:700;margin-bottom:.75rem;color:#fff}
.cta-v6__box p{color:#AED6F1;margin-bottom:1.5rem;font-size:1rem}
.cta-v6__btn{display:inline-flex;background:#fff !important;color:#1B4F72 !important;font-weight:700;padding:.875rem 2rem;border-radius:12px;font-size:.875rem;transition:all .2s;box-shadow:0 4px 12px rgba(0,0,0,0.15);text-decoration:none}
.cta-v6__btn:hover{background:#EBF5FB !important;transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.2)}

/* RESPONSIVE */
@media(min-width:768px){.hero-v6__title{font-size:3rem}}
@media(max-width:1024px){.cats-v6__grid{grid-template-columns:repeat(4,1fr) !important}}
@media(max-width:768px){
  .cats-v6__grid{grid-template-columns:repeat(3,1fr) !important}
  .feat-v6__grid{grid-template-columns:1fr !important}
  .guides-v6__grid{grid-template-columns:1fr !important}
  .hero-v6{padding:3rem 1rem 2.5rem}
  .hero-v6__title{font-size:2rem}
  .hero-v6__stats{gap:1.5rem}
  .h-stat__n{font-size:1.5rem}
  .fcard6__top{height:140px}
  .litem6__right{flex-direction:column;align-items:flex-end;gap:.25rem}
}
@media(max-width:480px){
  .cats-v6__grid{grid-template-columns:repeat(2,1fr) !important}
  .hero-v6__title{font-size:1.625rem}
  .hero-v6__sub{font-size:1rem}
  .fcard6__btns{flex-wrap:wrap}
  .abtn6{flex:none;width:calc(50% - .25rem)}
}

/* AD BANNER DEFAULT */
.ad-banner-wrap{margin-bottom:2rem}
.ad-banner-default{background:linear-gradient(135deg,#FFFBEB,#FFF7ED);border:1px solid #FDE68A;border-radius:16px;padding:1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.ad-banner-default__label{font-size:.625rem;text-transform:uppercase;letter-spacing:.75px;font-weight:600;color:#D97706}
.ad-banner-default__text h4{font-size:1.125rem;font-weight:700;color:#1f2937;margin:.25rem 0}
.ad-banner-default__text p{font-size:.875rem;color:#6b7280;margin:0}
.ad-banner-default__cta{background:#FEF3C7;border-radius:12px;padding:2rem 1.5rem;color:#92400E;font-weight:700;font-size:.875rem;flex-shrink:0}

/* MOBILE APP-LIKE IMPROVEMENTS */
@media(max-width:768px){
  body{-webkit-tap-highlight-color:transparent}
  .site-header{position:sticky;top:0;z-index:100}
  .hero-v6{padding:2.5rem 1rem 2rem}
  .hero-v6__title{font-size:1.75rem;line-height:1.2}
  .hero-v6__sub{font-size:.9375rem;margin-bottom:1.5rem}
  .hero-v6__search input[type="text"]{padding:.875rem 1.25rem .875rem 3rem;font-size:1rem;border-radius:14px}
  .hero-v6__stats{gap:1.25rem;margin-top:1.5rem}
  .h-stat__n{font-size:1.5rem}
  .h-stat__l{font-size:.75rem}
  .cats-v6{padding:1.5rem 0}
  .sec-head{margin-bottom:1rem}
  .sec-head h3{font-size:1.25rem}
  .ccard6{padding:1rem;border-radius:14px}
  .ccard6__em{font-size:1.75rem;margin-bottom:.5rem}
  .ccard6__nm{font-size:.8125rem}
  .feat-v6{padding:1rem 0}
  .fcard6__top{height:120px}
  .fcard6__em{font-size:2.75rem}
  .fcard6__body{padding:1rem}
  .fcard6__body h4{font-size:1rem}
  .abtn6{padding:.5rem 0;font-size:.6875rem;border-radius:10px}
  .latest-v6{padding:1rem 0}
  .litem6{padding:.875rem;border-radius:14px}
  .litem6__ico{width:40px;height:40px;border-radius:10px}
  .litem6__ico span{font-size:1.25rem}
  .litem6__info h4{font-size:.875rem}
  .guides-v6{padding:1.5rem 0}
  .gcard6{padding:1.25rem;border-radius:14px}
  .cta-v6{padding:1.5rem 1rem}
  .cta-v6__box{padding:2rem 1.5rem;border-radius:20px}
  .cta-v6__box h3{font-size:1.375rem}
  .ad-banner-default{flex-direction:column;text-align:center;padding:1.25rem}
  .ad-banner-default__cta{padding:1rem;width:100%}
  .container{padding:0 1rem}
}
@media(max-width:380px){
  .cats-v6__grid{grid-template-columns:repeat(2,1fr) !important;gap:.625rem}
  .abtn6{flex:none;width:100%}
}