/* Page specific styles. Shared foundation lives in /styles.css, loaded above.
   This page runs the default 1200px content column, so it does not need to
   declare --content-max; the footer picks up the sitewide default. */
/* ── HERO ── */
.hero {
  min-height: calc(100vh - 68px);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 72px 48px 80px;
  position: relative; overflow: hidden;
  text-align: center;
}
.hero-grid-bg {
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 70% 80% at 50% 30%, black 10%, transparent 100%);
}
.hero-glow {
  position:absolute; pointer-events:none;
  width:800px; height:800px;
  top:50%; left:50%; transform:translate(-50%,-60%);
  background:radial-gradient(circle, rgba(229,93,41,0.07) 0%, transparent 65%);
}
.hero-glow-blue {
  position:absolute; pointer-events:none;
  width:500px; height:500px;
  top:60%; left:60%;
  background:radial-gradient(circle, rgba(24,93,137,0.06) 0%, transparent 65%);
}

/* Headline block */
.hero-headline {
  position: relative; z-index: 2;
  max-width: none; margin: 0;
}
.hero-h1 {
  font-family: var(--font-d);
  font-size: clamp(40px, 4.6vw, 68px);
  line-height: 0.92; letter-spacing: 0.015em;
  color: var(--white); margin-bottom: 28px;
}
.hero-h1 em { color: var(--orange); font-style: normal; }
.hero-sub {
  font-size: 18px; color: var(--muted);
  line-height: 1.75; max-width: 520px; margin: 0 0 32px;
}
.hero-sub strong { color: var(--text); font-weight: 600; }
.hero-ctas {
  display: flex; align-items: center; justify-content: flex-start;
  gap: 16px; flex-wrap: wrap; margin-bottom: 0;
}

/* Proof stats */
.hero-proof {
  display: flex; gap: 48px; justify-content: center;
  padding-top: 0; border-top: none;
  position: relative; z-index: 2;
  margin-top: 56px;
}
.proof-item { text-align: center; }
.proof-num {
  font-family: var(--font-d); font-size: 44px;
  color: var(--orange); line-height: 1; margin-bottom: 4px;
}
.proof-label { font-size: 12px; color: var(--muted); font-weight: 500; letter-spacing: 0.03em; }
.proof-divider { width:1px; background:var(--line2); align-self:stretch; }

/* ── ORBITAL VISUAL ── */
.hero-orbital {
  position: relative; z-index: 2;
  width: 100%; max-width: 720px;
  margin: 0 auto;
  display: flex; align-items: center; justify-content: center;
}

/* ── TRUST BAR ── */
.trust {
  padding:0;
  background:var(--bg2);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  overflow:hidden;
}
.trust-header {
  padding:20px 48px 0;
  display:flex; align-items:center; justify-content:center;
}
.trust-label {
  font-size:11px; font-weight:700; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--muted2);
}
/* Marquee */
.marquee-wrap {
  position:relative; overflow:hidden;
  padding:18px 0 20px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
}
.marquee-track {
  display:flex; align-items:center; gap:0;
  width:max-content;
  animation: marquee 32s linear infinite;
}
@keyframes marquee {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}
.tool-badge {
  display:inline-flex; align-items:center; gap:14px;
  margin:0 10px;
  background:var(--bg3); border:1px solid var(--line2);
  border-radius:12px; padding:14px 22px;
  white-space:nowrap;
  cursor:default;
}
/* Full colour, full opacity, always. The track never stops, so there is nothing
   to hover: a stationary cursor over a moving strip would just make each badge
   flick as it passed underneath. The marquee is something to read, not use. */
.tool-logo {
  width:40px; height:40px; object-fit:contain; flex-shrink:0;
}
.tool-logo-fallback {
  width:40px; height:40px; border-radius:9px; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--font-b); font-size:18px; font-weight:700;
  letter-spacing:-0.02em;
}
.tool-name {
  font-family:var(--font-d); font-size:18px;
  letter-spacing:0.05em; color:var(--text);
}

/* ── FAQ ── */
.faq {
  padding:96px 48px;
  border-top:1px solid var(--line);
}
.faq-inner { max-width:1200px; margin:0 auto; }
.faq-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:2px; background:var(--line);
  border-radius:16px; overflow:hidden;
  margin-top:16px;
}
.faq-item {
  background:var(--bg2); padding:28px 32px;
  transition:background 0.2s;
  position:relative;
}
.faq-item:hover { background:var(--bg3); }
.faq-item::before {
  content:''; position:absolute;
  top:0; left:0; width:3px; bottom:0;
  background:var(--blue-bright); opacity:0;
  transition:opacity 0.2s;
}
.faq-item:hover::before { opacity:1; }
.faq-q {
  font-size:15px; font-weight:700;
  color:var(--white); margin-bottom:10px;
  line-height:1.4;
}
.faq-a {
  font-size:14px; color:var(--muted);
  line-height:1.7;
}

/* ── CREDENTIALS STRIP ──
   This was a full section: 80px of padding, a two column grid, "CERTIFIED
   EXPERTS. NOT JUST CONSULTANTS." at 42px, and four cards restating each other.
   It was sized like an argument when it is really a fact — and it was sitting
   directly above the testimonials, so the page made its own case at full volume
   immediately before Clate Mask made it better for free.
   Certification is a box you want ticked before you buy, not a reason you buy.
   So it ticks: one band, the badge, one sentence, three chips. The heading is
   gone entirely rather than shrunk, because a small heading over a small band is
   two things competing to be the quiet one.
   The Thryv badge image survives at 76px. It is the only part of the old section
   that was doing work no sentence could do. */
.credstrip {
  padding:34px 48px;
  background:var(--bg2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.credstrip-inner {
  max-width:1200px; margin:0 auto;
  display:flex; align-items:center; gap:26px;
}
.credstrip-badge { height:76px; width:auto; display:block; flex-shrink:0; }
.credstrip-body { min-width:0; }
.credstrip-title {
  font-family:var(--font-d); font-size:23px; color:var(--white);
  letter-spacing:0.02em; line-height:1; margin-bottom:7px;
}
.credstrip-desc {
  font-size:13.5px; color:var(--muted); line-height:1.65; max-width:760px;
  margin-bottom:11px;
}
.credstrip-tags { display:flex; gap:8px; flex-wrap:wrap; }
.credstrip-tag {
  display:inline-flex; align-items:center;
  font-size:11px; font-weight:700; letter-spacing:0.05em;
  color:var(--green);
  background:rgba(61,184,122,0.08);
  border:1px solid rgba(61,184,122,0.2);
  border-radius:6px; padding:3px 10px;
}

/* ── HOMEPAGE GUIDES ──
   The teaser for /guides, which has been live and reachable from nothing. Three
   real titles rather than one "read our guides" block: the titles ARE the pitch,
   because "connect Calendly to Keap without duplicate contacts" tells you we have
   done the work and "helpful resources" tells you nothing.
   Sits directly under the AI visibility section on purpose. Those two are the
   only places on this page that give something away before asking for anything,
   and they belong together, above pricing, doing that job as a pair. */
.guidesx { padding:80px 48px; }
.guidesx-inner { max-width:1200px; margin:0 auto; }
.guidesx-head {
  display:flex; align-items:flex-end; justify-content:space-between;
  flex-wrap:wrap; gap:16px; margin-bottom:34px;
}
.guidesx-head .section-sub { margin-bottom:0; }
.guidesx-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.gxc {
  display:flex; flex-direction:column;
  background:var(--bg2); border:1px solid var(--line2); border-radius:16px;
  padding:24px 24px 22px; text-decoration:none;
  transition:border-color 0.25s, transform 0.2s, background 0.2s;
}
a.gxc:hover { border-color:var(--orange-border); transform:translateY(-2px); background:var(--bg3); }
.gxc-tags { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.gxc-tag {
  font-size:10.5px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--muted); background:var(--bg5); border:1px solid var(--line2);
  border-radius:20px; padding:3px 9px;
}
.gxc-t {
  font-family:var(--font-d); font-size:22px; color:var(--white);
  letter-spacing:0.02em; line-height:1.05; margin-bottom:9px;
}
.gxc-d { font-size:13.5px; color:var(--muted); line-height:1.65; }
.gxc-d strong { color:var(--text); font-weight:600; }
.gxc-go {
  display:inline-flex; align-items:center; gap:7px; margin-top:16px;
  font-size:13px; font-weight:600; color:var(--orange);
}
.gxc-go svg { transition:transform 0.2s; }
a.gxc:hover .gxc-go svg { transform:translateX(3px); }

/* ── WHO WE HELP ── */
.who {
  padding:96px 48px;
}
.who-inner { max-width:1200px; margin:0 auto; }
.who-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:2px;
  background:var(--line); border-radius:16px; overflow:hidden;
  margin-top:16px;
}
.who-card {
  background:var(--bg3); padding:36px;
  transition:background 0.2s;
  position:relative; overflow:hidden;
}
.who-card:hover { background:var(--bg4); }
.who-card::before {
  content:''; position:absolute;
  top:0; left:0; width:3px; bottom:0;
  background:var(--blue-bright); opacity:0;
  transition:opacity 0.2s;
}
.who-card:hover::before { opacity:1; }
.who-card-num {
  font-family:var(--font-d); font-size:52px;
  color:var(--blue-bright); line-height:1;
  margin-bottom:12px; user-select:none;
}
.who-card-title {
  font-size:16px; font-weight:700; color:var(--white);
  margin-bottom:8px;
}
.who-card-desc { font-size:15px; color:var(--muted); line-height:1.65; }
.who-highlight {
  grid-column:span 2;
  background:var(--blue-dim);
  border-top:1px solid var(--blue-border);
  padding:28px 36px;
  display:flex; align-items:center; gap:16px;
}
.who-highlight-icon { font-size:28px; flex-shrink:0; }
.who-highlight-text { font-size:15px; color:var(--text); line-height:1.6; }
.who-highlight-text strong { color:var(--orange); }

/* ── SERVICES ── */
.services { padding:96px 48px; background:var(--bg2); border-top:1px solid var(--line); }
.services-inner { max-width:1200px; margin:0 auto; }
.services-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:20px;
}
.svc-card {
  background:var(--bg3); border:1px solid var(--line);
  border-radius:16px; padding:30px;
  transition:border-color 0.25s, transform 0.2s;
  position:relative; overflow:hidden;
}
.svc-card:hover { border-color:var(--blue-border); transform:translateY(-4px); }
.svc-card::after {
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 20% 0%, rgba(24,93,137,0.13), transparent 55%);
  opacity:0; transition:opacity 0.3s;
}
.svc-card:hover::after { opacity:1; }
.svc-icon {
  width:46px; height:46px; border-radius:11px;
  background:var(--blue-dim); border:1px solid var(--blue-border);
  display:flex; align-items:center; justify-content:center;
  font-size:20px; margin-bottom:18px;
}
.svc-name {
  font-family:var(--font-d); font-size:24px;
  color:var(--white); letter-spacing:0.03em; margin-bottom:10px;
}
.svc-desc { font-size:15px; color:var(--muted); line-height:1.7; margin-bottom:20px; }
.svc-list { list-style:none; display:flex; flex-direction:column; gap:7px; }
.svc-list li {
  font-size:13px; color:var(--text); font-weight:500;
  display:flex; align-items:flex-start; gap:8px;
}
.svc-list li::before {
  content:''; display:block; width:5px; height:5px;
  border-radius:50%; background:var(--blue-bright);
  margin-top:6px; flex-shrink:0;
}

/* ── OUTCOME / HOW ── */
.outcome { padding:96px 48px; border-top:1px solid var(--line); }
.outcome-inner {
  max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start;
}
.outcome-steps { margin-top:40px; display:flex; flex-direction:column; gap:0; }
.ostep {
  display:flex; gap:20px; padding-bottom:32px; position:relative;
}
.ostep:not(:last-child)::after {
  content:''; position:absolute;
  left:19px; top:40px; bottom:0; width:2px;
  background:linear-gradient(to bottom, var(--orange-border), transparent);
}
.ostep-num {
  width:40px; height:40px; border-radius:50%; flex-shrink:0;
  background:var(--blue-dim); border:2px solid var(--blue-border);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-d); font-size:17px; color:var(--blue-bright);
}
.ostep-title { font-size:15px; font-weight:700; color:var(--white); margin-bottom:5px; }
.ostep-desc { font-size:15px; color:var(--muted); line-height:1.65; }

/* Outcome visual */
.outcome-visual {
  background:var(--bg3); border:1px solid var(--line2);
  border-radius:20px; overflow:hidden; position:relative;
}
.outcome-visual::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--blue), transparent);
}
.ov-header {
  padding:20px 24px 16px;
  border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between;
}
.ov-title { font-size:12px; font-weight:700; letter-spacing:0.07em; text-transform:uppercase; color:var(--muted); }
.ov-tag {
  font-size:10px; font-weight:700; letter-spacing:0.07em;
  text-transform:uppercase; color:var(--green);
  background:rgba(61,184,122,0.1); border:1px solid rgba(61,184,122,0.2);
  border-radius:6px; padding:3px 8px;
}
.ov-metrics { padding:20px 24px; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ov-metric {
  background:var(--bg4); border:1px solid var(--line);
  border-radius:10px; padding:16px;
}
.ov-metric-val {
  font-family:var(--font-d); font-size:34px;
  line-height:1; margin-bottom:3px;
}
.ov-metric-val.orange { color:var(--orange); }
.ov-metric-val.blue { color:#4A9EC9; }
.ov-metric-val.green { color:var(--green); }
.ov-metric-label { font-size:11px; color:var(--muted); font-weight:500; }

.ov-quote {
  margin:0 24px 24px;
  background:var(--bg4); border:1px solid var(--line2);
  border-radius:10px; padding:16px 18px;
}
.ov-quote-text {
  font-size:13px; color:var(--text); line-height:1.6;
  font-style:italic; margin-bottom:8px;
}
.ov-quote-attr { font-size:11px; color:var(--muted); font-weight:600; }

/* ── PRICING PREVIEW ── */
.pricing { padding:96px 48px; background:var(--bg2); border-top:1px solid var(--line); }
.pricing-inner { max-width:1200px; margin:0 auto; }

/* ── FINAL CTA ── */
.final {
  padding:96px 48px; text-align:center;
  border-top:1px solid var(--line);
  position:relative; overflow:hidden;
}
.final::before {
  content:''; position:absolute;
  width:700px; height:700px; top:50%; left:50%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(229,93,41,0.05) 0%, transparent 65%);
  pointer-events:none;
}
.final-inner { max-width:580px; margin:0 auto; position:relative; z-index:2; }
.final .section-tag { justify-content:center; }
.final .section-tag::before { display:none; }
.final .section-h2 { margin-bottom:16px; }
.final .section-sub { margin:0 auto 36px; }
/* 26px, not 14px: .btn-primary carries a 10px solid extrusion (see /styles.css)
   and box-shadow occupies no layout space, so 14px left the orange slab 4px off
   this text. */
.final-note {
  margin-top:26px; font-size:12px; color:var(--muted);
  display:flex; align-items:center; justify-content:center; gap:6px;
}

/* Safety net — hero always visible after 1s even if JS hasn't fired.
   .reveal base and the keyframes live in /styles.css. */
.hero .reveal {
  animation: revealFallback 0s 1s forwards;
}


/* ── HERO DASHBOARD (mission control) ── */
/* Founder portrait. This slot used to hold a mock dashboard of invented metrics.
   It is also the video slot: when the intro video exists it drops into this same
   frame, with this image as its poster, and nothing else has to move. */
.hero-portrait{position:relative;z-index:2;width:100%;max-width:420px;justify-self:center;}
.hero-portrait-frame{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/5;
  background:var(--bg3);border:1px solid var(--line2);box-shadow:0 28px 70px rgba(0,0,0,.5);}
.hero-portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:center 15%;display:block;}
.photo-badge{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);
  background:var(--orange);color:#fff;font-family:var(--font-d);font-size:14px;letter-spacing:.08em;
  padding:8px 24px;border-radius:100px;white-space:nowrap;border:2px solid var(--bg);z-index:3;}

/* Gentle hero glow drift + reduced-motion guard */
@keyframes glow-drift{0%{transform:translate(-50%,-60%) scale(1);}50%{transform:translate(-46%,-56%) scale(1.08);}100%{transform:translate(-54%,-64%) scale(1);}}
@keyframes glow-drift-blue{0%{transform:translate(0,0) scale(1);}50%{transform:translate(-22px,18px) scale(1.12);}100%{transform:translate(0,0) scale(1);}}
.hero-glow{animation:glow-drift 16s ease-in-out infinite;}
.hero-glow-blue{animation:glow-drift-blue 20s ease-in-out infinite;}
@media (prefers-reduced-motion: reduce){
  .hero-glow,.hero-glow-blue{animation:none;}
}

/* Two-column hero */
.hero-top{position:relative;z-index:2;width:100%;max-width:1180px;margin:0 auto;
  display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}
.hero-intro{text-align:left;}
@media(max-width:900px){
  .hero{padding:52px 32px 64px;}
  .hero-top{grid-template-columns:1fr;gap:40px;}
  .hero-intro{text-align:center;}
  .hero-headline{margin:0 auto;}
  .hero-sub{margin:0 auto 32px;max-width:560px;}
  .hero-ctas{justify-content:center;}
  .hero-h1{font-size:clamp(44px,8vw,72px);}
}


/* Homepage pricing — three-path chooser */
.path-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.home-paths{margin:34px 0 4px;}
.path-card{background:var(--bg3);border:1px solid var(--line2);border-radius:18px;padding:30px 26px;
  text-decoration:none;display:flex;flex-direction:column;gap:13px;position:relative;overflow:hidden;text-align:left;
  transition:border-color .2s,transform .15s,background .2s;}
.path-card:hover{border-color:var(--blue-border);transform:translateY(-3px);background:var(--bg4);}
.path-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,transparent,var(--blue-bright),transparent);opacity:0;transition:opacity .2s;}
.path-card:hover::before{opacity:1;}
.path-icon{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--blue-dim);border:1px solid var(--blue-border);color:var(--blue-bright);}
.path-num{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--muted);text-transform:uppercase;}
.path-name{font-family:var(--font-d);font-size:25px;color:var(--white);letter-spacing:.03em;line-height:1;}
.path-desc{font-size:15px;color:var(--muted);line-height:1.6;flex:1;}
.path-go{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--orange);}
.path-card.combo{background:linear-gradient(150deg,rgba(229,93,41,0.09),rgba(24,93,137,0.06));border-color:var(--orange-border);}
@media(max-width:760px){.path-grid{grid-template-columns:1fr;}}

/* ── TESTIMONIALS / CLIENT VOICES ── */
.voices { padding:96px 48px; border-top:1px solid var(--line); }
.voices-inner { max-width:1200px; margin:0 auto; }
.voices-vids { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:8px 0 20px; }
.vcard { background:var(--bg3); border:1px solid var(--line2); border-radius:16px; overflow:hidden; transition:border-color 0.2s, transform 0.2s; }
.vcard:hover { border-color:var(--orange-border); transform:translateY(-3px); }
.vmedia { position:relative; width:100%; aspect-ratio:16/9; background:#000; overflow:hidden; }
.vmedia video { width:100%; height:100%; object-fit:contain; display:block; background:#000; }
.vmedia iframe { position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
.vcap { padding:15px 20px; display:flex; flex-direction:column; gap:2px; }
.vcap b { color:var(--white); font-size:15px; font-weight:700; }
.vcap span { color:var(--muted); font-size:13px; }
.voices-quotes { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.vquote { background:var(--bg3); border:1px solid var(--line2); border-radius:16px; padding:24px 26px; transition:border-color 0.2s, transform 0.2s; }
.vquote:hover { border-color:var(--blue-border); transform:translateY(-2px); }
.vquote-mark { font-family:var(--font-d); font-size:48px; line-height:0.7; color:var(--orange-border); display:block; height:22px; }
.vquote-text { font-size:15px; color:var(--text); line-height:1.65; margin:6px 0 16px; }
.vquote-attr { display:flex; flex-direction:column; gap:2px; }
.vquote-attr b { color:var(--white); font-size:14px; font-weight:700; }
.vquote-attr span { color:var(--muted); font-size:12.5px; }
@media (max-width:860px){ .voices-quotes { grid-template-columns:1fr; } }
@media (max-width:760px){ .voices { padding-left:22px; padding-right:22px; } .voices-vids { grid-template-columns:1fr; } }

/* ── AI VISIBILITY SECTION ── */
.aivis{padding:96px 48px;border-top:1px solid var(--line);position:relative;overflow:hidden;}
.aivis-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
.aivis-glow{position:absolute;pointer-events:none;width:600px;height:600px;top:50%;right:-100px;transform:translateY(-50%);background:radial-gradient(circle,rgba(229,93,41,0.06) 0%,transparent 65%);}
.aivis-copy{position:relative;z-index:2;}
.aivis-h2 em{color:var(--orange);font-style:normal;}
.aivis-points{list-style:none;display:flex;flex-direction:column;gap:12px;margin:0 0 32px;}
.aivis-points li{display:flex;align-items:flex-start;gap:11px;font-size:15px;color:var(--text);line-height:1.55;}
.aivis-points svg{color:var(--orange);flex-shrink:0;margin-top:3px;}
.aivis-points a{color:var(--white);font-weight:700;text-decoration:none;border-bottom:1px solid var(--orange-border);transition:border-color .2s;}
.aivis-points a:hover{border-bottom-color:var(--orange);}
.aivis-note{margin-top:14px;font-size:12px;color:var(--muted2);display:flex;align-items:center;gap:6px;}
.aivis-visual{position:relative;z-index:2;}
.scan-panel{background:linear-gradient(180deg,var(--bg3),#101015);border:1px solid var(--line2);border-radius:18px;box-shadow:0 30px 80px -30px rgba(229,93,41,0.18),0 10px 40px rgba(0,0,0,0.5);overflow:hidden;}
.scan-bar{display:flex;align-items:center;gap:12px;padding:13px 18px;border-bottom:1px solid var(--line);background:rgba(255,255,255,0.015);}
.scan-dots{display:flex;gap:6px;}
.scan-dots span{width:10px;height:10px;border-radius:50%;background:var(--line2);}
.scan-dots span:first-child{background:var(--orange);opacity:.75;}
.scan-title{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.02em;}
.scan-live{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:11px;color:var(--green);font-weight:700;letter-spacing:.05em;text-transform:uppercase;}
.scan-live-dot{width:7px;height:7px;border-radius:50%;background:var(--green);animation:sp 1.8s infinite;}
@keyframes sp{0%{box-shadow:0 0 0 0 rgba(61,184,122,.45)}70%{box-shadow:0 0 0 7px rgba(61,184,122,0)}100%{box-shadow:0 0 0 0 rgba(61,184,122,0)}}
.scan-body{padding:22px;}
.scan-score-row{display:flex;align-items:center;gap:22px;margin-bottom:20px;}
.scan-dial{position:relative;width:112px;height:112px;flex-shrink:0;}
.scan-dial svg{transform:rotate(-90deg);}
.scan-dial-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.scan-dial-num b{font-family:var(--font-d);font-size:40px;color:var(--white);line-height:1;}
.scan-dial-num span{font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--muted);text-transform:uppercase;margin-top:2px;}
.scan-verdict{font-size:14px;color:var(--muted);line-height:1.5;}
.scan-verdict b{color:var(--text);font-weight:600;}
.scan-checks{display:flex;flex-direction:column;gap:9px;}
.scan-check{display:flex;align-items:center;gap:10px;font-size:12.5px;background:var(--bg4);border:1px solid var(--line);border-radius:9px;padding:9px 13px;}
.scan-check-ico{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;}
.scan-check.pass .scan-check-ico{background:rgba(61,184,122,.15);color:var(--green);}
.scan-check.fail .scan-check-ico{background:rgba(224,82,82,.15);color:#E05252;}
.scan-check-text{flex:1;color:var(--muted);}
.scan-check-text b{color:var(--text);font-weight:600;}
@media(max-width:900px){.aivis{padding:72px 22px;}.aivis-inner{grid-template-columns:1fr;gap:40px;}.aivis-visual{order:-1;}}

/* ── MOBILE RESPONSIVE (homepage section grids) ── */
@media(max-width:900px){
  .services-grid { grid-template-columns:1fr; }
  .who-grid { grid-template-columns:1fr; }
  .who-highlight { grid-column:auto; }
  .outcome-inner { grid-template-columns:1fr; gap:40px; }
  .guidesx-grid { grid-template-columns:1fr; }
  .credstrip-inner { flex-direction:column; align-items:flex-start; gap:20px; }
  .faq-grid { grid-template-columns:1fr !important; }
}
@media(max-width:760px){
  .who, .services, .outcome, .pricing, .faq, .guidesx, .credstrip, .final { padding-left:22px; padding-right:22px; }
  .trust-header { padding-left:22px; padding-right:22px; }
}

/* ── MOBILE REFINEMENTS (polish) ── */
@media(max-width:760px){
  /* tighter vertical rhythm — kill the long scroll gaps */
  .who, .services, .outcome, .pricing, .faq, .voices, .guidesx { padding-top:56px; padding-bottom:56px; }
  .credstrip { padding-top:26px; padding-bottom:26px; }
  .final { padding-top:64px; padding-bottom:64px; }
  .section-sub { margin-bottom:34px; }
  /* hero + proof stats: scale down so all three fit, no clipping */
  .hero { padding:36px 22px 48px; }
  .hero-proof { gap:16px; margin-top:44px; }
  .proof-num { font-size:clamp(26px,8vw,40px); }
  .proof-label { font-size:10px; letter-spacing:.02em; }
  .credstrip-badge { height:64px; }
  .guidesx-head { margin-bottom:26px; }
}