:root {
  --ink: #10201c;
  --ink-soft: #455851;
  --ink-muted: #71837c;
  --paper: #f6f4ed;
  --paper-bright: #fffef9;
  --paper-deep: #eae7dd;
  --line: rgba(16, 32, 28, .13);
  --line-dark: rgba(255, 255, 255, .14);
  --night: #07110f;
  --night-2: #0c1b17;
  --mint: #aef4c2;
  --mint-bright: #d7ffe2;
  --acid: #d9ff6a;
  --orange: #ff9d62;
  --purple: #a99afc;
  --rose: #f19bb4;
  --white: #fffef9;
  --shadow-sm: 0 10px 40px rgba(7, 17, 15, .08);
  --shadow-lg: 0 35px 100px rgba(7, 17, 15, .16);
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 32px;
  --container: 1220px;
  --ease: cubic-bezier(.2, .75, .25, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body::selection { color: var(--night); background: var(--mint); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
code, pre { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }
pre { margin: 0; white-space: pre; overflow-x: auto; }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.narrow { max-width: 830px; margin-inline: auto; }
.narrow-left { max-width: 890px; }
.centered { text-align: center; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 1000; left: 16px; top: 12px; transform: translateY(-140%); padding: 10px 16px; border-radius: 8px; background: var(--mint); color: var(--night); font-weight: 750; transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }
.site-shell { min-height: 100vh; overflow: clip; }

.site-header { position: sticky; z-index: 100; top: 0; border-bottom: 1px solid transparent; background: rgba(246, 244, 237, .78); backdrop-filter: blur(18px); transition: border-color .25s, box-shadow .25s, background .25s; }
.site-header.scrolled { border-color: var(--line); background: rgba(246, 244, 237, .94); box-shadow: 0 8px 30px rgba(7, 17, 15, .05); }
.nav-wrap { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--night); font-weight: 840; letter-spacing: -.035em; font-size: 20px; }
.brand img { filter: drop-shadow(0 7px 12px rgba(85, 220, 138, .2)); }
.brand em { margin-left: 4px; color: var(--rose); font-style: normal; font-size: .7em; letter-spacing: .03em; }
.nav-links { display: flex; align-items: center; gap: 26px; font-size: 14px; font-weight: 680; }
.nav-links > a:not(.button) { position: relative; color: #334740; }
.nav-links > a:not(.button)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -5px; height: 1px; background: var(--ink); transition: right .25s var(--ease); }
.nav-links > a:not(.button):hover::after { right: 0; }
.menu-toggle { display: none; width: 44px; height: 42px; border: 1px solid var(--line); border-radius: 11px; background: transparent; align-items: center; justify-content: center; flex-direction: column; gap: 6px; }
.menu-toggle span:not(.sr-only) { width: 18px; height: 1.5px; background: currentColor; }

.button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--night); border-radius: 999px; padding: 11px 22px; background: var(--night); color: var(--white); font-weight: 760; font-size: 14px; letter-spacing: -.01em; cursor: pointer; transition: transform .2s var(--ease), box-shadow .2s, background .2s, color .2s; }
.button:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(7, 17, 15, .16); }
.button:active { transform: translateY(0); }
.button-small { min-height: 38px; padding: 8px 16px; font-size: 13px; }
.button-large { min-height: 54px; padding: 14px 26px; font-size: 15px; }
.button-ghost { color: var(--ink); background: transparent; border-color: var(--line); }
.button-ghost:hover { border-color: var(--ink); background: rgba(255,255,255,.45); }
.button-light { color: var(--night); background: var(--mint-bright); border-color: var(--mint-bright); }
.button-outline-light { color: var(--white); background: transparent; border-color: rgba(255,255,255,.34); }
.button-outline-light:hover { background: rgba(255,255,255,.08); }
.button.full { width: 100%; }
.text-link { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; font-weight: 780; border-bottom: 1px solid var(--ink); }
.text-link span { transition: transform .2s; }
.text-link:hover span { transform: translateX(4px); }

.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #4a6058; font-size: 12px; line-height: 1; font-weight: 820; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow > span { width: 26px; height: 1px; background: currentColor; }
.eyebrow.light { color: var(--mint); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--night); line-height: 1.04; letter-spacing: -.055em; }
h1 { margin-bottom: 25px; font-size: clamp(50px, 6vw, 86px); font-weight: 820; }
h1 em { color: transparent; background: linear-gradient(100deg, #1f7055, #79b761); -webkit-background-clip: text; background-clip: text; font-style: normal; }
h2 { margin-bottom: 20px; font-size: clamp(36px, 4vw, 61px); font-weight: 800; }
h3 { font-size: 23px; font-weight: 770; }
.hero-lede { max-width: 700px; margin-bottom: 32px; color: var(--ink-soft); font-size: clamp(18px, 2vw, 21px); line-height: 1.62; letter-spacing: -.016em; }
.section { position: relative; padding: 112px 0; }
.section-heading { max-width: 760px; }
.section-heading.centered { margin-inline: auto; }
.section-heading .eyebrow { margin-bottom: 21px; }
.section-heading p, .section-side-copy { color: var(--ink-soft); font-size: 18px; line-height: 1.68; }
.split-heading { display: flex; justify-content: space-between; align-items: end; gap: 70px; margin-bottom: 56px; }
.section-side-copy { max-width: 440px; margin-bottom: 9px; }
.microcopy { margin-top: 20px; color: var(--ink-muted); font-size: 12px; line-height: 1.6; }

.hero { position: relative; min-height: 760px; padding: 90px 0 110px; background: radial-gradient(circle at 15% 12%, rgba(174,244,194,.27), transparent 35%), linear-gradient(180deg, #fbfaf4, var(--paper)); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, .95fr) minmax(530px, 1.05fr); gap: 74px; align-items: center; }
.home-hero .hero-copy { padding-top: 30px; }
.home-hero .eyebrow { margin-bottom: 26px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; align-items: center; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 31px; color: #455851; font-size: 13px; font-weight: 680; }
.check { display: inline-flex; width: 16px; height: 16px; align-items: center; justify-content: center; margin-right: 6px; border-radius: 50%; background: #d9f8df; vertical-align: -2px; }
.check::after { content: "✓"; color: #247346; font-size: 10px; font-weight: 900; }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(1px); pointer-events: none; }
.hero-orb-one { width: 340px; height: 340px; right: -90px; top: 10%; border: 1px solid rgba(78, 148, 107, .12); box-shadow: inset 0 0 90px rgba(174,244,194,.15); }
.hero-orb-two { width: 130px; height: 130px; left: 43%; bottom: 50px; background: rgba(255, 157, 98, .12); filter: blur(36px); }

.hero-console { border: 1px solid rgba(255,255,255,.09); border-radius: 24px; background: #081310; color: #d9ede5; box-shadow: 0 34px 90px rgba(7,17,15,.26); overflow: hidden; transform: perspective(1200px) rotateY(-2deg) rotateX(1deg); }
.console-bar { min-height: 48px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 17px; border-bottom: 1px solid rgba(255,255,255,.09); color: #9ab2a9; font-family: monospace; font-size: 11px; }
.console-dots { display: flex; gap: 6px; }
.console-dots i { width: 7px; height: 7px; border-radius: 50%; background: #53605c; }
.console-dots i:first-child { background: #ff8c6b; }.console-dots i:nth-child(2) { background: #e7c75d; }.console-dots i:nth-child(3) { background: #7fca87; }
.live-dot { justify-self: end; color: #7ddc99; font-size: 9px; letter-spacing: .12em; }
.live-dot::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #75e69b; box-shadow: 0 0 10px #75e69b; }
.code-tabs .tab-list { display: flex; gap: 4px; padding: 13px 17px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.code-tabs .tab-list button { padding: 8px 12px 10px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #788e86; font-size: 11px; font-weight: 730; cursor: pointer; }
.code-tabs .tab-list button[aria-selected="true"] { color: var(--mint); border-color: var(--mint); }
.code-panel { position: relative; display: none; }
.code-panel.active { display: block; }
.code-panel pre { min-height: 308px; padding: 24px 24px 25px; color: #c9d8d3; font-size: 12.5px; line-height: 1.72; }
.copy-button { display: inline-flex; align-items: center; justify-content: center; min-height: 29px; padding: 5px 10px; border: 1px solid rgba(128,150,142,.28); border-radius: 7px; background: rgba(255,255,255,.04); color: inherit; font-size: 10px; font-weight: 750; cursor: pointer; }
.code-panel > .copy-button { position: absolute; z-index: 2; right: 14px; top: 14px; color: #b7c9c3; }
.c-blue { color: #88baff; }.c-green { color: #aee8b6; }.c-purple { color: #c7a7ff; }
.route-trace { padding: 18px 20px 21px; border-top: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.025); }
.route-label { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; color: #7f938c; font-size: 9px; letter-spacing: .13em; }
.route-label strong { color: #bdd0c9; font-size: 11px; letter-spacing: 0; }.route-label small { color: #61736d; font-weight: 500; }
.trace-line { display: flex; align-items: center; }
.trace-line b { flex: 1; height: 1px; background: rgba(255,255,255,.12); }
.node { display: inline-flex; align-items: center; gap: 6px; color: #7e938b; font-size: 10px; }
.node i { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; font-style: normal; font-weight: 800; }
.node.active { color: #cbffda; }.node.active i { border-color: #6de391; background: #163a25; box-shadow: 0 0 18px rgba(109,227,145,.2); }
.trace-result { display: flex; justify-content: space-between; gap: 10px; margin-top: 14px; color: #71867e; font-family: monospace; font-size: 9px; }.trace-result span:first-child { color: #8ce2a4; }

.provider-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.26); }
.provider-row { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; color: #384b44; }
.provider-row strong { font-size: 17px; letter-spacing: -.03em; }
.provider-row i { width: 3px; height: 3px; border-radius: 50%; background: #a1ada8; }
.provider-label { color: #83908b; font-size: 10px; font-weight: 800; letter-spacing: .16em; }

.stats-section { background: var(--paper-bright); }
.stats-section .section-heading { margin-bottom: 48px; }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.stat-card { min-height: 255px; display: flex; flex-direction: column; padding: 27px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.stat-card.featured { border-color: rgba(42,139,87,.42); background: #eaf8ed; box-shadow: inset 0 0 0 1px rgba(174,244,194,.4); }
.stat-card.premium { background: #eeeafd; }
.stat-top { display: flex; justify-content: space-between; gap: 10px; color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .14em; }
.badge { padding: 3px 8px; border-radius: 99px; color: #1f6c40; background: #c8f1d2; letter-spacing: .05em; }
.stat-card > strong { margin-top: 31px; color: var(--night); font-size: 37px; letter-spacing: -.06em; }
.stat-card p { color: var(--ink-soft); font-size: 13px; line-height: 1.55; }
.stat-bar { height: 3px; margin-top: auto; border-radius: 4px; background: rgba(16,32,28,.08); overflow: hidden; }
.stat-bar i { display: block; height: 100%; background: var(--ink); }
.featured .stat-bar i { background: #3b9660; }.premium .stat-bar i { background: #7768c9; }

.route-section { background: var(--paper); }
.route-architecture { min-height: 410px; display: grid; grid-template-columns: 1fr .55fr .9fr .55fr 1.35fr; align-items: center; padding: 48px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: radial-gradient(circle at center, rgba(174,244,194,.18), transparent 30%), var(--paper-bright); box-shadow: var(--shadow-sm); }
.architecture-input > span, .architecture-arrow > span { display: block; margin-bottom: 13px; color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .13em; text-align: center; }
.app-window { padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: white; box-shadow: 0 12px 35px rgba(7,17,15,.08); }
.app-window i { display: inline-block; width: 6px; height: 6px; margin-right: 3px; border-radius: 50%; background: #c9cfcc; }
.app-window strong { display: block; margin-top: 18px; font-family: monospace; font-size: 11px; }.app-window em { color: #28794d; font-style: normal; }
.architecture-arrow { text-align: center; }.architecture-arrow b { color: #8fa098; font-size: 27px; font-weight: 400; }
.router-core { position: relative; width: 176px; height: 176px; display: flex; align-items: center; justify-content: center; flex-direction: column; justify-self: center; border: 1px solid rgba(41,120,76,.34); border-radius: 50%; background: #f2fff4; box-shadow: 0 18px 55px rgba(72,165,105,.17); }
.router-core img { margin-bottom: 9px; }.router-core strong { font-size: 17px; letter-spacing: -.04em; }.router-core span { color: #648073; font-size: 9px; letter-spacing: .08em; }
.router-rings, .router-rings::before { position: absolute; content: ""; inset: -17px; border: 1px dashed rgba(48,126,80,.16); border-radius: 50%; }.router-rings::before { inset: -16px; }
.provider-stack { display: grid; gap: 9px; }
.provider-chip { min-height: 66px; display: flex; align-items: center; gap: 13px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.7); }
.provider-chip > i { color: #97a49f; font-style: normal; font-size: 9px; font-weight: 800; }.provider-chip span { display: flex; flex-direction: column; }.provider-chip strong { color: var(--ink); font-size: 13px; }.provider-chip small { color: var(--ink-muted); font-size: 9px; }.provider-chip em { margin-left: auto; color: #8a9993; font-style: normal; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.provider-chip.selected { border-color: rgba(42,139,87,.45); background: #eaf8ed; }.provider-chip.selected em { color: #2a7c4e; }
.feature-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 38px; margin-top: 48px; }
.mini-feature { padding-top: 22px; border-top: 1px solid var(--line); }
.mini-feature > span { color: #6d7e76; font-size: 10px; font-weight: 800; }.mini-feature h3 { margin: 17px 0 12px; }.mini-feature p { color: var(--ink-soft); font-size: 15px; }.mini-feature a { font-size: 13px; font-weight: 760; }

.workflow-section { overflow: hidden; background: #e8eee8; }
.workflow-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 100px; align-items: center; }
.gallery-stack { position: relative; min-height: 560px; }
.art-card { position: absolute; width: 300px; height: 400px; overflow: hidden; border: 8px solid #f7f5ee; border-radius: 22px; background: #dbe6d8; box-shadow: 0 28px 65px rgba(7,17,15,.18); }
.art-card > span { position: absolute; left: 17px; bottom: 14px; padding: 5px 8px; border-radius: 6px; background: rgba(7,17,15,.76); color: white; font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.art-one { left: 0; top: 70px; transform: rotate(-8deg); background: linear-gradient(140deg,#cbe3d0,#f0c7a7); }.art-two { left: 165px; top: 0; z-index: 2; transform: rotate(3deg); background: radial-gradient(circle at 40% 40%,#f4c492,transparent 23%),linear-gradient(145deg,#6f8f81,#c7d3c8); }.art-three { left: 325px; top: 95px; z-index: 3; transform: rotate(9deg); background: linear-gradient(155deg,#352d4d,#a895ca 55%,#edc1b0); }
.art-grid { width: 160px; height: 220px; margin: 78px auto; border: 1px solid rgba(7,17,15,.3); background: repeating-linear-gradient(90deg,transparent 0 20px,rgba(7,17,15,.07) 20px 21px),repeating-linear-gradient(0deg,transparent 0 20px,rgba(7,17,15,.07) 20px 21px); transform: perspective(400px) rotateY(-18deg); }
.art-sphere { width: 190px; height: 190px; margin: 90px auto; border-radius: 50%; background: radial-gradient(circle at 35% 30%,#fff9df,#f0a46e 32%,#544b68 72%); box-shadow: 25px 35px 42px rgba(18,37,32,.3); }
.art-fold { width: 210px; height: 250px; margin: 70px auto; clip-path: polygon(0 20%,70% 0,100% 80%,30% 100%); background: linear-gradient(125deg,#f5c5ad 0 35%,#5e5578 36% 68%,#e5dea2 69%); filter: drop-shadow(20px 25px 20px rgba(0,0,0,.25)); }
.workflow-steps { display: grid; gap: 0; margin-top: 35px; border-top: 1px solid var(--line); }
.workflow-steps > div { display: flex; align-items: center; gap: 18px; padding: 18px 0; border-bottom: 1px solid var(--line); }.workflow-steps i { display: inline-flex; width: 29px; height: 29px; align-items: center; justify-content: center; border-radius: 50%; background: var(--night); color: white; font-style: normal; font-size: 10px; }.workflow-steps span { display: flex; flex-direction: column; }.workflow-steps strong { font-size: 15px; }.workflow-steps small { color: var(--ink-muted); font-family: monospace; font-size: 10px; }

.use-case-section { background: var(--paper-bright); }
.use-case-section .section-heading { margin-bottom: 50px; }
.card-grid { display: grid; gap: 16px; }.card-grid.four { grid-template-columns: repeat(4, 1fr); }
.use-card, .resource-card { min-height: 330px; display: flex; flex-direction: column; padding: 27px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); transition: transform .25s var(--ease), box-shadow .25s, border-color .25s; }
.use-card:hover, .resource-card:hover { transform: translateY(-6px); border-color: rgba(40,114,77,.35); box-shadow: var(--shadow-sm); }
.card-icon { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 46px; border: 1px solid var(--line); border-radius: 12px; background: white; font-size: 21px; }
.use-card small, .resource-card small { color: #72847d; font-size: 9px; font-weight: 820; letter-spacing: .14em; }.use-card h3, .resource-card h3 { margin: 12px 0; font-size: 22px; }.use-card p, .resource-card p { color: var(--ink-soft); font-size: 14px; }.use-card b, .resource-card b { margin-top: auto; font-size: 12px; }

.safety-band { color: white; background: radial-gradient(circle at 10% 20%,rgba(79,163,107,.23),transparent 32%),var(--night); }
.safety-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; align-items: center; }.safety-band h2 { color: white; }.safety-band .section-heading p { color: #b7c7c1; }.safety-stack { display: grid; gap: 10px; }.safety-stack > div { display: flex; align-items: center; gap: 14px; min-height: 78px; padding: 13px 17px; border: 1px solid rgba(255,255,255,.12); border-radius: 13px; background: rgba(255,255,255,.035); }.safety-stack i { color: #70847c; font-style: normal; font-size: 9px; }.safety-stack span { display: flex; flex-direction: column; }.safety-stack strong { font-size: 14px; }.safety-stack small { color: #81958d; font-size: 10px; }.safety-stack b { margin-left: auto; color: #75d995; font-size: 8px; letter-spacing: .12em; }

.seo-library { background: var(--paper); }.library-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.library-grid a { min-height: 190px; display: flex; flex-direction: column; padding: 27px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.2); transition: background .2s; }.library-grid a:hover { background: var(--paper-bright); }.library-grid small { color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .13em; }.library-grid strong { max-width: 280px; margin-top: 19px; font-size: 20px; line-height: 1.25; letter-spacing: -.035em; }.library-grid span { margin-top: auto; font-size: 11px; font-weight: 760; }.library-all { color: white; background: var(--night)!important; }.library-all small { color: var(--mint); }

.faq-section { background: var(--paper-bright); }.faq-section .section-heading { margin-bottom: 42px; }.faq-list { border-top: 1px solid var(--line); }.faq-list details { border-bottom: 1px solid var(--line); }.faq-list summary { position: relative; list-style: none; padding: 23px 48px 23px 0; color: var(--night); font-size: 18px; font-weight: 730; cursor: pointer; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span, .faq-list summary span::after { position: absolute; right: 6px; top: 50%; width: 15px; height: 1px; content: ""; background: var(--ink); transition: transform .2s; }.faq-list summary span::after { right: 0; top: 0; transform: rotate(90deg); }.faq-list details[open] summary span::after { transform: rotate(0); }.faq-list details p { max-width: 700px; padding: 0 30px 23px 0; color: var(--ink-soft); }

.cta-section { padding: 0 0 90px; background: var(--paper-bright); }.cta-section.compact { padding-top: 30px; background: var(--paper); }.cta-card { position: relative; min-height: 300px; display: flex; justify-content: space-between; align-items: center; gap: 50px; overflow: hidden; padding: 55px 64px; border-radius: var(--radius-lg); color: white; background: radial-gradient(circle at 85% 20%,rgba(174,244,194,.18),transparent 30%),var(--night); }.cta-card > div:not(.cta-grid) { position: relative; z-index: 2; }.cta-card h2 { max-width: 770px; color: white; font-size: clamp(35px,4vw,56px); }.cta-card p { max-width: 650px; color: #aebfb8; }.cta-grid { position: absolute; inset: 0; opacity: .08; background: linear-gradient(rgba(255,255,255,.4) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.4) 1px,transparent 1px); background-size: 45px 45px; mask-image: radial-gradient(circle at 80% 40%,black,transparent 48%); }.cta-actions { min-width: 235px; display: grid; gap: 15px; text-align: center; }.cta-actions > a:not(.button) { color: #bdccc6; font-size: 12px; text-decoration: underline; text-underline-offset: 4px; }
/* Page and long-form surfaces */
.page-hero, .article-hero, .docs-hero, .playground-hero, .legal-hero { position: relative; padding: 100px 0 90px; overflow: hidden; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 75% 15%,rgba(174,244,194,.22),transparent 27%),linear-gradient(180deg,#fbfaf4,var(--paper)); }
.page-hero h1, .article-hero h1 { max-width: 970px; font-size: clamp(49px,5.7vw,79px); }
.page-hero .eyebrow, .article-hero .eyebrow, .docs-hero .eyebrow, .playground-hero .eyebrow, .legal-hero .eyebrow { margin-bottom: 24px; }
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 35px; color: var(--ink-muted); font-size: 11px; font-weight: 680; }.breadcrumbs a:hover { color: var(--ink); }.breadcrumbs span:last-child { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.article-orb { position: absolute; right: 10%; top: 40px; width: 390px; height: 390px; border: 1px solid rgba(40,122,78,.16); border-radius: 50%; box-shadow: inset 0 0 90px rgba(174,244,194,.16); }
.article-hero-grid { position: relative; display: grid; grid-template-columns: 1fr 310px; gap: 85px; align-items: end; }
.article-proof { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.6); box-shadow: var(--shadow-sm); }.proof-kicker { display: block; padding: 14px 20px; border-bottom: 1px solid var(--line); color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .15em; }.article-proof > div { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 17px 20px; border-bottom: 1px solid var(--line); }.article-proof small { color: var(--ink-muted); font-size: 10px; }.article-proof strong { font-size: 13px; text-align: right; }.article-proof > a { display: flex; justify-content: space-between; padding: 16px 20px; font-size: 11px; font-weight: 760; }
.article-layout { display: grid; grid-template-columns: 235px minmax(0, 760px); gap: 90px; justify-content: center; padding-top: 80px; padding-bottom: 110px; }
.article-toc { position: sticky; top: 110px; height: fit-content; }.article-toc > span, .docs-sidebar > span, .legal-nav > span { color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .15em; }.article-toc nav { display: grid; gap: 12px; margin-top: 18px; padding-left: 14px; border-left: 1px solid var(--line); }.article-toc nav a { color: #64766f; font-size: 12px; line-height: 1.4; }.article-toc nav a:hover { color: var(--ink); }.toc-cta { margin-top: 30px; padding: 19px; border: 1px solid var(--line); border-radius: 13px; background: var(--paper-bright); }.toc-cta strong { font-size: 13px; }.toc-cta p { margin: 5px 0 10px; color: var(--ink-muted); font-size: 11px; }.toc-cta a { font-size: 11px; font-weight: 760; }
.direct-answer { margin-bottom: 70px; padding: 28px 31px; border-left: 3px solid #3e9662; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: #e9f7ec; }.direct-answer span { color: #2b7550; font-size: 9px; font-weight: 850; letter-spacing: .16em; }.direct-answer p { margin: 10px 0 0; color: #1d4535; font-size: 20px; line-height: 1.55; font-weight: 610; letter-spacing: -.025em; }
.article-section { position: relative; margin-bottom: 82px; }.section-number { display: inline-block; margin-bottom: 14px; color: #72837c; font-size: 10px; font-weight: 820; letter-spacing: .14em; }.article-section h2 { font-size: clamp(32px,4vw,47px); }.article-section > p { color: #40534c; font-size: 17px; line-height: 1.8; }.check-list { display: grid; gap: 11px; margin: 25px 0; padding: 0; list-style: none; }.check-list li { position: relative; padding-left: 29px; color: #33473f; }.check-list li::before { position: absolute; left: 0; top: .35em; width: 17px; height: 17px; display: flex; align-items: center; justify-content: center; content: "✓"; border-radius: 50%; background: #d9f4df; color: #27754a; font-size: 9px; font-weight: 900; }
.table-wrap { overflow-x: auto; margin: 30px 0; border: 1px solid var(--line); border-radius: 14px; background: var(--paper-bright); }.table-wrap table { width: 100%; border-collapse: collapse; font-size: 13px; }.table-wrap th { padding: 13px 17px; background: #e9ece6; color: #5f716a; font-size: 9px; text-align: left; letter-spacing: .11em; text-transform: uppercase; }.table-wrap td { padding: 15px 17px; border-top: 1px solid var(--line); color: #3b4d46; vertical-align: top; }.table-wrap tr:hover td { background: rgba(174,244,194,.08); }
.article-code { margin: 30px 0; overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 15px; color: #c9d8d3; background: var(--night); box-shadow: 0 20px 55px rgba(7,17,15,.13); }.code-title { min-height: 44px; display: flex; align-items: center; gap: 12px; padding: 0 14px 0 18px; border-bottom: 1px solid rgba(255,255,255,.08); color: #9bb0a8; font-size: 10px; }.code-title small { color: #5e746c; text-transform: uppercase; }.code-title .copy-button { margin-left: auto; }.article-code pre { padding: 22px; font-size: 12px; line-height: 1.72; }.article-disclosure { padding: 16px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink-muted); background: #efede5; font-size: 11px!important; }
.faq-article .faq-list { margin-top: 30px; }.faq-article .faq-list summary { font-size: 16px; }.related-section { border-top: 1px solid var(--line); background: var(--paper-bright); }.related-section .section-heading { margin-bottom: 42px; }.related-section .resource-card { min-height: 310px; }

/* Resource and cluster hubs */
.cluster-layout { display: grid; grid-template-columns: 250px 1fr; gap: 80px; }.cluster-intro { position: sticky; top: 115px; height: fit-content; padding: 24px; border: 1px solid var(--line); border-radius: 15px; background: var(--paper-bright); }.cluster-intro > span { color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .14em; }.cluster-intro > strong { display: block; margin: 20px 0 8px; font-size: 23px; letter-spacing: -.04em; }.cluster-intro p { color: var(--ink-soft); font-size: 13px; }.cluster-intro a { font-size: 12px; font-weight: 770; }.cluster-list { border-top: 1px solid var(--line); }.cluster-item { display: grid; grid-template-columns: 55px 1fr; gap: 25px; padding: 36px 8px; border-bottom: 1px solid var(--line); }.cluster-item > span { color: #94a19c; font-size: 10px; font-weight: 800; }.cluster-item small { color: #6a7b74; font-size: 9px; font-weight: 820; letter-spacing: .13em; text-transform: uppercase; }.cluster-item h2 { max-width: 740px; margin: 9px 0 13px; font-size: clamp(27px,3vw,39px); transition: color .2s; }.cluster-item p { max-width: 760px; color: var(--ink-soft); }.cluster-item b { font-size: 12px; }.cluster-item b i { font-style: normal; transition: margin .2s; }.cluster-item:hover h2 { color: #287a50; }.cluster-item:hover b i { margin-left: 5px; }
.resource-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.resource-feature { min-height: 330px; padding: 28px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.22); transition: background .2s; }.resource-feature:hover { background: var(--paper-bright); }.feature-index { float: right; color: #b1bbb7; font-size: 10px; font-weight: 800; }.resource-feature small { color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .14em; }.resource-feature h2 { margin: 45px 0 15px; font-size: 30px; }.resource-feature p { color: var(--ink-soft); font-size: 14px; }.resource-feature b { display: block; margin-top: 25px; font-size: 11px; }.cluster-bands { padding-top: 20px; background: var(--paper-bright); }.cluster-band { padding: 55px 0; border-top: 1px solid var(--line); }.cluster-band-head { display: flex; justify-content: space-between; gap: 40px; align-items: end; margin-bottom: 30px; }.cluster-band-head > div { max-width: 760px; }.cluster-band-head small { color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .14em; }.cluster-band-head h2 { margin: 10px 0; font-size: 42px; }.cluster-band-head p { color: var(--ink-soft); }.cluster-band-head > a { white-space: nowrap; font-size: 12px; font-weight: 770; }.cluster-band-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.cluster-band-links a { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 17px; border: 1px solid var(--line); border-radius: 10px; font-size: 12px; font-weight: 680; }.cluster-band-links a:hover { border-color: #75a88b; background: #f0f8f1; }.seo-principles { background: #e9eee8; }.principle-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 50px; }.principle-grid article { min-height: 230px; padding: 24px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.45); }.principle-grid span { color: #788a82; font-size: 9px; font-weight: 820; }.principle-grid h3 { margin: 40px 0 12px; }.principle-grid p { color: var(--ink-soft); font-size: 13px; }

/* Documentation */
.docs-hero { padding-bottom: 70px; }.docs-hero-grid { display: grid; grid-template-columns: 1fr 390px; gap: 80px; align-items: end; }.docs-hero h1 { font-size: clamp(50px,5vw,75px); }.endpoint-card { position: relative; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper-bright); box-shadow: var(--shadow-sm); }.endpoint-card > span { color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .14em; }.endpoint-card code { display: block; margin: 18px 0 25px; padding: 13px; border-radius: 8px; background: #edf0ea; font-size: 12px; overflow: hidden; text-overflow: ellipsis; }.endpoint-card > button { position: absolute; right: 24px; top: 18px; }.endpoint-card > div { display: flex; align-items: center; gap: 8px; color: var(--ink-muted); }.endpoint-card > div i { width: 7px; height: 7px; border-radius: 50%; background: #51b878; box-shadow: 0 0 10px rgba(81,184,120,.5); }
.docs-layout { display: grid; grid-template-columns: 230px minmax(0, 800px); gap: 90px; justify-content: center; padding-top: 75px; padding-bottom: 110px; }.docs-sidebar { position: sticky; top: 110px; height: fit-content; }.docs-sidebar nav { display: grid; gap: 10px; margin-top: 18px; padding-left: 14px; border-left: 1px solid var(--line); }.docs-sidebar nav a { color: #60736b; font-size: 12px; }.docs-sidebar nav a:hover { color: var(--ink); }.docs-help { margin-top: 28px; padding: 19px; border-radius: 13px; color: white; background: var(--night); }.docs-help strong { font-size: 13px; }.docs-help p { margin: 6px 0 12px; color: #93a69f; font-size: 11px; }.docs-help a { color: var(--mint); font-size: 11px; font-weight: 750; }
.docs-section { margin-bottom: 85px; }.docs-label { color: var(--ink-muted); font-size: 9px; font-weight: 820; letter-spacing: .15em; }.docs-section h2 { margin-top: 12px; font-size: 45px; }.docs-section > p { color: var(--ink-soft); font-size: 17px; line-height: 1.75; }.docs-code { margin-top: 30px; overflow: hidden; border-radius: 16px; color: #c9d8d3; background: var(--night); }.docs-code .code-panel pre { min-height: 0; }.callout { margin: 25px 0; padding: 20px 22px; border: 1px solid rgba(40,122,78,.24); border-radius: 12px; background: #eaf6ed; }.callout.warning { border-color: rgba(196,112,62,.25); background: #f8eee5; }.callout strong { font-size: 13px; }.callout p { margin: 4px 0 0; color: var(--ink-soft); font-size: 13px; }.callout code { padding: 2px 4px; border-radius: 4px; background: rgba(255,255,255,.7); }.dimension-demo { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 12px; margin-top: 28px; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper-bright); }.dimension-demo label { display: grid; gap: 6px; color: var(--ink-muted); font-size: 10px; font-weight: 740; }.dimension-demo input { width: 100%; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }.dimension-demo > div { display: flex; justify-content: center; flex-direction: column; padding-left: 18px; border-left: 1px solid var(--line); }.dimension-demo small { color: var(--ink-muted); font-size: 8px; font-weight: 800; letter-spacing: .12em; }.dimension-demo strong { font-size: 22px; }.dimension-demo span { color: var(--ink-muted); font-size: 10px; }

/* Pricing */
.pricing-hero .narrow { max-width: 900px; }.pricing-toggle { display: inline-flex; align-items: center; gap: 14px; margin-top: 13px; padding: 8px 13px; border: 1px solid var(--line); border-radius: 99px; background: rgba(255,255,255,.5); }.pricing-toggle span { font-size: 11px; font-weight: 780; }.pricing-toggle small { color: var(--ink-muted); font-size: 10px; }.pricing-section { background: var(--paper-bright); }.pricing-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; align-items: stretch; }.price-card { position: relative; min-height: 570px; display: flex; flex-direction: column; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }.price-card.featured { border-color: rgba(40,122,78,.5); background: #ecf8ee; box-shadow: 0 24px 70px rgba(56,133,85,.13); }.popular-badge { position: absolute; right: 25px; top: 25px; padding: 5px 9px; border-radius: 99px; color: #1f6b40; background: #c7f0d1; font-size: 8px; font-weight: 850; letter-spacing: .12em; }.price-head small { color: var(--ink-muted); font-size: 9px; font-weight: 830; letter-spacing: .15em; }.price-head h2 { margin: 25px 0 8px; font-size: 52px; }.price-head h2 span { color: var(--ink-muted); font-size: 13px; letter-spacing: 0; }.price-head p { min-height: 50px; color: var(--ink-soft); font-size: 13px; }.credit-count { display: block; margin: 20px 0; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 17px; }.price-card .check-list { margin-bottom: 32px; font-size: 13px; }.price-card .button { margin-top: auto; }.pricing-note { margin-top: 25px; padding: 21px 24px; border: 1px solid var(--line); border-radius: 13px; background: #efede5; }.pricing-note strong { font-size: 13px; }.pricing-note p { margin: 4px 0 0; color: var(--ink-soft); font-size: 12px; }.calculator-section { background: #e8eee8; }.calculator-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }.cost-calculator { padding: 30px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper-bright); box-shadow: var(--shadow-sm); }.calc-inputs { display: grid; gap: 23px; }.calc-inputs label { display: grid; grid-template-columns: 130px 1fr 70px; gap: 15px; align-items: center; color: var(--ink-soft); font-size: 11px; font-weight: 700; }.calc-inputs input { accent-color: #2e8154; }.calc-inputs strong { font-size: 12px; text-align: right; }.calc-results { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 28px; padding-top: 23px; border-top: 1px solid var(--line); }.calc-results > div { padding: 14px; border-radius: 10px; background: #edf1eb; }.calc-results small { display: block; min-height: 27px; color: var(--ink-muted); font-size: 7px; font-weight: 820; letter-spacing: .11em; }.calc-results strong { font-size: 20px; }.cost-calculator > p { margin: 18px 0 0; color: var(--ink-muted); font-size: 9px; line-height: 1.55; }
/* Playground and forms */
.playground-hero { padding-bottom: 64px; }.playground-hero h1 { max-width: 920px; font-size: clamp(50px,5vw,75px); }.playground-section { padding: 70px 0 110px; background: #e9eee8; }.playground-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 20px; align-items: start; }.playground-form, .contact-form { padding: 30px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper-bright); box-shadow: var(--shadow-sm); }.form-head { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 26px; }.form-head small { color: var(--ink-muted); font-size: 8px; font-weight: 820; letter-spacing: .14em; }.form-head h2 { margin: 4px 0 0; font-size: 30px; }.mode-pill { padding: 5px 9px; border-radius: 99px; color: #286d48; background: #d9f4df; font-size: 8px; font-weight: 820; letter-spacing: .1em; }.demo-disabled { margin-bottom: 22px; padding: 16px; border: 1px solid rgba(194,113,58,.24); border-radius: 11px; background: #f8eee5; }.demo-disabled strong { font-size: 12px; }.demo-disabled p { margin: 5px 0 0; color: var(--ink-soft); font-size: 11px; }.demo-disabled code { font-size: 10px; }.field { position: relative; display: grid; gap: 7px; margin-bottom: 17px; }.field > span { color: #53675f; font-size: 10px; font-weight: 770; }.field input, .field textarea, .field select { width: 100%; padding: 12px 13px; border: 1px solid var(--line); border-radius: 9px; outline: none; color: var(--ink); background: var(--paper); transition: border .2s, box-shadow .2s; }.field textarea { resize: vertical; }.field input:focus, .field textarea:focus, .field select:focus { border-color: #4e9a6c; box-shadow: 0 0 0 3px rgba(78,154,108,.12); }.field > small { position: absolute; right: 10px; bottom: 7px; color: var(--ink-muted); font-size: 8px; }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.normalization-note { display: flex; align-items: center; gap: 12px; margin: 3px 0 21px; padding: 12px; border-radius: 9px; background: #edf1eb; }.normalization-note span { color: var(--ink-muted); font-size: 9px; font-weight: 750; text-transform: uppercase; }.normalization-note strong { font-size: 13px; }.normalization-note small { margin-left: auto; color: var(--ink-muted); font-size: 9px; }.form-policy { margin: 14px 0 0; color: var(--ink-muted); font-size: 9px; line-height: 1.5; }.form-policy a { text-decoration: underline; }.playground-output { overflow: hidden; border: 1px solid rgba(255,255,255,.09); border-radius: var(--radius); color: #d9e9e3; background: var(--night); box-shadow: var(--shadow-lg); }.output-head { min-height: 52px; display: flex; justify-content: space-between; align-items: center; padding: 0 18px; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 9px; font-weight: 820; letter-spacing: .14em; }.output-head > div { display: flex; align-items: center; gap: 7px; color: #93aaa1; }.output-head i { width: 6px; height: 6px; border-radius: 50%; background: #6bd48d; }.output-canvas { position: relative; min-height: 565px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #0d1916; }.output-canvas > img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: contain; background: #070e0c; }.placeholder-art { position: absolute; inset: 12%; overflow: hidden; opacity: .65; border: 1px solid rgba(255,255,255,.08); border-radius: 45% 45% 25% 25%; background: radial-gradient(circle at 35% 30%,rgba(174,244,194,.23),transparent 35%),linear-gradient(145deg,#172b25,#0a1210); }.placeholder-orb { width: 200px; height: 200px; margin: 75px auto; border: 1px solid rgba(174,244,194,.3); border-radius: 50%; box-shadow: inset 0 0 60px rgba(174,244,194,.08),0 0 80px rgba(174,244,194,.06); }.placeholder-plane { position: absolute; left: 20%; right: 20%; bottom: 15%; height: 100px; transform: perspective(300px) rotateX(60deg); background: repeating-linear-gradient(90deg,rgba(174,244,194,.12) 0 1px,transparent 1px 24px),repeating-linear-gradient(0deg,rgba(174,244,194,.12) 0 1px,transparent 1px 24px); }.output-placeholder { position: relative; z-index: 2; text-align: center; }.output-placeholder strong { display: block; font-size: 16px; }.output-placeholder p { margin: 6px 0 0; color: #7f968d; font-size: 11px; }.output-meta { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }.output-meta > div { min-width: 0; padding: 14px; border-right: 1px solid rgba(255,255,255,.08); }.output-meta > div:last-child { border: 0; }.output-meta small { display: block; color: #637a71; font-size: 7px; font-weight: 820; letter-spacing: .11em; }.output-meta strong { display: block; overflow: hidden; margin-top: 4px; color: #b9cbc4; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.output-json > div { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; color: #71877e; font-size: 8px; font-weight: 800; letter-spacing: .12em; }.output-json pre { max-height: 230px; padding: 0 17px 20px; color: #aabdb6; font-size: 10px; line-height: 1.6; }.playground-guardrails { background: var(--paper-bright); }
.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: start; }.contact-hero { padding-bottom: 110px; }.contact-direct { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 45px; }.contact-direct > div { padding-top: 15px; border-top: 1px solid var(--line); }.contact-direct small { display: block; color: var(--ink-muted); font-size: 8px; font-weight: 820; letter-spacing: .13em; }.contact-direct a { display: block; margin-top: 7px; font-size: 13px; font-weight: 760; }

/* Safety */
.safety-pipeline { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; gap: 15px; }.pipeline-stage { min-height: 260px; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper-bright); }.pipeline-stage > span { float: right; color: #a5b0ac; font-size: 9px; font-weight: 800; }.pipeline-stage > i { display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; border-radius: 11px; background: #e5f3e8; color: #286d48; font-style: normal; font-size: 8px; font-weight: 850; }.pipeline-stage h2 { margin: 48px 0 12px; font-size: 25px; }.pipeline-stage p { color: var(--ink-soft); font-size: 13px; }.safety-pipeline > b { color: #98a69f; font-weight: 400; }.safety-details { padding-top: 30px; background: var(--paper-bright); }.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }.detail-card { min-height: 480px; padding: 36px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }.detail-number { color: var(--ink-muted); font-size: 9px; font-weight: 820; }.detail-card h2 { margin-top: 60px; font-size: 39px; }.detail-card > p { color: var(--ink-soft); font-size: 15px; line-height: 1.7; }.detail-card .check-list { margin-top: 30px; font-size: 13px; }.policy-boundary { background: #e8eee8; }.policy-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; align-items: center; }.policy-matrix { border: 1px solid var(--line); border-radius: 17px; background: var(--paper-bright); overflow: hidden; }.policy-matrix > div { display: grid; grid-template-columns: 90px 1fr auto; align-items: center; gap: 20px; padding: 20px; border-bottom: 1px solid var(--line); }.policy-matrix > div:last-child { border: 0; }.policy-matrix span { color: var(--ink-muted); font-size: 8px; font-weight: 820; letter-spacing: .12em; }.policy-matrix strong { font-size: 14px; }.policy-matrix b { color: #2c7a4e; font-size: 9px; }.warning-text { color: #a26337!important; }.incident-section { background: var(--paper-bright); }.launch-blockers { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 48px; }.launch-blockers > div { display: flex; align-items: center; gap: 16px; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }.launch-blockers i { font-style: normal; font-size: 22px; }.launch-blockers span { display: flex; flex-direction: column; }.launch-blockers strong { font-size: 13px; }.launch-blockers small { color: var(--ink-muted); font-size: 10px; }

/* Legal */
.legal-hero { padding-bottom: 65px; }.legal-hero h1 { font-size: clamp(50px,5vw,74px); }.legal-layout { display: grid; grid-template-columns: 220px minmax(0,760px); gap: 90px; justify-content: center; padding-top: 70px; padding-bottom: 110px; }.legal-nav { position: sticky; top: 110px; height: fit-content; display: grid; gap: 11px; }.legal-nav > span { margin-bottom: 8px; }.legal-nav a { color: var(--ink-soft); font-size: 12px; }.legal-nav a:hover { color: var(--ink); }.legal-copy h2 { margin: 52px 0 15px; font-size: 31px; }.legal-copy h2:first-child { margin-top: 0; }.legal-copy p { color: #40524b; font-size: 16px; line-height: 1.82; }.legal-copy a { font-weight: 740; text-decoration: underline; text-underline-offset: 3px; }.legal-warning { margin-top: 70px; padding: 22px; border: 1px solid rgba(190,111,59,.25); border-radius: 12px; background: #f8eee5; }.legal-warning strong { font-size: 12px; }.legal-warning p { margin: 4px 0 0; font-size: 12px; }

/* Footer */
.site-footer { padding: 75px 0 25px; color: #b3c3bd; background: #07110f; }.footer-grid { display: grid; grid-template-columns: 1.7fr repeat(4,1fr); gap: 45px; padding-bottom: 60px; }.footer-grid .brand { color: white; }.footer-brand p { max-width: 290px; margin: 20px 0; color: #748980; font-size: 13px; }.status-pill { display: inline-flex; align-items: center; gap: 7px; color: #7e958c; font-size: 9px; }.status-pill i { width: 6px; height: 6px; border-radius: 50%; background: #68d28a; box-shadow: 0 0 9px #68d28a; }.footer-grid h2 { margin-bottom: 18px; color: #e5eee9; font-size: 11px; letter-spacing: .03em; }.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; gap: 11px; }.footer-grid > div:not(.footer-brand) a { color: #788f86; font-size: 11px; }.footer-grid > div:not(.footer-brand) a:hover { color: white; }.footer-bottom { min-height: 60px; display: flex; justify-content: space-between; align-items: center; gap: 30px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.09); }.footer-bottom p { margin: 0; color: #61746d; font-size: 9px; }.adult-discreet-link { color: #71847c; font-size: 9px; }.adult-discreet-link:hover { color: #d4ded9; }

/* Adult service */
.adult-theme { --paper: #16080e; --paper-bright: #1e0b14; --ink: #f8eaf0; --ink-soft: #cbb5be; --ink-muted: #9d7f8b; --line: rgba(255,255,255,.12); --night: #0f060a; --mint: #ffb1c5; --mint-bright: #ffd4df; }
.adult-theme body { color: #f5e8ed; background: #16080e; }.adult-theme h1,.adult-theme h2,.adult-theme h3 { color: #fff6f9; }.adult-header { border-color: rgba(255,255,255,.09); background: rgba(20,6,12,.84); }.adult-header.scrolled { background: rgba(20,6,12,.95); }.adult-header .brand { color: white; }.adult-header .nav-links > a:not(.button) { color: #c7adb7; }.adult-header .button-ghost { color: #ffe5ed; border-color: rgba(255,255,255,.2); }.adult-footer { padding-top: 30px; background: #0c0407; }.adult-footer .footer-bottom > div { display: flex; gap: 18px; }.adult-footer a { color: #90737e; font-size: 9px; }
.age-gate { position: fixed; z-index: 500; inset: 0; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(8,2,5,.88); backdrop-filter: blur(18px); }.age-gate[hidden] { display: none; }.age-gate-card { width: min(100%,540px); padding: 42px; border: 1px solid rgba(255,255,255,.15); border-radius: 24px; text-align: center; background: #1c0a12; box-shadow: 0 35px 100px rgba(0,0,0,.5); }.age-gate-card img { margin: 0 auto 20px; }.age-gate-card > span { color: #e69db2; font-size: 9px; font-weight: 850; letter-spacing: .16em; }.age-gate-card h2 { margin: 17px 0; font-size: 35px; }.age-gate-card p { color: #bea5af; }.age-gate-card > div { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin: 28px 0 15px; }.age-gate-card small { color: #856a75; font-size: 9px; }
.adult-hero { position: relative; min-height: 810px; display: flex; align-items: center; overflow: hidden; padding: 100px 0; background: radial-gradient(circle at 20% 15%,rgba(241,155,180,.17),transparent 32%),radial-gradient(circle at 86% 75%,rgba(148,80,120,.22),transparent 30%),#13070c; }.adult-grid-art { position: absolute; inset: 0; opacity: .08; background: linear-gradient(rgba(255,255,255,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.25) 1px,transparent 1px); background-size: 58px 58px; mask-image: radial-gradient(circle at 70% 50%,black,transparent 58%); }.adult-hero-grid { position: relative; display: grid; grid-template-columns: 1fr 470px; gap: 80px; align-items: center; }.adult-hero h1 { font-size: clamp(50px,5.6vw,80px); }.adult-hero .hero-lede { color: #cbb3bd; }.adult-zero { display: grid; grid-template-columns: auto 1fr; gap: 15px; margin-top: 34px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.13); }.adult-zero strong { color: #ffacc1; font-size: 8px; letter-spacing: .14em; }.adult-zero span { color: #8e717d; font-size: 10px; }.adult-control-panel { overflow: hidden; border: 1px solid rgba(255,255,255,.14); border-radius: 19px; background: rgba(255,255,255,.035); box-shadow: 0 30px 80px rgba(0,0,0,.28); }.control-head { display: flex; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid rgba(255,255,255,.1); color: #a68995; font-size: 8px; font-weight: 850; letter-spacing: .14em; }.control-head b { color: #ffacc1; }.control-line { display: flex; align-items: center; gap: 14px; padding: 17px 18px; border-bottom: 1px solid rgba(255,255,255,.08); }.control-line > i { color: #705662; font-style: normal; font-size: 8px; }.control-line > span { display: flex; flex-direction: column; }.control-line strong { color: #f0dce4; font-size: 12px; }.control-line small { color: #785e68; font-size: 9px; }.control-line > b { margin-left: auto; color: #e999b0; font-size: 7px; letter-spacing: .1em; }.control-foot { padding: 14px 18px; color: #896d78; font-size: 9px; text-align: center; }.adult-section { padding: 110px 0; background: #16080e; }.adult-section-alt { background: #1d0b14; }.adult-heading { max-width: 760px; }.adult-heading.centered { margin-inline: auto; text-align: center; }.adult-heading > span { color: #d68aa1; font-size: 9px; font-weight: 850; letter-spacing: .16em; }.adult-heading h2 { margin-top: 18px; }.adult-heading p { color: #b89ca7; font-size: 17px; }.adult-card-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; margin-top: 55px; }.adult-card-grid article { min-height: 310px; padding: 25px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.025); }.adult-card-grid i { color: #9e7181; font-style: normal; font-size: 9px; }.adult-card-grid h3 { margin: 75px 0 13px; font-size: 23px; }.adult-card-grid p { color: #9b808a; font-size: 13px; }.adult-two-col { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; align-items: center; }.eligibility-list { display: grid; gap: 12px; }.eligibility-list > div { display: flex; gap: 18px; padding: 25px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.025); }.eligibility-list i { display: inline-flex; flex: 0 0 auto; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 50%; font-style: normal; }.eligibility-list span { display: flex; flex-direction: column; }.eligibility-list strong { font-size: 15px; }.eligibility-list small { margin-top: 5px; color: #947682; font-size: 11px; line-height: 1.6; }.eligibility-list .allowed i { color: #b9f2c9; background: rgba(84,178,111,.17); }.eligibility-list .blocked i { color: #ffb1c5; background: rgba(215,94,128,.14); }.prohibition-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 55px; background: rgba(255,255,255,.11); border: 1px solid rgba(255,255,255,.11); }.prohibition-grid > div { min-height: 260px; padding: 30px; background: #16080e; }.prohibition-grid i { color: #8d6977; font-style: normal; font-size: 8px; }.prohibition-grid strong { display: block; margin: 55px 0 12px; color: #f7e5ec; font-size: 20px; }.prohibition-grid p { color: #967985; font-size: 12px; }.adult-operations { background: radial-gradient(circle at 80% 50%,rgba(208,94,130,.12),transparent 35%),#12060b; }.operator-checklist { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.operator-checklist > div { min-height: 82px; display: flex; align-items: center; gap: 15px; padding: 17px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.025); }.operator-checklist span { color: #896572; font-size: 8px; }.operator-checklist strong { font-size: 12px; }.adult-cta { padding: 75px 0; background: #edafc0; color: #210b14; }.adult-cta .container { display: flex; align-items: center; justify-content: space-between; gap: 50px; }.adult-cta span { font-size: 9px; font-weight: 850; letter-spacing: .14em; }.adult-cta h2 { max-width: 760px; margin: 12px 0; color: #210b14; }.adult-cta p { max-width: 760px; margin: 0; color: #704653; }.adult-cta .button-light { white-space: nowrap; background: #210b14; border-color: #210b14; color: white; }

/* Motion */
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s var(--ease), transform .7s var(--ease); }.js .reveal.visible { opacity: 1; transform: translateY(0); }.js .delay-one { transition-delay: .08s; }.js .delay-two { transition-delay: .16s; }.js .delay-three { transition-delay: .24s; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *,*::before,*::after { animation-duration: .01ms!important; animation-iteration-count: 1!important; transition-duration: .01ms!important; } .js .reveal { opacity: 1; transform: none; } }

/* Responsive */
@media (max-width: 1100px) {
  .hero-grid { grid-template-columns: 1fr 1fr; gap: 40px; }.hero-console { transform: none; }.stat-grid { grid-template-columns: 1fr 1fr; }.route-architecture { grid-template-columns: 1fr .4fr 1fr; gap: 20px; }.route-architecture .architecture-arrow:nth-of-type(4) { display: none; }.provider-stack { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; margin-top: 30px; }.workflow-grid { gap: 40px; }.gallery-stack { transform: scale(.85); transform-origin: left center; }.card-grid.four { grid-template-columns: 1fr 1fr; }.article-layout { grid-template-columns: 190px minmax(0,700px); gap: 50px; }.resource-feature-grid { grid-template-columns: 1fr 1fr; }.pricing-grid { gap: 10px; }.adult-hero-grid { grid-template-columns: 1fr 410px; gap: 45px; }.footer-grid { grid-template-columns: 1.5fr repeat(2,1fr); }.footer-grid > div:nth-child(4),.footer-grid > div:nth-child(5) { margin-top: 20px; }
}
@media (max-width: 900px) {
  .container { width: min(calc(100% - 32px), var(--container)); }.nav-links { position: absolute; left: 16px; right: 16px; top: 67px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 12px; border: 1px solid var(--line); border-radius: 15px; background: rgba(251,250,244,.98); box-shadow: var(--shadow-lg); }.nav-links.open { display: flex; }.nav-links > a:not(.button) { padding: 13px; }.nav-links .button { margin-top: 7px; }.menu-toggle { display: flex; }.adult-nav { position: static; display: flex; padding: 0; border: 0; background: transparent; box-shadow: none; flex-direction: row; align-items: center; }.adult-nav > a:not(.button) { display: none; }
  .hero { min-height: auto; padding-top: 65px; }.hero-grid,.article-hero-grid,.docs-hero-grid,.contact-grid,.playground-grid,.workflow-grid,.safety-grid,.calculator-grid,.policy-grid,.adult-two-col { grid-template-columns: 1fr; }.hero-console { max-width: 680px; }.provider-row { justify-content: center; flex-wrap: wrap; padding: 22px 0; }.provider-label { width: 100%; text-align: center; }.route-architecture { grid-template-columns: 1fr; }.architecture-arrow { transform: rotate(90deg); }.router-core { margin: 20px auto; }.provider-stack { grid-column: auto; }.gallery-stack { max-width: 620px; transform: scale(.85); min-height: 500px; }.split-heading { align-items: start; flex-direction: column; gap: 15px; }.section-side-copy { max-width: 700px; }.library-grid { grid-template-columns: 1fr 1fr; }.article-proof { max-width: 600px; }.article-layout,.docs-layout,.legal-layout,.cluster-layout { grid-template-columns: 1fr; }.article-toc,.docs-sidebar,.legal-nav,.cluster-intro { position: static; }.article-toc { display: none; }.docs-sidebar { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }.docs-sidebar > span,.docs-help { display: none; }.docs-sidebar nav { display: flex; flex-wrap: wrap; border: 0; padding: 0; margin: 0; }.docs-sidebar nav a { padding: 7px 10px; border: 1px solid var(--line); border-radius: 99px; }.legal-nav { display: flex; flex-wrap: wrap; gap: 8px; }.legal-nav > span { width: 100%; }.legal-nav a { padding: 7px 10px; border: 1px solid var(--line); border-radius: 99px; }.cluster-intro { max-width: 600px; }.principle-grid { grid-template-columns: 1fr 1fr; }.pricing-grid { grid-template-columns: 1fr; max-width: 630px; }.price-card { min-height: auto; }.safety-pipeline { grid-template-columns: 1fr 1fr; }.safety-pipeline > b { display: none; }.adult-hero-grid { grid-template-columns: 1fr; }.adult-control-panel { max-width: 620px; }.adult-card-grid { grid-template-columns: 1fr 1fr; }.adult-cta .container { align-items: start; flex-direction: column; }.cluster-band-links { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .container { width: min(calc(100% - 24px), var(--container)); }.section { padding: 82px 0; } h1 { font-size: 45px; } h2 { font-size: 36px; }.hero { padding: 48px 0 80px; }.hero-actions { align-items: stretch; flex-direction: column; }.hero-actions .button { width: 100%; }.hero-trust { display: grid; gap: 8px; }.console-bar { grid-template-columns: auto 1fr; }.console-bar > span:nth-child(2) { justify-self: end; }.live-dot { display: none; }.code-panel pre { min-height: 285px; font-size: 10px; }.trace-result { flex-wrap: wrap; }.provider-row strong { font-size: 14px; }.provider-row i { display: none; }.stat-grid,.provider-stack,.feature-row,.card-grid.four,.library-grid,.detail-grid,.launch-blockers,.resource-feature-grid,.principle-grid,.cluster-band-links,.prohibition-grid,.operator-checklist,.adult-card-grid { grid-template-columns: 1fr; }.stat-card { min-height: 220px; }.route-architecture { padding: 25px 18px; }.gallery-stack { min-height: 430px; transform: scale(.63); transform-origin: left top; width: 580px; }.workflow-grid { overflow: hidden; }.cta-card { align-items: stretch; flex-direction: column; padding: 38px 25px; }.cta-actions { width: 100%; }.footer-grid { grid-template-columns: 1fr 1fr; }.footer-brand { grid-column: 1 / -1; }.footer-bottom { align-items: start; flex-direction: column; }.article-hero,.page-hero,.docs-hero,.playground-hero,.legal-hero { padding: 70px 0 60px; }.article-hero h1,.page-hero h1 { font-size: 44px; }.article-proof { width: 100%; }.article-layout,.docs-layout,.legal-layout { padding-top: 50px; padding-bottom: 80px; }.article-section { margin-bottom: 65px; }.direct-answer p { font-size: 17px; }.article-section > p,.docs-section > p { font-size: 16px; }.table-wrap { margin-right: -12px; }.related-section .card-grid { grid-template-columns: 1fr; }.cluster-item { grid-template-columns: 34px 1fr; gap: 10px; }.cluster-item h2 { font-size: 28px; }.cluster-band-head { align-items: start; flex-direction: column; }.dimension-demo { grid-template-columns: 1fr 1fr; }.dimension-demo > div { grid-column: 1 / -1; padding: 14px 0 0; border-left: 0; border-top: 1px solid var(--line); }.form-row { grid-template-columns: 1fr; }.output-canvas { min-height: 420px; }.output-meta { grid-template-columns: 1fr 1fr; }.output-meta > div:nth-child(2) { border-right: 0; }.output-meta > div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.08); }.safety-pipeline { grid-template-columns: 1fr; }.pipeline-stage { min-height: 210px; }.detail-card { min-height: auto; }.policy-matrix > div { grid-template-columns: 70px 1fr; }.policy-matrix b { grid-column: 2; }.calc-inputs label { grid-template-columns: 1fr 60px; }.calc-inputs input { grid-column: 1 / -1; grid-row: 2; }.calc-results { grid-template-columns: 1fr; }.contact-direct { grid-template-columns: 1fr; }.adult-nav .button { display: inline-flex; }.adult-header .brand span { font-size: 16px; }.adult-hero { padding: 70px 0; }.adult-hero h1 { font-size: 43px; }.adult-zero { grid-template-columns: 1fr; }.adult-section { padding: 82px 0; }.adult-two-col { gap: 40px; }.age-gate-card { padding: 30px 20px; }.age-gate-card > div { flex-direction: column; }.age-gate-card .button { width: 100%; }.adult-footer .footer-bottom > div { flex-wrap: wrap; }
}

.cluster-guide-note {
  max-width: 760px;
  margin: 2rem auto 0;
  text-align: center;
  color: var(--muted);
  font-size: 1.02rem;
  line-height: 1.75;
}