/* ALID home (SaaS landing). Only loaded by /tools/ai-lead-intake-diagnostic/index.html, on top of site.css, site-chrome.css and alid.css.
   Own look: warm paper, soft gradient, calm medium-weight type (Figtree 500 / Inter from fonts.css), console-style mini UI.
   Everything is scoped under .ah so the rest of the site is untouched. */
.ah {
  --a: #C44B32; --a-deep: #A63D27; --a-soft: #F6E6E1;
  --paper: #FBFAF7; --page: #F4F1EC; --ln: #E4DED4; --ln2: #D6CFC3;
  --i: #1D1D1F; --i2: #3A3A3D; --mu: #6E6E73;
  --ok: #0F7B4F; --ok-s: #E3F1EA; --wa: #B45309; --wa-s: #F8EEDC; --cr: #B3261E; --cr-s: #F8E4E1;
  --nav: #0B3558;
  overflow-x: clip; color: var(--nav);
}
.ah .wrap { max-width: 1160px; }
.ah h1, .ah h2, .ah h3 { color: var(--nav); }
.ah-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ah-kicker { font: 600 .9rem/1.3 var(--font); letter-spacing: 0; text-transform: none; color: var(--a); margin: 0 0 14px; }
.ah-kicker.light { color: #F6C9BD; }
.ah-intro { font-size: 1.125rem; line-height: 1.55; color: var(--i2); max-width: 36rem; margin: 0 0 20px; }
.ah-intro.ah-lines { max-width: none; }
.ah-intro.ah-lines > span { display: block; }
.ah-intro.ah-lines .ah-sub { color: var(--mu); font-size: 1.02rem; margin-top: 4px; }
@media (min-width: 720px) { .ah-intro.ah-lines > span { white-space: nowrap; } }
.ah-quiet { font-size: .95rem; color: var(--mu); max-width: 34rem; margin: 0 0 16px; }
.ah-quiet a { color: inherit; }
.ah h1, .ah h2 { text-wrap: balance; }
.ah h2 { font-size: clamp(1.9rem, 3.2vw + .5rem, 2.9rem); margin: 0 0 16px; max-width: 22ch; }
.ah h3 { font-size: 1.1rem; margin: 0 0 6px; }
.ah .btn { border-radius: 999px; font-weight: 600; min-height: 50px; padding: 12px 26px; box-shadow: 0 1px 0 rgba(255,255,255,.25) inset, 0 6px 16px -6px rgba(196,75,50,.55); }
.ah .btn-2 { background: #fff; color: var(--nav); border-color: var(--ln2); box-shadow: 0 1px 2px rgba(11,53,88,.06); }
.ah .btn-2:hover { background: #fff; border-color: var(--a); color: var(--a); }
.ah-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 26px 0 0; }

/* ---------- hero ---------- */
.ah-hero { position: relative; padding: 64px 0 88px;
  background:
    radial-gradient(900px 520px at 88% 0%, rgba(196,75,50,.13), transparent 62%),
    radial-gradient(700px 480px at -5% 8%, rgba(244,241,236,.95), transparent 70%),
    linear-gradient(#fff, #fff); }
.ah-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) 560px; gap: 56px; align-items: center; }
/* the grey line ("Start from the problem.") never wraps: the size follows the copy column (about 10.1em wide at this face) */
.ah-copy h1 { font-size: clamp(2.5rem, calc((100vw - 680px) / 10.9), 2.9rem); margin: 0 0 20px; max-width: none; line-height: 1.06; }
.ah-copy h1 .ah-soft { color: #8C97A6; display: block; white-space: nowrap; }
.ah-lede { font-size: 1.2rem; line-height: 1.5; color: var(--i2); max-width: 31rem; margin: 0; }
.ah-note { margin: 22px 0 6px; font-size: .95rem; color: var(--nav); }
.ah-note strong { font-weight: 600; }
.ah-fine { margin: 0; font-size: .875rem; color: var(--mu); }
.ah-fine a { color: inherit; }
.ah-fine.light { color: #C9D3DE; margin-top: 14px; }

/* the stage: fixed size, everything absolutely placed, so nothing shifts while the loop plays */
.ah-stage { position: relative; width: 560px; height: 680px; max-width: 100%; }
.ah-osi { position: absolute; right: -14px; top: -30px; width: 310px; height: 310px; margin: 0; z-index: 1; isolation: isolate; }
.ah-osi .hm-glow { position: absolute; z-index: -2; left: 50%; top: 52%; width: 92%; aspect-ratio: 1; transform: translate(-50%,-50%); border-radius: 50%;
  background: radial-gradient(closest-side, rgba(196,75,50,.20), rgba(196,75,50,.08) 62%, rgba(196,75,50,0) 100%); }
.ah-osi .hm-figure { position: absolute; inset: 0; z-index: 1; display: block; margin: 0; transition: opacity .6s ease; }
.ah-osi .hm-figure img { display: block; width: 100%; height: 100%; object-fit: contain; transform-origin: 50% 100%; animation: ah-breathe 6s ease-in-out infinite; }
.ah-osi .hm-canvas { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity .6s ease; touch-action: pan-y; }
.ah-osi.hm-live .hm-canvas { opacity: 1; }
.ah-osi.hm-live .hm-figure { opacity: 0; }
@keyframes ah-breathe { 0%,100% { transform: translateY(0) scale(1,1); } 50% { transform: translateY(-4px) scale(1.012,.988); } }

.ah-win { position: absolute; z-index: 2; background: var(--paper); border: 1px solid var(--ln); border-radius: 16px; overflow: hidden;
  box-shadow: 0 1px 2px rgba(29,29,31,.05), 0 24px 48px -20px rgba(11,53,88,.28); color: var(--i); font-size: 13px; line-height: 1.4; }
.ah-intake { left: 0; top: 134px; width: 336px; height: 314px; }
.ah-inbox { right: 0; bottom: 0; width: 400px; height: 222px; z-index: 3; }
.ah-bar { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; background: var(--page); border-bottom: 1px solid var(--ln); }
.ah-bar i { width: 9px; height: 9px; border-radius: 50%; background: #D8D1C5; flex: none; }
.ah-url { margin-left: 8px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: var(--mu); background: #fff; border-radius: 999px; padding: 3px 10px; border: 1px solid var(--ln); }
.ah-tag { font: 600 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--a); background: var(--a-soft); padding: 4px 7px; border-radius: 999px; }
.ah-label { font: 600 10.5px/1.2 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--mu); margin: 0 0 8px; }
.ah-pane { position: absolute; inset: 34px 0 0 0; padding: 16px 16px 14px; transition: opacity .35s ease, transform .35s ease; }
.ah-read { opacity: 0; transform: translateY(8px); pointer-events: none; }
.ah-intake.is-read .ah-form { opacity: 0; transform: translateY(-8px); }
.ah-intake.is-read .ah-read { opacity: 1; transform: none; }
.ah-type { height: 110px; padding: 12px 13px; background: #fff; border: 1px solid var(--ln2); border-radius: 12px; font-size: 14px; line-height: 1.5; color: var(--i); overflow: hidden; }
.ah-caret { display: inline-block; width: 2px; height: 1.05em; background: var(--a); vertical-align: -2px; margin-left: 1px; animation: ah-blink 1s steps(2) infinite; }
@keyframes ah-blink { 50% { opacity: 0; } }
.ah-who { display: flex; gap: 8px; margin: 12px 0 0; flex-wrap: wrap; }
.ah-who span { font-size: 12px; padding: 6px 10px; background: #fff; border: 1px solid var(--ln); border-radius: 999px; color: var(--i2); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ah-go { position: relative; height: 40px; margin-top: 16px; }
.ah-fakebtn { display: inline-flex; align-items: center; height: 38px; padding: 0 18px; border-radius: 999px; background: var(--a); color: #fff; font-weight: 600; font-size: 13.5px; transition: transform .15s ease, opacity .25s ease; }
.ah-intake.is-press .ah-fakebtn { transform: scale(.94); }
.ah-reading { position: absolute; left: 0; top: 0; height: 38px; display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--mu); opacity: 0; transition: opacity .2s ease; }
.ah-reading::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--ln2); border-top-color: var(--a); animation: ah-spin .8s linear infinite; }
@keyframes ah-spin { to { transform: rotate(360deg); } }
.ah-intake.is-reading .ah-fakebtn { opacity: 0; }
.ah-intake.is-reading .ah-reading { opacity: 1; }

.ah-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 0 0 8px; }
.ah-row .ah-label { margin: 0; }
.ah-sev { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--wa); white-space: nowrap; }
.ah-sev i { width: 7px; height: 7px; border-radius: 50%; background: var(--wa); }
.ah-sum { font: 500 1.0625rem/1.3 var(--font-head); letter-spacing: -.012em; color: var(--i); margin: 0 0 12px; }
.ah-sum.big { font-size: 1.3rem; margin-bottom: 16px; }
.ah-flow { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.ah-flow li { position: relative; margin: 0; padding: 0 0 0 20px; font-size: 13px; }
.ah-flow li::before { content: ""; position: absolute; left: 2px; top: .38em; width: 9px; height: 9px; border-radius: 50%; background: var(--ok); }
.ah-flow li.bad::before { background: var(--cr); box-shadow: 0 0 0 3px var(--cr-s); }
.ah-flow li.unk::before { background: #fff; border: 1.5px dashed var(--mu); }
.ah-flow b { font-weight: 600; }
.ah-flow li.bad b { color: var(--cr); }
.ah-flow em { font: 600 9.5px/1 var(--mono); text-transform: uppercase; letter-spacing: .06em; margin-left: 6px; color: var(--cr); font-style: normal; }
.ah-flow li.unk em { color: var(--mu); }
.ah-flow.long { gap: 12px; margin-bottom: 18px; }
.ah-flow.long li { font-size: 14px; }
.ah-flow.long span { display: block; color: var(--mu); font-size: 13px; margin-top: 1px; }
.ah-offer { margin: 0; font-weight: 600; font-size: 13.5px; padding: 9px 12px; border-radius: 10px; background: var(--a-soft); color: var(--a-deep); }
.ah-offer span { font: 600 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .07em; margin-right: 8px; opacity: .8; }
.ah-signoff { margin: 14px 0 0; font-style: italic; color: var(--mu); font-size: 13.5px; }

.ah-inhead { display: flex; align-items: center; gap: 8px; padding: 12px 14px 8px; }
.ah-inhead b { font: 500 1rem/1 var(--font-head); color: var(--i); }
.ah-badge { min-width: 20px; height: 20px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: var(--a); color: #fff; font-size: 11.5px; font-weight: 600; transition: transform .3s ease; }
.ah-badge.pop { transform: scale(1.35); }
.ah-leads { list-style: none; margin: 0; padding: 0; }
.ah-lead { position: relative; display: grid; grid-template-columns: minmax(0,1.5fr) auto minmax(0,1.3fr) auto auto; gap: 8px; align-items: center; margin: 0; padding: 7px 14px; border-top: 1px solid var(--ln); background: transparent; font-size: 12px; min-height: 46px; }
.ah-lead .n b { display: block; font-weight: 600; font-size: 12.5px; color: var(--i); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ah-lead .n small { display: block; color: var(--mu); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ah-lead .o { color: var(--i2); font-weight: 500; line-height: 1.25; }
.ah-lead .d { color: var(--mu); }
.ah-lead .ok { color: var(--ok); font-weight: 500; white-space: nowrap; }
.ah-lead .ok::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--ok); margin-right: 5px; vertical-align: 1px; }
.ah-lead .t { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.ah-lead .t.a { background: var(--cr-s); color: var(--cr); } .ah-lead .t.b { background: var(--wa-s); color: var(--wa); } .ah-lead .t.c { background: var(--ok-s); color: var(--ok); }
.ah-lead.sel { background: #fff; box-shadow: inset 3px 0 0 var(--a); }
/* the new-lead slot: placeholder first, then the lead drops in */
.ah-lead.new { display: block; padding: 0; }
.ah-lead.new .ah-wait { display: flex; align-items: center; min-height: 46px; padding: 0 14px; color: var(--mu); font-size: 12px; transition: opacity .25s ease; }
.ah-lead.new .ah-fill { position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0,1.5fr) auto minmax(0,1.3fr) auto auto; gap: 8px; align-items: center; padding: 9px 14px; background: #fff; box-shadow: inset 3px 0 0 var(--a); opacity: 0; transform: translateY(-14px); transition: opacity .4s ease, transform .5s cubic-bezier(.2,.9,.3,1.2); }
.ah-lead.new.landed .ah-fill { opacity: 1; transform: none; animation: ah-flash 1.6s ease-out; }
.ah-lead.new.landed .ah-wait { opacity: 0; }
@keyframes ah-flash { 0% { background: var(--a-soft); } 100% { background: #fff; } }

.ah-replay { position: absolute; left: 0; top: 462px; z-index: 4; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--ln2); background: #fff; color: var(--nav); font: 600 12.5px/1 var(--font); cursor: pointer; }
.ah-replay:hover { border-color: var(--a); color: var(--a); }

/* ---------- sections ---------- */
.ah-sec { padding: 104px 0; background: #fff; }
.ah-alt { background: linear-gradient(180deg, var(--paper), #fff 140%); border-top: 1px solid var(--ln); border-bottom: 1px solid var(--ln); }
.ah-narrow { max-width: 760px; }
.ah-head { max-width: 46rem; margin: 0 0 40px; }
.ah-pains { list-style: none; margin: 36px 0 0; padding: 0; display: grid; gap: 28px; }
.ah-pains li { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 16px; margin: 0; }
.ah-pains p { margin: 0; color: var(--i2); }
.ah-n { font: 600 .85rem/1 var(--mono); color: var(--a); padding-top: .4em; }
.ah-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 20px; counter-reset: none; }
.ah-steps li { margin: 0; padding: 22px; background: #fff; border: 1px solid var(--ln); border-radius: 16px; }
.ah-steps .ah-n { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: var(--a-soft); padding: 0; margin-bottom: 14px; }
.ah-steps p { margin: 0; color: var(--i2); font-size: .98rem; }

.ah-split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 72px; align-items: center; }
.ah-feature.rev .ah-text { order: 2; }
.ah-text h2 { max-width: 18ch; }
.ah-parts { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 14px; }
.ah-parts li { margin: 0; padding-left: 16px; border-left: 2px solid var(--a-soft); }
.ah-parts b { display: block; font-weight: 600; color: var(--nav); }
.ah-parts span { color: var(--i2); font-size: .98rem; }
.ah-visual { position: relative; padding-top: 86px; }
.ah-card { position: relative; z-index: 1; background: var(--paper); border: 1px solid var(--ln); border-radius: 20px; padding: 24px; color: var(--i); font-size: 14px; box-shadow: 0 1px 2px rgba(29,29,31,.05), 0 30px 60px -28px rgba(11,53,88,.3); }
.ah-guide { position: absolute; z-index: 0; right: 34px; top: 0; width: 132px; height: auto; }
.ah-inboxcard { padding: 6px 0 0; overflow: hidden; }
.ah-inboxcard .ah-lead { padding: 12px 18px; }
.ah-inboxcard .ah-inhead { padding: 14px 18px 8px; }
.ah-detail { padding: 14px 18px 18px; border-top: 1px solid var(--ln); background: #fff; }
.ah-detail p:last-child { margin: 0; color: var(--i2); font-size: 14px; }
.ah-log { list-style: none; margin: 0 0 22px; padding: 0; }
.ah-log li { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; margin: 0; padding: 12px 0; border-top: 1px solid var(--ln); font-size: 14px; }
.ah-log .k { font-weight: 500; }
.ah-log .ok { color: var(--ok); font-weight: 500; } .ah-log .fail { color: var(--wa); font-weight: 500; text-align: right; }
.ah-chans { display: flex; flex-wrap: wrap; gap: 8px; }
.ah-chans span, .ah-langs span { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--ln2); background: #fff; font-size: 13px; font-weight: 500; color: var(--i2); }
.ah-chans span.on, .ah-langs span.on { background: var(--a); border-color: var(--a); color: #fff; }
.ah-code { margin: 0 0 22px; padding: 14px 16px; background: #1D1D1F; color: #F5F5F7; border-radius: 12px; font: 12.5px/1.6 var(--mono); overflow-x: auto; max-width: 100%; }
.ah-code code { font: inherit; background: none; color: inherit; padding: 0; white-space: pre; }
.ah-widget { background: #fff; border: 1px solid var(--ln); border-radius: 14px; padding: 16px; }
.ah-langs { display: flex; gap: 6px; margin: 0 0 12px; }
.ah-langs span { padding: 4px 10px; font-size: 12px; }
.ah-wq { margin: 0 0 8px; font-weight: 600; }
.ah-wbox { height: 54px; border: 1px solid var(--ln2); border-radius: 10px; margin-bottom: 12px; background: var(--paper); }

/* reveal: sections already show their final state without JS; with JS the UI settles in once in view */
.ah-js [data-reveal] .ah-card { opacity: 0; transform: translateY(18px); transition: opacity .45s ease, transform .45s ease; }
.ah-js [data-reveal].in .ah-card { opacity: 1; transform: none; }
.ah-js [data-reveal] .ah-flow.long li { opacity: 0; transform: translateX(-6px); transition: opacity .4s ease, transform .4s ease; }
.ah-js [data-reveal].in .ah-flow.long li { opacity: 1; transform: none; }
.ah-js [data-reveal].in .ah-flow.long li:nth-child(1) { transition-delay: .35s; }
.ah-js [data-reveal].in .ah-flow.long li:nth-child(2) { transition-delay: .6s; }
.ah-js [data-reveal].in .ah-flow.long li:nth-child(3) { transition-delay: .85s; }
.ah-js [data-reveal].in .ah-flow.long li:nth-child(4) { transition-delay: 1.1s; }
.ah-js [data-reveal].in .ah-flow.long li:nth-child(5) { transition-delay: 1.35s; }
/* Osi rises only once the card is fully opaque: he waits fully below the card's top edge (translateY 100%, invisible),
   becomes visible at .45s (the card's fade ends at .45s), then slides up from behind it with no overshoot,
   so the part of the still meant to stay behind the card never shows. */
.ah-js [data-reveal] .ah-guide { opacity: 0; transform: translateY(100%); transition: opacity 0s linear .45s, transform .75s cubic-bezier(.22,1,.36,1) .5s; }
.ah-js [data-reveal].in .ah-guide { opacity: 1; transform: none; }

/* trust, plans, close */
.ah-nots { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 56px; align-items: start; }
.ah-notlist { border-radius: 20px; padding: 28px; border: 1px solid #EBC3B8; color: var(--nav);
  background: radial-gradient(420px 260px at 0% 0%, rgba(196,75,50,.16), transparent 70%), linear-gradient(160deg, #FBEAE4 0%, #F7DDD5 55%, #FCEFEB 100%); }
.ah-notlist h3 { font-size: 1.2rem; margin-bottom: 18px; color: var(--a-deep); }
.ah-notlist ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.ah-notlist li { position: relative; margin: 0; padding-left: 40px; }
.ah-notlist li::before { content: "\00D7"; position: absolute; left: 0; top: -2px; width: 26px; height: 26px; border-radius: 50%; background: #fff; color: var(--a); box-shadow: 0 0 0 1px #EBC3B8; display: flex; align-items: center; justify-content: center; font: 500 18px/1 var(--font); }
.ah-notlist b { display: block; font-weight: 600; color: var(--nav); font-size: 1.05rem; }
.ah-notlist span { display: block; color: #4A3A37; }
/* the positive twin of the red card: soft green, AA text (h3 #0B6B43 5.4:1, body 9.4:1, quiet #4A5750 6.3:1 on the darkest stop) */
.ah-dolist { border-radius: 20px; padding: 28px; border: 1px solid #BFE0CD;
  background: radial-gradient(420px 260px at 100% 0%, rgba(15,123,79,.14), transparent 70%), linear-gradient(160deg, #E8F5EE 0%, #D8EFE2 55%, #EEF8F2 100%); }
.ah-dolist h3 { font-size: 1.2rem; margin-bottom: 18px; color: #0B6B43; }
.ah-dolist .ah-quiet { color: #4A5750; }
.ah-checks { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 12px; }
.ah-checks li { position: relative; margin: 0; padding-left: 38px; color: var(--i2); min-height: 26px; }
.ah-checks li::before { content: ""; position: absolute; left: 0; top: -1px; width: 26px; height: 26px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px #BFE0CD; }
.ah-checks li::after { content: ""; position: absolute; left: 8px; top: 6px; width: 10px; height: 5px; border-left: 2px solid #0B6B43; border-bottom: 2px solid #0B6B43; transform: rotate(-45deg); }
.ah-plans { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 72px; align-items: center; }
.ah-tiers { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.ah-tiers li { display: grid; grid-template-columns: 110px auto minmax(0,1fr); gap: 16px; align-items: baseline; margin: 0; padding: 20px 22px; background: #fff; border: 1px solid var(--ln); border-radius: 16px; }
.ah-tiers b { font: 500 1.15rem/1 var(--font-head); color: var(--nav); }
.ah-tiers .p { font: 500 1.7rem/1 var(--font-head); letter-spacing: -.02em; color: var(--nav); white-space: nowrap; }
.ah-tiers .p small { font: 500 .85rem var(--font); color: var(--mu); margin-left: 3px; letter-spacing: 0; }
.ah-tiers span:last-child { color: var(--i2); font-size: .95rem; }
.ah #faq .faq { max-width: none; margin-top: 28px; }
.ah #faq .faq summary { font-size: 1.05rem; padding: 18px 32px 18px 0; }
.ah-close { padding: 24px 0 96px; background: #fff; }
.ah-closecard { position: relative; display: grid; grid-template-columns: minmax(0,1fr) 260px; gap: 24px; align-items: end; padding: 56px 56px 0; border-radius: 28px; overflow: hidden; color: #fff;
  background: radial-gradient(520px 320px at 90% 100%, rgba(196,75,50,.55), transparent 70%), linear-gradient(135deg, #0B3558, #12466f); }
.ah-closecopy { padding-bottom: 52px; }
.ah-closecopy h2 { color: #fff; max-width: 16ch; }
.ah-closecopy p { color: #D6E0EA; margin: 0; max-width: 30rem; }
.ah-closecopy .ah-actions .btn-2 { background: transparent; color: #fff; border-color: rgba(255,255,255,.4); box-shadow: none; }
.ah-closecopy .ah-actions .btn-2:hover { border-color: #fff; color: #fff; }
.ah-closeosi { display: block; width: 240px; height: auto; justify-self: center; margin-bottom: -2px; }


.ah-modes { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 24px; margin-top: 40px; align-items: stretch; }
.ah-modes .ah-card { margin: 0; }
.ah-modes .ah-quiet { margin: 0 0 14px; }
.ah-modes .ah-widget, .ah-launcher { margin-bottom: 16px; }
.ah-modes .ah-code { margin: 0; }
.ah-launcher { position: relative; height: 148px; background: #fff; border: 1px solid var(--ln); border-radius: 14px; padding: 16px 16px 0; overflow: hidden; }
.ah-l-line { display: block; height: 8px; width: 72%; background: var(--ln); border-radius: 99px; margin-bottom: 10px; }
.ah-l-line.short { width: 44%; }
.ah-fab { position: absolute; right: 14px; bottom: 14px; display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 16px; border-radius: 999px; background: var(--a); color: #fff; font-weight: 600; font-size: 13px; box-shadow: 0 8px 20px -8px rgba(196,75,50,.7); }

/* ---------- tablet / phone ---------- */
@media (max-width: 1100px) {
  .ah-hero-grid { grid-template-columns: minmax(0,1fr); gap: 40px; }
  .ah-copy h1 { font-size: clamp(2.5rem, 4.6vw, 3.6rem); }
  .ah-stage { margin: 0 auto; }
  .ah-split, .ah-plans, .ah-nots, .ah-modes { grid-template-columns: minmax(0,1fr); gap: 40px; }
  .ah-feature.rev .ah-text { order: 0; }
  .ah-steps { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .ah-hero { padding: 28px 0 56px; }
  .ah-copy h1 { font-size: min(2.6rem, calc((100vw - 54px) / 10.5)); }
  .ah-lede { font-size: 1.08rem; }
  .ah-actions .btn { flex: 1 1 100%; }
  .ah-sec { padding: 64px 0; }
  .ah-stage { width: 100%; height: 700px; }
  .ah-osi { width: 180px; height: 180px; right: -8px; top: -16px; }
  .ah-intake { left: 0; right: 0; top: 122px; width: auto; height: 312px; }
  .ah-inbox { left: 0; right: 0; bottom: 0; width: auto; height: 226px; }
  .ah-replay { left: 0; right: auto; top: 440px; }
  .ah-lead, .ah-lead.new .ah-fill { grid-template-columns: minmax(0,1.4fr) auto minmax(0,1fr) auto; }
  .ah-lead .d { display: none; }
  .ah-steps { grid-template-columns: minmax(0,1fr); }
  .ah-card { padding: 18px; }
  .ah-inboxcard { padding: 4px 0 0; }
  .ah-guide { width: 104px; right: 18px; }
  .ah-visual { padding-top: 68px; }
  .ah-notlist { padding: 22px; }
  .ah-tiers li { grid-template-columns: minmax(0,1fr) auto; row-gap: 6px; }
  .ah-tiers span:last-child { grid-column: 1 / -1; }
  .ah-closecard { grid-template-columns: minmax(0,1fr); padding: 36px 24px 0; border-radius: 22px; }
  .ah-closecopy { padding-bottom: 12px; }
  .ah-closeosi { width: 180px; }
  .ah-dolist { padding: 22px; }
  .ah-log li { flex-wrap: wrap; }
  .ah-log .fail { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  .ah-osi .hm-figure img, .ah-caret { animation: none; }
  .ah-js [data-reveal] .ah-card, .ah-js [data-reveal] .ah-flow.long li, .ah-js [data-reveal] .ah-guide { opacity: 1; transform: none; transition: none; }
}