/* =========================================================================
   AI Search Score — homepage design (home.css)
   The homepage is rendered as clean HTML in front-page.php (no Gutenberg
   wrappers). This stylesheet styles those semantic classes directly.
   Teal (#109e8d) + dark slate · Space Grotesk / Figtree · light + dark modes.
   ========================================================================= */
:root{
  --h-teal:#109e8d; --h-teal-d:#0b7469;
  --h-ink:#16232b; --h-slate:#57697a; --h-deep:#0d2a31;
  --h-line:#e3e9ec; --h-soft:#eef2f3; --h-card:#ffffff; --h-page:#f4f7f7; --h-band:#ffffff;
  --h-shadow:0 1px 2px rgba(16,40,50,.04), 0 12px 32px -12px rgba(16,40,50,.14);
  --h-maxw:1140px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-ll-light]){
    --h-page:#0f1316; --h-band:#151a1e; /* 1.5.4: page + band must flip too (ghosted-H1 root cause) */
    --h-ink:#e9eef1; --h-slate:#a2adb8; --h-line:#2b3138;
    --h-soft:#191d21; --h-card:#1b2024; --h-deep:#0c2b32; --h-teal:#28b6a4; --h-teal-d:#5fd6c6;
  }
}

/* Container + band helpers */
.home{background:var(--h-page)}
.home .ll-main,.home main{background:var(--h-page)}
.aiss-x{max-width:var(--h-maxw);margin:0 auto;padding-inline:24px}
.aiss-band{width:100%;margin-block:0}
.aiss-band--soft{background:var(--h-band);border-block:1px solid var(--h-line);padding-block:64px}
.home main, .home .ll-main{overflow-x:clip}

/* Typography base for the homepage */
.home .aiss-hero,.home .aiss-band,.home section.aiss-x{font-family:"Figtree",system-ui,sans-serif;color:var(--h-ink)}
.home .aiss-hero h1,.home section h2,.home h3{font-family:"Space Grotesk",system-ui,sans-serif;letter-spacing:-.02em;line-height:1.12}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.9rem;color:var(--h-teal-d);margin:0 0 .5rem}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--h-teal)}

/* HERO */
.aiss-hero{max-width:var(--h-maxw);margin:0 auto;padding:72px 24px 8px}
.aiss-hero__inner{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center}
.aiss-hero h1{font-weight:700;font-size:clamp(2.3rem,1.5rem+2.4vw,3.3rem);color:var(--h-ink);margin:0 0 1rem;max-width:15ch}
.aiss-hero .lead{font-size:1.15rem;line-height:1.55;color:var(--h-slate);margin:0;max-width:44ch}
.aiss-hero .chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}
.aiss-hero .chip{font-size:.82rem;color:var(--h-slate);background:var(--h-soft);border:1px solid var(--h-line);padding:.35rem .75rem;border-radius:999px;font-weight:500}
.aiss-hero__card{background:#fff;border:1px solid var(--h-line);border-radius:20px;box-shadow:var(--h-shadow);padding:26px}
.aiss-hero__card-title{font-family:"Space Grotesk";font-weight:600;font-size:1.12rem;line-height:1.25;color:#16232b;margin-bottom:1rem}
.aiss-hero__card .aiss-scan,.aiss-hero__card .aiss-scan__box{border:0;padding:0;background:none;box-shadow:none;margin:0}

/* WHY */
.aiss-why{display:grid;grid-template-columns:repeat(3,1fr);gap:44px}
.aiss-why__item h3{font-size:1.15rem;margin:0 0 .45rem;color:var(--h-ink)}
.aiss-why__item p{color:var(--h-slate);font-size:.98rem;margin:0;line-height:1.55}

/* PROOF */
.aiss-proof{background:var(--h-deep);color:#eaf3f2;border-radius:20px;padding:60px;margin-block:72px}
.aiss-proof .eyebrow--light{color:#5fd6c6}
.aiss-proof .eyebrow--light::before{background:#5fd6c6}
.aiss-proof h2{color:#fff;font-size:clamp(1.7rem,1.3rem+1.4vw,2.2rem);max-width:22ch;margin:.4rem 0 1rem}
.aiss-proof p{color:#b9d0cd;max-width:62ch;margin:0}
.aiss-proof a{color:#7fe3d4;font-weight:600}
.aiss-proof__stats{display:flex;gap:2.6rem;flex-wrap:wrap;margin:1.8rem 0}
.aiss-proof__stats .n{font-family:"Space Grotesk";font-weight:700;font-size:2.6rem;color:#fff;line-height:1;display:block}
.aiss-proof__stats .l{font-size:.86rem;color:#9dbcb8;margin-top:.35rem;display:block;max-width:17ch}
.aiss-proof__verify{margin-top:1.4rem;font-size:.95rem}

/* SECTION shell */
.aiss-sect{padding-block:72px}
.aiss-band--soft .aiss-sect{padding-block:0}
.aiss-sect__title{font-size:clamp(1.7rem,1.3rem+1.4vw,2.1rem);max-width:24ch;margin:.2rem 0 .6rem}
.aiss-sect__intro{color:var(--h-slate);font-size:1.05rem;max-width:62ch;margin:.4rem 0 0}

/* CHECKS */
.aiss-checks{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:38px}
.aiss-check{border:1px solid var(--h-line);border-radius:14px;padding:24px 26px;background:var(--h-card);box-shadow:0 1px 2px rgba(16,40,50,.04),0 8px 20px -14px rgba(16,40,50,.12)}
.aiss-check h3{font-size:1.1rem;margin:0 0 .4rem}
.aiss-check p{color:var(--h-slate);font-size:.96rem;margin:0}

/* STEPS */
.aiss-steps{list-style:none;margin:38px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;counter-reset:s}
.aiss-steps li{position:relative;padding-top:52px;color:var(--h-slate);font-size:.97rem}
.aiss-steps li::before{counter-increment:s;content:counter(s);position:absolute;top:0;left:0;width:36px;height:36px;font-family:"Space Grotesk";font-weight:700;color:var(--h-teal-d);border:1.5px solid var(--h-teal);border-radius:50%;display:flex;align-items:center;justify-content:center}
.aiss-steps li strong{display:block;font-family:"Space Grotesk";font-size:1.08rem;color:var(--h-ink);margin-bottom:.3rem}

/* PRICING */
.aiss-prices{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:38px}
.aiss-price{border:1px solid var(--h-line);border-radius:14px;padding:20px 22px;background:var(--h-card);box-shadow:0 1px 2px rgba(16,40,50,.04),0 8px 20px -14px rgba(16,40,50,.12)}
.aiss-price .p{font-family:"Space Grotesk";font-weight:700;font-size:1.3rem;display:block;color:var(--h-ink)}
.aiss-price .p small{font-size:.78rem;color:var(--h-slate);font-weight:500}
.aiss-price .d{font-size:.9rem;color:var(--h-slate);margin-top:.25rem;display:block}

/* FAQ */
.aiss-faq{margin-top:36px;border-top:1px solid var(--h-line)}
.aiss-faq details{border-bottom:1px solid var(--h-line)}
.aiss-faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;position:relative;font-family:"Space Grotesk";font-weight:600;font-size:1.12rem;color:var(--h-ink)}
.aiss-faq summary::-webkit-details-marker{display:none}
.aiss-faq summary::after{content:"+";position:absolute;right:4px;top:15px;font-size:1.5rem;color:var(--h-teal);font-weight:400}
.aiss-faq details[open] summary::after{content:"–"}
.aiss-faq p{color:var(--h-slate);padding:0 0 22px;max-width:64ch;margin:0}

/* FINAL CTA */
.aiss-final{background:var(--h-deep);color:#fff;border-radius:20px;padding:60px;text-align:center;margin-block:72px}
.aiss-final h2{color:#fff;font-size:clamp(1.7rem,1.3rem+1.4vw,2.1rem);margin:0 0 .5rem}
.aiss-final p{color:#b9d0cd;margin:0 0 1.6rem}
.aiss-final__cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.aiss-btn{display:inline-flex;align-items:center;font-family:"Figtree";font-weight:600;font-size:1rem;padding:.85rem 1.6rem;border-radius:11px;border:1.5px solid transparent;text-decoration:none}
.aiss-btn--primary{background:var(--h-teal);color:#fff}
.aiss-btn--primary:hover{background:var(--h-teal-d)}
.aiss-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.32)}
.aiss-btn--ghost:hover{border-color:#fff}

/* dark-mode: keep the scanner card a light 'app surface' */
@media (prefers-color-scheme: dark){
  :root:not([data-ll-light]) .aiss-hero__card{background:#fff}
  :root:not([data-ll-light]) .aiss-hero__card-title{color:#16232b}
  :root:not([data-ll-light]) .aiss-proof,
  :root:not([data-ll-light]) .aiss-final{border:1px solid #17414a}
  :root:not([data-ll-light]) .aiss-band--soft{background:#1b2024}
}

/* Responsive */
@media(max-width:860px){
  .aiss-hero__inner{grid-template-columns:1fr;gap:30px}
  .aiss-hero{padding:44px 24px 0}
  .aiss-why{grid-template-columns:1fr;gap:28px}
  .aiss-checks{grid-template-columns:1fr}
  .aiss-steps{grid-template-columns:1fr;gap:30px}
  .aiss-prices{grid-template-columns:1fr 1fr}
  .aiss-proof,.aiss-final{padding:36px 24px;margin-block:44px}
  .aiss-sect{padding-block:48px}
}
@media(max-width:480px){ .aiss-prices{grid-template-columns:1fr} }

/* =========================================================================
   DARK-MODE READABILITY FIX (v1.5.2): force explicit, high-contrast colours on
   hero text + chips so nothing ghosts, regardless of theme dark rules.
   ========================================================================= */
.home .aiss-hero h1{color:var(--h-ink) !important;-webkit-text-fill-color:currentColor;opacity:1}
.home .aiss-hero .lead{color:var(--h-slate) !important}
.home .aiss-hero .eyebrow,.home .eyebrow{color:var(--h-teal-d) !important}
.home .aiss-hero .chip{color:var(--h-ink) !important;background:var(--h-card) !important;border-color:var(--h-line) !important}
.home .aiss-why__item h3,.home .aiss-sect__title,.home .aiss-check h3,
.home .aiss-price .p,.home .aiss-faq summary{color:var(--h-ink) !important}
.home .aiss-why__item p,.home .aiss-check p,.home .aiss-price .d,
.home .aiss-sect__intro,.home .aiss-faq p{color:var(--h-slate) !important}

@media (prefers-color-scheme: dark){
  :root:not([data-ll-light]) .home .aiss-hero h1{color:#eef2f5 !important}
  :root:not([data-ll-light]) .home .aiss-hero .lead{color:#b6c1cb !important}
  :root:not([data-ll-light]) .home .aiss-hero .chip{color:#dfe6ea !important;background:#1e242a !important;border-color:#2d343b !important}
  :root:not([data-ll-light]) .home .aiss-hero .eyebrow{color:#5fd6c6 !important}
}

/* =========================================================================
   HERO H1 — unconditional readable fix (v1.5.3). No vars, no theme-guard
   dependency. Explicit colours per scheme, maximum specificity.
   ========================================================================= */
html body.home .aiss-hero .aiss-hero__copy h1{
  color:#16232b !important;
  -webkit-text-fill-color:#16232b !important;
  opacity:1 !important;
  text-shadow:none !important;
  -webkit-text-stroke:0 !important;
  background:none !important;
  filter:none !important;
}
@media (prefers-color-scheme: dark){
  html body.home .aiss-hero .aiss-hero__copy h1{
    color:#f2f5f7 !important;
    -webkit-text-fill-color:#f2f5f7 !important;
  }
  html body.home .aiss-hero .aiss-hero__copy .lead{color:#c2ccd4 !important}
}

/* =========================================================================
   MOBILE OVERFLOW FIX (v1.5.5): grid/flex children default to min-width:auto,
   so a wide child (the scanner card's content) refuses to shrink and pushes the
   whole card off-screen. Allow shrinking + clip, and stop any horizontal spill.
   ========================================================================= */
html,body{overflow-x:hidden}
.home .aiss-hero__inner > *{min-width:0}          /* let both columns shrink */
.home .aiss-hero__card{min-width:0;max-width:100%;overflow:hidden}
.home .aiss-hero__card *{max-width:100%;box-sizing:border-box}
.home .aiss-hero__card .aiss-scan{width:100%;max-width:100%}
.home .aiss-why,.home .aiss-checks,.home .aiss-prices,.home .aiss-steps{min-width:0}
.home .aiss-why > *,.home .aiss-checks > *,.home .aiss-prices > *,.home .aiss-steps > *{min-width:0}
.home section,.home .aiss-x,.home .aiss-band{max-width:100%;overflow-x:clip}

/* =========================================================================
   HERO CHIPS 2-2-1 (v1.5.6): two chips per row (five items => 2 / 2 / 1),
   full-width tidy rows instead of ragged wrapping. Reverts to inline flow on
   wider screens where they fit on fewer lines comfortably.
   ========================================================================= */
.home .aiss-hero .chips{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;max-width:420px}
.home .aiss-hero .chip{text-align:center;justify-content:center;display:inline-flex;align-items:center}
.home .aiss-hero .chip:last-child{grid-column:1 / -1}   /* 5th chip spans full width */
@media(min-width:861px){
  /* on desktop let them flow inline again (they fit fine beside the copy) */
  .home .aiss-hero .chips{display:flex;flex-wrap:wrap;max-width:none}
  .home .aiss-hero .chip:last-child{grid-column:auto}
}

/* Answer capsule, signals table, freshness stamp (homepage v1.5.8) */
.aiss-capsule{font-size:1.12rem;line-height:1.6;color:var(--h-ink);max-width:60ch;background:var(--h-card);border-left:3px solid var(--h-teal);padding:1rem 1.25rem;border-radius:0 12px 12px 0}
.aiss-table{width:100%;border-collapse:collapse;margin-top:28px;font-size:.98rem}
.aiss-table th,.aiss-table td{text-align:left;padding:.8rem 1rem;border-bottom:1px solid var(--h-line)}
.aiss-table thead th{font-family:"Space Grotesk";font-size:.82rem;text-transform:uppercase;letter-spacing:.03em;color:var(--h-slate)}
.aiss-table td:last-child,.aiss-table th:last-child{text-align:right;font-family:"Space Grotesk";font-weight:600;white-space:nowrap}
.aiss-table tbody tr:hover{background:var(--h-soft)}
.aiss-updated{color:#8fb0ac;font-size:.85rem;margin-top:.4rem}
@media (prefers-color-scheme: dark){:root:not([data-ll-light]) .aiss-capsule{color:var(--h-ink)}}
@media(max-width:600px){.aiss-table{font-size:.9rem}.aiss-table th,.aiss-table td{padding:.6rem .5rem}}

/* Concrete-facts strip (homepage v1.5.9) */
.aiss-facts{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.aiss-facts li{background:var(--h-card);border:1px solid var(--h-line);border-radius:12px;padding:1rem 1.1rem;font-size:.95rem;color:var(--h-slate)}
.aiss-facts li strong{display:block;font-family:"Space Grotesk";font-size:1.35rem;color:var(--h-ink);margin-bottom:.15rem}
@media(max-width:760px){.aiss-facts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:440px){.aiss-facts{grid-template-columns:1fr 1fr}}

/* Hero fact-led sub-headline (v1.5.10) — answer-first opener */
.aiss-hero .hero-fact{font-family:"Space Grotesk";font-weight:500;font-size:1.15rem;color:var(--h-teal-d);margin:0 0 1rem;line-height:1.4;max-width:40ch}
@media (prefers-color-scheme: dark){:root:not([data-ll-light]) .aiss-hero .hero-fact{color:#5fd6c6}}
