/* SeatLayer homepage — outcome-led hero with the live picker, then the audience
   fork, 3D, the one-chart surfaces, the integration boundary, and the paths. */
.skip-link{position:fixed;left:16px;top:12px;z-index:1000;transform:translateY(-160%);padding:10px 14px;border-radius:8px;background:#fff;color:var(--ink);font-weight:750;box-shadow:var(--shadow-card)}
.skip-link:focus{transform:none}

/* ---------- 1. hero ---------- */
.home-hero{position:relative;overflow:hidden;padding:clamp(36px,4vw,52px) 0 clamp(52px,6vw,72px);background:
  radial-gradient(70% 60% at 82% 4%,rgba(244,183,64,.14),transparent 64%),
  linear-gradient(180deg,#fdf3e2 0%,var(--paper) 66%)}
.home-hero:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.4;background-image:linear-gradient(rgba(12,18,32,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(12,18,32,.035) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,#000,transparent 76%)}
.home-hero .wrap{position:relative}
/* Copy left, live product right. The panel is the argument, so it gets the
   larger column and both columns start at the top of the first viewport. */
.home-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(28px,3.4vw,44px);align-items:center}
.home-intro>*{min-width:0}
/* Not the --sl-title-xl display token: at 82px this headline ran to five lines
   beside the panel. It is a sentence, not a wordmark, so it is set at reading
   scale with a looser tracking than the old -.055em, which was closing the
   letterforms up at that size. */
.home-intro h1{font-size:clamp(2rem,calc(1.55rem + 2.2vw),3rem);font-weight:800;line-height:1.02;letter-spacing:-.035em;text-wrap:balance}
.home-answer{max-width:52ch;margin-top:20px;color:#444f68;font-size:clamp(1rem,1.15vw,1.125rem);line-height:1.6;text-wrap:pretty}
.home-ctas{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:26px}
.home-ctas .btn{min-height:48px}
.home-proofline{margin-top:16px;color:var(--faint);font:600 .75rem/1.6 var(--mono);letter-spacing:.02em}
.home-text-link{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;padding:0 4px 0 0;border-bottom:1px solid #a9956c;color:#4e5870;font-size:.8125rem;font-weight:700}
.home-text-link:hover{color:var(--ink);border-color:var(--amber-deep)}

/* ---------- shared section head ---------- */
.home-section-head{max-width:780px}
.home-section-head.center{margin-inline:auto;text-align:center}
.home-section-head h2{font-size:var(--sl-title-section);font-weight:800;line-height:1.08;letter-spacing:-.04em;text-wrap:balance}
.home-section-head p{max-width:68ch;margin-top:15px;color:var(--muted);font-size:1rem;line-height:1.7;text-wrap:pretty}
.home-section-head.center p{margin-inline:auto}

/* ---------- 2. audience fork ---------- */
.home-paths{padding:88px 0;background:#fff}
.home-path-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:38px;align-items:stretch}
/* The code block's longest line is its min-content width, and a bare 1fr
   track takes that as its floor — which pushed the whole page 140px wide on
   a 390px phone. Zeroing the automatic minimum lets the pre scroll instead. */
.home-path-grid>*,.home-path,.home-code{min-width:0}
.home-path{display:flex;flex-direction:column;padding:clamp(24px,3vw,32px);border:1px solid var(--line);border-radius:20px;background:var(--card);box-shadow:0 20px 54px -45px rgba(12,18,32,.7)}
.home-path-sdk{border-color:#e0d0ab;background:linear-gradient(168deg,#fffdf8,#fff6e4)}
.home-path h3{font-size:1.25rem;line-height:1.22;letter-spacing:-.02em}
.home-path>p{margin-top:12px;max-width:56ch;color:var(--muted);font-size:.9375rem;line-height:1.7}
.home-paths-foot{margin-top:22px;color:var(--muted);font-size:.95rem}.home-paths-foot a{color:var(--amber-text);font-weight:700}
.home-path-qualifier{margin-top:16px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.72);color:#4e5870;font-size:.875rem;line-height:1.6}
.home-code{margin-top:20px;padding:18px 20px;border-radius:14px;background:#101828;color:#c9d4ea;font:400 12.5px/1.7 var(--mono);overflow-x:auto}
.home-code .k{color:#6ee7a8}.home-code .s{color:#f4b740}.home-code .n{color:#e0b0ff}.home-code .c{color:#98a5c2}
.home-path-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;margin-top:auto;padding-top:22px}
.home-path-actions .btn{min-height:48px}
.home-path-link{display:inline-flex;min-height:44px;align-items:center;border-bottom:2px solid var(--amber);font-size:.8125rem;font-weight:750}
.home-path-link:hover{color:var(--amber-text)}

/* ---------- 3. 3D ---------- */
.home-3d{padding:88px 0;background:#0b111b;color:#edf2fb}
.home-3d .home-section-head p{color:#9ca8ba}
/* Top-aligned, not stretched: the panorama canvas has a fixed height, so a
   stretched track left a slab of empty frame under its caption. */
.home-3d-figures{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:22px;margin-top:36px;align-items:stretch}
.home-3d-figures .home-dia{margin:0}
.home-3d-figures>.home-dia{display:flex;flex-direction:column}
.home-dia-link{color:inherit;text-decoration:none}
.home-dia-link:hover{border-color:#3a4a6b}
.home-dia-link .home-dia-cap{display:block;padding:11px 15px;border-top:1px solid #1c2536;color:#9aa3b8;font:11.5px/1.5 var(--mono);letter-spacing:.02em}
.home-dia-link:hover .home-dia-cap{color:#f4c75b}
.home-3d-figures>.home-dia>div{flex:1}
.home-3d-side{display:flex;flex-direction:column;min-width:0}
/* Amber, not the shared component's indigo: this page's toggle sits on the
   brand's dark surface and must read as the same system as the hero picker. */
.home-3d .dg-pills{gap:8px;padding:14px 0 8px}
.home-3d .dg-pills button{min-height:34px;padding:0 14px;font-size:12px}
.home-3d .dg-pills button.on{background:var(--amber);border-color:var(--amber);color:#0c1220}
.home-3d-claims{display:grid;gap:14px;margin:22px 0 0;padding:0;list-style:none}
.home-3d-claims li{position:relative;padding-left:22px;color:#b3bdcd;font-size:.9375rem;line-height:1.6;text-wrap:pretty}
.home-3d-claims li:before{content:"";position:absolute;left:0;top:.62em;width:10px;height:10px;border-radius:50%;background:var(--amber)}
.home-3d-link{display:inline-flex;min-height:44px;align-items:center;align-self:flex-start;margin-top:auto;padding-top:18px;border-bottom:2px solid var(--amber);color:#edf2fb;font-size:.875rem;font-weight:750}
.home-3d-link:hover{color:#f4c75b}

/* ---------- 4. one chart, three surfaces ---------- */
.home-sdk-section{padding:88px 0;background:#fff}
.home-sdk-rail{overflow:hidden;border:1px solid var(--line);border-radius:20px;background:var(--card);box-shadow:0 20px 54px -45px rgba(12,18,32,.7)}
.home-sdk-rail article{display:grid;grid-template-columns:minmax(150px,.42fr) minmax(200px,.85fr) minmax(260px,1.2fr);gap:12px 26px;padding:28px;border-bottom:1px solid var(--line);align-items:start}
.home-sdk-rail article:last-child{border-bottom:0}
.home-sdk-rail b{grid-area:1/1/3/2;font:700 .625rem/1.5 var(--mono);letter-spacing:.12em;color:#765b1d}
.home-sdk-rail h3{grid-column:2;grid-row:1;font-size:1.15rem;line-height:1.22;letter-spacing:-.02em}
.home-sdk-rail p{grid-column:3;grid-row:1;color:var(--muted);font-size:.8125rem;line-height:1.65}
.home-sdk-rail a{grid-column:2/4;grid-row:2;display:inline-flex;min-height:44px;align-items:center;justify-self:start;border-bottom:2px solid var(--amber);font-size:.8125rem;font-weight:750}

/* ---------- 5. it slots in ---------- */
.home-flow-section{padding:88px 0;background:#fffaf1}
.home-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:26px;border:1px solid var(--line);border-radius:20px;background:var(--card);overflow:hidden}
.home-flow-step{position:relative;padding:28px 24px;border-right:1px solid var(--line)}
.home-flow-step:last-child{border-right:0}
.home-flow-step b{display:grid;width:34px;height:34px;place-items:center;border-radius:50%;background:var(--ink);color:#fff;font:700 .6875rem var(--mono)}
.home-flow-step h3{margin-top:26px;font-size:1.125rem;line-height:1.2}
.home-flow-step p{margin-top:9px;color:var(--muted);font-size:.78125rem;line-height:1.65}
.home-flow-step small{display:block;margin-top:16px;font:700 .625rem/1.5 var(--mono);letter-spacing:.08em;color:#67522b;text-transform:uppercase}
/* The one place on the page where the ownership split is stated. */
.home-own{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:22px;border:1px solid #dbcbaa;border-radius:18px;background:#fffdf8;overflow:hidden}
.home-own>div{padding:22px 24px;border-right:1px solid #ebdfc6}
.home-own>div:last-child{border-right:0}
.home-own b{display:block;font-size:.9375rem;font-weight:750;letter-spacing:-.01em}
.home-own p{margin-top:8px;color:var(--muted);font-size:.875rem;line-height:1.65}
.home-flow-links{display:flex;gap:20px;flex-wrap:wrap;margin-top:24px}
.home-flow-links a{display:inline-flex;min-height:44px;align-items:center;border-bottom:2px solid var(--amber);font-size:.8125rem;font-weight:750}

/* ---------- 6. work with AI (Copilot + MCP) ---------- */
.home-ai{padding:88px 0;background:#fff}
.home-ai-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:20px;margin-top:38px;align-items:stretch}
.home-ai-session{display:flex;flex-direction:column;border:1px solid #26324a;border-radius:20px;background:#0b0f18;color:#e6ecf7;box-shadow:0 24px 60px -46px rgba(12,18,32,.8);overflow:hidden}
.home-ai-session-top{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #1c2536;color:#98a5c2;font:600 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.home-ai-session-top .sl3d-proof-dots{display:inline-flex;gap:5px}
.home-ai-session-top .sl3d-proof-dots i{width:8px;height:8px;border-radius:50%;background:#2a3549}
.home-ai-session-tag{margin-left:auto;padding:3px 9px;border:1px solid #33405a;border-radius:999px;color:#c5cfe0;text-transform:none;letter-spacing:.02em}
.home-ai-msg{padding:18px 20px 4px}.home-ai-agent{flex:1}
.home-ai-msg b{display:block;font:700 .6875rem/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#98a5c2}
.home-ai-user b{color:#f4c75b}
.home-ai-msg>p{margin-top:8px;font-size:.9375rem;line-height:1.6;color:#e6ecf7;text-wrap:pretty}
.home-ai-user>p{font-weight:600}
.home-ai-tools{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:6px}
.home-ai-tools li{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;font-size:.8125rem;color:#aab5c9}
.home-ai-tools code{padding:4px 9px;border:1px solid #2b3750;border-radius:8px;background:#121a2a;color:#6ee7a8;font:600 .75rem/1.4 var(--mono)}
.home-ai-connect{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:auto;padding:14px 20px;border-top:1px solid #1c2536;background:#0e1420;color:#98a5c2;font:600 .75rem/1.5 var(--mono)}
.home-ai-connect code{padding:5px 10px;border-radius:8px;background:#f4b740;color:#0c1220;font:700 .8125rem/1.4 var(--mono)}
.home-ai-paths{display:grid;gap:12px;align-content:stretch}
.home-ai-paths article{padding:18px 20px;border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:0 18px 48px -44px rgba(12,18,32,.7)}
.home-ai-paths h3{margin-top:10px;font-size:1.0625rem;line-height:1.25;letter-spacing:-.015em}
.home-ai-paths p{margin-top:6px;color:var(--muted);font-size:.875rem;line-height:1.65}
.home-ai-paths a{display:inline-flex;min-height:40px;align-items:center;border-bottom:2px solid var(--amber);font-size:.8125rem;font-weight:750}
.ai-status-pill{display:inline-flex;align-items:center;gap:9px;padding:6px 12px;border:1px solid #decfab;border-radius:999px;background:rgba(255,253,248,.72);color:#675b45;font:700 .6875rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.ai-status-pill .dot{width:7px;height:7px;border-radius:50%;background:var(--live)}

/* ---------- 7. how the demo is built ---------- */
.home-provenance{padding:72px 0;background:#fffaf1}
.home-provenance-meta{margin-top:28px;border:1px solid #29344b;border-top:1px solid #29344b;border-radius:16px;overflow:hidden}
.home-provenance-note{max-width:74ch;margin-top:22px;color:var(--muted);font-size:.875rem;line-height:1.7;text-wrap:pretty}

/* ---------- 8. hosted seated events ---------- */
.home-hosted-section{padding:88px 0;background:#fff}
.home-hosted-card{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.65fr);gap:clamp(28px,6vw,72px);padding:clamp(28px,5vw,58px);border:1px solid #dbcbaa;border-radius:24px;background:linear-gradient(145deg,#fffdf8,#fff4d9);box-shadow:0 24px 64px -52px rgba(12,18,32,.7)}
.home-hosted-copy h2{max-width:18ch;font-size:var(--sl-title-section);font-weight:800;line-height:1.08;letter-spacing:-.04em;text-wrap:balance}
.home-hosted-copy>p{max-width:62ch;margin-top:16px;color:var(--muted);font-size:.9375rem;line-height:1.72}
.home-hosted-copy .home-hosted-boundary{margin-top:22px;padding:16px 18px;border:1px solid rgba(219,203,170,.95);border-radius:12px;background:rgba(255,255,255,.66);color:#4e5870}
.home-hosted-workflow{display:flex;flex-direction:column;padding:28px;border-radius:18px;background:#121a28;color:#edf2fb}
.home-hosted-workflow>b{font:700 .625rem/1.45 var(--mono);letter-spacing:.13em;color:#f4b740}
.home-hosted-workflow ol{margin:18px 0 0;padding-left:20px;color:#c0c9d6;font-size:.8125rem;line-height:1.65}
.home-hosted-workflow li+li{margin-top:8px}
.home-hosted-workflow>.btn{justify-content:center;margin-top:24px;text-align:center}
.home-hosted-workflow nav{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px}
.home-hosted-workflow nav a{display:inline-flex;min-height:44px;align-items:center;border-bottom:1px solid #667188;color:#aeb9c9;font-size:.75rem;font-weight:750}
.home-hosted-workflow nav a:hover{color:#f4c75b;border-color:currentColor}

/* ---------- 9. pricing / trust ---------- */
.home-trust-section{padding:92px 0;background:#121a28;color:#edf2fb}
.home-trust-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px,7vw,96px);align-items:center}
.home-price h2{font-size:var(--sl-title-section);line-height:1.08;letter-spacing:-.04em;text-wrap:balance}
.home-price p{max-width:540px;margin-top:15px;color:#9ca8ba;font-size:.9375rem;line-height:1.7}
.home-price strong{color:#fff}
.home-price a{margin-top:24px}
.home-trust-links{display:grid;grid-template-columns:1fr 1fr;border:1px solid #2d3950;border-radius:18px;overflow:hidden}
.home-trust-link{display:flex;min-height:132px;flex-direction:column;justify-content:space-between;padding:22px;border-right:1px solid #2d3950;border-bottom:1px solid #2d3950;background:#151f2f}
.home-trust-link:nth-child(2n){border-right:0}
.home-trust-link:nth-last-child(-n+2){border-bottom:0}
.home-trust-link b{font-size:.9375rem}
.home-trust-link span{color:#8795aa;font:600 .625rem/1.45 var(--mono);letter-spacing:.08em}
.home-trust-link:hover{background:#1a2638;color:#f4c75b}

/* ---------- 10. faq ---------- */
.home-faq-section{padding:88px 0}
.home-faq-section .faq{max-width:850px}
.home-faq-section .faq summary{min-height:64px}
.home-faq-section .faq .a a{border-bottom:2px solid var(--amber);font-weight:650}

/* ---------- 11. final ---------- */
.home-final{padding:96px 0;background:
  radial-gradient(60% 130% at 50% -15%,rgba(244,183,64,.18),transparent 70%),
  #0b111b;color:#edf2fb;text-align:center}
.home-final h2{max-width:800px;margin-inline:auto;font-size:var(--sl-title-final);line-height:1.04;letter-spacing:-.04em;text-wrap:balance}
.home-final p{max-width:660px;margin:16px auto 0;color:#9ca8ba}
.home-final-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:28px}
.home-final .btn-ghost{border-color:#536177;background:#192231;color:#edf2fb}
.home-final .btn-ghost:hover{border-color:#f4b740;color:#f4c75b}
.home-3d :focus-visible,.home-hosted-workflow :focus-visible,.home-trust-section :focus-visible,.home-final :focus-visible{outline:3px solid var(--amber);outline-offset:3px}

/* ---------- hero variant of the shared live-picker shell ----------
   Scoped by .sl3d-proof--hero so every other page keeps the click-to-load
   poster treatment. Here the resting frame is the product, so nothing is
   painted over it and the controls sit in one slim rail underneath. */
.home-proof{min-width:0}
.sl3d-proof.sl3d-proof--hero{border-radius:20px}
/* The control rail wraps to two rows in this column width, so the stage gives
   back the height it takes — the whole panel has to finish inside the first
   viewport at 1280x800. */
.sl3d-proof--hero .sl3d-proof-stage{min-height:clamp(380px,36vw,462px)}
.sl3d-proof.sl3d-proof--hero:has(.sl3d-proof-rest) .sl3d-proof-poster:after{background:none}
.sl3d-proof--hero .sl3d-proof-poster{align-items:stretch}
.sl3d-proof--hero .sl3d-proof-rest{position:absolute;inset:0}
.sl3d-proof--hero .sl3d-proof-guides{gap:8px 10px;padding:10px 12px}
.sl3d-proof--hero .sl3d-guide,.sl3d-proof--hero .sl3d-proof-link{padding:0 12px;font-size:11.5px}
/* Never show a disabled control: the guides appear only once the picker is up,
   and the load button steps aside once it has done its job. */
/* The load button only does something once the script has run, and the script
   is what stamps data-state. Gating on it keeps a dead control off the page
   when JavaScript is unavailable. */
.sl3d-proof--hero:not([data-state="ready"]) .sl3d-guide{display:none}
.sl3d-proof--hero .sl3d-load{display:none}
.sl3d-proof--hero[data-state="idle"] .sl3d-load,
.sl3d-proof--hero[data-state="loading"] .sl3d-load,
.sl3d-proof--hero[data-state="failed"] .sl3d-load{display:inline-flex}
.sl3d-proof--hero .sl3d-guide[hidden]{display:none}
/* The shared shell sets 40px with !important; in the hero these are primary
   page controls, so they take the full 44px touch target. */
.sl3d-proof--hero .sl3d-guide,.sl3d-proof--hero .sl3d-load{min-height:44px!important}
.sl3d-proof--hero .sl3d-guide-lead{border-color:#ffd166;background:var(--sl3d-amber);color:#1a1408;font-weight:750}
.sl3d-proof--hero .sl3d-guide-lead:hover:not([disabled]){background:#ffc958;border-color:#ffd166;color:#1a1408}
/* The shared shell hides this link above 640px because elsewhere it is a
   mobile-only fallback. In the hero it is the escape hatch to the full-page
   demo at every width, so it is shown and pushed to the end of the rail. */
.sl3d-proof--hero .sl3d-mobile-link{display:inline-flex}
/* One quiet row: three compact controls, then the full-page escape hatch as a
   text link pushed to the end. It was a bordered pill that wrapped onto its own
   line under the buttons and read as a stray element (owner, 2026-08-19). */
.sl3d-proof--hero .sl3d-proof-guides{flex-wrap:nowrap;align-items:center}
.sl3d-proof--hero .sl3d-guide{padding:0 11px;white-space:nowrap}
.sl3d-proof--hero .sl3d-proof-link{margin-left:auto;padding:0;border:0;background:transparent;box-shadow:none;border-radius:0;color:#c5cfe0;font-size:11.5px;font-weight:700;white-space:nowrap;border-bottom:1px solid #f4b740}
.sl3d-proof--hero .sl3d-proof-link:hover{color:#fff;background:transparent}
@media(max-width:760px){
  .sl3d-proof--hero .sl3d-proof-guides{flex-wrap:wrap}
  .sl3d-proof--hero .sl3d-proof-stage{min-height:clamp(340px,72vw,460px)}
  .sl3d-proof--hero .sl3d-proof-link{margin-left:0}
}
@media(max-width:640px){
  .home-ai-tools li{grid-template-columns:1fr;gap:3px}
  .home-ai-tools code{justify-self:start}
  .home-ai-msg{padding:16px 16px 4px}.home-ai-connect{padding:12px 16px}
  /* The picker mounts inline in 2D on a phone, so the load action stays. */
  .sl3d-proof--hero[data-state="idle"] .sl3d-load,
  .sl3d-proof--hero[data-state="loading"] .sl3d-load,
  .sl3d-proof--hero[data-state="failed"] .sl3d-load{display:inline-flex}
  .sl3d-proof--hero .sl3d-mobile-link{display:inline-flex}
  .sl3d-proof--hero .sl3d-proof-guides{display:flex}
}

@media(max-width:1100px){
  .home-intro{grid-template-columns:1fr;gap:34px;align-items:start}
  .home-intro h1{max-width:18ch}
  .home-proof{max-width:720px}
}
@media(max-width:980px){
  .home-3d-figures,.home-own,.home-ai-grid{grid-template-columns:1fr}
  .home-own>div{border-right:0;border-bottom:1px solid #ebdfc6}
  .home-own>div:last-child{border-bottom:0}
  .home-sdk-layout,.home-flow-intro,.home-trust-grid{grid-template-columns:1fr}
  .home-flow{grid-template-columns:1fr 1fr}.home-flow-step:nth-child(2){border-right:0}.home-flow-step:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .home-hosted-card{grid-template-columns:1fr minmax(300px,.7fr)}
}
@media(max-width:900px){
}
@media(max-width:760px){
  .home-path-grid{grid-template-columns:1fr}
  .home-sdk-rail article{grid-template-columns:1fr;gap:9px;padding:25px}
  .home-sdk-rail b,.home-sdk-rail h3,.home-sdk-rail p,.home-sdk-rail a{grid-column:1;grid-row:auto}
  .home-sdk-rail h3{margin-top:4px}.home-sdk-rail a{margin-top:3px}
  .home-hosted-card{grid-template-columns:1fr}
}
@media(max-width:640px){
  .home-hero{padding-top:34px;padding-bottom:56px}
  .home-intro h1{max-width:none}
  .home-answer{margin-top:16px;font-size:1rem}
  .home-ctas{align-items:stretch}.home-ctas .btn{justify-content:center;width:100%}
  .home-text-link{width:100%;justify-content:center;text-align:center}
  .home-proofline{font-size:.6875rem}
  .home-paths,.home-3d,.home-sdk-section,.home-flow-section,.home-hosted-section,.home-faq-section,.home-final{padding:72px 0}
  .home-provenance{padding:60px 0}
  .home-path-actions .btn{justify-content:center;width:100%}
  .home-flow{grid-template-columns:1fr}.home-flow-step{border-right:0;border-bottom:1px solid var(--line)!important}.home-flow-step:last-child{border-bottom:0!important}
  .home-hosted-card{padding:22px}.home-hosted-workflow{padding:23px}.home-hosted-workflow>.btn{width:100%}
  .home-trust-links{grid-template-columns:1fr}.home-trust-link{min-height:108px;border-right:0;border-bottom:1px solid #2d3950!important}.home-trust-link:last-child{border-bottom:0!important}
  .home-final-actions{display:grid;grid-template-columns:1fr}.home-final-actions a{justify-content:center}
}
@media(max-width:390px){
  .home-sdk-rail article,.home-hosted-workflow,.home-path{padding:21px}
  .home-code{padding:14px;font-size:11.5px}
}

/* Diagram frame on the landing page. Matches the Features treatment so a reader
   moving between the two pages sees one system, not two. */
.home-dia{margin:0 0 26px;padding:0;border:1px solid #26324a;border-radius:18px;overflow:hidden;background:#0b0f18;box-shadow:0 24px 60px -46px rgba(12,18,32,.8)}
.home-dia>div{min-width:0}
.home-dia figcaption{padding:11px 15px;border-top:1px solid #1c2536;color:#9aa3b8;font:11.5px/1.5 var(--mono);letter-spacing:.02em}
/* chartSpine is authored at 720x380: stretched to the full 1,112px row it was
   587px of diagram for a 380px idea. Held to its own scale it reads the same
   and gives the section back ~200px. */
.home-sdk-section .home-dia{max-width:920px;margin-inline:auto}
.home-sdk-section .home-dia,.home-flow-section .home-dia{margin-top:34px}
@media(max-width:640px){.home-dia{border-radius:14px}}