:root {
  --ink: #0a1020;
  --ink-2: #111a30;
  --paper: #f7f8fc;
  --surface: #ffffff;
  --surface-soft: #f1f4fb;
  --text: #11182a;
  --text-2: #5d6780;
  --text-3: #8791a7;
  --line: #e4e8f0;
  --brand: #5b5cf0;
  --brand-2: #8b5cf6;
  --aqua: #64d8ff;
  --green: #16a46f;
  --amber: #bb7011;
  --red: #d84a4a;
  --radius: 18px;
  --radius-sm: 11px;
  --shadow: 0 12px 30px rgba(17, 24, 39, .07);
  --shadow-lg: 0 28px 70px rgba(5, 12, 32, .18);
  --display: "Manrope", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { color: var(--text); background: var(--paper); font: 15.5px/1.6 var(--display); -webkit-font-smoothing: antialiased; }
body::selection { color: #fff; background: var(--brand); }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }
button, input { font: inherit; }
button { border: 0; }
:focus-visible { outline: 3px solid rgba(100, 216, 255, .95); outline-offset: 3px; }

.container { max-width: 1160px; margin: 0 auto; padding: 0 28px; }
.container.narrow { max-width: 810px; }

/* Navigation */
.nav { position: sticky; inset: 0 0 auto; z-index: 50; background: rgba(9, 15, 31, .8); border-bottom: 1px solid rgba(255,255,255,.08); backdrop-filter: blur(18px); }
.nav-inner { max-width: 1320px; min-height: 72px; margin: 0 auto; padding: 0 32px; display: flex; gap: 28px; align-items: center; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: inherit; font-size: 17px; font-weight: 800; letter-spacing: -.04em; }
.brand-dot { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.35); border-radius: 10px; color: #fff; background: linear-gradient(135deg, #7a82ff, #6b46e8 55%, #b763ec); box-shadow: 0 0 24px rgba(104, 92, 240, .48); }
.brand-name { color: #fff; }
.nav-links { display: flex; gap: 23px; margin-left: 16px; }
.nav-links a { color: #aeb8ce; font-size: 13px; font-weight: 700; transition: color .2s ease; }
.nav-links a:hover { color: #fff; }
.nav-actions { display: flex; gap: 10px; align-items: center; margin-left: auto; }

/* Buttons and form controls */
.btn { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 8px; padding: 10px 17px; color: var(--text); border: 1px solid transparent; border-radius: var(--radius-sm); background: #fff; cursor: pointer; font-size: 13.5px; font-weight: 800; letter-spacing: -.015em; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease; }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.btn-primary { color: #fff; background: linear-gradient(135deg, #6968f3, #7046df 56%, #9b56ec); border-color: rgba(255,255,255,.17); box-shadow: 0 10px 27px rgba(83, 76, 229, .3); }
.btn-primary:hover { box-shadow: 0 15px 35px rgba(83, 76, 229, .44); }
.btn-ghost { color: #c1c8d8; background: transparent; border-color: rgba(255,255,255,.14); }
.btn-ghost:hover { color: #fff; background: rgba(255,255,255,.07); }
.btn-lg { min-height: 54px; padding: 12px 19px; font-size: 14px; }
input { width: 100%; min-height: 52px; padding: 12px 15px; color: #e9edff; border: 1px solid rgba(199,213,255,.22); border-radius: var(--radius-sm); background: rgba(9,15,34,.67); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
input::placeholder { color: #8892a9; }
input:focus { outline: 0; border-color: #8ca6ff; box-shadow: 0 0 0 4px rgba(102, 126, 255, .16); }

/* Hero */
.hero { position: relative; isolation: isolate; overflow: hidden; min-height: 715px; padding: 78px 32px 72px; color: #f7f8ff; background: #070c18; }
/* The art belongs to the hero itself, rather than sitting in a separate card.
   This overlay preserves an intentionally quiet copy-safe area on the left. */
.hero::before { position: absolute; z-index: 1; inset: 0; content: ""; background: linear-gradient(90deg, rgba(4,8,18,.96) 0%, rgba(5,10,23,.91) 34%, rgba(5,10,22,.58) 53%, rgba(5,10,22,.16) 74%, rgba(5,10,22,.03) 100%); pointer-events: none; }
.hero-grid { position: absolute; z-index: 1; inset: 0; opacity: .12; background-image: linear-gradient(rgba(135,153,235,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(135,153,235,.1) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom, #000, transparent 72%); pointer-events:none; }
.hero-inner { position: static; max-width: 1320px; min-height: 560px; margin: 0 auto; }
.hero-copy { position: relative; z-index: 2; max-width: 610px; padding: 10px 0 35px; }
.eyebrow { display: inline-flex; gap: 8px; align-items: center; margin-bottom: 16px; padding: 6px 10px; color: var(--brand); border: 1px solid #dce2ff; border-radius: 999px; background: #edf0ff; font: 500 10.5px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.eyebrow-dark { color: #b9caff; border-color: rgba(139,161,255,.2); background: rgba(104,127,245,.1); }
.eyebrow-pulse { width: 7px; height: 7px; border-radius: 50%; background: #78e6ba; box-shadow: 0 0 0 4px rgba(120,230,186,.13), 0 0 14px rgba(120,230,186,.65); }
.hero h1 { max-width: 720px; margin-bottom: 22px; color: #f9faff; font-size: clamp(44px, 5.1vw, 75px); font-weight: 800; line-height: 1.04; letter-spacing: -.065em; }
.grad { color: #b9c9ff; background: linear-gradient(100deg, #aab5ff, #82d8ff 47%, #d099ff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero-sub { max-width: 605px; margin-bottom: 29px; color: #acb6ca; font-size: 17px; line-height: 1.7; }
.hero-sub strong { color: #dce4fb; font-weight: 700; }
.analyze-form { display: flex; max-width: 610px; gap: 8px; padding: 6px; border: 1px solid rgba(166,181,255,.19); border-radius: 15px; background: rgba(18,25,52,.53); box-shadow: 0 18px 45px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.04); }
.analyze-form input { min-width: 0; min-height: 46px; border: 0; background: transparent; box-shadow: none; }
.analyze-form input:focus { box-shadow: none; }
.analyze-form .btn { white-space: nowrap; }
.error-banner { max-width: 610px; margin-top: 12px; padding: 10px 13px; color: #c83434; border: 1px solid #fecaca; border-radius: var(--radius-sm); background: #fff2f2; font-size: 13px; }
.hero-cta-secondary { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; margin-top: 15px; }
.hero-cta-secondary .btn { min-height: 36px; padding: 8px 11px; }
.hero-note { color: #808ba4; font-size: 12px; font-weight: 600; }
.sandbox-demo-access { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:13px; }
.sandbox-demo-access[hidden] { display:none; }
.sandbox-demo-entry { min-height:34px; padding:7px 10px; color:#bfeaff; border-color:rgba(115,215,255,.29); background:rgba(58,153,198,.11); box-shadow:inset 0 1px 0 rgba(202,247,255,.08); font-size:11.5px; }
.sandbox-demo-entry:hover { color:#fff; border-color:rgba(136,233,255,.55); background:rgba(74,173,220,.18); }
.sandbox-demo-badge { padding:3px 5px; color:#8cecc5; border:1px solid rgba(133,236,195,.25); border-radius:999px; background:rgba(28,132,100,.16); font:500 8px/1 var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.sandbox-demo-note { color:#7f91aa; font-size:10.5px; font-weight:700; }
.trust-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 29px; }
.trust-chip { padding: 6px 9px; color: #9da9c3; border: 1px solid rgba(167,181,222,.14); border-radius: 999px; background: rgba(255,255,255,.035); font-size: 11px; font-weight: 700; }

.hero-visual { --gaze-shift-x:0px; --gaze-shift-y:0px; --far-eye-shift-y:0px; position:absolute; z-index:0; inset:0; overflow:hidden; pointer-events:none; }
.agent-art { position:absolute; z-index:0; top:50%; right:0; width:min(1672px,100%); height:auto; aspect-ratio:1672 / 941; transform:translateY(-50%); }
.agent-image { display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(1.01) contrast(1.025); }
/* A small, feathered duplicate of the eye area lets the pupil track a fine
   pointer without changing the face, the source art, or the hero composition. */
.agent-gaze { position:absolute; z-index:1; top:50%; right:0; width:min(1672px,100%); height:auto; aspect-ratio:1672 / 941; overflow:hidden; opacity:0; transform:translateY(-50%); transition:opacity .2s ease; will-change:opacity; -webkit-mask-image:radial-gradient(ellipse 45px 26px at var(--gaze-origin-x,66.93%) var(--gaze-origin-y,23.91%),#000 0%,#000 51%,rgba(0,0,0,.82) 74%,transparent 100%); mask-image:radial-gradient(ellipse 45px 26px at var(--gaze-origin-x,66.93%) var(--gaze-origin-y,23.91%),#000 0%,#000 51%,rgba(0,0,0,.82) 74%,transparent 100%); }
.agent-gaze-image { display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(1.01) contrast(1.025); transform:translate3d(var(--gaze-shift-x),var(--gaze-shift-y),0); transition:transform .16s cubic-bezier(.2,.72,.2,1); will-change:transform; }
.agent-far-eye { position:absolute; z-index:1; top:50%; right:0; width:min(1672px,100%); height:auto; aspect-ratio:1672 / 941; overflow:hidden; opacity:0; transform:translateY(-50%); will-change:opacity; -webkit-mask-image:radial-gradient(ellipse 21px 18px at var(--far-eye-origin-x,62.44%) var(--far-eye-origin-y,25.93%),#000 0%,#000 72%,rgba(0,0,0,.88) 82%,transparent 100%); mask-image:radial-gradient(ellipse 21px 18px at var(--far-eye-origin-x,62.44%) var(--far-eye-origin-y,25.93%),#000 0%,#000 72%,rgba(0,0,0,.88) 82%,transparent 100%); }
.agent-far-eye-image { display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(1.01) contrast(1.025); transform:translate3d(0,var(--far-eye-shift-y),0); transition:transform .26s cubic-bezier(.22,.61,.36,1); will-change:transform; }
.agent-gaze-pupil { position:absolute; z-index:3; top:50%; right:0; width:min(1672px,100%); height:auto; aspect-ratio:1672 / 941; opacity:0; transform:translateY(-50%); transition:opacity .18s ease; pointer-events:none; }
.agent-gaze-pupil::before { position:absolute; top:var(--gaze-origin-y,23.91%); left:var(--gaze-origin-x,67.40%); width:10px; height:15px; border-radius:50%; background:radial-gradient(ellipse at 42% 27%,rgba(239,231,219,.64) 0 7%,transparent 12%),radial-gradient(ellipse at 50% 53%,rgba(3,5,9,.94) 0 30%,rgba(24,16,14,.7) 47%,rgba(70,48,32,.16) 71%,transparent 82%); box-shadow:0 0 2px rgba(1,4,11,.42); content:""; opacity:.9; transform:translate(-50%,-50%) translate3d(var(--gaze-shift-x),var(--gaze-shift-y),0); transition:transform .14s cubic-bezier(.2,.72,.2,1); will-change:transform; }
.agent-gaze-pupil::after { position:absolute; top:var(--gaze-origin-y,23.91%); left:var(--gaze-origin-x,67.40%); width:2.5px; height:2.5px; border-radius:50%; background:rgba(255,253,249,.9); box-shadow:0 0 2px rgba(255,255,255,.32); content:""; opacity:.72; transform:translate(-50%,-50%) translate3d(calc(var(--gaze-shift-x) - 1px),calc(var(--gaze-shift-y) - 2px),0); transition:transform .14s cubic-bezier(.2,.72,.2,1); will-change:transform; }
.hero.gaze-tracking .agent-gaze { opacity:1; }
.hero.gaze-tracking .agent-image { -webkit-mask-image:radial-gradient(ellipse 21px 18px at var(--far-eye-origin-x,62.44%) var(--far-eye-origin-y,25.93%),transparent 0%,transparent 60%,#000 78%,#000 100%); mask-image:radial-gradient(ellipse 21px 18px at var(--far-eye-origin-x,62.44%) var(--far-eye-origin-y,25.93%),transparent 0%,transparent 60%,#000 78%,#000 100%); }
.hero.gaze-tracking .agent-far-eye { opacity:1; }
.hero.gaze-tracking .agent-gaze-pupil { opacity:.82; }
.hero-visual::before { position:absolute; z-index:2; inset:0; background:radial-gradient(ellipse at 79% 39%,rgba(117,203,255,.12),transparent 19%),radial-gradient(ellipse at 73% 68%,rgba(139,100,255,.1),transparent 31%); content:""; opacity:.68; }
.hero-orbit { position: absolute; z-index: 0; border: 1px solid rgba(112,148,255,.22); border-radius: 50%; transform: rotate(-22deg); animation:cognitive-orbit-drift 13s ease-in-out infinite; }
.orbit-one { width: 510px; height: 260px; top: 104px; right: -3px; box-shadow: 0 0 52px rgba(79,116,255,.14); }
.orbit-two { width: 610px; height: 336px; top: 64px; right: -38px; border-color: rgba(170,101,255,.13); animation-delay:-6.5s; }
.agent-panel { position: absolute; z-index: 3; display: flex; align-items: center; gap: 9px; padding: 10px 12px; color: #c8d1ef; border: 1px solid rgba(166,189,255,.2); border-radius: 10px; background: rgba(10,17,41,.77); box-shadow: 0 12px 30px rgba(0,0,0,.23); backdrop-filter: blur(10px); font: 500 10px/1.2 var(--mono); }
.agent-panel strong { color: #83e7c1; font-weight: 500; }
.agent-panel-top { top: 160px; left: 2%; }
.agent-panel-bottom { right: 7%; bottom: 150px; }
.agent-panel-dot { width: 6px; height: 6px; border-radius: 50%; background: #77e7bb; box-shadow: 0 0 12px #77e7bb; }
.mini-chart { display: inline-flex; align-items: end; gap: 2px; width: 28px; height: 14px; }
.mini-chart i { width: 4px; border-radius: 2px; background: linear-gradient(#94e4ff, #7585ff); }
.mini-chart i:nth-child(1) { height: 40%; }.mini-chart i:nth-child(2) { height: 70%; }.mini-chart i:nth-child(3) { height: 52%; }.mini-chart i:nth-child(4) { height: 100%; }
.hero-score-card { position: absolute; z-index: 4; bottom: 68px; left: 2%; width: 255px; padding: 15px; color: #d9e1ff; border: 1px solid rgba(177,196,255,.2); border-radius: 14px; background: rgba(11,17,43,.84); box-shadow: 0 18px 45px rgba(0,0,0,.28); backdrop-filter: blur(14px); }
.score-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; color: #9eaac7; font: 500 9px var(--mono); text-transform: uppercase; letter-spacing: .04em; }
.live-dot { color: #70e0ad; }
.live-dot::before { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: currentColor; content: ""; box-shadow: 0 0 8px currentColor; }
.hero-score-row { display: grid; grid-template-columns: 1fr auto; gap: 6px 10px; align-items: center; padding: 6px 0; color: #a8b2cc; font-size: 10.5px; }
.hero-score-row strong { color: #edf3ff; font-size: 12px; }.hero-score-row i { grid-column: span 2; height: 3px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.1); }.hero-score-row i::after { display: block; width: var(--meter); height: 100%; border-radius: inherit; background: linear-gradient(90deg,#62d2ff,#8b78ff); content: ""; }
.hero-score-card p { margin-top: 7px; color: #77849f; font: 9px var(--mono); }
/* Decorative mock cards made the artwork read as a separate framed product
   preview. The real preview results below the hero remain the product proof. */
.hero-orbit,.agent-panel,.hero-score-card { display:none; }

/* The same observer becomes active while the bounded preview is working. */
.analysis-state { position:absolute; z-index:8; left:max(32px,calc(50% - 630px)); bottom:28px; width:min(450px,calc(50% - 36px)); padding:17px 18px; border:1px solid rgba(142,167,255,.25); border-radius:15px; color:#e5ebff; background:rgba(9,15,37,.88); box-shadow:0 20px 54px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter:blur(15px); }
.analysis-state[hidden] { display:none; }.analysis-kicker { display:flex; align-items:center; gap:8px; margin-bottom:8px; color:#aebcff; font:500 10px/1 var(--mono); letter-spacing:.09em; text-transform:uppercase; }.analysis-live-dot { width:7px; height:7px; border-radius:50%; background:#82e7c1; box-shadow:0 0 0 4px rgba(130,231,193,.1),0 0 13px #82e7c1; }.analysis-state h2 { margin-bottom:4px; color:#fff; font-size:18px; letter-spacing:-.035em; }.analysis-state > p { color:#aeb9d4; font-size:12px; }.analysis-stages { display:grid; gap:7px; margin-top:14px; list-style:none; }.analysis-stage { display:flex; gap:8px; align-items:center; color:#7e89a4; font-size:11.5px; }.analysis-stage span { width:13px; color:#5d6780; font-size:10px; text-align:center; }.analysis-stage.current { color:#e6ebff; font-weight:800; }.analysis-stage.current span { color:#8bdfff; text-shadow:0 0 10px rgba(139,223,255,.9); }.analysis-stage.complete { color:#9fcfb9; }.analysis-stage.complete span { color:#81e3b6; }.analysis-signals { display:flex; flex-wrap:wrap; gap:6px; margin-top:13px; }.analysis-signal { padding:5px 7px; color:#bcd0f5; border:1px solid rgba(144,177,255,.15); border-radius:999px; background:rgba(118,137,235,.1); font:500 9px/1.2 var(--mono); }
.analysis-progress-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(130px,.85fr); gap:13px; margin-top:14px; }
.analysis-progress-grid .analysis-stages { margin-top:0; }
.analysis-activity { padding:9px; border:1px solid rgba(149,177,255,.13); border-radius:10px; background:linear-gradient(145deg,rgba(90,116,218,.1),rgba(25,36,85,.04)); }
.analysis-activity-label { display:block; margin-bottom:7px; color:#8695cf; font:500 8.5px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.analysis-activity-feed { display:grid; gap:6px; list-style:none; }
.analysis-activity-feed li { display:flex; align-items:flex-start; gap:5px; color:#c4d0eb; font-size:10px; line-height:1.27; }
.analysis-activity-feed li span { color:#82e7c1; font-size:9px; }
.analysis-activity-feed .analysis-activity-waiting { color:#8190ad; font-style:italic; }

/* The observer is the analysis surface: lightweight CSS/SVG overlays use
   only the real job stage and observed evidence passed in by landing.js. */
.analysis-visual { position:absolute; z-index:3; inset:0; overflow:hidden; pointer-events:none; opacity:0; transition:opacity .42s ease; }
.analysis-active .analysis-visual { opacity:1; }
.analysis-network { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.analysis-path { stroke:url(#analysis-line); stroke-width:1.25; stroke-linecap:round; stroke-dasharray:4 15; opacity:.08; transition:opacity .36s ease,stroke-width .36s ease; }
.analysis-traveler { fill:#b6f5ff; filter:drop-shadow(0 0 6px rgba(130,230,255,.95)); opacity:0; }
.analysis-eye-glow { position:absolute; top:27%; right:34%; width:74px; height:45px; border-radius:50%; background:radial-gradient(ellipse,rgba(142,236,255,.64) 0,rgba(101,161,255,.18) 38%,transparent 72%); filter:blur(4px); opacity:0; transform:scale(.6); transition:opacity .35s ease,transform .45s ease; }
.analysis-scan-ring { position:absolute; border:1px solid rgba(122,220,255,.37); border-radius:50%; opacity:0; transform:scale(.76); }
.scan-ring-one { width:270px; height:270px; top:15%; right:15%; box-shadow:0 0 38px rgba(111,197,255,.13),inset 0 0 32px rgba(111,197,255,.08); }
.scan-ring-two { width:148px; height:148px; top:29%; right:30%; border-color:rgba(141,245,205,.32); }
.analysis-document { position:absolute; z-index:1; width:81px; min-height:66px; padding:9px 8px; border:1px solid rgba(150,203,255,.29); border-radius:9px; background:linear-gradient(145deg,rgba(74,107,184,.35),rgba(18,27,65,.3)); box-shadow:0 12px 30px rgba(29,57,141,.18); opacity:0; transition:opacity .32s ease,transform .38s ease; }
.analysis-document span { display:block; margin-bottom:8px; color:#cde9ff; font:500 8px/1 var(--mono); letter-spacing:.1em; }
.analysis-document i { display:block; height:2px; margin-top:5px; border-radius:3px; background:linear-gradient(90deg,rgba(162,231,255,.86),rgba(137,168,255,.24)); }
.analysis-document i:nth-child(3) { width:79%; }.analysis-document i:nth-child(4) { width:57%; }
.document-one { top:17%; left:3%; transform:translateX(-18px) rotate(-5deg); }.document-two { top:45%; left:8%; width:73px; transform:translateX(-18px) rotate(5deg); }.document-three { right:3%; bottom:16%; width:72px; transform:translateX(18px) rotate(4deg); }
.analysis-entity-nodes { position:absolute; inset:0; }
.analysis-entity-node { position:absolute; padding:5px 7px; color:#d6f9ec; border:1px solid rgba(134,239,190,.34); border-radius:999px; background:rgba(25,92,97,.35); box-shadow:0 0 17px rgba(86,232,179,.18); font:500 8px/1 var(--mono); letter-spacing:.03em; opacity:0; transform:translateY(7px); animation:entity-node-in .42s ease forwards; }
.analysis-entity-node.organization { top:14%; left:31%; }.analysis-entity-node.services { top:28%; left:8%; }.analysis-entity-node.products { bottom:24%; left:17%; }.analysis-entity-node.locations { bottom:13%; left:40%; }.analysis-entity-node.people { top:23%; right:7%; }
.analysis-active .analysis-eye-glow { opacity:1; transform:scale(1); animation:eye-focus 2.2s ease-in-out infinite; }
.analysis-active .analysis-scan-ring { opacity:1; animation:analysis-ring 3.8s ease-in-out infinite; }.analysis-active .scan-ring-two { animation-delay:-1.5s; }
.analysis-active .path-discovery { opacity:.72; stroke-width:1.65; }.analysis-active .document-one { opacity:1; transform:translateX(0) rotate(-5deg); }
.analysis-visual[data-stage="crawler_access"] .path-discovery,.analysis-visual[data-stage="site_structure"] .path-discovery,.analysis-visual[data-stage="understanding"] .path-discovery,.analysis-visual[data-stage="entity_mapping"] .path-discovery,.analysis-visual[data-stage="question_coverage"] .path-discovery,.analysis-visual[data-stage="building_results"] .path-discovery { opacity:.82; }
.analysis-visual[data-stage="site_structure"] .path-structure,.analysis-visual[data-stage="understanding"] .path-structure,.analysis-visual[data-stage="entity_mapping"] .path-structure,.analysis-visual[data-stage="question_coverage"] .path-structure,.analysis-visual[data-stage="building_results"] .path-structure { opacity:.74; stroke-width:1.65; }
.analysis-visual[data-stage="site_structure"] .document-two,.analysis-visual[data-stage="understanding"] .document-two,.analysis-visual[data-stage="entity_mapping"] .document-two,.analysis-visual[data-stage="question_coverage"] .document-two,.analysis-visual[data-stage="building_results"] .document-two { opacity:1; transform:translateX(0) rotate(5deg); }
.analysis-visual[data-stage="understanding"] .path-semantic,.analysis-visual[data-stage="entity_mapping"] .path-semantic,.analysis-visual[data-stage="question_coverage"] .path-semantic,.analysis-visual[data-stage="building_results"] .path-semantic { opacity:.86; stroke-width:1.8; }
.analysis-visual[data-stage="understanding"] .analysis-eye-glow,.analysis-visual[data-stage="entity_mapping"] .analysis-eye-glow { transform:scale(1.25); }
.analysis-visual[data-stage="question_coverage"] .document-three,.analysis-visual[data-stage="building_results"] .document-three { opacity:1; transform:translateX(0) rotate(4deg); }
.analysis-active .analysis-traveler { opacity:1; animation:analysis-traveler 2.6s ease-in-out infinite; }.analysis-active .traveler-two { animation-delay:-.8s; }.analysis-active .traveler-three { animation-delay:-1.6s; }
@keyframes analysis-traveler { 0%,100% { transform:translate(0,0); opacity:0; } 15%,75% { opacity:1; } 50% { transform:translate(115px,18px); opacity:1; } }
@keyframes analysis-ring { 0%,100% { transform:scale(.78); opacity:.18; } 50% { transform:scale(1.09); opacity:.56; } }
@keyframes eye-focus { 0%,100% { filter:blur(4px); } 50% { filter:blur(1px) brightness(1.18); } }
@keyframes entity-node-in { to { opacity:1; transform:translateY(0); } }
body.analysis-active .hero::after { position:absolute; z-index:0; inset:0; pointer-events:none; background:linear-gradient(105deg,transparent 30%,rgba(122,207,255,.08) 47%,transparent 64%); content:""; animation:observer-scan 3.2s ease-in-out infinite; }.analysis-active .agent-image { filter:saturate(1.2) contrast(1.1) brightness(1.12) drop-shadow(0 0 22px rgba(105,209,255,.22)); animation:observer-breathe 2.8s ease-in-out infinite; }.analysis-active .hero-orbit { border-color:rgba(123,204,255,.42); box-shadow:0 0 70px rgba(88,160,255,.28); animation:observer-orbit 8s ease-in-out infinite; }.analysis-active .agent-panel { border-color:rgba(138,212,255,.34); }.analysis-active .agent-panel-dot,.analysis-active .live-dot::before { animation:signal-pulse 1.7s ease-in-out infinite; }.analysis-active .hero-score-card { border-color:rgba(133,190,255,.38); box-shadow:0 18px 54px rgba(66,116,255,.22); }
@keyframes observer-scan { 0%,100% { transform:translateX(-35%); opacity:.25; } 50% { transform:translateX(35%); opacity:1; } } @keyframes observer-breathe { 0%,100% { opacity:.92; } 50% { opacity:1; } } @keyframes observer-orbit { 0%,100% { opacity:.65; } 50% { opacity:1; } } @keyframes cognitive-orbit-drift { 0%,100% { opacity:.48; } 50% { opacity:.83; } } @keyframes signal-pulse { 0%,100% { opacity:.65; box-shadow:0 0 8px currentColor; } 50% { opacity:1; box-shadow:0 0 18px currentColor; } }

/* Marketing narrative */
.section { padding: 100px 0; background: var(--paper); }.section.alt { background: #eef1f8; border-block: 1px solid var(--line); }
.section h2 { max-width: 730px; margin-bottom: 14px; color: var(--ink); font-size: clamp(30px, 3.6vw, 48px); font-weight: 800; line-height: 1.12; letter-spacing: -.055em; }
.section-lead { max-width: 710px; margin-bottom: 38px; color: var(--text-2); font-size: 16.5px; }.section-note { max-width: 700px; margin-top: 27px; color: var(--text-2); }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.col-card, .metric-card, .opp-item, .fix-card, .ba-col, .preview-panel, .preview-score { border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.86); box-shadow: var(--shadow); }
.col-card { padding: 27px; }.col-card.accent { border-color: #d1d5ff; background: linear-gradient(155deg,#fbfaff,#f1f3ff); }.col-head { display: flex; gap: 10px; align-items: center; margin-bottom: 9px; }.col-ico,.fix-ico,.opp-ico { font-size: 21px; }.col-card h3 { font-size: 18px; letter-spacing: -.03em; }.col-card p,.metric-card p,.opp-item p,.fix-card p { color: var(--text-2); font-size: 14px; }.tick-list { display: grid; gap: 7px; margin-top: 15px; list-style: none; }.tick-list li { position: relative; padding-left: 22px; font-size: 13.5px; }.tick-list li::before { position: absolute; left: 0; color: var(--green); content: "✓"; font-weight: 800; }
.metric-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }.metric-card { min-height: 184px; padding: 24px; }.metric-num { margin-bottom: 10px; color: var(--brand); font: 500 11px var(--mono); letter-spacing: .08em; }.metric-card h3 { margin-bottom: 8px; font-size: 16px; letter-spacing: -.025em; }
.loop { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }.loop-step { display: inline-flex; gap: 8px; align-items: center; padding: 10px 14px; border: 1px solid var(--line); border-radius: 999px; background: #fff; box-shadow: var(--shadow); font-size: 13px; font-weight: 800; }.step-n { display: inline-flex; width: 21px; height: 21px; align-items: center; justify-content: center; border-radius: 50%; color: #fff; background: linear-gradient(135deg,var(--brand),var(--brand-2)); font: 500 10px var(--mono); }.loop-arrow { color: #8d96aa; }
.sample-card { max-width: 760px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: var(--shadow-lg); }.sample-header { display: flex; justify-content: space-between; gap: 10px; padding: 15px 22px; border-bottom: 1px solid var(--line); background: #fbfcff; }.badge.demo { display: inline-flex; padding: 4px 8px; color: #9c6108; border: 1px solid #f5dfac; border-radius: 999px; background: #fff8e7; font-size: 11px; font-weight: 800; }.sample-domain { color: var(--text-2); font-size: 12px; font-weight: 700; }.sample-scores { display: grid; gap: 15px; padding: 24px; }.sample-score { display: grid; grid-template-columns: 190px 38px 1fr; gap: 12px; align-items: center; }.ss-label { color: var(--text-2); font-size: 13px; }.ss-value { font-size: 18px; font-weight: 800; }.ss-bar { position: relative; height: 8px; overflow: hidden; border-radius: 99px; background: #e9edf5; }.ss-bar::after { position: absolute; inset: 0; width: calc(var(--w,50) * 1%); border-radius: inherit; background: linear-gradient(90deg,var(--brand),#9c6dea); content:""; }.sample-actions { padding: 0 24px 24px; }.sample-actions .btn { color:#fff; }
.opp-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; }.opp-item { display: flex; gap: 13px; padding: 19px; }.opp-item strong { color: var(--text); }.fix-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }.fix-card { padding: 27px; }.fix-ico { margin-bottom: 11px; }.fix-card h3 { margin-bottom: 8px; font-size: 17px; }.before-after { display: flex; gap: 14px; align-items: stretch; }.ba-col { flex: 1; min-width: 230px; padding: 21px; }.ba-tag { display:inline-block; margin-bottom: 11px; color: var(--text-3); font: 500 10px var(--mono); letter-spacing: .08em; text-transform:uppercase; }.ba-tag.after { color: var(--green); }.ba-row { display:flex; justify-content:space-between; padding:8px 0; border-top: 1px dashed var(--line); color:var(--text-2); font-size:13px; }.ba-row:first-of-type { border:0; }.ba-row strong { color:var(--text); }.ba-arrow { align-self:center; color:var(--brand); font-size:24px; }.who-grid { display:flex; flex-wrap:wrap; gap:10px; }.who-chip { padding:10px 15px; border:1px solid var(--line); border-radius:999px; background:#fff; box-shadow:var(--shadow); font-size:13px; font-weight:800; }.trust-list { display:grid; gap:12px; margin-top:25px; list-style:none; }.trust-list li { position:relative; padding:18px 20px 18px 50px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; color:var(--text-2); box-shadow:var(--shadow); }.trust-list li::before { position:absolute; left:17px; top:18px; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; color:var(--green); background:#e9fbf2; content:"✓"; font-size:12px; font-weight:800; }.trust-list strong { color:var(--text); }

/* Conversion and generated preview */
.cta { padding:100px 28px; color:#fff; text-align:center; background:radial-gradient(700px 300px at 50% 110%,rgba(113,78,245,.45),transparent 70%),#090d21; }.cta h2 { max-width:780px; margin:0 auto 12px; font-size:clamp(29px,3.6vw,47px); line-height:1.1; letter-spacing:-.055em; }.cta p { margin-bottom:28px; color:#adb7ce; }.cta .analyze-form { margin:auto; text-align:left; }.cta .analyze-form .btn { color:#fff; }.footer { padding:25px 0; color:#a2aac0; background:#070b19; }.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }.footer-note { font-size:12px; }.preview-section { padding:74px 0 0; background:var(--paper); }.preview-head { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:20px; }.preview-head h2 { font-size:27px; letter-spacing:-.04em; }.preview-domain,.identity-line { color:var(--text-2); font-size:13px; }.preview-scope { display:flex; justify-content:space-between; gap:18px; margin:0 0 18px; padding:15px 18px; border:1px solid #dce3fb; border-radius:14px; background:linear-gradient(105deg,#fbfcff,#f0f4ff); }.preview-scope > div { display:grid; gap:3px; }.scope-kicker { color:#4b5fb4; font:500 10px/1.2 var(--mono); letter-spacing:.07em; text-transform:uppercase; }.preview-scope strong { font-size:13px; }.preview-scope details { flex:none; align-self:center; color:#46557e; font-size:12px; }.preview-scope summary { cursor:pointer; font-weight:800; }.preview-scope ul { display:grid; gap:5px; max-width:420px; margin-top:9px; padding-left:16px; color:var(--text-2); }.preview-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; margin-bottom:14px; }.preview-score { padding:20px; }.preview-score .ps-label { color:var(--text-2); font-size:12px; }.preview-score .ps-value { font-size:34px; font-weight:800; letter-spacing:-.05em; }.preview-score .ps-state { margin-top:3px; font-size:12px; font-weight:800; }.ps-context { margin-top:9px; color:var(--text-2); font-size:11px; line-height:1.45; }.ps-state.excellent {color:var(--green)} .ps-state.good,.cov-PARTIAL {color:#376ed8}.ps-state.needs,.cov-WEAK {color:var(--amber)}.ps-state.critical,.cov-GAP {color:var(--red)}.ps-state.na {color:var(--text-3)}.preview-breakdown { margin:0 0 18px; padding:13px 16px; border:1px solid var(--line); border-radius:13px; background:#fff; color:var(--text-2); font-size:12px; }.preview-breakdown summary { color:var(--text); cursor:pointer; font-weight:800; }.preview-breakdown > p { margin-top:8px; }.preview-breakdown ul { display:grid; gap:6px; margin-top:9px; list-style:none; }.preview-breakdown li { display:flex; justify-content:space-between; gap:12px; padding-top:6px; border-top:1px solid var(--line); }.preview-breakdown li strong { color:var(--red); }.preview-breakdown .breakdown-total { color:var(--text); font-weight:800; }.preview-two { display:grid; grid-template-columns:1fr 1fr; gap:15px; }.preview-panel { padding:21px; }.preview-panel h3 { margin-bottom:12px; font-size:15px; }.preview-panel ul { display:grid; gap:9px; list-style:none; }.preview-item { display:flex; gap:8px; align-items:flex-start; font-size:13px; }.preview-item .dot { width:7px; height:7px; flex:none; margin-top:6px; border-radius:50%; }.preview-item .q { color:var(--text-2); }.preview-item .cov { font-weight:800; white-space:nowrap; }.preview-cta { margin:22px 0 16px; text-align:center; }.preview-cta > p { margin:12px auto; max-width:750px; color:var(--text-2); font-size:13px; }.preview-cta .btn { color:#fff; }.preview-contrast { display:grid; grid-template-columns:1fr 1fr; max-width:770px; margin:0 auto; overflow:hidden; border:1px solid var(--line); border-radius:14px; text-align:left; background:#fff; }.preview-contrast > div { padding:14px 17px; }.preview-contrast > div + div { border-left:1px solid var(--line); background:#f6f7ff; }.preview-contrast span { color:var(--brand); font:500 10px var(--mono); letter-spacing:.08em; text-transform:uppercase; }.preview-contrast p { margin:4px 0 0; color:var(--text-2); font-size:12px; line-height:1.45; }

/* Auth dialog */
.modal { position:fixed; z-index:100; inset:0; display:flex; align-items:center; justify-content:center; padding:20px; }.modal[hidden] { display:none; } body.modal-open { overflow:hidden; }.modal-backdrop { position:absolute; inset:0; background:rgba(4,8,20,.7); backdrop-filter:blur(8px); }.modal-card { position:relative; width:100%; max-width:425px; padding:29px; border:1px solid rgba(255,255,255,.08); border-radius:18px; color:var(--text); background:#fff; box-shadow:0 30px 90px rgba(0,0,0,.42); }.modal-card .brand-row .brand-name { color:var(--text); }.modal-card .brand-dot { width:27px; height:27px; }.modal-x { position:absolute; top:13px; right:13px; padding:6px; color:var(--text-3); background:transparent; cursor:pointer; }.modal-card h3 { margin:18px 0 5px; font-size:21px; letter-spacing:-.04em; }.modal-sub { margin-bottom:15px; color:var(--text-2); font-size:13px; }.tabs { display:flex; gap:5px; margin-bottom:15px; padding:4px; border-radius:10px; background:var(--surface-soft); }.tab { flex:1; padding:8px; border-radius:7px; color:var(--text-2); background:transparent; cursor:pointer; font-weight:800; font-size:13px; }.tab.active { color:var(--text); background:#fff; box-shadow:0 2px 7px rgba(0,0,0,.08); }.btn-google { display:flex; width:100%; align-items:center; justify-content:center; gap:9px; min-height:46px; border:1px solid var(--line); border-radius:var(--radius-sm); color:var(--text); background:#fff; cursor:pointer; font-weight:800; }.btn-google:hover { background:var(--surface-soft); }.btn-google:disabled { opacity:.6; }.auth-divider { display:flex; gap:10px; align-items:center; margin:14px 0; color:var(--text-3); font-size:11px; }.auth-divider::before,.auth-divider::after { flex:1; height:1px; background:var(--line); content:""; }.modal-card input { min-height:46px; margin-bottom:9px; color:var(--text); border-color:var(--line); background:#fff; }.modal-card input::placeholder { color:var(--text-3); }.modal-card #auth-submit { width:100%; color:#fff; }.modal-foot { margin-top:13px; color:var(--text-3); text-align:center; font-size:11.5px; }
.spinner { position:fixed; z-index:90; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(5,10,25,.64); backdrop-filter:blur(7px); }.spinner[hidden] { display:none; }.spinner-card { max-width:420px; padding:32px 38px; border:1px solid rgba(255,255,255,.1); border-radius:18px; color:#fff; text-align:center; background:#101935; box-shadow:var(--shadow-lg); }.spinner-ring { width:39px; height:39px; margin:0 auto 15px; border:3px solid rgba(166,180,255,.2); border-top-color:#a6b7ff; border-radius:50%; animation:spin 1s linear infinite; }.spinner-sub { margin-top:5px; color:#aeb8ce; font-size:12px; } @keyframes spin { to { transform:rotate(360deg); } }

@media (max-width: 1020px) { .hero { min-height:0; padding-inline:28px; }.metric-grid { grid-template-columns:repeat(2,1fr); }.opp-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width: 780px) { .nav-inner { min-height:64px; padding:0 18px; }.nav-links,.nav-actions .btn-ghost { display:none; }.nav-actions { margin-left:auto; }.nav-actions .btn { min-height:35px; padding:7px 10px; font-size:12px; }.hero { padding:57px 20px 0; }.hero::before { background:linear-gradient(180deg,rgba(4,8,18,.98) 0%,rgba(4,8,18,.94) 45%,rgba(4,8,18,.32) 75%,rgba(4,8,18,.05) 100%); }.hero-grid { opacity:.08; }.hero-inner { display:flex; flex-direction:column; min-height:0; }.hero-copy { padding:0; }.hero h1 { font-size:clamp(43px,13vw,63px); }.hero-sub { font-size:15px; }.analyze-form { flex-direction:column; padding:5px; }.analyze-form .btn { width:100%; }.hero-visual { position:relative; z-index:0; inset:auto; width:calc(100% + 40px); min-height:620px; margin:0 -20px -1px; }.agent-art { inset:0; width:100%; height:620px; aspect-ratio:auto; transform:translate3d(var(--observer-shift-x),var(--observer-shift-y),0); }.agent-image { object-position:50% 58%; }.agent-gaze,.agent-far-eye,.agent-gaze-pupil { display:none; }.hero.gaze-tracking .agent-image { -webkit-mask-image:none; mask-image:none; }.hero-visual::before { inset:0; background:radial-gradient(ellipse at 67% 47%,rgba(117,205,255,.14),transparent 23%),linear-gradient(180deg,rgba(5,10,23,.58),transparent 30%); }.analysis-state { position:relative; left:auto; bottom:auto; z-index:3; width:100%; margin:25px 0 0; }.section { padding:67px 0; }.container { padding:0 20px; }.two-col,.preview-two { grid-template-columns:1fr; }.fix-grid { grid-template-columns:1fr; }.sample-score { grid-template-columns:1fr 38px; }.sample-score .ss-bar { grid-column:span 2; }.before-after { flex-direction:column; }.preview-grid,.preview-contrast { grid-template-columns:1fr; }.preview-contrast > div + div { border-top:1px solid var(--line); border-left:0; }.preview-scope { align-items:flex-start; flex-direction:column; }.footer-inner { align-items:flex-start; flex-direction:column; } }
@media (max-width: 520px) { .hero h1 { font-size:43px; }.hero-note { width:100%; }.trust-strip { margin-top:20px; }.hero-visual { min-height:565px; }.agent-art { height:565px; }.metric-grid,.opp-grid { grid-template-columns:1fr; }.sample-header { align-items:flex-start; flex-direction:column; }.section h2 { font-size:31px; } }
@media (max-width: 780px) { .analysis-progress-grid { grid-template-columns:1fr; gap:10px; }.analysis-document.document-two,.analysis-document.document-three { display:none; }.analysis-network { opacity:.72; }.analysis-eye-glow { right:29%; }.analysis-entity-node { font-size:7px; padding:4px 5px; }.analysis-entity-node.organization { top:19%; left:27%; }.analysis-entity-node.services { top:32%; left:5%; }.analysis-entity-node.products { bottom:28%; left:12%; }.analysis-entity-node.locations { bottom:17%; left:35%; }.analysis-entity-node.people { top:29%; right:4%; } }
@media (max-width: 520px) { .analysis-document.document-one { width:62px; min-height:51px; padding:7px; }.analysis-document.document-one span { margin-bottom:6px; }.analysis-eye-glow { width:52px; height:32px; }.scan-ring-one { width:210px; height:210px; right:12%; }.scan-ring-two { width:112px; height:112px; right:27%; }.analysis-entity-node.products,.analysis-entity-node.people { display:none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; }.btn,.agent-art,.agent-gaze,.agent-gaze-image,.agent-far-eye,.agent-far-eye-image,.agent-gaze-pupil,.hero-visual::before,.agent-image,.analysis-visual,.analysis-path,.analysis-document,.analysis-eye-glow { transition:none; }.agent-gaze,.agent-far-eye,.agent-gaze-pupil { display:none; }.hero.gaze-tracking .agent-image { -webkit-mask-image:none; mask-image:none; }.spinner-ring,.hero-orbit,.analysis-active .agent-image,.analysis-active .hero-orbit,.analysis-active .agent-panel-dot,.analysis-active .live-dot::before,.analysis-active .analysis-eye-glow,.analysis-active .analysis-scan-ring,.analysis-active .analysis-traveler,.analysis-entity-node { animation:none; }.analysis-active .hero::after { display:none; }.hero-grid { display:none; } }

/* Premium marketing narrative — intentionally scoped below the frozen hero */
.narrative-icon-sprite { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
.narrative-section { position:relative; isolation:isolate; overflow:hidden; padding:clamp(86px,8vw,122px) 0; }
.narrative-section > .container { position:relative; z-index:2; }
.narrative-section::before { position:absolute; z-index:-1; inset:0; pointer-events:none; content:""; background-image:linear-gradient(rgba(84,96,135,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(84,96,135,.035) 1px,transparent 1px); background-size:52px 52px; mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent); }
.narrative-section .eyebrow { display:inline-flex; align-items:center; gap:9px; margin-bottom:17px; padding:7px 11px; border:1px solid rgba(91,92,240,.16); border-radius:999px; color:#605cf0; background:rgba(255,255,255,.64); box-shadow:0 6px 24px rgba(44,53,86,.04); }
.narrative-section .eyebrow::before { width:5px; height:5px; border-radius:50%; background:currentColor; box-shadow:0 0 12px currentColor; content:""; }
.narrative-section h2 { max-width:800px; margin-bottom:18px; font-size:clamp(36px,4.2vw,58px); line-height:1.055; letter-spacing:-.064em; text-wrap:balance; }
.narrative-section .section-lead { max-width:760px; margin-bottom:44px; color:#606a82; font-size:17px; line-height:1.75; text-wrap:pretty; }
.narrative-icon { display:grid; width:46px; height:46px; flex:none; place-items:center; border:1px solid rgba(116,119,255,.22); border-radius:14px; color:#6968ef; background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(238,240,255,.8)); box-shadow:0 11px 28px rgba(52,57,130,.12),inset 0 1px rgba(255,255,255,.9); }
.narrative-icon svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.card-kicker,.card-order { color:#6668d9; font:500 10px/1.2 var(--mono); letter-spacing:.11em; text-transform:uppercase; }

/* Search evolution: established foundation + new intelligence layer */
.evolution-section { background:radial-gradient(700px 430px at 78% 16%,rgba(117,105,255,.1),transparent 68%),linear-gradient(180deg,#f8f9fd,#f4f6fb); }
.discovery-compare { position:relative; gap:22px; }
.discovery-compare::after { position:absolute; z-index:3; top:50%; left:50%; width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(117,117,245,.25); border-radius:50%; color:#6764ec; background:#fff; box-shadow:0 10px 32px rgba(56,56,133,.16); content:"+"; font:500 16px var(--mono); transform:translate(-50%,-50%); }
.discovery-compare .col-card { position:relative; min-height:330px; padding:32px; overflow:hidden; border:1px solid rgba(117,126,159,.17); border-radius:24px; background:rgba(255,255,255,.74); box-shadow:0 22px 65px rgba(21,30,60,.08); backdrop-filter:blur(10px); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.discovery-compare .col-card::after { position:absolute; inset:auto -70px -105px auto; width:240px; height:240px; border:1px solid rgba(93,93,240,.1); border-radius:50%; box-shadow:0 0 0 34px rgba(93,93,240,.025),0 0 0 68px rgba(93,93,240,.018); content:""; }
.discovery-compare .col-card:hover { border-color:rgba(100,104,234,.32); box-shadow:0 28px 75px rgba(21,30,60,.12); transform:translateY(-3px); }
.discovery-compare .col-card.accent { border-color:rgba(117,105,255,.26); background:radial-gradient(300px 210px at 92% 12%,rgba(112,94,255,.17),transparent 75%),linear-gradient(145deg,rgba(252,251,255,.96),rgba(237,239,255,.9)); }
.discovery-compare .col-head { position:relative; z-index:2; gap:15px; margin-bottom:20px; }
.discovery-compare .col-head > div { display:grid; gap:4px; }
.discovery-compare .col-card h3 { font-size:21px; letter-spacing:-.04em; }
.discovery-compare .col-card p { position:relative; z-index:2; min-height:70px; color:#606a82; font-size:14.5px; line-height:1.7; }
.discovery-compare .tick-list { position:relative; z-index:2; gap:10px; margin-top:21px; }
.discovery-compare .tick-list li { padding-left:25px; color:#2d374f; font-size:13.5px; }
.discovery-compare .tick-list li::before { top:2px; width:16px; height:16px; display:grid; place-items:center; border-radius:50%; color:#4e6ede; background:#edf1ff; content:"✓"; font-size:9px; }
.evolution-section .section-note { margin-top:31px; padding-left:18px; border-left:2px solid #706ded; color:#626c84; }

/* Four measurement surfaces */
.section.intelligence-section { color:#dce5fb; border:0; background:radial-gradient(680px 420px at 9% 4%,rgba(77,91,238,.19),transparent 68%),radial-gradient(600px 380px at 90% 92%,rgba(59,191,225,.1),transparent 70%),#090f20; }
.intelligence-section::before { opacity:.75; background-image:linear-gradient(rgba(135,156,215,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(135,156,215,.07) 1px,transparent 1px); }
.intelligence-section::after { position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(105deg,transparent 7%,rgba(132,126,255,.06) 7.1%,transparent 7.25%,transparent 63%,rgba(92,222,255,.05) 63.1%,transparent 63.25%); content:""; }
.intelligence-section .eyebrow { color:#a9b4ff; border-color:rgba(164,174,255,.2); background:rgba(124,126,255,.08); }
.intelligence-section h2 { color:#f7f9ff; }
.intelligence-section .section-lead { color:#9ca9c5; }
.intelligence-section .metric-grid { gap:14px; }
.intelligence-section .metric-card { position:relative; min-height:255px; padding:27px 25px 23px; overflow:hidden; border:1px solid rgba(157,173,218,.15); border-radius:20px; color:#f5f7ff; background:linear-gradient(145deg,rgba(24,34,63,.88),rgba(12,19,38,.82)); box-shadow:0 18px 55px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.035); transition:transform .25s ease,border-color .25s ease,background .25s ease; }
.intelligence-section .metric-card::before { position:absolute; inset:0; pointer-events:none; background:radial-gradient(180px 120px at 92% 2%,rgba(106,113,255,.12),transparent 75%); content:""; }
.intelligence-section .metric-card:hover { border-color:rgba(146,159,255,.32); background:linear-gradient(145deg,rgba(29,41,76,.94),rgba(13,21,42,.88)); transform:translateY(-3px); }
.metric-card-top { position:relative; display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:24px; }
.intelligence-section .metric-num { margin:0; color:#7f8dac; font-size:10px; }
.intelligence-section .narrative-icon { width:42px; height:42px; color:#a7adff; border-color:rgba(151,161,255,.2); background:rgba(114,116,244,.09); box-shadow:none; }
.intelligence-section .narrative-icon svg { width:21px; height:21px; }
.intelligence-section .metric-card h3 { position:relative; margin-bottom:10px; color:#f7f9ff; font-size:18px; letter-spacing:-.035em; }
.intelligence-section .metric-card p { position:relative; max-width:230px; color:#98a5c0; font-size:13px; line-height:1.65; }
.metric-trace { position:absolute; right:0; bottom:0; left:0; height:32px; overflow:hidden; opacity:.7; }
.metric-trace::before { position:absolute; top:16px; right:0; left:0; height:1px; background:linear-gradient(90deg,transparent,rgba(112,125,255,.2) 10%,rgba(112,207,255,.44) 62%,transparent); content:""; }
.metric-trace i { position:absolute; top:13px; left:68%; width:7px; height:7px; border:1px solid #86dfff; border-radius:50%; background:#182447; box-shadow:0 0 12px #6fcfff; }

/* Continuous product loop */
.loop-section { background:radial-gradient(620px 360px at 95% 0,rgba(107,83,239,.08),transparent 70%),#f8f9fc; }
.loop-shell { overflow:hidden; border:1px solid rgba(125,134,168,.18); border-radius:26px; color:#e8edfb; background:radial-gradient(530px 260px at 15% 0,rgba(101,87,238,.2),transparent 72%),#0c1327; box-shadow:0 30px 85px rgba(14,22,48,.17); }
.loop-shell-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px 21px; border-bottom:1px solid rgba(255,255,255,.08); color:#8997b5; font:500 10px var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.loop-live { display:inline-flex; align-items:center; gap:8px; color:#aab6d0; }
.loop-live i { width:6px; height:6px; border-radius:50%; background:#65dcb5; box-shadow:0 0 13px rgba(101,220,181,.8); }
.loop-shell .loop { display:grid; grid-template-columns:minmax(112px,1fr) 16px minmax(112px,1fr) 16px minmax(112px,1fr) 16px minmax(112px,1fr) 16px minmax(112px,1fr) 16px minmax(112px,1fr); gap:0; align-items:stretch; padding:24px 18px 27px; }
.loop-shell .loop-step { position:relative; min-width:0; min-height:128px; display:flex; align-items:flex-start; justify-content:flex-start; flex-direction:column; gap:4px; padding:18px 15px; border:1px solid rgba(163,177,219,.12); border-radius:15px; color:#eef2ff; background:rgba(255,255,255,.035); box-shadow:inset 0 1px rgba(255,255,255,.035); }
.loop-shell .step-n { width:auto; height:auto; margin-bottom:15px; color:#858fff; border-radius:0; background:none; font-size:9px; }
.loop-shell .loop-step strong { font-size:13px; letter-spacing:-.02em; }
.loop-shell .loop-step small { color:#8290ad; font-size:10.5px; line-height:1.35; }
.loop-shell .loop-arrow { position:relative; z-index:2; align-self:center; color:#616f91; text-align:center; font:400 12px var(--mono); }

/* Product proof surface */
.section.sample-section { border:0; background:radial-gradient(620px 360px at 90% 12%,rgba(98,89,240,.09),transparent 73%),#eef1f7; }
.sample-section .sample-card { max-width:900px; border-color:rgba(112,122,159,.18); border-radius:24px; box-shadow:0 32px 85px rgba(23,32,65,.14); }
.sample-section .sample-header { align-items:center; padding:17px 24px; border-color:rgba(255,255,255,.08); color:#d8e0f4; background:#10172a; }
.sample-section .badge.demo { color:#f2c777; border-color:rgba(241,193,99,.22); background:rgba(222,158,44,.1); }
.sample-section .sample-domain { color:#98a5bf; font-family:var(--mono); }
.sample-section .sample-scores { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; padding:0; background:#e5e8f1; }
.sample-section .sample-score { grid-template-columns:1fr auto; gap:8px 15px; padding:25px 26px; background:#fff; }
.sample-section .sample-score .ss-bar { grid-column:1/-1; height:5px; margin-top:7px; }
.sample-section .ss-label { align-self:end; font-size:12px; }
.sample-section .ss-value { font-size:28px; line-height:1; letter-spacing:-.05em; }
.sample-section .sample-actions { padding:22px 25px 25px; border-top:1px solid #e7eaf1; background:#fff; }

/* Evidence-backed opportunity cards */
.opportunity-section { background:linear-gradient(180deg,#f8f9fc,#f4f6fb); }
.opportunity-section .opp-grid { gap:16px; }
.opportunity-section .opp-item { position:relative; min-height:222px; display:block; padding:26px; overflow:hidden; border-color:rgba(118,127,160,.17); border-radius:21px; background:rgba(255,255,255,.77); box-shadow:0 16px 48px rgba(27,37,69,.07); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.opportunity-section .opp-item::after { position:absolute; right:-37px; bottom:-53px; width:116px; height:116px; border:1px solid rgba(101,100,240,.09); border-radius:50%; box-shadow:0 0 0 18px rgba(101,100,240,.025); content:""; }
.opportunity-section .opp-item:hover { border-color:rgba(102,103,233,.3); box-shadow:0 24px 58px rgba(27,37,69,.11); transform:translateY(-3px); }
.opportunity-section .card-order { position:absolute; top:28px; right:25px; color:#9aa3b8; font-size:9px; }
.opportunity-section .narrative-icon { width:43px; height:43px; margin-bottom:27px; }
.opportunity-section .narrative-icon svg { width:21px; height:21px; }
.opportunity-section .opp-item p { position:relative; z-index:2; color:#717b92; font-size:13.5px; line-height:1.65; }
.opportunity-section .opp-item strong { display:inline-block; margin-bottom:6px; color:#182036; font-size:15px; line-height:1.35; letter-spacing:-.025em; }

/* Commercial action paths */
.section.action-section { color:#dce4f7; border:0; background:radial-gradient(620px 390px at 93% 0,rgba(118,78,232,.19),transparent 72%),radial-gradient(500px 330px at 0 100%,rgba(64,177,217,.09),transparent 70%),#0a1021; }
.action-section::before { opacity:.7; background-image:linear-gradient(rgba(140,155,204,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(140,155,204,.06) 1px,transparent 1px); }
.action-section .eyebrow { color:#aeb6ff; border-color:rgba(170,179,255,.18); background:rgba(118,110,242,.09); }
.action-section h2 { color:#f7f9ff; }
.action-section .section-lead { color:#99a6bf; }
.action-section .fix-grid { gap:15px; }
.action-section .fix-card { min-height:310px; display:flex; flex-direction:column; padding:29px; border-color:rgba(156,170,213,.15); border-radius:21px; background:linear-gradient(145deg,rgba(24,34,62,.91),rgba(13,21,41,.88)); box-shadow:0 20px 58px rgba(0,0,0,.18); transition:transform .25s ease,border-color .25s ease; }
.action-section .fix-card:hover { border-color:rgba(153,157,255,.32); transform:translateY(-3px); }
.fix-card-top { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:27px; color:#6f7b98; font:500 9px var(--mono); letter-spacing:.1em; }
.action-section .narrative-icon { width:44px; height:44px; color:#adb5ff; border-color:rgba(158,164,255,.19); background:rgba(116,110,243,.09); box-shadow:none; }
.action-section .fix-card h3 { color:#f4f6ff; font-size:18px; }
.action-section .fix-card p { color:#96a3bc; font-size:13.5px; line-height:1.7; }
.fix-path { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:20px; border-top:1px solid rgba(255,255,255,.08); color:#b9c3da; font:500 10px var(--mono); letter-spacing:.055em; text-transform:uppercase; }
.fix-path i { color:#8f95ff; font-style:normal; font-size:15px; }

/* Before / after verification */
.verify-section { background:radial-gradient(580px 360px at 8% 12%,rgba(91,92,240,.08),transparent 72%),#f8f9fc; }
.verify-section .before-after { max-width:900px; gap:0; align-items:center; padding:13px; border:1px solid rgba(112,122,158,.17); border-radius:25px; background:rgba(255,255,255,.64); box-shadow:0 24px 70px rgba(21,31,64,.09); }
.verify-section .ba-col { position:relative; min-width:0; padding:27px 29px; border:0; border-radius:17px; box-shadow:none; }
.verify-section .ba-col:last-child { background:linear-gradient(145deg,#f2f4ff,#eef9f7); }
.verify-section .ba-tag { margin-bottom:17px; }
.verify-section .ba-row { padding:12px 0; border-color:#e3e6ef; font-size:13px; }
.verify-section .ba-row strong { font-size:18px; letter-spacing:-.04em; }
.verify-section .ba-col:last-child .ba-row strong { color:#168866; }
.verify-section .ba-arrow { position:relative; z-index:2; width:42px; height:42px; flex:none; display:grid; place-items:center; margin:0 -8px; border:1px solid rgba(106,107,236,.17); border-radius:50%; color:#6867ed; background:#fff; box-shadow:0 10px 24px rgba(48,52,122,.13); font-size:17px; }
.verify-section .section-note { padding-left:18px; border-left:2px solid #6a69ed; }

/* Audience cards */
.section.audience-section { border:0; background:linear-gradient(180deg,#eef1f7,#f4f6fa); }
.audience-section .who-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; margin-top:42px; }
.audience-section .who-chip { min-height:92px; display:flex; align-items:center; gap:14px; padding:19px 20px; border-color:rgba(114,124,157,.17); border-radius:17px; color:#252e45; background:rgba(255,255,255,.75); box-shadow:0 13px 38px rgba(24,34,65,.06); font-size:13.5px; transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.audience-section .who-chip:hover { border-color:rgba(102,103,233,.28); box-shadow:0 19px 45px rgba(24,34,65,.1); transform:translateY(-2px); }
.audience-section .narrative-icon { width:40px; height:40px; border-radius:12px; }
.audience-section .narrative-icon svg { width:20px; height:20px; }

/* Trust panel before conversion */
.trust-section { background:#f7f8fc; }
.trust-section .container { max-width:980px; padding:clamp(28px,4vw,48px); overflow:hidden; border:1px solid rgba(148,164,208,.15); border-radius:28px; color:#dfe6f7; background:radial-gradient(450px 230px at 0 0,rgba(103,91,241,.19),transparent 72%),#0d1427; box-shadow:0 30px 85px rgba(12,20,44,.18); }
.trust-section .container::after { position:absolute; top:-130px; right:-90px; width:330px; height:330px; border:1px solid rgba(128,144,202,.09); border-radius:50%; box-shadow:0 0 0 48px rgba(128,144,202,.025),0 0 0 96px rgba(128,144,202,.018); content:""; }
.trust-section .eyebrow { position:relative; z-index:2; color:#aeb7ff; border-color:rgba(171,181,255,.18); background:rgba(113,105,238,.09); }
.trust-section h2 { position:relative; z-index:2; max-width:690px; color:#f6f8ff; }
.trust-section .trust-list { position:relative; z-index:2; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:32px; }
.trust-section .trust-list li { min-height:188px; padding:58px 20px 20px; border-color:rgba(155,171,215,.13); border-radius:17px; color:#9eabc3; background:rgba(255,255,255,.035); box-shadow:none; font-size:12.5px; line-height:1.65; }
.trust-section .trust-list li::before { top:20px; left:20px; color:#8ee3c1; border:1px solid rgba(111,221,180,.17); background:rgba(68,192,147,.09); }
.trust-section .trust-list strong { color:#eef2ff; }

@media (max-width:1020px) {
  .loop-shell .loop { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  .loop-shell .loop-arrow { display:none; }
  .audience-section .who-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .trust-section .trust-list { grid-template-columns:1fr; }
  .trust-section .trust-list li { min-height:0; }
}
@media (max-width:780px) {
  .narrative-section { padding:76px 0; }
  .narrative-section h2 { font-size:clamp(33px,10vw,43px); }
  .narrative-section .section-lead { margin-bottom:33px; font-size:15.5px; line-height:1.7; }
  .discovery-compare { gap:14px; }
  .discovery-compare::after { top:50%; width:30px; height:30px; }
  .discovery-compare .col-card { min-height:0; padding:25px; }
  .discovery-compare .col-card p { min-height:0; }
  .intelligence-section .metric-card { min-height:225px; }
  .loop-shell .loop { grid-template-columns:repeat(2,minmax(0,1fr)); padding:17px; }
  .sample-section .sample-scores { grid-template-columns:1fr; }
  .sample-section .sample-score { grid-template-columns:1fr auto; }
  .sample-section .sample-score .ss-bar { grid-column:1/-1; }
  .opportunity-section .opp-item { min-height:205px; }
  .verify-section .before-after { padding:10px; }
  .verify-section .ba-arrow { margin:-8px 0; transform:rotate(90deg); }
  .audience-section .who-grid { margin-top:31px; }
}
@media (max-width:520px) {
  .narrative-section { padding:66px 0; }
  .narrative-section::before { background-size:40px 40px; }
  .narrative-section .eyebrow { font-size:9px; }
  .narrative-section h2 { font-size:32px; line-height:1.08; }
  .narrative-section .section-lead { margin-bottom:29px; }
  .discovery-compare::after { top:50%; }
  .discovery-compare .col-card { padding:23px; border-radius:20px; }
  .intelligence-section .metric-grid { gap:11px; }
  .intelligence-section .metric-card { min-height:205px; padding:23px; }
  .loop-shell { border-radius:21px; }
  .loop-shell-head { align-items:flex-start; flex-direction:column; }
  .loop-shell .loop { grid-template-columns:1fr; gap:9px; }
  .loop-shell .loop-step { min-height:96px; }
  .loop-shell .step-n { margin-bottom:9px; }
  .sample-section .sample-card { border-radius:20px; }
  .sample-section .sample-score { padding:22px; }
  .opportunity-section .opp-item { min-height:0; padding:23px; }
  .action-section .fix-card { min-height:280px; padding:25px; }
  .verify-section .ba-col { padding:23px 20px; }
  .audience-section .who-grid { grid-template-columns:1fr; }
  .audience-section .who-chip { min-height:78px; }
  .trust-section .container { margin-inline:14px; padding:28px 20px; border-radius:23px; }
}
@media (prefers-reduced-motion:reduce) {
  .discovery-compare .col-card,.intelligence-section .metric-card,.opportunity-section .opp-item,.action-section .fix-card,.audience-section .who-chip { transition:none; }
}

/* Sandbox-only founder path inside the auth dialog. The server gate keeps it hidden in production. */
.modal-card { max-height:calc(100vh - 40px); overflow-y:auto; }
.modal-sandbox-access { display:grid; gap:8px; margin:0 0 13px; padding:15px; border:1px solid #d6d9ff; border-radius:14px; background:radial-gradient(190px 100px at 100% 0,rgba(113,92,241,.16),transparent 74%),linear-gradient(145deg,#fafaff,#f2f4ff); box-shadow:inset 0 1px rgba(255,255,255,.9),0 12px 30px rgba(59,57,137,.08); }
.modal-sandbox-access[hidden],.modal-sandbox-divider[hidden] { display:none; }
.modal-sandbox-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.modal-sandbox-badge { padding:4px 7px; color:#655bd9; border:1px solid #d4d2ff; border-radius:999px; background:#eeedff; font:500 8px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.modal-sandbox-status { display:inline-flex; align-items:center; gap:6px; color:#537469; font:700 9px/1.2 var(--display); }
.modal-sandbox-status i { width:6px; height:6px; border-radius:50%; background:#22ad7a; box-shadow:0 0 10px rgba(34,173,122,.45); }
.modal-sandbox-access > strong { color:#161e34; font-size:14px; letter-spacing:-.025em; }
.modal-sandbox-access > p { color:#68738c; font-size:11px; line-height:1.5; }
.modal-sandbox-entry { width:100%; min-height:42px; margin-top:2px; color:#fff; border-color:rgba(85,83,222,.2); background:linear-gradient(135deg,#5962df,#7950e5); box-shadow:0 10px 24px rgba(91,79,216,.2); }
.modal-sandbox-entry:hover { box-shadow:0 13px 28px rgba(91,79,216,.3); }
.modal-sandbox-entry:disabled { color:#fff; }
.modal-sandbox-error { margin-top:3px; font-size:11px; }
.modal-sandbox-divider { margin:12px 0; color:#7e879b; }
@media (max-width:520px) {
  .modal { padding:12px; }
  .modal-card { max-height:calc(100vh - 24px); padding:23px 20px; }
  .modal-sandbox-access { padding:13px; }
}

/* Preview result hierarchy — the approved hero above remains untouched. */
.preview-section { padding:clamp(52px,6vw,82px) 0 clamp(72px,8vw,112px); background:radial-gradient(900px 430px at 50% 0,rgba(114,102,241,.08),transparent 68%),var(--paper); }
.preview-result-masthead { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.65fr); gap:clamp(22px,3vw,40px); align-items:stretch; margin-bottom:clamp(36px,5vw,58px); padding:clamp(28px,3.8vw,48px); overflow:hidden; border:1px solid rgba(139,169,236,.2); border-radius:28px; color:#f7f9ff; background:radial-gradient(680px 330px at 12% 0,rgba(96,106,237,.24),transparent 68%),linear-gradient(135deg,#081126 0%,#0a132b 57%,#17133c 100%); box-shadow:0 30px 80px rgba(23,34,78,.2); }
.preview-result-masthead::before { position:absolute; z-index:-1; inset:0; pointer-events:none; content:""; background-image:linear-gradient(rgba(143,178,237,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(143,178,237,.045) 1px,transparent 1px); background-size:44px 44px; mask-image:linear-gradient(90deg,#000,transparent 78%); }
.preview-result-primary { min-width:0; }
.preview-ready { display:inline-flex; gap:8px; align-items:center; margin-bottom:clamp(28px,3.2vw,42px); padding:7px 11px; border:1px solid rgba(127,229,190,.2); border-radius:999px; color:#a9efd5; background:rgba(61,175,134,.08); font:600 9px/1 var(--mono); letter-spacing:.11em; text-transform:uppercase; }
.preview-ready span { width:7px; height:7px; border-radius:50%; background:#67ddb1; box-shadow:0 0 13px rgba(103,221,177,.85); }
.preview-site-label { margin-bottom:8px; color:#8fa8cc; font:600 11px/1.2 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.preview-result-masthead .preview-result-primary h2 { max-width:none; margin:0; color:#fff; font-size:clamp(34px,4.1vw,55px); line-height:1.02; letter-spacing:-.06em; overflow-wrap:anywhere; }
.preview-result-summary { max-width:700px; margin-top:17px; color:#b7c3d8; font-size:clamp(14px,1.25vw,16px); line-height:1.65; }
.preview-site-facts { display:flex; flex-wrap:wrap; gap:8px; margin-top:23px; }
.preview-site-facts span { display:inline-flex; gap:5px; align-items:baseline; padding:8px 11px; border:1px solid rgba(157,184,231,.16); border-radius:999px; color:#aab7cd; background:rgba(255,255,255,.035); font-size:12px; }
.preview-site-facts strong { color:#f4f7ff; font-size:13px; }
.preview-result-masthead .identity-line { display:flex; flex-wrap:wrap; gap:7px 12px; max-width:760px; margin-top:19px; color:#aebbd1; font-size:13px; line-height:1.55; }
.preview-result-masthead .identity-line > span { color:#829bc2; font:600 9px/1.7 var(--mono); letter-spacing:.09em; text-transform:uppercase; }
.preview-result-masthead .preview-scope { display:flex; flex-direction:column; justify-content:flex-start; gap:13px; margin:0; padding:24px; border:1px solid rgba(153,178,231,.18); border-radius:20px; color:#dfe7f7; background:linear-gradient(155deg,rgba(255,255,255,.095),rgba(255,255,255,.035)); box-shadow:inset 0 1px rgba(255,255,255,.06); backdrop-filter:blur(12px); }
.preview-scope-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.preview-result-masthead .scope-kicker { color:#9fb0cc; font-size:9px; letter-spacing:.1em; }
.preview-result-masthead .preview-scope-heading strong { color:#ffda91; font-size:clamp(24px,2.2vw,32px); line-height:1; letter-spacing:-.045em; }
.preview-result-masthead .scope-moderate .preview-scope-heading strong { color:#a8caff; }
.preview-result-masthead .scope-strong .preview-scope-heading strong { color:#91e6c7; }
.preview-result-masthead .preview-scope > p { color:#c2cde0; font-size:13px; line-height:1.55; }
.preview-result-masthead .preview-scope details { width:100%; margin-top:auto; padding-top:15px; border-top:1px solid rgba(161,183,225,.15); color:#b7c4da; font-size:12px; }
.preview-result-masthead .preview-scope summary { color:#e6ecf8; font-size:12px; }
.preview-result-masthead .preview-scope ul { max-width:none; color:#aebbd0; font-size:11.5px; line-height:1.5; }
.preview-metric-intro { display:grid; grid-template-columns:minmax(0,.85fr) minmax(320px,.65fr); gap:28px; align-items:end; margin-bottom:22px; }
.preview-section-kicker { margin-bottom:8px; color:#625eed; font:600 10px/1.2 var(--mono); letter-spacing:.11em; text-transform:uppercase; }
.preview-metric-intro h3 { color:var(--ink); font-size:clamp(27px,3vw,39px); line-height:1.08; letter-spacing:-.052em; }
.preview-metric-intro > p { max-width:570px; color:#606b83; font-size:14px; line-height:1.65; }
.preview-grid { gap:16px; margin-bottom:17px; }
.preview-score { position:relative; display:flex; min-height:266px; flex-direction:column; padding:25px; overflow:hidden; border-color:#e0e4ee; border-radius:20px; box-shadow:0 18px 45px rgba(35,49,83,.08); }
.preview-score::after { position:absolute; right:-25px; bottom:-35px; width:120px; height:120px; border-radius:50%; background:radial-gradient(circle,rgba(105,93,236,.08),transparent 70%); content:""; }
.preview-score-head { display:flex; gap:12px; align-items:center; }
.preview-icon { display:inline-grid; width:39px; height:39px; flex:none; place-items:center; border:1px solid #dcdffc; border-radius:12px; color:#625fe5; background:#f5f5ff; }
.preview-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.preview-score .ps-type,.preview-panel-heading span { display:block; margin-bottom:4px; color:#7b8296; font:600 8px/1.2 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.preview-score .ps-label { color:#222b40; font-size:14px; font-weight:800; line-height:1.25; }
.preview-score-reading { display:flex; gap:13px; align-items:flex-end; margin:20px 0 9px; }
.preview-score .ps-value { color:#121a2d; font-size:48px; line-height:.95; }
.preview-score .ps-state { margin:0 0 4px; padding:5px 8px; border-radius:999px; background:#f1f3f8; font-size:11px; }
.preview-score .ps-context { position:relative; z-index:1; margin-top:auto; color:#667188; font-size:13px; line-height:1.6; }
.preview-breakdown { margin:0 0 20px; padding:16px 19px; border-radius:14px; color:#68738a; font-size:13px; }
.preview-breakdown summary { font-size:13px; }
.preview-two { gap:16px; }
.preview-panel { min-height:255px; padding:25px; border-radius:20px; box-shadow:0 18px 45px rgba(35,49,83,.07); }
.preview-panel-heading { display:flex; gap:12px; align-items:center; }
.preview-panel-heading h3 { margin:0; color:#20283b; font-size:18px; letter-spacing:-.03em; }
.preview-panel-summary { margin:15px 0 17px; padding-bottom:15px; border-bottom:1px solid #edf0f5; color:#68738a; font-size:13px; line-height:1.5; }
.preview-panel ul { gap:10px; }
.preview-item { font-size:13.5px; line-height:1.5; }
.preview-item .q { color:#667188; }
.preview-next-step { margin:25px 0 0; padding:clamp(27px,3.8vw,45px); border:1px solid rgba(139,153,236,.2); border-radius:25px; color:#f4f6ff; text-align:left; background:radial-gradient(560px 260px at 100% 0,rgba(120,79,232,.28),transparent 72%),linear-gradient(145deg,#0b142b,#10132f 58%,#1b1240); box-shadow:0 28px 70px rgba(30,31,91,.17); }
.preview-next-copy { display:grid; grid-template-columns:minmax(260px,.7fr) minmax(320px,1fr); gap:10px 36px; align-items:end; }
.preview-next-copy .preview-section-kicker { grid-column:1/-1; color:#aaa5ff; }
.preview-next-copy h3 { color:#fff; font-size:clamp(27px,3.2vw,42px); line-height:1.08; letter-spacing:-.052em; overflow-wrap:anywhere; }
.preview-next-copy > p { color:#b1bdd4; font-size:14px; line-height:1.65; }
.preview-next-step .preview-contrast { display:grid; grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr); max-width:none; margin:28px 0 22px; overflow:visible; border:0; border-radius:0; color:inherit; background:transparent; }
.preview-next-step .preview-contrast > div { padding:19px; border:1px solid rgba(157,174,222,.15); border-radius:16px; background:rgba(255,255,255,.035); }
.preview-next-step .preview-contrast > div + div { border-left:1px solid rgba(157,174,222,.15); }
.preview-next-step .preview-contrast .preview-path-next { border-color:rgba(151,136,247,.27); background:rgba(116,91,226,.11); }
.preview-next-step .preview-contrast span { color:#a9a5ff; font-size:9px; }
.preview-next-step .preview-contrast strong { display:block; margin-top:7px; color:#fff; font-size:18px; letter-spacing:-.025em; }
.preview-next-step .preview-contrast p { color:#aeb9cf; font-size:12.5px; line-height:1.55; }
.preview-next-step .preview-contrast .preview-path-arrow { display:grid; padding:0; border:0; place-items:center; color:#918cf8; background:transparent; font-size:22px; }
.preview-signup-row { display:flex; gap:22px; align-items:center; justify-content:space-between; padding-top:22px; border-top:1px solid rgba(163,178,219,.15); }
.preview-signup-row > div { display:grid; gap:4px; }
.preview-signup-row strong { color:#f4f6ff; font-size:14px; }
.preview-signup-row span { color:#9facbf; font-size:12px; }
.preview-signup-row .btn { flex:none; min-height:50px; padding-inline:23px; }
.preview-paid-note { margin:15px 0 0!important; color:#8491aa!important; text-align:left; font-size:11.5px!important; }

@media (max-width:960px) {
  .preview-result-masthead { grid-template-columns:1fr; }
  .preview-result-masthead .preview-scope { min-height:0; }
  .preview-metric-intro,.preview-next-copy { grid-template-columns:1fr; align-items:start; }
  .preview-next-copy .preview-section-kicker { grid-column:auto; }
}
@media (max-width:780px) {
  .preview-result-masthead { padding:27px 23px; border-radius:23px; }
  .preview-ready { margin-bottom:30px; }
  .preview-site-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .preview-site-facts span { justify-content:center; text-align:center; }
  .preview-metric-intro > p { font-size:13.5px; }
  .preview-grid { gap:12px; }
  .preview-score { min-height:235px; }
  .preview-panel { min-height:0; }
  .preview-next-step .preview-contrast { grid-template-columns:1fr; gap:10px; }
  .preview-next-step .preview-contrast > div + div { border-left:0; }
  .preview-next-step .preview-contrast .preview-path-arrow { min-height:26px; transform:rotate(90deg); }
  .preview-signup-row { align-items:stretch; flex-direction:column; }
  .preview-signup-row .btn { width:100%; }
}
@media (max-width:520px) {
  .preview-section { padding:43px 0 72px; }
  .preview-result-masthead .preview-result-primary h2 { font-size:32px; }
  .preview-result-summary { font-size:14px; }
  .preview-site-facts { grid-template-columns:1fr; }
  .preview-site-facts span { justify-content:flex-start; padding-inline:12px; }
  .preview-result-masthead .preview-scope { padding:20px; }
  .preview-metric-intro h3 { font-size:29px; }
  .preview-score,.preview-panel { padding:22px; }
  .preview-next-step { padding:25px 21px; border-radius:22px; }
  .preview-next-copy h3 { font-size:29px; }
}
