/*
 * HostYourAI public site theme.
 *
 * One stylesheet for every public HostYourAI page (never the Loes pages).
 * Source of the look: the chosen homepage design /x/pro-07-paper-v6c.
 * Rules of the brand: rounded corners like the apps (section 12; 2 Nov 2026
 * Jantine chose rounded corners like the apps), no see-through fills, no
 * shadows, no round dots, light hairlines only. Colour comes from surfaces (paper,
 * band, raise) and one accent (indigo). Gradients live only in the finish
 * layer (section 11): soft atmosphere, never gradient text, glows or lines.
 *
 * Structure
 *   1. Fonts (self-hosted, OFL; files and licences in /fonts)
 *   2. Tokens (--hy-*; legacy names live in site-compat.css)
 *   3. Base elements (in a cascade layer, so a page's own CSS always wins)
 *   4. Components (hy-* classes; one block per Blade component in
 *      resources/views/components/site)
 *   5. Prose (article text from the database: .prose-site, .prose-trust)
 *   6-10. Page components, one section per family of pages: SEO templates,
 *      commerce, content, model garden, homepage chapters (their windows are
 *      also the product windows of the layer pages)
 *  11. Finish: the atmosphere switch, [data-finish="warm"] on <body>
 *      (App\Support\SiteTheme::FINISH; '' turns it off)
 *  12. Corners: the rounded system (--hy-r-* tokens), as in the apps
 *
 * Linked by partials/site-head through App\Support\SiteTheme, which adds a
 * content hash to the URL. Edit this file directly; there is no build step.
 */

/* ===================================================================== */
/* 0. Base: the older shared classes, moved here from the inline <style>   */
/*    of partials/site-head and layouts/site (3 Nov 2026), in their old    */
/*    order and before everything else, so the cascade is unchanged. Rules */
/*    no public view used any more were dropped, and so were the body and  */
/*    .font-mono fonts and the body gradient that brand.css overrides.     */
/*    Callers: the illustrations (partials/illus), the site nav and footer, */
/*    the savings flow (cv-*), prose-site / prose-tight article text and   */
/*    the FAQ and TOC boxes of the SEO pages.                              */
/* ===================================================================== */
/* Design tokens and fonts live in public/css/brand.css (partials.brand-css), the one brand
     source for every public HostYourAI page, loaded last in the <head>. */
*{box-sizing:border-box;}
html,body{margin:0;}
body{background:var(--background);
    color:var(--foreground);
    -webkit-font-smoothing:antialiased;
    padding:0 16px;}
a{text-decoration:none;color:inherit;}
h1,h2,h3{text-wrap:balance;}
.sub{color:var(--muted-foreground);font-size:17px;line-height:1.65;font-weight:400;text-wrap:pretty;}
.hyai-mark{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:var(--accent);flex:none;box-shadow:0 1px 2px rgba(79,70,229,0.3);}
.hyai-mark svg{width:21px;height:21px;display:block;}
.shell{max-width:1440px;width:100%;margin:0 auto;border-left:1px solid var(--border);border-right:1px solid var(--border);position:relative;overflow-x:clip;background:var(--background);}
.grad-text{background:var(--grad-ink);-webkit-background-clip:text;background-clip:text;color:transparent;}
/* reusable subtle grain veil (drop inside any overflow-hidden gradient tile) */
/* buttons: ink pills (radius-full, near-black) */
.btn-primary{background:var(--ink);color:#fff;border-radius:999px;padding:11px 22px;font-weight:500;font-size:15px;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
    box-shadow:0 1px 1px rgba(0,0,0,0.08);
    transition:background-color .175s var(--ease), box-shadow .175s var(--ease), transform .175s var(--ease);}
.btn-primary:hover{background:var(--ink-hover);transform:translateY(-1px);
    box-shadow:0 1px 2px rgba(0,0,0,0.08), 0 10px 22px -12px rgba(21,17,12,0.45);}
.btn-ghost{background:transparent;color:var(--foreground);border:1px solid var(--border-strong);border-radius:999px;padding:11px 22px;font-weight:500;font-size:15px;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
    transition:background-color .175s var(--ease), border-color .175s var(--ease), box-shadow .175s var(--ease), transform .175s var(--ease);}
.btn-ghost:hover{background:var(--ink-muted);border-color:rgba(21,17,12,0.30);transform:translateY(-1px);
    box-shadow:0 1px 2px rgba(21,17,12,0.06);}
.shine{position:relative;overflow:hidden;}
.shine::after{content:"";position:absolute;top:0;left:-60%;width:50%;height:100%;
    background:linear-gradient(105deg,transparent,rgba(255,255,255,0.35),transparent);
    transform:skewX(-18deg);animation:shine 3.6s ease-in-out infinite;}
@keyframes shine{0%{left:-60%;}55%,100%{left:130%;}}
/* pills, eyebrows, badges */
.pill{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500;border:1px solid var(--border);background:var(--card);color:var(--foreground);border-radius:999px;padding:6px 13px;line-height:1.2;box-shadow:0 1px 1px rgba(21,17,12,0.04);}
/* the legacy pill eyebrow; option C's eyebrow (a row holding .eyebrow__l chips) is left alone */
.eyebrow:not(:has(> .eyebrow__l)){display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent-soft);border:1px solid rgba(99,102,241,0.26);border-radius:999px;padding:6px 13px;line-height:1.2;}
.feature-li{display:flex;align-items:center;gap:10px;font-size:15px;color:rgba(21,17,12,0.85);padding:7px 0;}
.check{position:relative;width:14px;height:14px;border-radius:50%;background:var(--accent-soft);box-shadow:inset 0 0 0 1px rgba(99,102,241,0.45);flex:none;display:inline-flex;}
.check::after{content:"";position:absolute;left:31%;top:17%;width:26%;height:47%;border:solid var(--accent-ink);border-width:0 1.5px 1.5px 0;transform:rotate(45deg);}
.check svg{display:none;}
/* legacy inline check icons: the ::after checkmark replaces them */
.nav-link{font-size:15px;color:var(--muted-foreground);font-weight:450;padding:8px 13px;border-radius:999px;transition:.175s var(--ease);}
.nav-link:hover{color:var(--foreground);background:var(--ink-muted);}
.tab-btn{padding:9px 18px;border-radius:999px;font-size:15px;font-weight:500;color:var(--muted-foreground);cursor:pointer;}
.tab-btn.active{background:var(--ink);color:#fff;}
.sec-border{border-top:1px solid var(--border);}
/* layered 2-4% radial washes instead of one flat band, plus a whisper of grain */
.band{position:relative;isolation:isolate;background:
    radial-gradient(90% 75% at 14% 0%, rgba(99,102,241,0.045), rgba(99,102,241,0) 55%),
    radial-gradient(90% 75% at 86% 100%, rgba(214,158,96,0.05), rgba(214,158,96,0) 55%),
    radial-gradient(120% 120% at 50% 0%, rgba(99,102,241,0.04), rgba(99,102,241,0) 58%),
    var(--panel);}
.band::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background-image:var(--noise);opacity:.025;mix-blend-mode:multiply;}
/* hero aurora (signature: soft radial circle clusters anchored low) + grain */
/* =====  LIGHT PAPER CARD (brand primitive: hairline border, whisper shadow)  ===== */
.noise-card{position:relative;overflow:hidden;border-radius:16px;isolation:isolate;
    background:var(--card);
    border:1px solid var(--border);
    box-shadow:var(--shadow-card);
    transition:border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);}
.noise-card::after{content:"";position:absolute;z-index:-1;inset:0;
    background-image:var(--noise);
    opacity:.02;mix-blend-mode:multiply;pointer-events:none;}
.noise-card:hover{border-color:var(--border-strong);transform:translateY(-2px);
    box-shadow:var(--shadow-lift);}
/* dark ink statement panel (deliberate dark accent in the light system: CTA / code panels
     that carry white text in page templates keep working) */
.noise-dark{position:relative;overflow:hidden;background:var(--ink);border-radius:28px;isolation:isolate;color:#fff;
    border:1px solid rgba(21,17,12,0.9);box-shadow:var(--shadow-card);}
.noise-dark::before{content:"";position:absolute;z-index:-2;inset:0;
    background:
      radial-gradient(58% 78% at 12% -8%, rgba(99,102,241,0.28), rgba(99,102,241,0) 60%),
      radial-gradient(54% 74% at 104% 110%, rgba(129,140,248,0.16), rgba(129,140,248,0) 58%);}
.noise-dark::after{content:"";position:absolute;z-index:-1;inset:0;
    background-image:var(--noise);
    opacity:.05;mix-blend-mode:overlay;pointer-events:none;}
/* light paper island (radius 28) with layered 3% indigo wash + grain */
.wf-island{position:relative;overflow:hidden;background:var(--card);border-radius:28px;isolation:isolate;border:1px solid var(--border);box-shadow:var(--shadow-card);}
.wf-island::before{content:"";position:absolute;z-index:-2;inset:0;pointer-events:none;
    background:
      radial-gradient(58% 78% at 12% -8%, rgba(99,102,241,0.06), rgba(99,102,241,0) 60%),
      radial-gradient(54% 74% at 104% 110%, rgba(129,140,248,0.05), rgba(129,140,248,0) 58%),
      radial-gradient(40% 60% at 82% 0%, rgba(224,180,130,0.05), rgba(224,180,130,0) 55%);}
.wf-island::after{content:"";position:absolute;z-index:-1;inset:0;
    background-image:var(--noise);
    opacity:.025;mix-blend-mode:multiply;pointer-events:none;}
/* light statement panel: paper with soft indigo aurora and hairline border */
.cta-island{position:relative;overflow:hidden;border-radius:28px;isolation:isolate;color:var(--foreground);
    border:1px solid var(--border);box-shadow:var(--shadow-card);}
.cta-island::after{content:"";position:absolute;z-index:-1;inset:0;
    background-image:var(--noise);
    opacity:.025;mix-blend-mode:multiply;pointer-events:none;}
.cta-panel{padding:clamp(48px,8vw,110px) 24px;text-align:center;
    background:
      radial-gradient(58% 88% at 14% -10%, rgba(99,102,241,0.16), rgba(99,102,241,0) 60%),
      radial-gradient(54% 82% at 88% 112%, rgba(129,140,248,0.14), rgba(129,140,248,0) 58%),
      radial-gradient(46% 70% at 72% -6%, rgba(165,180,252,0.10), rgba(165,180,252,0) 55%),
      linear-gradient(180deg,#F5F4FD 0%,#EFEFFB 100%);}
/* "open" item: content sits directly on the page; a thin top rule gives structure */
.open-item{border-top:1px solid var(--border);padding-top:20px;transition:border-color .25s var(--ease);}
.open-item:hover{border-color:var(--border-strong);}
.open-num{font-size:40px;line-height:1;font-weight:600;letter-spacing:-0.025em;}
.count{font-variant-numeric:tabular-nums;}
/* marquee (icon chips, pause on hover, edge fade) */
.mq-mask{-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);overflow:hidden;}
.marquee{display:flex;gap:14px;width:max-content;animation:scroll 28s linear infinite;}
.marquee:hover{animation-play-state:paused;}
.marquee-rev{animation-direction:reverse;}
@keyframes scroll{to{transform:translateX(-50%);}}
.brand-chip{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:9px;padding:10px 18px;border-radius:999px;
    border:1px solid var(--border);background:var(--card);color:var(--muted-foreground);
    font-size:15px;font-weight:500;letter-spacing:-0.01em;white-space:nowrap;transition:color .25s var(--ease), border-color .25s var(--ease);box-shadow:0 1px 1px rgba(21,17,12,0.04);}
.brand-chip svg{width:17px;height:17px;opacity:.7;transition:.25s;flex:none;}
.brand-chip img{width:16px;height:16px;opacity:.7;transition:opacity .25s;flex:none;}
.brand-chip:hover{color:var(--foreground);border-color:var(--border-strong);}
.brand-chip:hover svg{opacity:1;color:var(--accent-ink);}
.brand-chip:hover img{opacity:1;}
/* grain wakes up on chip hover */
.brand-chip::after,.pill::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
    background-image:var(--noise);opacity:0;mix-blend-mode:multiply;transition:opacity .3s ease;}
.brand-chip:hover::after,.pill:hover::after{opacity:.04;}
/* model chip (SEO links to /models) */
.mchip{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:10px;
    border:1px solid var(--border);background:var(--card);color:rgba(21,17,12,0.85);
    font-size:13.5px;font-weight:500;transition:.2s;box-shadow:0 1px 1px rgba(21,17,12,0.04);}
.mchip:hover{border-color:rgba(99,102,241,0.45);color:var(--accent-ink);background:var(--accent-soft);}
.mchip .d{width:7px;height:7px;border-radius:50%;background:#059669;flex:none;}
.mchip .d.idle{background:#8A8071;box-shadow:none;}
.mchip img{width:16px;height:16px;opacity:.75;flex:none;}
.mchip svg{width:15px;height:15px;flex:none;color:var(--accent-ink);opacity:.8;}
/* letter-monogram fallback for vendors without an icon slug */
/* numbered step */
.step-card{position:relative;}
.step-no{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
    font-weight:600;font-size:15px;color:var(--accent-ink);background:var(--accent-soft);border:1px solid rgba(99,102,241,0.3);}
/* tab panel fade */
.tabfade{animation:tabfade .45s ease;}
@keyframes tabfade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.tabpanel{display:none;}
.tabpanel.show{display:block;animation:tabfade .45s ease;}
/* testimonial card */
.tcard{flex:0 0 360px;width:360px;}
/* integration tile grid (scattered icons + twinkle) */
.itile{aspect-ratio:1;border-radius:13px;border:1px solid var(--border);
    background:var(--card);display:flex;align-items:center;justify-content:center;transition:.25s;box-shadow:0 1px 1px rgba(21,17,12,0.03);}
.itile.lit{background:var(--accent-soft);border-color:rgba(99,102,241,0.22);}
.itile:hover{border-color:var(--border-strong);transform:translateY(-2px);box-shadow:var(--shadow-card);}
.itile svg,.itile span{width:26px;height:26px;}
.twinkle{animation:twinkle 4s ease-in-out infinite;}
@keyframes twinkle{0%,100%{opacity:.5;}50%{opacity:1;}}
/* ============ PASTEL AURORA FRAMES (paper + blurred indigo/periwinkle/sand tints + grain) ============ */
.mb{position:relative;border-radius:22px;overflow:hidden;isolation:isolate;
    padding:clamp(24px,4.4vw,58px);background:var(--mb-base,#FBF7F0);
    border:1px solid var(--border);box-shadow:var(--shadow-card);}
.mb::before{content:"";position:absolute;inset:-25%;z-index:-2;
    background:var(--mb-grad);filter:blur(30px);}
.mb::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background-image:var(--noise);opacity:.025;mix-blend-mode:multiply;}
.mb--warm{--mb-base:#FBF6EF;--mb-grad:
    radial-gradient(50% 60% at 18% 14%, rgba(129,140,248,0.28) 0%, rgba(129,140,248,0) 60%),
    radial-gradient(46% 56% at 78% 78%, rgba(224,180,130,0.24) 0%, rgba(224,180,130,0) 60%),
    radial-gradient(40% 50% at 60% 30%, rgba(99,102,241,0.16) 0%, rgba(99,102,241,0) 60%);}
.mb--cool{--mb-base:#F7F6FB;--mb-grad:
    radial-gradient(48% 58% at 72% 18%, rgba(99,102,241,0.26) 0%, rgba(99,102,241,0) 60%),
    radial-gradient(46% 56% at 20% 82%, rgba(165,180,252,0.30) 0%, rgba(165,180,252,0) 60%),
    radial-gradient(40% 50% at 46% 50%, rgba(224,180,130,0.14) 0%, rgba(224,180,130,0) 58%);}
.mb--clean{--mb-base:#FAF7F1;--mb-grad:
    radial-gradient(70% 90% at 50% -16%, rgba(99,102,241,0.20) 0%, rgba(99,102,241,0) 62%),
    radial-gradient(55% 70% at 102% 112%, rgba(165,180,252,0.18) 0%, rgba(165,180,252,0) 58%);}
.mb--forest{--mb-base:#FBF6EE;--mb-grad:
    radial-gradient(48% 58% at 78% 16%, rgba(224,180,130,0.30) 0%, rgba(224,180,130,0) 60%),
    radial-gradient(46% 56% at 22% 80%, rgba(129,140,248,0.24) 0%, rgba(129,140,248,0) 60%),
    radial-gradient(40% 50% at 55% 45%, rgba(99,102,241,0.12) 0%, rgba(99,102,241,0) 58%);}
.mb--amber{--mb-base:#F8F5FB;--mb-grad:
    radial-gradient(48% 58% at 22% 14%, rgba(165,180,252,0.30) 0%, rgba(165,180,252,0) 60%),
    radial-gradient(46% 56% at 80% 82%, rgba(99,102,241,0.20) 0%, rgba(99,102,241,0) 60%),
    radial-gradient(40% 50% at 70% 30%, rgba(224,180,130,0.18) 0%, rgba(224,180,130,0) 58%);}
/* ============ SHARED PAPER PANEL (white card inside a pastel aurora frame) ============ */
.glass{position:relative;border-radius:16px;color:var(--foreground);overflow:hidden;
    background:var(--card);
    border:1px solid var(--border);
    box-shadow:0 1px 1px rgba(21,17,12,0.05), 0 22px 48px -26px rgba(21,17,12,0.28);}
.glass::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
    background-image:var(--noise);opacity:.02;mix-blend-mode:multiply;}
.glass-head{display:flex;align-items:center;justify-content:space-between;
    padding:14px 17px;border-bottom:1px solid var(--border);
    font-size:15px;font-weight:500;color:var(--foreground);}
.glass-head .chev{width:14px;height:14px;opacity:.6;color:var(--muted-foreground);}
.glass-head .chev svg{width:14px;height:14px;display:block;}
/* ============ INSIGHTS CARD (light paper) ============ */
.ins-card{position:relative;border-radius:18px;color:var(--foreground);overflow:hidden;
    background:var(--card);
    border:1px solid var(--border);
    box-shadow:0 1px 1px rgba(21,17,12,0.05), 0 22px 48px -26px rgba(21,17,12,0.28);}
.ins-top{display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:13px 15px;border-bottom:1px solid var(--border);}
.ins-select{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;
    color:var(--foreground);background:rgba(21,17,12,0.04);
    border:1px solid var(--border);border-radius:9px;padding:7px 11px;line-height:1;}
.ins-select svg{width:13px;height:13px;opacity:.7;}
.ins-actions{display:flex;align-items:center;gap:7px;}
.ins-gen{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:500;
    color:#fff;background:var(--ink);border:none;border-radius:9px;padding:8px 13px;cursor:pointer;line-height:1;}
.ins-gen svg{width:14px;height:14px;}
.ins-icon{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;
    border-radius:8px;color:var(--muted-foreground);cursor:pointer;}
.ins-icon:hover{background:var(--ink-muted);color:var(--foreground);}
.ins-icon svg{width:16px;height:16px;}
.ins-body{padding:22px 24px 26px;position:relative;z-index:1;}
.ins-headrow{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.ins-title{font-size:21px;font-weight:500;color:var(--foreground);margin:0;letter-spacing:-0.01em;}
.ins-pager{display:inline-flex;align-items:center;gap:14px;font-size:13.5px;color:var(--muted-foreground);white-space:nowrap;}
.ins-pager svg{width:15px;height:15px;}
.ins-metric{display:flex;align-items:baseline;gap:12px;margin-top:14px;
    font-size:clamp(40px,6vw,54px);line-height:1;font-weight:600;color:var(--foreground);letter-spacing:-0.025em;}
.ins-delta{font-size:15px;font-weight:500;color:#046C4E;letter-spacing:0;}
.ins-sub{margin-top:12px;font-size:15px;color:var(--muted-foreground);}
.ins-rows{margin-top:26px;display:flex;flex-direction:column;gap:22px;}
.ins-rowhead{display:flex;align-items:center;gap:12px;margin-bottom:11px;flex-wrap:wrap;}
.ins-pill{font-size:12.5px;font-weight:500;border-radius:7px;padding:4px 9px;white-space:nowrap;line-height:1.1;}
.ins-pill.blue{color:#4338ca;background:rgba(99,102,241,0.12);}
.ins-pill.amber{color:#554D42;background:rgba(21,17,12,0.06);}
.ins-rowdesc{font-size:14.5px;color:rgba(21,17,12,0.85);}
.ins-bar{position:relative;height:14px;border-radius:7px;background:rgba(21,17,12,0.06);overflow:hidden;}
.ins-seg{position:absolute;top:0;bottom:0;border-radius:3px;background:#6366f1;}
/* ============ VERTICAL FLOW (Router, light paper) ============ */
.fl-body{padding:24px 22px 26px;display:flex;flex-direction:column;position:relative;z-index:1;}
.fl-step{position:relative;display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:11px;
    background:#fff;border:1px solid var(--border);font-size:14px;color:#2D241B;box-shadow:0 1px 1px rgba(21,17,12,0.04);}
.fl-step + .fl-step,.fl-code{margin-top:24px;}
.fl-step.amber{border-color:rgba(99,102,241,0.50);box-shadow:0 0 0 3px var(--accent-soft);}
.fl-step:not(:last-of-type)::after,.fl-code::before{content:"";position:absolute;left:50%;width:1px;height:24px;background:rgba(21,17,12,0.18);}
.fl-step:not(:last-of-type)::after{bottom:-24px;}
.fl-ico{width:25px;height:25px;border-radius:7px;background:var(--accent-soft);display:inline-flex;align-items:center;justify-content:center;color:var(--accent-ink);flex:none;}
.fl-ico.amber{background:rgba(99,102,241,0.16);color:#4338ca;}
.fl-ico svg{width:14px;height:14px;}
.fl-code{position:relative;padding:12px 14px;border-radius:11px;background:rgba(21,17,12,0.04);
    border:1px solid var(--border);font-family:'JetBrains Mono',monospace;font-size:12.5px;
    color:#2D241B;text-align:center;}
.fl-code::before{top:-24px;}
.fl-branch{display:flex;justify-content:space-between;gap:18px;margin-top:14px;}
.fl-leg{flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;}
.fl-tag{font-size:11.5px;color:#554D42;background:rgba(21,17,12,0.04);
    border:1px solid var(--border);border-radius:7px;padding:3px 11px;}
.fl-leaf{width:100%;padding:11px;border-radius:11px;background:#fff;
    border:1px solid var(--border);text-align:center;font-size:13px;color:#2D241B;}
/* ============ ROUTING CANVAS (light paper) ============ */
.cv-wrap{position:relative;width:100%;aspect-ratio:1000/440;border-radius:16px;overflow:hidden;
    background:var(--card);border:1px solid var(--border);
    box-shadow:0 1px 1px rgba(21,17,12,0.04), 0 24px 60px -32px rgba(21,17,12,0.30);
    background-image:radial-gradient(rgba(21,17,12,0.08) 1px, transparent 1px);
    background-size:26px 26px;background-position:13px 13px;}
.cv-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;}
.cv-link{fill:none;stroke:rgba(21,17,12,0.16);stroke-width:1.5;}
.cv-node{position:absolute;z-index:2;transform:translate(-50%,-50%);
    width:17%;padding:11px 13px;border-radius:12px;
    background:#fff;border:1px solid var(--border);
    box-shadow:0 10px 24px -12px rgba(21,17,12,0.22);}
.cv-node .r1{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:500;color:var(--foreground);letter-spacing:-0.01em;white-space:nowrap;}
.cv-node .r2{margin-top:4px;font-size:11px;color:#554D42;white-space:nowrap;}
.cv-bi{width:21px;height:21px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.cv-bi svg{width:13px;height:13px;}
.cv-tag{position:absolute;z-index:2;transform:translate(-50%,-50%);font-size:10px;letter-spacing:.02em;
    color:#554D42;background:var(--card);border:1px solid var(--border);
    border-radius:999px;padding:2px 9px;}
.cv-cap{position:relative;z-index:1;margin-top:14px;text-align:center;font-size:13px;color:var(--muted-foreground);}
.cv-pkt{filter:drop-shadow(0 0 2px rgba(99,102,241,0.55));}
.cv-pkt.warm{filter:drop-shadow(0 0 2px rgba(5,150,105,0.55));}
.cv-pulse{animation:cvpulse 3s ease-in-out infinite;}
@keyframes cvpulse{
    0%,100%{box-shadow:0 10px 24px -12px rgba(21,17,12,.22),0 0 0 1px rgba(99,102,241,.45),0 0 14px rgba(99,102,241,.18);}
    50%{box-shadow:0 10px 24px -12px rgba(21,17,12,.22),0 0 0 2px rgba(99,102,241,.75),0 0 26px rgba(99,102,241,.35);}}
.cv-glow{box-shadow:0 10px 24px -12px rgba(21,17,12,.22),0 0 0 1px rgba(5,150,105,.35),0 0 14px rgba(5,150,105,.12);}
@media (max-width:680px){.cv-node .r2{display:none;}
.cv-node{width:auto;min-width:80px;padding:8px 10px;}
.cv-node .r1{font-size:11px;gap:6px;}
.cv-cap{font-size:11.5px;}}
/* ============ COMMAND PALETTE + TIMELINE (light paper) ============ */
.pl-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative;z-index:1;}
.pl-pane{padding:16px;position:relative;z-index:1;}
.pl-pane.bd{border-bottom:1px solid var(--border);}
.pl-title{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:500;color:var(--foreground);margin-bottom:13px;}
.pl-title .chev{width:13px;height:13px;opacity:.6;color:var(--muted-foreground);}
.pl-title .chev svg{width:13px;height:13px;display:block;}
.pl-search{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:9px;
    background:rgba(21,17,12,0.04);border:1px solid var(--border);
    font-size:13px;color:#554D42;margin-bottom:12px;}
.pl-search svg{width:14px;height:14px;}
.pl-kbd{margin-left:auto;font-size:11px;color:#554D42;font-family:'JetBrains Mono',monospace;}
.pl-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;font-size:13.5px;color:#2D241B;}
.pl-item.active{background:var(--accent-soft);color:var(--accent-ink);}
.pl-item .dot{width:18px;height:18px;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;flex:none;color:#554D42;}
.pl-item.active .dot{background:var(--accent);color:#fff;}
.pl-item svg{width:13px;height:13px;}
.pl-day{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:500;color:var(--foreground);margin:14px 0 8px;}
.pl-day:first-child{margin-top:0;}
.pl-day svg{width:14px;height:14px;opacity:.6;}
.pl-day .chev{margin-left:auto;opacity:.5;color:var(--muted-foreground);}
.pl-ev{display:flex;align-items:center;gap:10px;padding:5px 0 5px 6px;margin-left:7px;
    border-left:1px solid rgba(21,17,12,0.14);font-size:13px;color:#554D42;}
.pl-ev svg{width:13px;height:13px;opacity:.55;flex:none;}
.pl-ev b{color:var(--foreground);font-weight:500;}
@media (max-width:560px){.pl-grid{grid-template-columns:1fr;}}
/* ============ GPU INSTANCE PANEL (light paper) ============ */
.gp-body{padding:20px 22px 22px;position:relative;z-index:1;}
.gp-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;}
.gp-name{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:500;color:var(--foreground);}
.gp-name .mk{width:24px;height:24px;border-radius:7px;background:var(--accent-soft);color:var(--accent-ink);display:inline-flex;align-items:center;justify-content:center;}
.gp-name .mk svg{width:13px;height:13px;}
.gp-chip{font-size:11.5px;font-weight:500;color:#046C4E;background:rgba(4,120,87,0.10);border:1px solid rgba(4,120,87,0.25);border-radius:999px;padding:3px 10px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
.gp-dot{width:7px;height:7px;border-radius:50%;background:#059669;box-shadow:0 0 6px rgba(5,150,105,.45);}
.gp-sub{font-size:12.5px;color:#554D42;margin-bottom:16px;}
.gp-gauge + .gp-gauge{margin-top:13px;}
.gp-glabel{display:flex;justify-content:space-between;font-size:12.5px;color:#554D42;margin-bottom:7px;}
.gp-glabel b{color:var(--foreground);font-weight:500;}
.gp-track{height:9px;border-radius:6px;background:rgba(21,17,12,0.08);overflow:hidden;}
.gp-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,#6366f1,#818cf8);}
.gp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px;}
.gp-stat{padding:11px 12px;border-radius:11px;background:rgba(21,17,12,0.03);border:1px solid var(--border);}
.gp-sv{font-size:18px;font-weight:600;color:var(--foreground);letter-spacing:-0.01em;}
.gp-sl{font-size:11.5px;color:#554D42;margin-top:2px;}
.gp-endpoint{margin-top:16px;display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:10px;
    background:rgba(21,17,12,0.03);border:1px solid var(--border);font-family:'JetBrains Mono',monospace;font-size:11.5px;color:#2D241B;overflow:hidden;}
.gp-endpoint svg{width:13px;height:13px;flex:none;color:var(--accent-ink);}
.gp-endpoint .ok{margin-left:auto;color:#046C4E;white-space:nowrap;}
/* mock windows: paper codeblock cards (hairline border, language tag left + copy icon right) */
.mock{background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden;
    box-shadow:0 1px 1px rgba(21,17,12,0.04), 0 2px 8px rgba(21,17,12,0.04);}
.mock-head{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:1px solid var(--border);}
.mock-head .d{display:none;}
.mock-head .t{margin-left:0;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11.5px;color:#6B6255;}
.mock-head::after{content:"";margin-left:auto;width:14px;height:14px;flex:none;opacity:.75;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B6255' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E") center/contain no-repeat;}
.code{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12.5px;line-height:1.75;padding:16px 18px;white-space:pre;overflow-x:auto;color:#2D241B;}
.code .c2{color:#4338ca;}
.code .c3{color:#6B4A8C;}
.code .c4{color:#15110C;}
.mrow{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--border);font-size:13px;}
.mrow:last-child{border-bottom:0;}
.mrow .nm{font-weight:500;color:var(--foreground);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chip{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;border-radius:5px;padding:3px 7px;line-height:1.2;white-space:nowrap;}
.chip.warm{color:#046C4E;background:rgba(4,120,87,0.10);}
.chip.eu{color:#4338ca;background:rgba(99,102,241,0.10);}
.chip.up{color:#92400E;background:rgba(217,119,6,0.12);}
.bar{height:9px;border-radius:5px;background:rgba(21,17,12,0.08);overflow:hidden;}
.bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#6366f1,#818cf8);}
/* ============ CHAT MOCK (light paper) ============ */
.cm-wrap{display:flex;flex-direction:column;gap:10px;position:relative;z-index:1;}
.cm-tag{align-self:flex-start;font-size:11px;color:#554D42;font-family:'JetBrains Mono',monospace;}
.cm-b{max-width:82%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.5;}
.cm-u{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:4px;}
.cm-a{align-self:flex-start;background:#fff;border:1px solid var(--border);color:#2D241B;border-bottom-left-radius:4px;box-shadow:0 1px 1px rgba(21,17,12,0.04);}
.cm-caret{display:inline-block;width:6px;height:14px;border-radius:var(--hy-r-dot);background:var(--accent);vertical-align:-2px;margin-left:2px;animation:blink 1s steps(2) infinite;}
@keyframes blink{50%{opacity:0;}}
/* ============ WORKFLOW (light paper island) ============ */
/* ============ EMBEDDINGS (vector space, light paper) ============ */
.emb-plot{position:relative;aspect-ratio:1000/440;border-radius:12px;overflow:hidden;
    background:rgba(21,17,12,0.02);border:1px solid var(--border);
    background-image:radial-gradient(rgba(21,17,12,0.08) 1px,transparent 1px);background-size:20px 20px;}
.emb-svg{position:absolute;inset:0;width:100%;height:100%;}
.emb-svg line{stroke:rgba(99,102,241,0.55);stroke-width:0.5;stroke-dasharray:2 2;}
.emb-dot{position:absolute;transform:translate(-50%,-50%);border-radius:50%;}
.emb-q{box-shadow:0 0 0 4px rgba(5,150,105,0.14),0 0 14px rgba(5,150,105,.45);}
.emb-qlabel{position:absolute;transform:translate(-50%,-150%);font-size:10.5px;font-family:'JetBrains Mono',monospace;color:#046C4E;white-space:nowrap;}
.emb-list{margin-top:15px;display:flex;flex-direction:column;gap:9px;position:relative;z-index:1;}
.emb-row{display:flex;align-items:center;gap:11px;font-size:12.5px;}
.emb-row .nm{font-family:'JetBrains Mono',monospace;color:rgba(21,17,12,0.85);min-width:92px;}
.emb-bar{flex:1;height:6px;border-radius:4px;background:rgba(21,17,12,0.08);overflow:hidden;}
.emb-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#6366f1,#818cf8);}
.emb-sc{color:var(--accent-ink);font-variant-numeric:tabular-nums;min-width:34px;text-align:right;}
/* image tiles (illustration internals keep their colourful gradients) */
.img-prompt{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:9px;background:rgba(21,17,12,0.04);border:1px solid var(--border);font-size:12.5px;color:#554D42;margin-bottom:12px;}
.img-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:300px;margin:0 auto;}
.img-tile{aspect-ratio:1;border-radius:9px;border:1px solid var(--border);}
.img-g1{background:linear-gradient(135deg,#6366f1,#a855f7,#ec4899);}
.img-g2{background:linear-gradient(135deg,#0ea5e9,#6366f1,#1e1b4b);}
.img-g3{background:linear-gradient(135deg,#f43f5e,#a855f7,#6366f1);}
.img-gen{display:flex;align-items:center;justify-content:center;background:rgba(21,17,12,0.04);color:#554D42;font-size:11px;}
/* custom HF deploy */
.dep-field{display:flex;align-items:center;gap:9px;padding:11px 13px;border-radius:10px;background:rgba(21,17,12,0.03);border:1px solid var(--border);font-family:'JetBrains Mono',monospace;font-size:12.5px;color:#2D241B;}
.dep-field .lab{color:#8A8071;}
.dep-row{display:flex;gap:10px;margin-top:12px;align-items:center;}
.dep-chip{font-size:12px;color:var(--accent-ink);background:var(--accent-soft);border:1px solid rgba(99,102,241,.3);border-radius:8px;padding:7px 11px;}
.dep-btn{margin-left:auto;font-size:13px;font-weight:500;color:#fff;background:var(--ink);border-radius:9px;padding:8px 16px;}
.dep-prog{margin-top:18px;}
.dep-track{height:7px;border-radius:5px;background:rgba(21,17,12,0.08);overflow:hidden;}
.dep-track i{display:block;height:100%;width:64%;background:linear-gradient(90deg,#6366f1,#818cf8);border-radius:5px;}
.dep-log{margin-top:9px;font-family:'JetBrains Mono',monospace;font-size:11.5px;color:#554D42;}
/* ============ FOOTER ============ */
.social{width:38px;height:38px;border-radius:999px;border:1px solid var(--border-strong);background:var(--card);display:inline-flex;align-items:center;justify-content:center;color:var(--muted-foreground);transition:.175s var(--ease);}
.social:hover{color:var(--accent-ink);border-color:rgba(99,102,241,0.5);background:var(--accent-soft);}
.social svg{width:17px;height:17px;}
/* ---- mobile tuning for pastel frames + paper panels ---- */
@media (max-width:640px){.mb{padding:12px;border-radius:16px;}
.glass{min-width:0;}
.gp-top{flex-wrap:wrap;row-gap:6px;}
.gp-endpoint{flex-wrap:wrap;row-gap:4px;font-size:10px;padding:8px 9px;}
.ins-headrow{flex-wrap:wrap;row-gap:4px;}
.cv-wrap{background-size:18px 18px;}
.cv-node{padding:7px 9px;border-radius:9px;min-width:0;}
.cv-node .r1{font-size:10px;gap:5px;}
.cv-bi{width:16px;height:16px;border-radius:5px;}
.cv-bi svg{width:10px;height:10px;}
.cv-tag{font-size:8.5px;padding:1px 6px;}
.cv-cap{font-size:11px;margin-top:10px;}
.glass-head,.ins-top{padding:11px 13px;}
.ins-select{font-size:11.5px;padding:6px 9px;}
.ins-gen{font-size:11.5px;padding:7px 10px;}
.ins-body{padding:16px 15px 18px;}
.ins-title{font-size:17px;}
.ins-metric{font-size:34px;}
.ins-pager{font-size:12px;gap:8px;}
.ins-rows{gap:16px;}
.ins-pill{font-size:11px;}
.ins-rowdesc{font-size:12.5px;}
.gp-body{padding:16px 15px 18px;}
.gp-stats{gap:7px;}
.gp-stat{padding:8px 9px;}
.gp-sv{font-size:15px;}
.gp-sl{font-size:10.5px;}
.fl-body{padding:18px 15px 20px;}
.fl-step{font-size:12.5px;padding:10px 12px;}
.pl-pane{padding:13px;}
.pl-item{font-size:12.5px;}
.pl-ev{font-size:12px;}
.emb-list{margin-top:12px;}
.emb-row{font-size:11.5px;}
.emb-row .nm{min-width:74px;}}
/* ============ MOTION & INTERACTION ============ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);}
.reveal.in{opacity:1;transform:none;}
.reveal.d1{transition-delay:.08s;}
.reveal.d2{transition-delay:.16s;}
.reveal.d3{transition-delay:.24s;}
.reveal.d4{transition-delay:.32s;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}
.marquee{animation:none;}
.shine::after{animation:none;}
.cm-caret{animation:none;}
.cv-pulse{animation:none;}
.twinkle{animation:none;}
.btn-primary:hover,.btn-ghost:hover,.noise-card:hover,.itile:hover{transform:none;}}
html { scroll-behavior: smooth; }
.prose-site > :first-child { margin-top: 0 !important; }
.prose-site > :first-child:not(.prose-table,.hy-table-wrap,table,.hy-win) { padding-top: 0 !important; border-top: 0 !important; }
.prose-site > :first-child::before { display: none !important; }
.prose-site h2 { position: relative; color: var(--foreground); font-weight: 600; font-size: 26px; letter-spacing: -0.02em; margin: 2rem 0 .9rem; padding-top: 1.9rem; border-top: 1px solid var(--border); scroll-margin-top: 96px; }
.prose-site h2::before { content: ""; position: absolute; top: -1px; left: 0; width: 44px; height: 2px; background: var(--grad-ink); }
.prose-site h3 { color: var(--foreground); font-weight: 600; font-size: 18px; margin: 1.4rem 0 .5rem; }
.prose-site p, .prose-site li { color: var(--muted-foreground); font-size: 16px; line-height: 1.7; }
.prose-site p { margin: 0 0 1rem; }
.prose-site ul { list-style: none; padding: 0; margin: 1rem 0 1.4rem; }
.prose-site ul li { position: relative; padding-left: 1.6rem; margin-bottom: .5rem; }
.prose-site ul li::before { content: ""; position: absolute; left: 0; top: .58em; width: 13px; height: 13px; border-radius: 50%; background: var(--grad); }
.prose-site ol { list-style: decimal; padding-left: 1.25rem; margin: 1rem 0 1.4rem; }
.prose-site a { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 2px; }
.prose-site strong { color: var(--foreground); font-weight: 600; }
.prose-site code { background: rgba(21,17,12,0.05); color: var(--foreground); padding: 1px 6px; border-radius: 4px; font-size: 13px; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.prose-site pre { background: var(--card); border: 1px solid var(--border); color: #2D241B; padding: 14px; border-radius: 10px; overflow-x: auto; margin: 1.2rem 0; font-size: 12.5px; box-shadow: 0 1px 1px rgba(21,17,12,0.04); }
.prose-site pre code { background: transparent; padding: 0; color: inherit; }
.prose-site table { width: 100%; border-collapse: collapse; margin: 1.2rem 0; font-size: 14px; }
.prose-site th, .prose-site td { border: 1px solid var(--border); padding: 9px 12px; text-align: left; color: var(--muted-foreground); vertical-align: top; }
.prose-site th { color: var(--foreground); font-weight: 600; background: rgba(21,17,12,0.03); }
/* tables get a framed, scrollable wrapper (the .shell clips overflow-x) */
.prose-table { overflow-x: auto; margin: 1.4rem 0; border: 1px solid var(--border); border-radius: 12px; -webkit-overflow-scrolling: touch; }
.prose-site .prose-table { }
.prose-site .prose-table table { margin: 0; border: 0; }
.prose-site .prose-table th, .prose-site .prose-table td { border-left: 0; border-right: 0; }
.prose-site .prose-table tr > :first-child { border-left: 0; }
.prose-site .prose-table thead th { border-top: 0; }
.prose-site .prose-table tbody tr:last-child td { border-bottom: 0; }
/* tight prose inside feature rows (no top dividers, first h3 flush) */
.prose-tight > :first-child { margin-top: 0 !important; }
.prose-tight h2 { border-top: 0; padding-top: 0; margin-top: 0; }
.prose-tight h2::before { display: none; }
.prose-tight h3 { margin-top: 1.2rem; }
.prose-tight h3:first-child { margin-top: 0; }
/* "On this page": a compact expandable outline at the top of the article,
   shown on every screen size (the article itself is full width). */
.toc-box { border: 1px solid var(--border); border-radius: 12px; padding: 0 16px; margin-bottom: 28px; background: var(--card); box-shadow: 0 1px 1px rgba(21,17,12,0.04); }
.toc-box summary { cursor: pointer; list-style: none; padding: 13px 0; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--muted-foreground); display: flex; justify-content: space-between; align-items: center; }
.toc-box summary::-webkit-details-marker { display: none; }
.toc-box summary::after { content: "+"; color: var(--accent-ink); font-size: 18px; font-weight: 400; }
.toc-box[open] summary::after { content: "\2013"; }
.toc-box ul { list-style: none; padding: 0 0 12px; margin: 0; }
.toc-box ul li { padding: 0; margin: 0; }
.toc-box ul li::before { display: none; }
.toc-box a { display: block; padding: 6px 0; font-size: 14px; color: var(--muted-foreground); text-decoration: none; }
.toc-box a:hover { color: var(--foreground); }
/* in-body FAQ accordion (native <details>) */
.faq-item { border-top: 1px solid var(--border); }
.faq-item summary { cursor: pointer; list-style: none; padding: 16px 0; font-weight: 600; font-size: 16px; color: var(--foreground); display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; color: var(--accent-ink); font-weight: 400; font-size: 20px; line-height: 1; transition: transform .2s; }
.faq-item[open] summary::after { content: "\2013"; }
.faq-a { padding-bottom: 16px; }
.faq-a p, .faq-a li { color: var(--muted-foreground); }
.faq-a > :first-child { margin-top: 0; }
/* end base */


/* ===================================================================== */
/* 1. Fonts                                                              */
/* ===================================================================== */
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/inter-tight-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/inter-tight-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/inter-tight-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/inter-tight-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* 600 and 700 share one file: the brand never goes heavier than 600, legacy
   font-bold classes resolve to the same face instead of a faux bold. */
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:600 700;font-display:swap;src:url(/fonts/inter-tight-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:600 700;font-display:swap;src:url(/fonts/inter-tight-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Fragment Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url(/fonts/fragment-mono-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Fragment Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url(/fonts/fragment-mono-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Metric-matched fallback (Arial scaled to Inter Tight), so the swap does not move the layout. */
@font-face{font-family:'Inter Tight Fallback';src:local('Arial'),local('Helvetica Neue'),local('Helvetica');size-adjust:96.5%;ascent-override:100.4%;descent-override:25%;line-gap-override:0%}

/* ===================================================================== */
/* 2. Tokens                                                             */
/* ===================================================================== */
:root{
  /* surfaces, lightest to darkest */
  --hy-cream:#FFFDF8;      /* insets inside a band surface, active segment */
  --hy-paper:#F8F4ED;      /* the page */
  --hy-deep:#F5F0E7;       /* window footers, wells */
  --hy-band:#F1EBE0;       /* cards, windows, bands */
  --hy-raise:#EBE4D8;      /* bars on a band, secondary buttons, hover */
  --hy-raise-2:#E1DDD6;    /* hover on raise, empty meter cells */
  --hy-line:#E1DDD6;       /* the one hairline colour */
  --hy-faint:#CBC2B3;      /* tracks, placeholder squares */
  --hy-chip-core:#B8B6F4;  /* the core of a lit GPU chip (flat, never see-through) */
  --hy-deep-2:#EFE8DC;     /* a tile on a highlighted row inside a cream window */
  --hy-accent-tint:#E6E7FA; /* a layer tag that is part of a plan */
  --hy-accent-tint-2:#DDDFF8;
  /* ink */
  --hy-ink:#15110C;
  --hy-ink-2:#2D241B;
  --hy-ink-press:#2A241D; /* a pressed quiet button */
  --hy-muted:#554D42;      /* secondary text, 7:1 on paper */
  --hy-muted-2:#5E5549;    /* labels on band */
  --hy-subtle:#6B6152;     /* the quiet second line of a heading */
  --hy-graphic:#7F7464;    /* graphic grey, 3:1 on wells */
  /* accent */
  --hy-accent:#6366F1;        /* fills: meters, bars, marks */
  --hy-accent-strong:#4F46E5; /* buttons, accent text, the logo square */
  --hy-accent-hover:#4338CA;
  --hy-on-accent:#FFFDF8;
  --hy-selection:#C7D2FE;
  /* Loes, the wink: only through <x-site.loes-wink> and <x-site.maatje who="loes"> */
  --hy-loes:#FB94C2;
  /* status, for form errors, notices and a ready mark */
  --hy-ok:#047857;
  --hy-danger:#B4482E;
  --hy-danger-ink:#9A3412;
  /* type */
  --hy-font:'Inter Tight','Inter Tight Fallback',system-ui,-apple-system,'Segoe UI',sans-serif;
  --hy-mono:'Fragment Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  /* layout */
  --hy-w:1312px;      /* content width */
  --hy-sx:64px;       /* side padding */
  --hy-sec:152px;     /* space between sections and chapters (v7k: 152, 124 below 1100, 92 below 760) */
  --hy-nav:64px;      /* nav height, also the sticky offset */
  --hy-ease:cubic-bezier(.2,.7,.2,1);
  /* corners (2 Nov 2026 Jantine chose rounded corners like the apps:
     app cards rounded-xl, controls rounded-lg). Never a circle. */
  --hy-r-panel:24px;  /* large panels: team, call to action, closing box */
  --hy-r-card:12px;   /* cards, windows, dropdowns, grids of tiles */
  --hy-r-ctl:8px;     /* buttons, inputs, tabs, tiles, photos */
  --hy-r-tag:6px;     /* tags, badges, segments inside a control */
  --hy-r-mark:7px;    /* the logo mark */
  --hy-r-dot:2px;     /* tiny square marks up to 8px and thin meters (brand --b-r-tick) */
  --hy-r-bar:3px;     /* bars and meters 6px and taller (brand --b-r-bar) */
  --hy-r-thumb:4px;   /* slider thumbs */
  /* type scale (pro-07-paper-v7k: one heading scale for every section) */
  --hy-t-display:clamp(56px,6.6vw,96px); /* the homepage H1 and short page titles */
  --hy-t-h1:clamp(40px,5vw,72px);        /* page titles that run long (SEO pages, legal, news) */
  --hy-t-h2:clamp(36px,4.2vw,58px);      /* every section and chapter heading */
  --hy-t-h3:22px;                        /* card and plan headings */
  /* the gradient panel (v7c/v7k): paper on the left, lavender and periwinkle in the
     middle, a warm peach wash bottom right, a trace of grain. Hero and closing panels only. */
  --hy-grad:
    linear-gradient(90deg,#FFFDF8 0%,#FFFDF8 30%,#FFFDF800 64%),
    radial-gradient(ellipse 60% 80% at 100% 100%,#E8A57ACC 0%,#F0C29E99 38%,#F0C29E00 76%),
    radial-gradient(ellipse 54% 76% at 96% 32%,#A5B4FCB3 0%,#A5B4FC00 78%),
    linear-gradient(110deg,#FFFDF8 26%,#C7C9F5 100%);
  --hy-grad-stack:
    linear-gradient(180deg,#FFFDF8 0%,#FFFDF8 45%,#FFFDF800 70%),
    radial-gradient(ellipse 80% 50% at 100% 100%,#E8A57ACC 0%,#F0C29E99 38%,#F0C29E00 76%),
    radial-gradient(ellipse 70% 45% at 80% 75%,#A5B4FCB3 0%,#A5B4FC00 78%),
    linear-gradient(180deg,#FFFDF8 30%,#C7C9F5 100%);
  --hy-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --hy-grad-pad:80px 56px; /* inside a gradient panel */
}
@media (max-width:1180px){:root{--hy-sx:40px;--hy-grad-pad:64px 32px}}
@media (max-width:1100px){:root{--hy-sec:124px}}
@media (max-width:760px){:root{--hy-sec:92px}}
@media (max-width:720px){:root{--hy-sx:20px;--hy-grad-pad:40px 16px}}

/* ===================================================================== */
/* 3. Base elements                                                      */
/* In a layer: any unlayered rule (Tailwind, a page's own <style>) wins.   */
/* ===================================================================== */
@layer hy-base{
  html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hy-nav) + 24px)}
  body{margin:0;background:var(--hy-paper);color:var(--hy-ink);font:400 16px/1.55 var(--hy-font);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
  a{color:inherit;text-decoration:none}
  img,svg,video{max-width:100%}
  h1,h2,h3{text-wrap:balance}
  p{text-wrap:pretty}
  code,kbd,samp,pre{font-family:var(--hy-mono);letter-spacing:0}
  ::selection{background:var(--hy-selection);color:var(--hy-ink)}
  :focus-visible{outline:2px solid var(--hy-accent-strong);outline-offset:3px}
  @media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
}

/* ===================================================================== */
/* 4. Components                                                         */
/* ===================================================================== */

/* --- helpers ---------------------------------------------------------- */
.hy-wrap{box-sizing:border-box;max-width:calc(var(--hy-w) + 2*var(--hy-sx));margin:0 auto;padding:0 var(--hy-sx)}
.hy-mono{font-family:var(--hy-mono);letter-spacing:0;font-weight:400}
.hy-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hy-sq{display:inline-block;width:7px;height:7px;background:var(--hy-accent-strong);flex:none}
.hy-sq--quiet{background:var(--hy-graphic)}
.hy-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
@media (max-width:1180px){.hy-pair{grid-template-columns:minmax(0,1fr)}}
.hy-skip{position:absolute;left:12px;top:12px;z-index:100;padding:10px 14px;background:var(--hy-accent-strong);color:var(--hy-on-accent);font-size:14px}
.hy-skip:not(:focus){width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hy-anchor{display:block;height:0;outline:0}

/* --- logo: <x-site.logo>, <x-site.mark> ------------------------------- */
.hy-logo{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:16px;letter-spacing:-.02em;color:var(--hy-ink)}
.hy-mark{display:inline-grid;place-items:center;width:26px;height:26px;background:var(--hy-accent-strong);color:var(--hy-on-accent);flex:none}
.hy-mark svg{display:block;width:15px;height:auto}
.hy-mark--sm{width:20px;height:20px}.hy-mark--sm svg{width:12px}

/* --- button: <x-site.button> ------------------------------------------ */
.hy-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:44px;padding:0 20px;font:500 15px/1 var(--hy-font);letter-spacing:-.01em;white-space:nowrap;cursor:pointer;border:0;text-decoration:none;transition:background-color .15s var(--hy-ease),color .15s var(--hy-ease)}
.hy-btn--primary{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-btn--primary:hover{background:var(--hy-accent-hover);color:var(--hy-on-accent)}
.hy-btn--secondary{background:var(--hy-raise);color:var(--hy-ink)}
.hy-btn--secondary:hover{background:var(--hy-ink);color:var(--hy-paper)}
.hy-btn--secondary:active{background:var(--hy-ink-press);color:var(--hy-paper)}
.hy-btn:focus-visible{outline:2px solid var(--hy-accent);outline-offset:2px}
.hy-btn--quiet{background:transparent;color:var(--hy-muted);padding:0 10px}
.hy-btn--quiet:hover{color:var(--hy-ink)}
.hy-btn--sm{height:34px;padding:0 14px;font-size:14px}
.hy-btn--block{display:flex;box-sizing:border-box;width:100%}
.hy-btn svg{flex:none}
.hy-btn[disabled],.hy-btn[aria-disabled="true"]{opacity:1;background:var(--hy-raise);color:var(--hy-graphic);cursor:not-allowed}
/* the text link with an arrow ("See all models ->") */
.hy-more{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:500;color:var(--hy-ink)}
.hy-more svg{transition:transform .15s var(--hy-ease)}
.hy-more:hover svg{transform:translateX(3px)}
.hy-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.hy-actions--center{justify-content:center}

/* --- command chip: <x-site.command> ------------------------------------ */
.hy-cmd{display:inline-flex;align-items:center;gap:12px;height:44px;padding:0 6px 0 16px;background:var(--hy-raise);font:400 14px/1 var(--hy-mono);color:var(--hy-ink);white-space:nowrap;cursor:pointer;border:0;transition:background-color .15s}
.hy-cmd:hover{background:var(--hy-raise-2)}
.hy-cmd__p{color:var(--hy-accent-strong)}
.hy-cmd__copy{display:inline-grid;place-items:center;width:32px;height:32px;background:var(--hy-paper);color:var(--hy-muted)}
.hy-cmd__copy .f{opacity:0}
.hy-cmd__done{font-size:11px;color:var(--hy-accent-hover);overflow:hidden;width:0;transition:width .2s}
.hy-cmd.is-done .hy-cmd__copy{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-cmd.is-done .hy-cmd__copy .o{opacity:0}.hy-cmd.is-done .hy-cmd__copy .f{opacity:1}
.hy-cmd.is-done .hy-cmd__done{width:48px}

/* --- label: the mono chip in a chapter line and a section head ---------- */
.hy-label{display:inline-flex;align-items:center;gap:8px;padding:5px 9px;background:var(--hy-raise);color:var(--hy-ink-2);font:400 13px/1.2 var(--hy-mono);letter-spacing:0;white-space:nowrap}
.hy-label b{font-weight:400;color:var(--hy-accent-strong)}
.hy-label--accent{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-label--accent b{color:var(--hy-on-accent)}
.hy-badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 7px;background:var(--hy-raise);color:var(--hy-ink-2);font:400 11px/1 var(--hy-mono);letter-spacing:0;white-space:nowrap}
.hy-badge--accent{background:var(--hy-accent-strong);color:var(--hy-on-accent)}

/* --- nav: <x-site.nav> ------------------------------------------------- */
.hy-nav{position:sticky;top:0;z-index:60;background:var(--hy-paper);font-family:var(--hy-font)}
.hy-nav__bar{display:flex;align-items:center;gap:36px;height:var(--hy-nav)}
.hy-nav__menu{display:flex;align-items:center;gap:2px;margin:0;padding:0;list-style:none;font-size:14px;color:var(--hy-muted)}
.hy-nav__item{position:relative}
.hy-nav__trigger{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 10px;font:inherit;color:inherit;background:none;border:0;cursor:pointer;white-space:nowrap;transition:color .15s}
.hy-nav__item:hover>.hy-nav__trigger,.hy-nav__item.is-open>.hy-nav__trigger,.hy-nav__trigger[aria-current="page"]{color:var(--hy-ink)}
.hy-chev{width:12px;height:12px;flex:none;color:var(--hy-muted);transition:transform .15s}
.hy-nav__item.is-open .hy-chev{transform:rotate(180deg)}
.hy-nav__panel{position:absolute;top:100%;left:0;padding-top:8px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s,transform .15s,visibility .15s;z-index:61}
/* With the nav script running, .is-open alone opens a panel (the script keeps aria-expanded in step,
   on hover too); hover and focus-within are the fallback for when the script does not run. */
.hy-nav:not(.hy-nav--js) .hy-nav__item:hover>.hy-nav__panel,.hy-nav:not(.hy-nav--js) .hy-nav__item:focus-within>.hy-nav__panel,.hy-nav__item.is-open>.hy-nav__panel{opacity:1;visibility:visible;transform:none}
.hy-nav__item.is-dismissed>.hy-nav__panel{opacity:0;visibility:hidden;transform:translateY(-4px)}
.hy-nav__panel--end{left:auto;right:0}
.hy-nav__card{display:grid;gap:2px;min-width:230px;padding:10px;background:var(--hy-raise)}
.hy-nav__card--2{grid-template-columns:repeat(2,minmax(200px,max-content))}
.hy-nav__card--3{grid-template-columns:repeat(3,minmax(200px,max-content))}
.hy-nav__card--4{grid-template-columns:repeat(4,216px)}
.hy-nav__card--4 .hy-nav__link{white-space:normal;line-height:1.35}
.hy-nav__card--2,.hy-nav__card--3,.hy-nav__card--4{gap:2px 8px;width:max-content}
.hy-nav__card--4 .hy-nav__lead-blurb{min-height:2.8em}
.hy-nav__col{display:grid;align-content:start;gap:2px}
.hy-nav__lead{display:grid;gap:4px;margin-bottom:6px;padding:12px 10px;background:var(--hy-cream);color:var(--hy-ink)}
.hy-nav__lead-name{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:500;letter-spacing:-.01em}
.hy-nav__lead-arrow{width:14px;height:14px;color:var(--hy-accent-strong);transition:transform .15s}
.hy-nav__lead-blurb{font-size:13px;line-height:1.4;color:var(--hy-muted);white-space:normal}
.hy-nav__lead:hover .hy-nav__lead-arrow,.hy-nav__lead:focus-visible .hy-nav__lead-arrow{transform:translateX(3px)}
.hy-nav__lead:hover,.hy-nav__lead[aria-current]{background:var(--hy-paper)}
.hy-nav__card--narrow{min-width:180px}
.hy-nav__head{padding:6px 10px;font:400 11px/1.3 var(--hy-mono);color:var(--hy-muted-2);letter-spacing:0}
.hy-nav__link{display:flex;align-items:center;gap:10px;padding:7px 10px;color:var(--hy-ink-2);font-size:14px;white-space:nowrap}
.hy-nav__link:hover,.hy-nav__link[aria-current]{background:var(--hy-raise-2);color:var(--hy-ink)}
.hy-nav__link .hy-check{margin-left:auto;color:var(--hy-accent-strong)}
.hy-nav__right{margin-left:auto;display:flex;align-items:center;gap:18px;font-size:14px;color:var(--hy-muted)}
.hy-nav__right>a:not(.hy-btn):hover{color:var(--hy-ink)}
@media (max-width:1180px){.hy-nav__docs{display:none}}
.hy-nav__burger{display:none;place-items:center;width:40px;height:40px;background:var(--hy-raise);color:var(--hy-ink);border:0;cursor:pointer}
.hy-nav__burger .hy-nav__i-close,.hy-nav__burger[aria-expanded="true"] .hy-nav__i-open{display:none}
.hy-nav__burger[aria-expanded="true"] .hy-nav__i-close{display:block}
.hy-flag{display:inline-block;flex:none;width:20px;height:14px;outline:1px solid var(--hy-line);outline-offset:-1px}
/* mobile drawer */
.hy-mnav{position:fixed;inset:var(--hy-nav) 0 0;z-index:59;overflow:auto;padding:8px var(--hy-sx) 32px;background:var(--hy-paper)}
.hy-mnav[hidden]{display:none}
.hy-mnav details{border-bottom:1px solid var(--hy-raise)}
.hy-mnav summary{list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:52px;font-size:18px;color:var(--hy-ink);cursor:pointer}
.hy-mnav summary::-webkit-details-marker{display:none}
.hy-mnav details[open] .hy-chev{transform:rotate(180deg)}
.hy-mnav__group{padding:0 0 12px}
.hy-mnav__head{padding:10px 0 4px;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.hy-mnav__group a{display:flex;align-items:center;min-height:44px;color:var(--hy-muted)}
.hy-mnav__col+.hy-mnav__col{margin-top:8px}
.hy-mnav__group a.hy-mnav__lead{justify-content:space-between;font-weight:500;color:var(--hy-ink)}
.hy-mnav__lead .hy-icon{width:14px;height:14px;color:var(--hy-accent-strong)}
.hy-mnav a[aria-current="page"]{color:var(--hy-ink)}
.hy-mnav__group a:hover{color:var(--hy-ink)}
.hy-mnav__top{display:flex;align-items:center;min-height:52px;font-size:18px;color:var(--hy-ink);border-bottom:1px solid var(--hy-raise)}
.hy-mnav__langs{display:flex;flex-wrap:wrap;gap:6px;padding:16px 0;border-bottom:1px solid var(--hy-raise)}
.hy-mnav__langs a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;font-size:14px;color:var(--hy-muted);background:var(--hy-band)}
.hy-mnav__langs a[aria-current]{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-mnav__cta{display:grid;gap:8px;margin-top:24px}
body.hy-mnav-open{overflow:hidden}
@media (max-width:1180px){
  .hy-nav__menu,.hy-nav__hide-md{display:none}
  .hy-nav__burger{display:grid}
}
@media (max-width:720px){
  .hy-nav__hide-sm{display:none}
}
@media (min-width:1181px){.hy-mnav{display:none!important}}

/* --- footer: <x-site.footer> ------------------------------------------- */
.hy-footer{padding:88px 0 40px;background:var(--hy-paper);font-family:var(--hy-font)}
.hy-footer__grid{display:grid;grid-template-columns:minmax(260px,1.3fr) 4fr;gap:48px}
.hy-footer__cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:40px 28px}
.hy-footer__head a{color:inherit}
.hy-footer__head a:hover{color:var(--hy-ink)}
.hy-footer__brand p{margin:16px 0 0;max-width:22em;font-size:14px;line-height:1.55;color:var(--hy-muted)}
.hy-footer__head{margin:0 0 16px;font:400 12px/1.3 var(--hy-mono);color:var(--hy-muted-2);letter-spacing:0}
.hy-footer__list{margin:0;padding:0;list-style:none}
.hy-footer__list li{margin:0 0 10px}
.hy-footer__list a{font-size:14px;color:var(--hy-ink-2)}
.hy-footer__list a:hover{color:var(--hy-ink)}
.hy-footer__eu{display:inline-flex;align-items:center;gap:8px;margin-top:20px;padding:6px 10px;background:var(--hy-band);font:400 12px var(--hy-mono);color:var(--hy-ink-2)}
.hy-footer__news{margin-top:28px;max-width:320px}
.hy-footer__form{display:flex;gap:2px}
.hy-footer__social{display:flex;align-items:center;gap:16px;margin-top:22px;font-size:13px;color:var(--hy-muted)}
.hy-footer__social a:hover{color:var(--hy-ink)}
.hy-footer__social svg{width:16px;height:16px;display:block}
.hy-footer__legal{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;margin-top:56px;padding-top:24px;border-top:1px solid var(--hy-line);font-size:12.5px;color:var(--hy-muted-2)}
.hy-footer__legal a:hover{color:var(--hy-ink)}
.hy-footer__legal .hy-footer__made{display:inline-flex;align-items:center;gap:8px}
.hy-footer__langs{margin-left:auto;display:inline-flex;gap:2px}
.hy-footer__langs a{padding:2px 6px}
.hy-footer__langs a[aria-current]{background:var(--hy-raise);color:var(--hy-ink)}
.hy-footer__msg{margin-top:8px;font-size:12px}
.hy-footer__msg.is-ok{color:#046C4E}.hy-footer__msg.is-error{color:#B42318}
.hy-footer__fine{margin-top:8px;font-size:12px;line-height:1.5;color:var(--hy-muted-2)}
@media (max-width:1180px){.hy-footer__grid{grid-template-columns:1fr}.hy-footer__cols{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:860px){.hy-footer__cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.hy-footer{padding:64px 0 32px}.hy-footer__cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.hy-footer__list a{display:inline-flex;align-items:center;min-height:32px}.hy-footer__list li{margin:0 0 4px}.hy-footer__legal .hy-footer__made,.hy-footer__langs{margin-left:0}}

/* --- section: <x-site.section> ----------------------------------------- */
.hy-section{padding:var(--hy-section-pad,104px) 0}
.hy-section--band{background:var(--hy-band)}
.hy-section--tight{--hy-section-pad:64px}
.hy-section__head{max-width:760px;margin-bottom:48px}
.hy-section__head--center{margin-left:auto;margin-right:auto;text-align:center}
.hy-section__head .hy-label{margin-bottom:20px}
.hy-section__title{margin:0;font-weight:500;font-size:var(--hy-t-h2);line-height:.98;letter-spacing:-.045em;color:var(--hy-ink)}
.hy-section__title span{color:var(--hy-subtle)}
.hy-section__sub{margin:16px 0 0;font-size:17px;line-height:1.55;color:var(--hy-muted)}
@media (max-width:720px){.hy-section{--hy-section-pad:72px}.hy-section__head{margin-bottom:32px}}

/* --- chapter header: <x-site.chapter> ---------------------------------- */
.hy-chapter{padding:var(--hy-sec) 0 0}
.hy-chapter--hero{padding-top:88px}
.hy-chapter__line{display:flex;align-items:center;gap:14px;margin-bottom:28px;font:400 13px var(--hy-mono);color:var(--hy-muted);white-space:nowrap;overflow-x:auto;scrollbar-width:none}
.hy-chapter__line::-webkit-scrollbar{display:none}
.hy-chapter__num{color:var(--hy-muted-2)}
.hy-label__note{color:var(--hy-muted-2)}
.hy-chapter__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:64px;align-items:end;margin-bottom:56px}
.hy-h1{margin:0;font-weight:500;font-size:var(--hy-t-display);line-height:1;letter-spacing:-.045em;color:var(--hy-ink)}
.hy-h2{margin:0;font-weight:500;font-size:var(--hy-t-h2);line-height:.98;letter-spacing:-.045em;color:var(--hy-ink)}
.hy-h1 span,.hy-h2 span{color:var(--hy-subtle)}
.hy-h3{margin:0;font-weight:500;font-size:var(--hy-t-h3);line-height:1.25;letter-spacing:-.025em;color:var(--hy-ink)}
.hy-lead{margin:0;font-size:17px;line-height:1.5;color:var(--hy-muted)}
.hy-lead b,.hy-lead strong{color:var(--hy-ink);font-weight:500}
.hy-chapter__aside .hy-actions{margin-top:18px}
@media (max-width:1180px){.hy-chapter__head{grid-template-columns:1fr;gap:20px}}
@media (max-width:720px){.hy-chapter__head{margin-bottom:36px}.hy-chapter--hero{padding-top:48px}}

/* --- product window: <x-site.window> ----------------------------------- */
.hy-win{display:flex;flex-direction:column;min-width:0;background:var(--hy-band)}
.hy-win__head{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 18px;background:var(--hy-raise);font-size:13.5px;color:var(--hy-muted)}
.hy-win__crumb{display:flex;align-items:center;gap:8px;min-width:0;white-space:nowrap;overflow:hidden}
.hy-win__crumb i{font-style:normal}
.hy-win__crumb b{color:var(--hy-ink);font-weight:500}
.hy-win__actions{margin-left:auto;display:flex;align-items:center;gap:8px;font:400 12px var(--hy-mono);color:var(--hy-muted)}
.hy-win__body{flex:1;min-width:0}
.hy-win__body--pad{padding:20px 18px}
.hy-win__foot{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px 28px;padding:14px 18px;background:var(--hy-deep);font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.hy-win__foot b{color:var(--hy-ink-2);font-weight:400}
/* terminal variant */
.hy-win--term .hy-win__head{min-height:40px;padding:0 14px;gap:10px;font:400 11.5px var(--hy-mono)}
.hy-win__dots{display:flex;gap:5px}.hy-win__dots i{width:8px;height:8px;background:var(--hy-faint)}
.hy-win--term .hy-win__body{padding:18px 16px;font:400 12.5px/1.8 var(--hy-mono);color:var(--hy-ink-2);white-space:pre;overflow-x:auto}
.hy-win--term .hy-win__body .p{color:var(--hy-accent-strong)}
.hy-win--term .hy-win__body .d{color:var(--hy-muted-2)}
/* segmented control inside a window head */
.hy-seg{display:inline-flex;background:var(--hy-paper);padding:2px}
.hy-seg>*{padding:5px 10px;font:400 12px var(--hy-mono);color:var(--hy-muted-2);background:none;border:0}
.hy-seg>.is-on,.hy-seg>[aria-selected="true"]{background:var(--hy-cream);color:var(--hy-accent-strong)}
.hy-duo{display:grid;grid-template-columns:380px minmax(0,1fr);gap:12px;align-items:stretch}
@media (max-width:1180px){.hy-duo{grid-template-columns:1fr}}

/* --- table: <x-site.table> --------------------------------------------- */
.hy-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;background:var(--hy-band)}
.hy-table{width:100%;border-collapse:collapse;font-size:14px;color:var(--hy-ink-2)}
.hy-table caption{padding:14px 18px;text-align:left;font:400 12px var(--hy-mono);color:var(--hy-muted-2);background:var(--hy-raise);caption-side:top}
.hy-table th,.hy-table td{padding:12px 18px;text-align:left;vertical-align:top}
.hy-table thead th{padding-top:12px;padding-bottom:10px;font:400 11px/1.3 var(--hy-mono);color:var(--hy-muted-2);letter-spacing:0;white-space:nowrap}
.hy-table tbody tr+tr td,.hy-table tbody tr+tr th,.hy-table tbody tr:first-child>*{border-top:1px solid var(--hy-raise)}
.hy-table tbody th{font-weight:500;color:var(--hy-ink)}
.hy-table .is-num{text-align:right;font-family:var(--hy-mono);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
.hy-table tbody tr:hover>*{background:var(--hy-deep)}

/* --- tabs: <x-site.tabs> + <x-site.tab-panel> --------------------------- */
.hy-tabs__list{display:inline-flex;flex-wrap:wrap;gap:2px;padding:2px;background:var(--hy-raise)}
.hy-tabs__tab{height:36px;padding:0 14px;font:500 14px var(--hy-font);color:var(--hy-muted);background:none;border:0;cursor:pointer;transition:color .15s,background-color .15s}
.hy-tabs__tab:hover{color:var(--hy-ink)}
.hy-tabs__tab[aria-selected="true"]{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-tabs--mono .hy-tabs__tab{font:400 12px var(--hy-mono);height:30px;padding:0 10px}
.hy-tabs__panel{padding-top:24px}
.hy-tabs__panel[hidden]{display:none}

/* --- layer card: <x-site.layer-card> ------------------------------------ */
.hy-layers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:1180px){.hy-layers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.hy-layers{grid-template-columns:1fr}}

/* --- layer page: layer.blade.php (/control, /serve, /eu-compute) ------- */
.hy-layer-page__related{margin-top:40px;padding-top:24px;border-top:1px solid var(--hy-line)}
.hy-layer-page__related .hy-label{margin:0 0 14px}
.hy-layer-page__about{margin-top:48px}
.hy-layer-page__note{margin:20px 0 0;max-width:760px;font-size:13px;line-height:1.6;color:var(--hy-muted-2)}
.hy-layer-page__steps-label{margin:40px 0 16px}
.hy-layer-page__steps-cta{margin-top:28px}
.hy-win__list{margin-top:16px}
/* /code in the layer template (partials/layer-code-*.blade.php, 3 Nov 2026) */
.hy-layer-page__cli{margin-top:32px;max-width:720px}
.hy-layer-page__cli .hy-layer-page__note a,.hy-layer-page__note a{color:var(--hy-accent-strong)}
.hy-layer-page__eu{margin:20px 0 0}
.hy-layer-page__tools{margin-top:24px}
.hy-layer-page__tools .hy-label{margin:0 0 12px}
.hy-layer-page__tools .hy-chip .hy-mono{color:var(--hy-muted-2);font-size:12px}
.hy-layer-page__pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
.hy-layer-page__stack{display:flex;flex-direction:column;min-width:0}
.hy-layer-page__stack .hy-win{flex:1}
.hy-layer-page__checks{margin:16px 0 0;padding:0;list-style:none}
.hy-layer-page__checks li{display:flex;align-items:baseline;gap:12px;padding:10px 0;border-top:1px solid var(--hy-raise);font-size:14.5px;line-height:1.5;color:var(--hy-ink-2)}
.hy-layer-page__checks li:first-child{border-top:0}
.hy-layer-page__checks .hy-sq{transform:translateY(-1px)}
.hy-layer-page__checks code,.hy-layer-page__models .hy-mono{font:400 13px var(--hy-mono);color:var(--hy-ink)}
.hy-win--term .hy-win__body .del{color:var(--hy-muted-2);text-decoration:line-through}
.hy-win--term .hy-win__body .add{color:var(--hy-accent-strong)}
.hy-layer-page__models{margin:0;padding:6px 18px;list-style:none}
.hy-layer-page__models li{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--hy-raise);font-size:15px;font-weight:500;color:var(--hy-ink)}
.hy-layer-page__models li:first-child{border-top:0}
.hy-layer-page__models .hy-mono{color:var(--hy-muted-2)}
.hy-layer-page__steps{margin:0;padding:0;list-style:none;max-width:560px}
.hy-layer-page__steps li{display:flex;align-items:center;gap:14px;padding:12px 0;border-top:1px solid var(--hy-raise);font-size:15px;color:var(--hy-ink-2)}
.hy-layer-page__steps li:first-child{border-top:0}
.hy-layer-page__step-no{display:inline-grid;place-items:center;width:28px;height:28px;flex:none;border-radius:var(--hy-r-ctl);background:var(--hy-raise);font:400 12px var(--hy-mono);color:var(--hy-ink)}
@media (max-width:900px){.hy-layer-page__pair{grid-template-columns:1fr}}

/* --- model card: <x-site.model-card> ------------------------------------ */
.hy-models{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;padding:2px;background:var(--hy-paper)}
.hy-model{display:grid;gap:14px;align-content:start;min-width:0;padding:18px 18px 16px;background:var(--hy-band);color:var(--hy-ink);transition:background-color .15s}
a.hy-model:hover{background:var(--hy-raise)}
.hy-model__hd{display:flex;align-items:center;gap:10px;min-width:0}
.hy-model__hd img{width:20px;height:20px;flex:none}
.hy-model__name{font-weight:500;font-size:15.5px;line-height:1.25;letter-spacing:-.02em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hy-model__rank{flex:none;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.hy-model__state{margin-left:auto;flex:none;display:inline-flex;align-items:center;gap:6px;font:400 11px var(--hy-mono);color:var(--hy-accent-hover)}
.hy-model__pub{margin-top:-8px;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.hy-model__stats{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:2px 22px;margin:0}
.hy-model__stats dt{font:400 10.5px var(--hy-mono);color:var(--hy-muted-2)}
.hy-model__stats dd{margin:0;font:400 12.5px var(--hy-mono);color:var(--hy-ink-2)}
.hy-model__badges{display:flex;flex-wrap:wrap;gap:4px}
@media (max-width:1180px){.hy-models{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.hy-models{grid-template-columns:1fr}}

/* --- maatje + Loes wink: <x-site.maatje>, <x-site.loes-wink> ------------- */
.hy-maatje{display:inline-block;flex:none;width:var(--hy-maatje,24px);line-height:0}
.hy-maatje svg{display:block;width:100%;height:auto;image-rendering:pixelated;shape-rendering:crispEdges}
.hy-loes-wink{display:inline-flex;align-items:flex-end;gap:12px;font-size:14px;line-height:1.4;color:var(--hy-muted)}
.hy-loes-wink b{font-weight:500;color:var(--hy-ink)}
a.hy-loes-wink:hover b{color:var(--hy-accent-strong)}

/* ===================================================================== */
/* 5. Prose: article text, also from seo_pages in the database           */
/* .prose-site is the long-form article, .prose-trust the compact legal    */
/* text. <x-site.prose-body> renders either; the class names stay because  */
/* templates and stored content already use them.                          */
/* ===================================================================== */
.prose-site,.prose-trust{color:var(--hy-muted);font-size:16px;line-height:1.7}
.prose-site>:first-child,.prose-trust>:first-child{margin-top:0!important}
/* a table that opens the prose keeps its card frame (5 Nov 2026) */
.prose-site>:first-child:not(.prose-table,.hy-table-wrap,table,.hy-win),.prose-trust>:first-child:not(.prose-table,.hy-table-wrap,table,.hy-win){padding-top:0!important;border-top:0!important}
.prose-site>:first-child::before{display:none!important}
.prose-site h2{position:relative;margin:2.4rem 0 .9rem;padding-top:1.6rem;border-top:1px solid var(--hy-line);color:var(--hy-ink);font-weight:500;font-size:28px;line-height:1.15;letter-spacing:-.03em;scroll-margin-top:calc(var(--hy-nav) + 32px)}
.prose-site h2::before{content:"";position:absolute;top:-1px;left:0;width:44px;height:2px;background:var(--hy-accent-strong)}
.prose-site h3{margin:1.6rem 0 .5rem;color:var(--hy-ink);font-weight:500;font-size:19px;letter-spacing:-.02em}
.prose-site p,.prose-site li{color:var(--hy-muted);font-size:16px;line-height:1.7}
.prose-site p{margin:0 0 1rem}
.prose-site ul{list-style:none;margin:1rem 0 1.4rem;padding:0}
.prose-site ul li{position:relative;margin-bottom:.5rem;padding-left:1.4rem}
.prose-site ul li::before{content:"";position:absolute;left:0;top:.66em;width:7px;height:7px;background:var(--hy-accent-strong)}
.prose-site ol{list-style:decimal;margin:1rem 0 1.4rem;padding-left:1.25rem}
.prose-site ol li::marker{font-family:var(--hy-mono);font-size:13px;color:var(--hy-muted-2)}
.prose-site a,.prose-trust a{color:var(--hy-accent-strong);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.prose-site a:hover,.prose-trust a:hover{color:var(--hy-accent-hover)}
.prose-site strong,.prose-site b,.prose-trust strong{color:var(--hy-ink);font-weight:500}
.prose-site code,.prose-trust code{padding:1px 6px;background:var(--hy-raise);color:var(--hy-ink-2);font-size:13px;font-family:var(--hy-mono)}
.prose-site pre,.prose-trust pre{margin:1.2rem 0;padding:14px 16px;overflow-x:auto;background:var(--hy-band);color:var(--hy-ink-2);font-size:12.5px;line-height:1.7}
.prose-site pre code,.prose-trust pre code{padding:0;background:none;color:inherit}
.prose-site blockquote{margin:1.4rem 0;padding:4px 0 4px 18px;border-left:2px solid var(--hy-accent-strong);color:var(--hy-ink-2)}
.prose-site hr{border:0;border-top:1px solid var(--hy-line);margin:2rem 0}
.prose-site img{height:auto}
.prose-site table,.prose-trust table{width:100%;margin:1.2rem 0;border-collapse:collapse;font-size:14px}
.prose-site th,.prose-site td,.prose-trust th,.prose-trust td{padding:10px 14px;border-top:1px solid var(--hy-raise);text-align:left;vertical-align:top;color:var(--hy-muted)}
.prose-site th,.prose-trust th{color:var(--hy-ink);font-weight:500;background:var(--hy-band)}
.prose-site thead th,.prose-trust thead th{border-top:0;font:400 11.5px/1.3 var(--hy-mono);color:var(--hy-muted-2)}
/* tables get a scrollable band frame (.prose-table is written by the SEO template) */
.prose-table{margin:1.4rem 0;overflow-x:auto;-webkit-overflow-scrolling:touch;background:var(--hy-band)}
.prose-site .prose-table table{margin:0}
.prose-site .prose-table th{background:var(--hy-raise)}
.prose-site .prose-table tbody tr:hover td{background:var(--hy-deep)}
/* compact legal text */
.prose-trust{font-size:14.5px}
.prose-trust h2{margin:2rem 0 .75rem;color:var(--hy-ink);font-weight:500;font-size:22px;letter-spacing:-.02em}
.prose-trust h3{margin:1.5rem 0 .5rem;color:var(--hy-ink);font-weight:500;font-size:16px}
.prose-trust p,.prose-trust li{color:var(--hy-muted);font-size:14.5px;line-height:1.7}
.prose-trust p{margin:0 0 .9rem}
.prose-trust ul{list-style:square;margin:0 0 .9rem;padding-left:1.25rem}
.prose-trust ul li::marker{color:var(--hy-accent-strong)}
.prose-trust ol{list-style:decimal;margin:0 0 .9rem;padding-left:1.25rem}
/* tight prose inside a feature row */
.prose-tight>:first-child{margin-top:0!important}
.prose-tight h2{border-top:0;padding-top:0;margin-top:0}
.prose-tight h2::before{display:none}
.prose-tight h3{margin-top:1.2rem}
.prose-tight h3:first-child{margin-top:0}
/* "On this page" outline */
.toc-box{margin-bottom:28px;padding:0 16px;background:var(--hy-band)}
.toc-box summary{display:flex;justify-content:space-between;align-items:center;padding:13px 0;list-style:none;cursor:pointer;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.toc-box summary::-webkit-details-marker{display:none}
.toc-box summary::after{content:"+";color:var(--hy-accent-strong);font-size:16px}
.toc-box[open] summary::after{content:"\2212"}
.toc-box ul{list-style:none;margin:0;padding:0 0 12px}
.toc-box ul li{margin:0;padding:0}
.toc-box ul li::before{display:none}
.toc-box a{display:block;padding:6px 0;font-size:14px;color:var(--hy-muted);text-decoration:none}
.toc-box a:hover{color:var(--hy-ink)}
/* FAQ accordion (native details) */
.faq-item{border-top:1px solid var(--hy-line)}
.faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;list-style:none;cursor:pointer;font-weight:500;font-size:16px;color:var(--hy-ink)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";flex:none;color:var(--hy-accent-strong);font:400 18px/1 var(--hy-mono)}
.faq-item[open] summary::after{content:"\2212"}
.faq-a{padding-bottom:16px}
.faq-a p,.faq-a li{color:var(--hy-muted)}
.faq-a>:first-child{margin-top:0}

@media (prefers-reduced-motion:reduce){
  .hy-btn,.hy-cmd,.hy-nav__panel,.hy-more svg,.hy-chev,.hy-layer,.hy-model{transition:none}
}

/* ===================================================================== */
/* 6. Page components: SEO templates                                     */
/*    seo/show and the 290 seo_pages: <x-site.hero>, feature, cards,     */
/*    stats, steps, cta, prose, seo-*, and the windows in partials/illus */
/* ===================================================================== */
/* --- hero: <x-site.hero> ------------------------------------------------ */
.hy-hero{padding:88px 0 var(--hy-hero-bottom,104px)}
.hy-hero__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:56px;align-items:center}
.hy-hero--media .hy-hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:72px}
.hy-hero__text{max-width:880px}
.hy-hero__eyebrow{margin-bottom:32px}
.hy-hero__title{margin:0;font-weight:500;font-size:var(--hy-t-h1);line-height:.98;letter-spacing:-.05em;color:var(--hy-ink)}
.hy-hero__title span{color:var(--hy-subtle)}
.hy-hero__sub{margin:24px 0 0;max-width:34em;font-size:19px;line-height:1.5;letter-spacing:-.015em;color:var(--hy-muted)}
.hy-hero__sub b,.hy-hero__sub strong{color:var(--hy-ink);font-weight:500}
.hy-hero__actions{margin-top:32px}
.hy-hero__media{min-width:0}
@media (max-width:1180px){
  .hy-hero--media .hy-hero__grid{grid-template-columns:1fr;gap:48px}
}
@media (max-width:720px){
  .hy-hero{padding-top:48px;--hy-hero-bottom:72px}
  .hy-hero__eyebrow{margin-bottom:24px}
  .hy-hero__sub{font-size:17px}
}

/* --- feature row: <x-site.feature> -------------------------------------- */
.hy-feature{padding:96px 0}
.hy-feature--band{background:var(--hy-band)}
.hy-feature__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.hy-feature--flip .hy-feature__text{order:2}
.hy-feature--flip .hy-feature__media{order:1}
.hy-feature__text{min-width:0}
.hy-feature__media{min-width:0}
.hy-feature__eyebrow{margin-bottom:20px}
.hy-feature__title{margin:0 0 20px;font-weight:500;font-size:clamp(28px,2.8vw,40px);line-height:1.05;letter-spacing:-.04em;color:var(--hy-ink)}
/* the window in a band row sits on cream, so it stays a step apart from the band */
.hy-feature--band .hy-feature__media .hy-win{background:var(--hy-paper)}
.hy-feature--band .hy-feature__media .hy-win__head{background:var(--hy-raise)}
.hy-feature--band .prose-site .prose-table,.hy-feature--band .prose-site pre{background:var(--hy-paper)}
.hy-feature--band .prose-site th{background:var(--hy-paper)}
.hy-feature--band .prose-site .prose-table th{background:var(--hy-raise)}
.hy-feature--band .prose-site code{background:var(--hy-raise)}
@media (max-width:1180px){
  .hy-feature__grid{grid-template-columns:1fr;gap:40px}
  .hy-feature--flip .hy-feature__text,.hy-feature--flip .hy-feature__media{order:0}
}
@media (max-width:720px){.hy-feature{padding:72px 0}}

/* --- article: the plain-article body of seo/show ------------------------ */
.hy-article{padding:88px 0 104px;border-top:1px solid var(--hy-line)}
.hy-article__figure{max-width:760px;margin:40px 0}
@media (max-width:720px){.hy-article{padding:56px 0 72px}}

/* --- prose section: <x-site.prose> -------------------------------------- */
.hy-prose-sec{padding:96px 0}
.hy-prose-sec__inner{max-width:768px;margin:0 auto}
.hy-prose-sec__head{margin-bottom:32px}
.hy-prose-sec__head .hy-label{margin-bottom:20px}
.hy-prose-sec__title{margin:0;font-weight:500;font-size:clamp(30px,3.2vw,44px);line-height:1.05;letter-spacing:-.04em;color:var(--hy-ink)}
.hy-prose-sec__body{padding:clamp(24px,4vw,44px);background:var(--hy-band)}

/* --- cards: <x-site.cards> ---------------------------------------------- */
.hy-cards{display:grid;grid-template-columns:repeat(var(--hy-cols,3),minmax(0,1fr));gap:12px}
.hy-cards--open{gap:32px}
.hy-card{display:flex;flex-direction:column;gap:10px;min-width:0;padding:24px;background:var(--hy-band);color:var(--hy-ink)}
.hy-section--band .hy-card{background:var(--hy-paper)}
a.hy-card{transition:background-color .15s var(--hy-ease)}
a.hy-card:hover{background:var(--hy-raise)}
.hy-cards--open .hy-card{padding:20px 0 0;background:none;border-top:1px solid var(--hy-line)}
.hy-cards--open a.hy-card:hover{background:none}
.hy-cards--open a.hy-card:hover .hy-card__title{color:var(--hy-accent-strong)}
.hy-card__icon{display:inline-grid;place-items:center;width:40px;height:40px;margin-bottom:8px;background:var(--hy-cream);color:var(--hy-accent-strong)}
.hy-section--band .hy-card__icon{background:var(--hy-band)}
.hy-card__icon svg{width:20px;height:20px}
.hy-card__title{margin:0;font-weight:500;font-size:17px;line-height:1.3;letter-spacing:-.02em;color:var(--hy-ink);transition:color .15s}
.hy-card__text{margin:0;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
.hy-card__text--clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hy-card__more{margin-top:auto;padding-top:6px;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--hy-ink)}
a.hy-card:hover .hy-card__more svg{transform:translateX(3px)}
.hy-card__more svg{transition:transform .15s var(--hy-ease)}
@media (max-width:1180px){.hy-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.hy-cards{grid-template-columns:1fr}.hy-cards--open{gap:24px}}

/* --- stats: <x-site.stats> ---------------------------------------------- */
.hy-stats{display:grid;grid-template-columns:repeat(var(--hy-cols,3),minmax(0,1fr));gap:12px}
.hy-stats--open{gap:32px}
.hy-stat{min-width:0;padding:28px 24px;background:var(--hy-band)}
.hy-stats--open .hy-stat{padding:22px 0 0;background:none;border-top:1px solid var(--hy-line)}
.hy-stat__num{display:block;font-weight:500;font-size:clamp(40px,4vw,56px);line-height:1;letter-spacing:-.045em;color:var(--hy-accent-strong);font-variant-numeric:tabular-nums}
.hy-stat__label{margin:14px 0 0;font-weight:500;font-size:17px;line-height:1.3;letter-spacing:-.02em;color:var(--hy-ink)}
.hy-stat__text{margin:8px 0 0;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
@media (max-width:1180px){.hy-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.hy-stats{grid-template-columns:1fr}}

/* --- steps: <x-site.steps> ---------------------------------------------- */
.hy-steps{display:grid;grid-template-columns:repeat(var(--hy-cols,3),minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.hy-steps--open{gap:32px}
.hy-step{min-width:0;padding:24px;background:var(--hy-band)}
.hy-section--band .hy-step,.hy-section--band .hy-stat{background:var(--hy-paper)}
.hy-section--band .hy-step__no{background:var(--hy-band)}
.hy-section--band .hy-step:first-child .hy-step__no{background:var(--hy-accent-strong)}
.hy-steps--open .hy-step{padding:22px 0 0;background:none;border-top:1px solid var(--hy-line)}
.hy-step__no{display:inline-grid;place-items:center;width:32px;height:32px;background:var(--hy-raise);font:400 12px var(--hy-mono);color:var(--hy-ink-2)}
.hy-step:first-child .hy-step__no{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-step__title{margin:20px 0 0;font-weight:500;font-size:19px;line-height:1.25;letter-spacing:-.025em;color:var(--hy-ink)}
.hy-step__text{margin:8px 0 0;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
@media (max-width:1180px){.hy-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.hy-steps{grid-template-columns:1fr}}

/* --- call to action: <x-site.cta> --------------------------------------- */
.hy-cta{padding:var(--hy-sec) 0 96px}
.hy-cta__box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:56px;align-items:center;padding:72px 64px;background:var(--hy-band)}
.hy-cta__title{margin:0;font-weight:500;font-size:var(--hy-t-h2);line-height:1;letter-spacing:-.045em;color:var(--hy-ink)}
.hy-cta__title span{color:var(--hy-subtle)}
.hy-cta__sub{margin:20px 0 0;max-width:34em;font-size:18px;line-height:1.5;color:var(--hy-muted)}
.hy-cta__actions{margin-top:28px}
.hy-cta__crew{display:grid;grid-template-columns:repeat(3,96px);gap:10px}
.hy-cta__bot{display:grid;place-items:center;aspect-ratio:1;background:var(--hy-raise)}
/* compact: a row inside a section (careers callout) */
.hy-cta--compact{padding:0}
.hy-people+.hy-cta--compact{margin-top:56px}
.hy-cta--compact .hy-cta__box{grid-template-columns:auto minmax(0,1fr) auto;gap:32px;padding:32px}
.hy-cta--compact .hy-cta__title{font-size:22px;line-height:1.25;letter-spacing:-.02em}
.hy-cta--compact .hy-cta__sub{margin-top:8px;font-size:15px}
.hy-cta--compact .hy-cta__actions{margin-top:0}
.hy-cta--compact .hy-cta__bot{width:64px}
.hy-section--band .hy-cta--compact .hy-cta__box{background:var(--hy-paper)}
@media (max-width:1180px){
  .hy-cta__box{grid-template-columns:1fr;gap:40px;padding:56px 40px}
  .hy-cta--compact .hy-cta__box{grid-template-columns:auto minmax(0,1fr);gap:24px}
  .hy-cta--compact .hy-cta__actions{grid-column:1/-1}
}
@media (max-width:720px){
  .hy-cta{padding-bottom:72px}
  .hy-cta__box{padding:40px 24px}
  .hy-cta__crew{grid-template-columns:repeat(3,72px)}
  .hy-cta--compact .hy-cta__box{grid-template-columns:1fr;padding:24px}
}

/* --- FAQ list: <x-site.seo-faq> ----------------------------------------- */
.hy-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;margin:0}
.hy-faq--single{grid-template-columns:minmax(0,1fr)}
.hy-faq--single .hy-faq__item:first-child{padding-top:0;border-top:0}
.hy-faq__item{padding:24px 0;border-top:1px solid var(--hy-line)}
.hy-faq__q{margin:0;font-weight:500;font-size:17px;line-height:1.35;letter-spacing:-.02em;color:var(--hy-ink)}
.hy-faq__a{margin:10px 0 0;font-size:15px;line-height:1.6;color:var(--hy-muted)}
@media (max-width:720px){.hy-faq{grid-template-columns:1fr}}

/* --- chips: <x-site.seo-chips> ------------------------------------------ */
.hy-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.hy-chip{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 14px;background:var(--hy-band);font-size:14.5px;font-weight:500;letter-spacing:-.015em;color:var(--hy-ink-2);transition:background-color .15s}
a.hy-chip:hover{background:var(--hy-raise)}
.hy-chip--accent{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
a.hy-chip--accent:hover{background:var(--hy-accent-hover)}
.hy-chip img{width:18px;height:18px;flex:none}

/* --- people: <x-site.seo-person> ---------------------------------------- */
.hy-people{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px 12px}
.hy-person{display:grid;gap:4px;align-content:start;min-width:0}
.hy-person__photo{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;margin-bottom:10px;background:var(--hy-raise)}
.hy-person__name{margin:0;font-weight:500;font-size:16px;letter-spacing:-.02em;color:var(--hy-ink)}
.hy-person__role{margin:0;font-size:14px;color:var(--hy-muted)}
.hy-person__links{display:flex;gap:14px;margin-top:6px;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.hy-person__links a{display:inline-flex;align-items:center;gap:6px}
.hy-person__links a:hover{color:var(--hy-accent-strong)}
.hy-person__links svg{width:14px;height:14px}
@media (max-width:1180px){.hy-people{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.hy-people{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* --- tool wall: partials/seo/integrations ------------------------------- */
.hy-tool{display:flex;align-items:center;gap:10px;min-width:0;height:56px;padding:0 16px;background:var(--hy-band);font-size:14px;font-weight:500;letter-spacing:-.015em;color:var(--hy-ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hy-tool img{width:20px;height:20px;flex:none}
.hy-tool--more{grid-column:span 2;font:400 12.5px var(--hy-mono);color:var(--hy-muted)}

/* --- trust labels: partials/seo/security -------------------------------- */
.hy-badges{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 48px;padding:0;list-style:none}
.hy-badges .hy-label svg{width:14px;height:14px;color:var(--hy-accent-strong)}

/* --- map window: the company page ---------------------------------------- */
.hy-map{display:block;width:100%;height:360px;border:0;background:var(--hy-raise)}
.hy-map-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;width:100%}
.hy-map-foot a{color:var(--hy-ink-2)}
.hy-map-foot a:hover{color:var(--hy-accent-strong)}

/* ===================================================================== */
/* Illustrations (partials/illus): product windows, never pictures       */
/* ===================================================================== */
.hy-illus{font-size:13.5px;color:var(--hy-ink-2)}
.hy-illus .hy-win__body--pad{padding:22px 20px}
/* checklist */
.hy-check-list{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.hy-check-list li{display:flex;align-items:flex-start;gap:12px;font-size:14.5px;line-height:1.4;color:var(--hy-ink-2)}
.hy-check-list .hy-tick{display:inline-grid;place-items:center;width:20px;height:20px;flex:none;background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-check-list .hy-tick svg{width:12px;height:12px}
.hy-check-list small{display:block;margin-top:2px;font-size:12.5px;color:var(--hy-muted)}
/* meters (gpu, embeddings) */
.hy-illus__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.hy-illus__name{font-weight:500;font-size:16px;letter-spacing:-.02em;color:var(--hy-ink)}
.hy-illus__meta{margin-bottom:18px;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}

/* ===================================================================== */
/* 7. Page components: commerce                                          */
/*    pricing, savings, GPU pool, FAQ: <x-site.commerce-*>, the savings  */
/*    check (sv-*) and the pricing calculator (rk-*), also written by JS */
/* ===================================================================== */
/* --- page hero: <x-site.commerce-hero> ----------------------------------- */
.hy-cm-hero{padding:88px 0 96px}
.hy-cm-hero__grid{display:grid;grid-template-columns:minmax(0,640px) minmax(0,1fr);gap:72px;align-items:end}
.hy-cm-hero__grid--solo{grid-template-columns:minmax(0,880px)}
.hy-cm-hero__eyebrow{margin-bottom:28px}
.hy-cm-hero__title{margin:0;font-weight:500;font-size:var(--hy-t-display);line-height:1;letter-spacing:-.05em;color:var(--hy-ink)}
.hy-cm-hero__title span{color:var(--hy-subtle)}
.hy-cm-hero--long .hy-cm-hero__title{font-size:var(--hy-t-h1);line-height:1.02;letter-spacing:-.045em}
.hy-cm-hero__lead{margin:28px 0 0;max-width:32em;font-size:20px;line-height:1.45;letter-spacing:-.015em;color:var(--hy-muted)}
.hy-cm-hero__lead b,.hy-cm-hero__lead strong{color:var(--hy-ink);font-weight:500}
.hy-cm-hero__body{margin-top:18px;max-width:40em}
.hy-cm-hero__body p{margin:0 0 12px;font-size:16px;line-height:1.6;color:var(--hy-muted)}
.hy-cm-hero__actions{margin-top:36px}
.hy-cm-hero__note{margin:18px 0 0;font-size:14px;color:var(--hy-muted-2)}
.hy-cm-hero__aside{min-width:0}
.hy-cm-hero__below{margin-top:56px}
@media (max-width:1180px){.hy-cm-hero__grid{grid-template-columns:1fr;gap:48px}}
@media (max-width:720px){.hy-cm-hero{padding:48px 0 64px}.hy-cm-hero__lead{font-size:18px}.hy-cm-hero__below{margin-top:36px}}

/* --- figures: <x-site.commerce-figures> ---------------------------------- */
.hy-cm-figs{display:grid;grid-template-columns:repeat(var(--hy-cm-cols,3),minmax(0,1fr));gap:12px}
.hy-cm-fig{min-width:0;padding:22px 22px 20px;background:var(--hy-band)}
.hy-cm-figs--open .hy-cm-fig{padding:20px 0 0;background:none;border-top:1px solid var(--hy-line)}
.hy-cm-fig__label{margin:0;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.hy-cm-fig__value{margin:10px 0 0;font-weight:500;font-size:clamp(30px,3vw,40px);line-height:1;letter-spacing:-.035em;color:var(--hy-ink);font-variant-numeric:tabular-nums}
.hy-cm-fig__value.is-accent{color:var(--hy-accent-strong)}
.hy-cm-fig__unit{margin:6px 0 0;font-size:13px;color:var(--hy-muted)}
.hy-cm-fig__title{margin:14px 0 0;font-weight:500;font-size:17px;line-height:1.3;letter-spacing:-.02em;color:var(--hy-ink)}
.hy-cm-fig__note{margin:8px 0 0;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
@media (max-width:1180px){.hy-cm-figs{grid-template-columns:repeat(min(var(--hy-cm-cols,3),2),minmax(0,1fr))}}
@media (max-width:560px){.hy-cm-figs{grid-template-columns:1fr}.hy-cm-figs--tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* --- plan card: <x-site.commerce-plan> ----------------------------------- */
.hy-cm-plans{display:grid;grid-template-columns:repeat(var(--hy-cm-cols,4),minmax(0,1fr));gap:12px}
.hy-cm-plans--2{--hy-cm-cols:2}
.hy-cm-plans--3{--hy-cm-cols:3}
.hy-cm-plan{display:flex;flex-direction:column;gap:14px;min-width:0;padding:24px 24px 22px;background:var(--hy-band);color:var(--hy-ink)}
a.hy-cm-plan{transition:background-color .15s}
a.hy-cm-plan:hover{background:var(--hy-raise)}
.hy-cm-plan__top{display:flex;align-items:center;gap:12px;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.hy-cm-plan__num{display:inline-grid;place-items:center;width:32px;height:32px;background:var(--hy-cream);color:var(--hy-muted)}
.hy-cm-plan.is-on .hy-cm-plan__num{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.hy-cm-plan__title{margin:0;font-weight:500;font-size:21px;line-height:1.2;letter-spacing:-.025em;color:var(--hy-ink)}
.hy-cm-plan__text{margin:0;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
.hy-cm-plan__price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:0;padding:12px 0 0;border-top:1px solid var(--hy-line)}
.hy-cm-plan__price b{font-weight:500;font-size:24px;letter-spacing:-.03em;color:var(--hy-ink);font-variant-numeric:tabular-nums}
.hy-cm-plan__price span{font-size:13px;color:var(--hy-muted)}
.hy-cm-plan__foot{margin-top:auto;padding-top:6px}
.hy-cm-plan__more{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500}
.hy-cm-plan__more svg{transition:transform .15s var(--hy-ease)}
a.hy-cm-plan:hover .hy-cm-plan__more svg{transform:translateX(3px)}
@media (max-width:1180px){.hy-cm-plans{grid-template-columns:repeat(min(var(--hy-cm-cols,4),2),minmax(0,1fr))}}
@media (max-width:720px){.hy-cm-plans{grid-template-columns:1fr}}

/* On a band section every surface steps up one: cards become cream, gaps become band. */
.hy-section--band .hy-cm-fig:not(.hy-cm-figs--open .hy-cm-fig),.hy-section--band .hy-cm-plan,.hy-section--band .hy-cm-step__head,.hy-section--band .hy-cm-step__body,.hy-section--band .hy-cm-panel,.hy-section--band .hy-cm-jump a,.hy-section--band .sv-case,.hy-section--band .sv-when-card{background:var(--hy-cream)}
.hy-section--band .hy-cm-steps{background:var(--hy-band)}
.hy-section--band .hy-cm-step__num,.hy-section--band .hy-cm-plan__num{background:var(--hy-band)}
.hy-section--band a.hy-cm-plan:hover,.hy-section--band .sv-case:hover,.hy-section--band .hy-cm-jump a:hover{background:var(--hy-raise)}
.hy-section--band .sv-case.on{background:var(--hy-accent-strong)}

/* --- checklist: <x-site.commerce-checks> --------------------------------- */
.hy-cm-checks{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.hy-cm-checks li{display:grid;grid-template-columns:16px minmax(0,1fr);gap:12px;align-items:start;margin:0;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
.hy-cm-checks li svg{margin-top:3px;color:var(--hy-accent-strong)}
.hy-cm-checks li b{color:var(--hy-ink);font-weight:500}
.hy-cm-checks--lg li{font-size:16px}
.hy-cm-checks--cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 40px}
@media (max-width:720px){.hy-cm-checks--cols{grid-template-columns:1fr}}

/* --- steps: <x-site.commerce-steps> -------------------------------------- */
.hy-cm-steps{display:grid;gap:2px;margin:0;padding:2px;list-style:none;background:var(--hy-paper)}
.hy-cm-step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:2px;margin:0}
.hy-cm-step__head{display:flex;align-items:center;gap:14px;padding:18px 20px;background:var(--hy-band)}
.hy-cm-step__num{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;background:var(--hy-cream);font:400 12px var(--hy-mono);color:var(--hy-accent-strong)}
.hy-cm-step__label{font-weight:500;font-size:16px;letter-spacing:-.015em;color:var(--hy-ink)}
.hy-cm-step__body{padding:18px 20px;background:var(--hy-band)}
.hy-cm-step__title{margin:0 0 6px;font-weight:500;font-size:16.5px;line-height:1.3;letter-spacing:-.015em;color:var(--hy-ink)}
.hy-cm-step__body p{margin:0;font-size:14.5px;line-height:1.6;color:var(--hy-muted)}
@media (max-width:720px){.hy-cm-step{grid-template-columns:1fr}}

/* --- flow: <x-site.commerce-flow> ---------------------------------------- */
.hy-cm-flowfig{margin:0}
.hy-cm-flow{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr) 56px minmax(0,1.15fr);align-items:center;padding:clamp(20px,3.4vw,48px);background:var(--hy-cream)}
.hy-cm-flow__node{min-width:0;padding:14px 16px;background:var(--hy-band)}
.hy-cm-flow__node.is-hub{background:var(--hy-raise)}
.hy-cm-flow__t{display:flex;align-items:center;gap:10px;font-weight:500;font-size:14.5px;letter-spacing:-.015em;color:var(--hy-ink)}
.hy-cm-flow__s{margin:5px 0 0 17px;font-size:12.5px;line-height:1.45;color:var(--hy-muted)}
.hy-cm-flow__t .hy-badge{margin-left:auto}
.hy-cm-flow__link{position:relative;height:1px;background:var(--hy-graphic)}
.hy-cm-flow__link span{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);font:400 10.5px var(--hy-mono);color:var(--hy-muted-2);white-space:nowrap}
.hy-cm-flow__fork{position:relative;align-self:stretch}
.hy-cm-flow__fork::before{content:"";position:absolute;left:0;top:50%;width:50%;height:1px;background:var(--hy-graphic)}
.hy-cm-flow__fork::after{content:"";position:absolute;left:50%;width:1px;top:calc((100% - 28px) / 6);bottom:calc((100% - 28px) / 6);background:var(--hy-graphic)}
.hy-cm-flow__targets{display:grid;grid-auto-rows:1fr;gap:14px}
.hy-cm-flow[data-n="2"] .hy-cm-flow__fork::after{top:calc((100% - 14px) / 4);bottom:calc((100% - 14px) / 4)}
.hy-cm-flow[data-n="1"] .hy-cm-flow__fork::after{display:none}
.hy-cm-flow__targets .hy-cm-flow__node{position:relative;display:flex;flex-direction:column;justify-content:center}
.hy-cm-flow__targets .hy-cm-flow__node::before{content:"";position:absolute;right:100%;top:50%;width:28px;height:1px;background:var(--hy-graphic)}
.hy-cm-flow-cap{margin:14px 0 0;font-size:13px;color:var(--hy-muted)}
@media (max-width:900px){
  .hy-cm-flow{grid-template-columns:1fr;justify-items:stretch}
  .hy-cm-flow__link,.hy-cm-flow__fork{justify-self:start;width:1px;height:28px;margin-left:20px;background:var(--hy-graphic)}
  .hy-cm-flow__link span{left:14px;bottom:auto;top:50%;transform:translateY(-50%)}
  .hy-cm-flow__fork::before,.hy-cm-flow__fork::after,.hy-cm-flow__targets .hy-cm-flow__node::before{display:none}
  .hy-cm-flow__targets{gap:8px}
}

/* --- panels and copy: <x-site.commerce-panel> ---------------------------- */
.hy-cm-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hy-cm-panel{min-width:0;padding:clamp(22px,3vw,36px);background:var(--hy-band)}
.hy-cm-panel__label{display:block;margin-bottom:16px;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.hy-cm-panel__title{margin:0 0 14px;font-weight:500;font-size:clamp(21px,2vw,26px);line-height:1.2;letter-spacing:-.025em;color:var(--hy-ink)}
@media (max-width:900px){.hy-cm-panels{grid-template-columns:1fr}}

.hy-cm-copy{max-width:60em}
.hy-cm-copy>*{margin-top:0;margin-bottom:0}
.hy-cm-copy>*+*{margin-top:14px}
.hy-cm-copy p,.hy-cm-copy li{font-size:15.5px;line-height:1.65;color:var(--hy-muted)}
.hy-cm-copy li{margin:0}
.hy-cm-copy p b,.hy-cm-copy p strong,.hy-cm-copy li b,.hy-cm-copy li strong{color:var(--hy-ink);font-weight:500}
.hy-cm-copy ul{display:grid;gap:8px;margin:0;padding-left:1.15rem;list-style:square}
.hy-cm-copy ul li::marker{color:var(--hy-accent-strong)}
.hy-cm-copy a,.hy-cm-fine a,.hy-cm-faq .faq-a a{color:var(--hy-accent-strong);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.hy-cm-copy a:hover,.hy-cm-fine a:hover,.hy-cm-faq .faq-a a:hover{color:var(--hy-accent-hover)}
.hy-cm-copy code,.hy-cm-faq .faq-a code{padding:1px 6px;background:var(--hy-raise);color:var(--hy-ink-2);font:400 .88em var(--hy-mono)}
.hy-cm-copy>h2,.hy-cm-copy h2{margin:56px 0 0;font-weight:500;font-size:clamp(24px,2.4vw,30px);line-height:1.15;letter-spacing:-.03em;color:var(--hy-ink)}
.hy-cm-copy>h3,.hy-cm-copy h3{margin:36px 0 0;font-weight:500;font-size:18px;line-height:1.3;letter-spacing:-.02em;color:var(--hy-ink)}
.hy-cm-copy .hy-table-wrap{margin-top:14px}
.hy-cm-copy .hy-table td,.hy-cm-copy .hy-table th{white-space:nowrap}
.hy-cm-panel .hy-cm-copy p,.hy-cm-panel .hy-cm-copy li{font-size:14.5px}
.hy-cm-fine,.hy-cm-copy .hy-cm-fine{margin:12px 0 0;max-width:62em;font-size:13px;line-height:1.6;color:var(--hy-muted-2)}
.hy-cm-fine b,.hy-cm-fine strong{color:var(--hy-ink-2);font-weight:500}
.hy-cm-callout{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:20px;padding:18px 20px;background:var(--hy-band)}
.hy-cm-callout p{margin:0;max-width:52em;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
.hy-cm-callout p b{color:var(--hy-ink);font-weight:500}

/* --- split section: <x-site.commerce-split> ------------------------------ */
.hy-cm-split{scroll-margin-top:calc(var(--hy-nav) + 8px)}
.hy-cm-split__grid{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:64px;align-items:start}
.hy-cm-split__head{position:sticky;top:calc(var(--hy-nav) + 32px)}
.hy-cm-split__head .hy-label{margin-bottom:20px}
.hy-cm-split__title{margin:0;font-weight:500;font-size:clamp(28px,2.8vw,40px);line-height:1.05;letter-spacing:-.04em;color:var(--hy-ink)}
.hy-cm-split__title span{color:var(--hy-subtle)}
.hy-cm-split__sub{margin:14px 0 0;font-size:16px;line-height:1.55;color:var(--hy-muted)}
.hy-cm-split__body{min-width:0}
.hy-cm-split__body>.hy-cm-faq{max-width:none}
@media (max-width:1180px){.hy-cm-split__grid{grid-template-columns:1fr;gap:28px}.hy-cm-split__head{position:static}}

/* --- jump links (FAQ index) --------------------------------------------- */
.hy-cm-jump{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.hy-cm-jump a{display:inline-flex;align-items:center;height:34px;padding:0 12px;background:var(--hy-band);font-size:14px;color:var(--hy-ink-2);transition:background-color .15s}
.hy-cm-jump a:hover{background:var(--hy-raise)}
.hy-cm-jump__head{margin:0 0 12px;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}

/* --- FAQ list: <x-site.commerce-faq> -------------------------------------- */
.hy-cm-faq{max-width:880px;border-bottom:1px solid var(--hy-line)}
.hy-cm-faq .faq-a p{margin:0;max-width:46em;font-size:15px;line-height:1.7}
.hy-cm-faq-group{scroll-margin-top:calc(var(--hy-nav) + 24px)}
.hy-cm-faq-group .hy-section__head{margin-bottom:24px}

/* --- closing call to action: <x-site.commerce-cta> ----------------------- */
.hy-cm-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 64px;align-items:end;padding:clamp(28px,5vw,64px);background:var(--hy-band)}
.hy-cm-cta__title{margin:0;font-weight:500;font-size:var(--hy-t-h2);line-height:.98;letter-spacing:-.045em;color:var(--hy-ink)}
.hy-cm-cta__title span{color:var(--hy-subtle)}
.hy-cm-cta__text{margin:16px 0 0;max-width:36em;font-size:17px;line-height:1.55;color:var(--hy-muted)}
@media (max-width:900px){.hy-cm-cta{grid-template-columns:1fr}}

/* --- mono chips row (hero trust line) ------------------------------------ */
.hy-cm-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.hy-cm-chips li{margin:0}

/* ===================================================================== */
/* Savings check (savings.blade.php). The script writes sv-* markup too.  */
/* ===================================================================== */
.sv-check{scroll-margin-top:calc(var(--hy-nav) + 20px)}
.sv-chips{margin-top:16px}
.sv-intro{margin-bottom:18px}
.sv-intro h3{margin:0;font-weight:500;font-size:18px;letter-spacing:-.02em;color:var(--hy-ink)}
.sv-intro p{margin:6px 0 0;max-width:52em;font-size:14px;line-height:1.55;color:var(--hy-muted)}
.sv-tabs[role=tablist]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;margin-bottom:16px;padding:2px;background:var(--hy-raise)}
.sv-tab{height:38px;padding:0 12px;background:none;border:0;font:500 14px var(--hy-font);color:var(--hy-muted);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .15s,background-color .15s}
.sv-tab:hover{color:var(--hy-ink)}
.sv-tab.on{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
@media (max-width:640px){.sv-tabs[role=tablist]{grid-template-columns:1fr}}
.sv-form{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:10px;align-items:end}
.sv-grid{display:grid;grid-template-columns:140px 1.3fr 1fr 1fr 1fr 1fr;gap:10px;align-items:end}
.sv-grid.sub{grid-template-columns:1.4fr 1.2fr .8fr 1fr auto}
@media (max-width:760px){.sv-grid,.sv-grid.sub{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.sv-form{grid-template-columns:1fr}}
.sv-form label,.sv-grid label{display:block;margin-bottom:6px;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.sv-form select,.sv-form input,.sv-grid select,.sv-grid input{width:100%;height:44px;padding:0 12px;background:var(--hy-cream);border:0;font:400 14px var(--hy-font);color:var(--hy-ink)}
.sv-form input#sv-key{font:400 13px var(--hy-mono)}
.sv-form select,.sv-grid select{appearance:none;-webkit-appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23554D42' stroke-width='1.6'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:18px}
.sv-form select:focus,.sv-form input:focus,.sv-grid select:focus,.sv-grid input:focus{outline:2px solid var(--hy-accent-strong);outline-offset:-2px}
.sv-add{padding:8px 0;background:none;border:0;font:500 14px var(--hy-font);color:var(--hy-accent-strong);cursor:pointer}
.sv-add:hover{color:var(--hy-accent-hover)}
.sv-hint{margin:8px 0 0;font-size:12.5px;line-height:1.55;color:var(--hy-muted)}
.sv-submit{margin-top:12px}
.sv-help{margin-top:14px}
.sv-help summary{display:inline-flex;align-items:center;gap:8px;list-style:none;cursor:pointer;font-size:14px;font-weight:500;color:var(--hy-accent-strong)}
.sv-help summary::-webkit-details-marker{display:none}
.sv-help summary::after{content:"+";font:400 15px/1 var(--hy-mono)}
.sv-help[open] summary::after{content:"\2212"}
.sv-help__body{margin-top:10px;max-width:56em}
.sv-help__body p{margin:0 0 6px;font-size:13.5px;line-height:1.6;color:var(--hy-muted)}
.sv-help__body b{color:var(--hy-ink);font-weight:500}
.sv-err{margin:12px 0 0;font-size:13.5px;color:var(--hy-muted)}
.sv-report{margin-top:28px}
.sv-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;padding:2px;background:var(--hy-band)}
.sv-tiles.two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){.sv-tiles,.sv-tiles.two{grid-template-columns:1fr}}
.sv-tile{position:relative;padding:16px 18px;background:var(--hy-cream);text-align:left}
.sv-tile.win::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--hy-accent-strong)}
.sv-k{font:400 11px var(--hy-mono);color:var(--hy-muted-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sv-v{margin-top:6px;font-weight:500;font-size:28px;letter-spacing:-.03em;color:var(--hy-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.sv-s{margin-top:4px;font-size:12.5px;color:var(--hy-muted)}
.sv-s.win{color:var(--hy-accent-strong);font-weight:500}
.sv-row{display:grid;grid-template-columns:1.4fr 1.4fr 1fr 1fr;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--hy-line);font-size:13.5px;color:var(--hy-muted)}
.sv-row:first-of-type{border-top:0}
.sv-row b{color:var(--hy-ink);font-weight:500}
.sv-row .r{text-align:right}
.sv-row .pct{color:var(--hy-accent-strong);font-weight:500}
@media (max-width:640px){.sv-row{grid-template-columns:1fr 1fr}.sv-row .r{text-align:left}}
.sv-table{width:100%;margin-top:14px;border-collapse:collapse;font-size:13.5px}
.sv-table th{padding:8px 6px;border-bottom:1px solid var(--hy-line);text-align:left;font:400 11px var(--hy-mono);color:var(--hy-muted-2);white-space:nowrap}
.sv-table td{padding:8px 6px;border-bottom:1px solid var(--hy-line);color:var(--hy-muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.sv-table tbody tr:last-child td{border-bottom:0}
.sv-table td b{color:var(--hy-ink);font-weight:500}
.sv-table .r{text-align:right;white-space:nowrap}
.sv-table .pct{color:var(--hy-accent-strong);font-weight:500}
.sv-table .pct.neg{color:var(--hy-muted)}
.sv-warn{margin-top:10px;font-size:12.5px;color:var(--hy-muted)}
.sv-trust{display:flex;gap:10px;align-items:flex-start;padding:10px 0;font-size:14px;color:var(--hy-muted)}
.sv-trust .ok{flex:none;margin-top:3px;color:var(--hy-accent-strong)}
.sv-part{font-size:12px;color:var(--hy-muted)}
.sv-note{margin:10px 0 0;font-size:12.5px;line-height:1.55;color:var(--hy-muted)}
.sv-note--tight{margin-top:4px}
.sv-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.sv-alt-title{margin:26px 0 0;font-weight:500;font-size:16px;letter-spacing:-.015em;color:var(--hy-ink)}
.sv-keep{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:16px}
.sv-keep__text{font-size:14px;color:var(--hy-ink)}
.sv-trust-list{margin-top:28px}
.sv-how-actions{margin-top:28px}
.sv-when-body a{color:var(--hy-accent-strong);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
/* example cases */
.sv-cases{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:1180px){.sv-cases{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.sv-cases{grid-template-columns:1fr}}
.sv-case{display:flex;flex-direction:column;gap:6px;min-width:0;padding:18px 18px 16px;background:var(--hy-band);border:0;text-align:left;font:inherit;color:var(--hy-ink);cursor:pointer;transition:background-color .15s,color .15s}
.sv-case:hover{background:var(--hy-raise)}
.sv-case:focus-visible{outline:2px solid var(--hy-accent-strong);outline-offset:2px}
.sv-case-t{font-weight:500;font-size:15px;letter-spacing:-.015em}
.sv-case-s{min-height:2.6em;font-size:13px;line-height:1.45;color:var(--hy-muted)}
.sv-case-pct{margin-top:6px;font-weight:500;font-size:26px;letter-spacing:-.03em;color:var(--hy-accent-strong);font-variant-numeric:tabular-nums}
.sv-case-pct.neg{color:var(--hy-muted)}
.sv-case-n{font-size:13px;line-height:1.5;color:var(--hy-muted);font-variant-numeric:tabular-nums}
.sv-case-n b{color:var(--hy-ink);font-weight:500}
.sv-case-n small{font-size:12px}
.sv-case-go{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:10px;font-size:13px;font-weight:500;color:var(--hy-accent-strong)}
.sv-case.on{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.sv-case.on .sv-case-s,.sv-case.on .sv-case-n,.sv-case.on .sv-case-n b,.sv-case.on .sv-case-pct,.sv-case.on .sv-case-go{color:var(--hy-on-accent)}
/* when cards */
.sv-when{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:1000px){.sv-when{grid-template-columns:1fr}}
.sv-when-card{display:flex;flex-direction:column;min-width:0;padding:24px;background:var(--hy-band)}
.sv-when-card h3{display:flex;align-items:center;gap:10px;min-height:2.6em;margin:0;font-weight:500;font-size:17px;line-height:1.3;letter-spacing:-.02em;color:var(--hy-ink)}
.sv-when-body{margin-top:8px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden}
.sv-when-body p{margin:0 0 8px;font-size:14.5px;line-height:1.6;color:var(--hy-muted)}
.sv-when-card.open .sv-when-body,.sv-when-body.fits{display:block;-webkit-line-clamp:unset}
.sv-more{align-self:flex-start;margin-top:auto;padding:10px 0 0;background:none;border:0;font:500 14px var(--hy-font);color:var(--hy-accent-strong);cursor:pointer;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.sv-more[hidden]{display:none}
@media print{.hy-nav,.hy-footer,.no-print{display:none!important}.sv-report{margin:0}}

/* ===================================================================== */
/* Pricing calculator (partials/kostenrekenmodule). Styling only; the     */
/* script and its ids are unchanged.                                      */
/* ===================================================================== */
.rk-calc{--rk-gap:18px;margin:20px 0 8px;padding:clamp(18px,2.6vw,28px);background:var(--hy-band)}
.rk-controls{display:grid;grid-template-columns:1fr;gap:var(--rk-gap)}
@media (min-width:760px){.rk-controls{grid-template-columns:minmax(0,1.5fr) 110px minmax(0,1.5fr);align-items:start}}
.rk-label{display:block;margin-bottom:7px;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.rk-select,.rk-input{width:100%;height:44px;padding:0 12px;background:var(--hy-cream);border:0;font:400 14.5px var(--hy-font);color:var(--hy-ink);font-variant-numeric:tabular-nums}
.rk-select{appearance:none;-webkit-appearance:none;padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--hy-muted) 50%),linear-gradient(135deg,var(--hy-muted) 50%,transparent 50%);background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.rk-range:focus-visible,.rk-pill:focus-visible{outline:2px solid var(--hy-accent-strong);outline-offset:2px}
.rk-pills{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:2px;padding:2px;background:var(--hy-raise)}
.rk-pill{padding:8px 12px;background:none;border:0;font:500 13px/1.25 var(--hy-font);color:var(--hy-muted);text-align:left;cursor:pointer;transition:color .15s,background-color .15s}
.rk-pill:hover{color:var(--hy-ink)}
.rk-pill[aria-pressed="true"]{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.rk-pill small{display:block;margin-top:2px;font:400 11px var(--hy-mono);color:var(--hy-muted-2);font-variant-numeric:tabular-nums}
.rk-pill[aria-pressed="true"] small{color:var(--hy-on-accent)}
.rk-volume{margin-top:22px;padding-top:18px;border-top:1px solid var(--hy-line)}
.rk-volume-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px}
.rk-volume-head .rk-label{margin-bottom:0}
.rk-out{display:block;font-weight:500;font-size:19px;letter-spacing:-.02em;color:var(--hy-ink);font-variant-numeric:tabular-nums}
.rk-range{width:100%;height:26px;margin:8px 0 0;background:transparent;appearance:none;-webkit-appearance:none;cursor:pointer}
.rk-range::-webkit-slider-runnable-track{height:4px;background:var(--hy-faint)}
.rk-range::-moz-range-track{height:4px;background:var(--hy-faint)}
.rk-range::-moz-range-progress{height:4px;background:var(--hy-accent)}
.rk-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;margin-top:-7px;background:var(--hy-accent-strong);border:0}
.rk-range::-moz-range-thumb{width:18px;height:18px;background:var(--hy-accent-strong);border:0;border-radius:0}
.rk-scale{display:flex;justify-content:space-between;margin-top:4px;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.rk-cards{display:grid;grid-template-columns:1fr;gap:2px;margin-top:22px;padding:2px;background:var(--hy-raise)}
@media (min-width:560px){.rk-cards{grid-template-columns:1fr 1fr}}
.rk-card{position:relative;padding:16px 18px;background:var(--hy-cream)}
.rk-card-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 8px;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.rk-badge{display:inline-flex;align-items:center;height:20px;padding:0 7px;background:var(--hy-accent-strong);color:var(--hy-on-accent);font:400 11px var(--hy-mono);white-space:nowrap}
.rk-card[data-winner="0"] .rk-badge{visibility:hidden}
.rk-amount{margin-top:8px;font-weight:500;font-size:29px;line-height:1.15;letter-spacing:-.03em;color:var(--hy-ink);font-variant-numeric:tabular-nums}
.rk-amount span{font-size:14px;font-weight:400;letter-spacing:0;color:var(--hy-muted)}
.rk-bar{height:6px;margin-top:12px;overflow:hidden;background:var(--hy-raise)}
.rk-bar i{display:block;height:100%;background:var(--hy-accent);transition:width .28s var(--hy-ease)}
.rk-sub{margin-top:9px;font-size:12.5px;line-height:1.55;color:var(--hy-muted)}
.rk-verdict{margin-top:20px;padding-top:18px;border-top:1px solid var(--hy-line)}
.rk-verdict-main{font-weight:500;font-size:17px;line-height:1.5;letter-spacing:-.015em;color:var(--hy-ink);text-wrap:pretty}
.rk-verdict-sub{margin-top:7px;font-size:14px;line-height:1.6;color:var(--hy-muted);text-wrap:pretty}
.rk-team-line{margin-top:10px;font-size:14px;line-height:1.6;color:var(--hy-muted);text-wrap:pretty}
.rk-team-line b{color:var(--hy-ink);font-weight:500}
.rk-details{margin-top:18px;border-top:1px solid var(--hy-line)}
.rk-details summary{display:flex;align-items:center;justify-content:space-between;padding:14px 0 4px;list-style:none;cursor:pointer;font-size:14px;font-weight:500;color:var(--hy-ink)}
.rk-details summary::-webkit-details-marker{display:none}
.rk-details summary::after{content:"+";font:400 16px/1 var(--hy-mono);color:var(--hy-ink)}
.rk-details[open] summary::after{content:"\2212"}
.rk-notes{display:grid;gap:9px;margin-top:10px}
.rk-note{display:flex;gap:10px;font-size:12.5px;line-height:1.6;color:var(--hy-muted)}
.rk-note b{color:var(--hy-ink);font-weight:500}
.rk-note a{color:var(--hy-accent-strong);text-decoration:underline;text-underline-offset:3px}
.rk-note::before{content:"";flex:none;width:5px;height:5px;border-radius:var(--hy-r-dot);margin-top:8px;background:var(--hy-muted)}
.rk-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media (prefers-reduced-motion:reduce){
  a.hy-cm-plan,.hy-cm-plan__more svg,.hy-cm-jump a,.sv-case,.sv-tab,.rk-pill,.rk-bar i{transition:none}
}

/* ===================================================================== */
/* 8. Page components: content                                           */
/*    news, contact, careers, legal extras, error pages: <x-site.content-*> */
/* ===================================================================== */

/* --- card grid + news card: <x-site.content-card-grid>, <x-site.content-news-card> */
.hy-ncards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:dense;gap:2px;padding:2px;background:var(--hy-paper)}
.hy-ncards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.hy-clamp-2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.hy-is-paged{display:none!important}
@media (max-width:1180px){.hy-ncards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.hy-ncards,.hy-ncards--2{grid-template-columns:minmax(0,1fr)}}

/* --- panel: <x-site.content-panel> --------------------------------------- */
.hy-panel{min-width:0;padding:clamp(20px,3vw,32px);background:var(--hy-band);color:var(--hy-ink)}
.hy-panel--cream{background:var(--hy-cream)}
.hy-panel--rule{border-left:2px solid var(--hy-accent-strong)}
.hy-panel__label{margin-bottom:16px}
.hy-panel__title{margin:0 0 12px;font-weight:500;font-size:21px;line-height:1.25;letter-spacing:-.025em;color:var(--hy-ink)}
.hy-panel__text{margin:0;font-size:15px;line-height:1.6;color:var(--hy-muted)}
.hy-panel>:last-child{margin-bottom:0}

/* --- form field: <x-site.content-field> ---------------------------------- */
.hy-form{display:grid;gap:18px}
.hy-form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:720px){.hy-form__row{grid-template-columns:1fr}}
.hy-field{display:grid;gap:8px;min-width:0}
.hy-field__label{font:400 12px/1.3 var(--hy-mono);color:var(--hy-muted-2)}
.hy-field__control{width:100%;min-height:44px;padding:11px 14px;background:var(--hy-cream);border:0;outline:1px solid var(--hy-line);outline-offset:-1px;color:var(--hy-ink);font:400 15px/1.45 var(--hy-font)}
.hy-field__control::placeholder{color:var(--hy-graphic);opacity:1}
.hy-field__control:focus{outline:2px solid var(--hy-accent-strong);outline-offset:-2px}
textarea.hy-field__control{resize:vertical;min-height:132px}
.hy-field--invalid .hy-field__control{outline:2px solid var(--hy-danger);outline-offset:-2px}
.hy-field__error{margin:0;font-size:12.5px;color:var(--hy-danger-ink)}
.hy-field__hint{margin:0;font-size:12.5px;color:var(--hy-muted-2)}

/* --- notice: <x-site.content-notice> ------------------------------------- */
.hy-notice{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;background:var(--hy-cream);font-size:14px;line-height:1.5;color:var(--hy-ink-2)}
.hy-notice::before{content:"";flex:none;width:7px;height:7px;margin-top:.45em;background:var(--hy-accent-strong)}
.hy-notice--ok::before{background:var(--hy-ok)}
.hy-notice--error::before{background:var(--hy-danger)}

/* --- inline form (one field + button): .hy-inline-form ------------------- */
.hy-inline-form{display:flex;gap:2px;width:100%;max-width:440px}
.hy-inline-form .hy-field__control{flex:1;min-width:0;height:44px;min-height:0;padding:0 14px}
.hy-inline-form .hy-btn{flex:none}
.hy-inline-form + .hy-notice{margin-top:12px;max-width:440px}
@media (max-width:420px){.hy-inline-form{flex-direction:column}.hy-inline-form .hy-field__control{flex:none;width:100%}}

/* --- spacing helpers for content pages ------------------------------------ */
.hy-section--after-head{padding-top:0}
.hy-toolbar{margin-bottom:24px}
.hy-more-row{margin-top:40px}

/* --- article column: .hy-readcol (news item, long single-column text) ----- */
.hy-readcol{max-width:760px}
.hy-readcol__media{aspect-ratio:21/9;overflow:hidden;margin-bottom:48px;background:var(--hy-deep)}
.hy-readcol__media svg{display:block;width:100%;height:100%}
.hy-back{display:inline-flex;align-items:center;gap:8px;margin-bottom:28px;font:400 13px var(--hy-mono);color:var(--hy-muted)}
.hy-back:hover{color:var(--hy-ink)}
.hy-back svg{transform:scaleX(-1)}

/* --- two-column content split: .hy-split (contact, careers) -------------- */
.hy-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2px;padding:2px;background:var(--hy-paper)}
.hy-split--aside{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.hy-split__col{display:grid;gap:2px;align-content:start;min-width:0}
.hy-split__title{margin:0 0 20px;font-weight:500;font-size:24px;line-height:1.2;letter-spacing:-.03em;color:var(--hy-ink)}
@media (max-width:1180px){.hy-split,.hy-split--aside{grid-template-columns:minmax(0,1fr)}}
.hy-panel address{font-style:normal}

.hy-ncards + h2{margin-top:2rem}
.hy-fine{margin-top:2rem;font:400 11.5px/1.5 var(--hy-mono);color:var(--hy-muted-2)}

/* --- one-line code block and long tokens --------------------------------- */
.hy-codeline{margin:0 0 14px;padding:12px 14px;overflow-x:auto;background:var(--hy-cream);font:400 13px/1.5 var(--hy-mono);color:var(--hy-ink)}
.hy-codeline code{white-space:pre}
.hy-panel code:not(.hy-codeline code){padding:1px 5px;background:var(--hy-raise);font:400 .9em var(--hy-mono);color:var(--hy-ink-2)}
.hy-break{word-break:break-all}

/* --- group head: .hy-grouphead (mono label with a hairline to the right) -- */
.hy-grouphead{display:flex;align-items:center;gap:10px;margin:0 0 16px;font:400 12px/1.3 var(--hy-mono);color:var(--hy-muted-2)}
.hy-grouphead::after{content:"";flex:1;height:1px;background:var(--hy-line)}
.hy-grouphead:not(:first-child){margin-top:48px}

/* --- check list: .hy-checks (square accent marks) ------------------------- */
.hy-checks{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.hy-checks li{position:relative;padding-left:18px;font-size:14px;line-height:1.55;color:var(--hy-muted)}
.hy-checks li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;background:var(--hy-accent-strong)}
.hy-checks--2{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
@media (max-width:720px){.hy-checks--2{grid-template-columns:1fr}}

.hy-cols-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
@media (max-width:1180px){.hy-cols-3{grid-template-columns:1fr;gap:28px}}

.hy-dialog-lead{margin-top:24px;max-width:44em}
.hy-dialog-cols{margin-top:36px}

.prose-trust p.hy-fine,.prose-site p.hy-fine{font-size:11.5px;color:var(--hy-muted-2)}

/* ===================================================================== */
/* 9. Page components: model garden                                      */
/*    /models, /models/{slug}, /models/rankings (rank-*), <x-site.model-search> */
/* ===================================================================== */

/* ---- /models -------------------------------------------------------- */
.mg-hero .hy-chapter__head{margin-bottom:40px}
.mg-hero{padding-bottom:56px}
.mg-advice{display:flex;align-items:center;gap:18px;padding:18px 20px;background:var(--hy-band)}
.mg-advice__mark{flex:none}
.mg-advice__text{flex:1;min-width:0}
.mg-advice__text h2{margin:0;font-weight:500;font-size:17px;letter-spacing:-.02em;color:var(--hy-ink)}
.mg-advice__text p{margin:4px 0 0;font-size:14px;color:var(--hy-muted)}
@media (max-width:720px){.mg-advice{flex-direction:column;align-items:flex-start}}

.mg-toolbar{position:sticky;top:var(--hy-nav);z-index:30;display:grid;gap:10px;padding:12px 0;margin-bottom:20px;background:var(--hy-paper);border-bottom:1px solid var(--hy-line)}
.mg-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.mg-chips{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;padding:2px;background:var(--hy-band)}
.mg-chips::-webkit-scrollbar{display:none}
.mg-chip{flex:none;height:32px;padding:0 12px;font:400 12.5px var(--hy-mono);color:var(--hy-muted);background:none;border:0;cursor:pointer;white-space:nowrap;transition:background-color .15s,color .15s}
.mg-chip:hover{background:var(--hy-raise);color:var(--hy-ink)}
.mg-chip.active,.mg-chip[aria-pressed="true"]{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.mg-chip .ct{margin-left:6px;color:inherit;opacity:.75}
.mg-select{height:36px;padding:0 30px 0 12px;font:400 13px var(--hy-font);color:var(--hy-ink);background:var(--hy-band);border:0;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23554D42' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.mg-select:focus{outline:2px solid var(--hy-accent-strong);outline-offset:-2px}
.mg-spacer{flex:1}
.mg-count{margin:0 0 14px;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.mg-desc{margin:0;font-size:13.5px;line-height:1.5;color:var(--hy-muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mg-empty{padding:56px 20px;text-align:center;font-size:15px;color:var(--hy-muted)}
.mg-empty[hidden]{display:none}
.hy-models [data-mg-card][hidden]{display:none}

/* ---- advice wizard (components/site/models-advice) ------------------ */
.gw-overlay{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;padding:16px;background:var(--hy-paper)}
.gw-overlay.open{display:flex}
.gw-panel{width:100%;max-width:620px;max-height:90vh;overflow-y:auto;background:var(--hy-band);border:1px solid var(--hy-line)}
.gw-head{position:sticky;top:0;z-index:1;display:flex;align-items:center;gap:12px;padding:14px 20px;background:var(--hy-raise)}
.gw-head h3{flex:1;margin:0;font-weight:500;font-size:16px;letter-spacing:-.02em;color:var(--hy-ink)}
.gw-x{display:inline-flex;padding:6px;background:none;border:0;color:var(--hy-muted);cursor:pointer}
.gw-x:hover{color:var(--hy-ink);background:var(--hy-raise-2)}
.gw-body{padding:20px}
.gw-panel [hidden]{display:none!important}
.gw-label{display:block;margin-bottom:6px;font-weight:500;font-size:13.5px;color:var(--hy-ink)}
.gw-text,.gw-input{width:100%;padding:10px 12px;background:var(--hy-cream);border:1px solid var(--hy-line);color:var(--hy-ink);font:400 14px/1.5 var(--hy-font)}
.gw-text{min-height:130px;resize:vertical}
.gw-text:focus,.gw-input:focus{outline:2px solid var(--hy-accent-strong);outline-offset:-1px}
.gw-hint{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.gw-help{margin:6px 0 0;font-size:12.5px;color:var(--hy-muted)}
.gw-adv{margin-top:18px;padding-top:14px;border-top:1px solid var(--hy-line)}
.gw-adv-toggle{display:flex;align-items:center;gap:6px;width:100%;padding:0;background:none;border:0;cursor:pointer;text-align:left;font:500 13.5px var(--hy-font);color:var(--hy-ink)}
.gw-adv-toggle:hover{color:var(--hy-accent-strong)}
.gw-adv-toggle .hy-chev{transition:transform .15s}
.gw-adv-toggle[aria-expanded="true"] .hy-chev{transform:rotate(180deg)}
.gw-adv-sum{font-weight:400;color:var(--hy-accent-strong)}
.gw-adv-body{padding-top:12px}
.gw-field{margin-top:16px}
.gw-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:6px}
.gw-row .gw-label{margin:0}
.gw-val{font:400 12.5px var(--hy-mono);color:var(--hy-accent-strong)}
.gw-range{width:100%;accent-color:var(--hy-accent-strong);cursor:pointer}
.gw-ticks{display:flex;justify-content:space-between;margin-top:3px;font:400 10.5px var(--hy-mono);color:var(--hy-muted-2)}
.gw-check{display:flex;align-items:flex-start;gap:10px;margin-top:16px;cursor:pointer}
.gw-check input{width:16px;height:16px;margin-top:2px;flex:none;accent-color:var(--hy-accent-strong)}
.gw-check .gw-label{margin:0}
.gw-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.gw-err{margin-top:14px;padding:10px 12px;background:var(--hy-cream);border-left:2px solid var(--hy-accent-strong);font-size:13px;color:var(--hy-ink)}
.gw-err[hidden]{display:none}
.gw-loading{padding:48px 20px;text-align:center;font-size:14px;color:var(--hy-ink)}
.gw-dots{display:flex;justify-content:center;gap:6px;margin-bottom:16px}
.gw-dots .hy-sq{animation:gw-blink 1s steps(2,end) infinite}
.gw-dots .hy-sq:nth-child(2){animation-delay:.2s}
.gw-dots .hy-sq:nth-child(3){animation-delay:.4s}
@keyframes gw-blink{50%{background:var(--hy-faint)}}
@media (prefers-reduced-motion:reduce){.gw-dots .hy-sq{animation:none}}
.gw-summary{margin:0;font-size:14px;line-height:1.55;color:var(--hy-ink)}
.gw-link{display:inline-flex;margin:8px 0 4px;padding:0;background:none;border:0;cursor:pointer;font:400 12.5px var(--hy-mono);color:var(--hy-accent-strong)}
.gw-link:hover{color:var(--hy-accent-hover)}
.gw-opt{margin-top:2px;padding:14px 16px;background:var(--hy-cream)}
.gw-opt{border-left:2px solid transparent}.gw-opt.rec{border-left-color:var(--hy-accent-strong)}
.gw-opt-top{display:flex;gap:12px;align-items:flex-start}
.gw-rank{flex:none;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;font:400 12px var(--hy-mono);background:var(--hy-raise);color:var(--hy-ink-2)}
.gw-opt.rec .gw-rank{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.gw-opt-mid{flex:1;min-width:0}
.gw-name{font-weight:500;font-size:14.5px;letter-spacing:-.01em;color:var(--hy-ink)}
.gw-name .hy-badge{margin-left:8px;vertical-align:middle}
.gw-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.gw-why{margin:8px 0 0;font-size:13px;line-height:1.55;color:var(--hy-muted)}
.gw-price{flex:none;text-align:right;font:400 12px var(--hy-mono);color:var(--hy-muted-2);white-space:nowrap}
.gw-price .big{font-size:13.5px;color:var(--hy-ink)}
.gw-btns{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.gw-talk{display:flex;align-items:center;gap:12px;margin-top:14px;padding:12px 14px;background:var(--hy-raise)}
.gw-talk-text{flex:1;min-width:0}
@media (max-width:560px){.gw-talk{flex-wrap:wrap}}
.gw-avatar{flex:none;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;background:var(--hy-accent-strong);color:var(--hy-on-accent);font:500 15px var(--hy-font)}
.gw-avatar img{width:100%;height:100%;object-fit:cover}
.gw-avatar--lg{width:48px;height:48px;font-size:18px}
.gw-person{display:flex;align-items:center;gap:12px;margin-top:8px}
.gw-pick{margin-top:12px;padding:10px 12px;background:var(--hy-cream);font-size:13px}
.gw-pick-head{margin-bottom:4px;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.gw-pick-row{display:flex;justify-content:space-between;gap:12px;padding:2px 0}
.gw-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
@media (max-width:560px){.gw-fields{grid-template-columns:1fr}}
.gw-sent{margin-top:16px;padding:12px 16px;background:var(--hy-cream)}
.gw-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ---- /models/{slug} ------------------------------------------------- */
.mp-badges{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:20px}
.mp-panel .hy-win__body{padding:18px}
.mp-slug{font:400 13px var(--hy-mono);color:var(--hy-ink);word-break:break-all}
.mp-sub{margin:6px 0 0;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.mp-sub a{color:inherit;text-decoration:underline}
.mp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;margin-top:16px;background:var(--hy-paper);padding:2px}
.mp-stat{padding:12px;background:var(--hy-cream)}
.mp-stat b{display:block;font-weight:500;font-size:20px;letter-spacing:-.03em;color:var(--hy-ink)}
.mp-stat span{font:400 10.5px var(--hy-mono);color:var(--hy-muted-2)}
.mp-endpoint{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;font:400 12px var(--hy-mono);color:var(--hy-ink-2)}
.mp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--hy-paper)}
@media (max-width:1180px){.mp-grid{grid-template-columns:1fr}}
.mp-card{padding:24px;background:var(--hy-band);min-width:0}
.mp-card h2{margin:0 0 18px}
.mp-card .hy-table-wrap{margin:0 -24px}
.mp-kicker{margin:0 0 8px;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.mp-kicker+.mp-prices{margin-bottom:18px}
.mp-prices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
.mp-prices--one{grid-template-columns:1fr}
.mp-price{padding:14px 16px;background:var(--hy-cream)}
.mp-price b{display:block;font-weight:500;font-size:26px;letter-spacing:-.03em;color:var(--hy-ink)}
.mp-price b.mp-price--text{font-size:19px}
.mp-price span{display:block;margin-top:4px;font-size:13px;color:var(--hy-muted)}
.mp-price a{color:var(--hy-accent-strong)}
.mp-note{margin:10px 0 0;font-size:13px;color:var(--hy-muted)}
.mp-note a{color:var(--hy-accent-strong)}
.mp-verified{margin:10px 0 0;font:400 12px var(--hy-mono);color:var(--hy-accent-hover)}
.mp-score{display:flex;align-items:baseline;gap:8px;margin-top:24px}
.mp-score b{font-weight:500;font-size:48px;line-height:1;letter-spacing:-.04em;color:var(--hy-accent-strong)}
.mp-score span{font:400 12.5px var(--hy-mono);color:var(--hy-muted-2)}
.mp-text{margin:8px 0 0;font-size:14px;color:var(--hy-ink-2)}
.mp-text--muted{color:var(--hy-muted);font-size:13px}
.mp-text a{color:var(--hy-accent-strong)}
.mp-meters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px}
@media (max-width:720px){.mp-meters{grid-template-columns:1fr}}
.mp-meter__row{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--hy-muted)}
.mp-meter__row b{font:400 13px var(--hy-mono);color:var(--hy-ink)}
.mp-meter{height:6px;margin-top:8px;background:var(--hy-raise-2)}
.mp-meter i{display:block;height:100%;background:var(--hy-accent)}
.mp-details{margin-top:20px}
.mp-details summary{cursor:pointer;font-weight:500;font-size:14px;color:var(--hy-ink)}
.mp-list{margin:10px 0 0;padding:0;list-style:none}
.mp-list li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid var(--hy-line);font-size:13px;color:var(--hy-ink-2)}
.mp-list li span:last-child{font-family:var(--hy-mono)}
.mp-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--hy-paper)}
@media (max-width:720px){.mp-faq{grid-template-columns:1fr}}
.mp-faq__item{padding:22px;background:var(--hy-band)}
.mp-faq__item h3{margin:0 0 8px;font-weight:500;font-size:16px;letter-spacing:-.02em;color:var(--hy-ink)}
.mp-faq__item p{margin:0;font-size:14px;line-height:1.6;color:var(--hy-muted)}

/* Model pages, compact (2 Nov 2026): one chapter at the homepage Control density. */
.mp-hero .hy-h1{overflow-wrap:anywhere}
.mp-duo{grid-template-columns:minmax(0,440px) minmax(0,1fr)}
.mp-left{display:flex;flex-direction:column;gap:12px;min-width:0}
.mp-left{align-self:start}.mp-term{flex:0 0 auto;min-width:0}
.mp-term .hy-win__body{white-space:pre;overflow-x:auto;overflow-wrap:normal}
.mp-term .hy-win__body{font-size:12px;line-height:1.75}
.mp-usage{padding:14px 16px;background:var(--hy-band)}
.mp-h{margin:0 0 6px;font-weight:500;font-size:17px;line-height:1.3;letter-spacing:-.02em;color:var(--hy-ink)}
.mp-panel .hy-win__body{padding:14px 18px 16px}
.mp-id{padding-bottom:12px}
.mp-desc{margin:10px 0 0;font-size:13.5px;line-height:1.55;color:var(--hy-ink-2);max-width:72ch}
.mp-rows{margin:0}
.mp-rows>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;min-height:42px;padding:6px 0;border-top:1px solid var(--hy-raise);font-size:14px}
.mp-rows dt{color:var(--hy-muted);min-width:0}
.mp-rows dt a{color:var(--hy-accent-strong)}
.mp-rows dd{margin:0;display:flex;justify-content:flex-end;gap:6px;font:400 13px var(--hy-mono);color:var(--hy-ink);white-space:nowrap}
.mp-rows dd b{font:500 15px var(--hy-font);letter-spacing:-.02em}
.mp-rows .mp-rows__k{min-height:0;padding:14px 0 4px;border-top:0}
.mp-rows .mp-rows__k dt{font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.mp-rows .mp-rows__k:first-child{padding-top:0}
.mp-panel .mp-endpoint{margin-top:10px;padding-top:12px;border-top:1px solid var(--hy-raise)}
.mp-sec{--hy-section-pad:40px}.mp-sec+.mp-sec{padding-top:24px}
.mp-sec--first{padding-top:12px}
.mp-sec .hy-section__head{margin-bottom:18px}
.mp-sec .hy-section__title{font-size:clamp(24px,2.2vw,30px);letter-spacing:-.03em}
.mp-sec .mp-grid{gap:12px;background:none}
.mp-sec .mp-card{padding:18px 18px 16px}
.mp-sec .mp-card .mp-h{margin-bottom:10px}
.mp-sec .mp-card .hy-table-wrap{margin:0 -18px}
.mp-sec .hy-table th,.mp-sec .hy-table td{padding:9px 18px;font-size:13.5px}
.mp-sec .mp-score{margin-top:12px}
.mp-sec .mp-score b{font-size:36px}
.mp-sec .mp-faq{gap:12px;background:none}
.mp-sec .mp-faq__item{padding:16px 18px}
.mp-sec .mp-faq__item h3{font-size:15px}
.mp-sec .mp-faq__item p{font-size:13.5px}
.mp-related{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0;background:none}
.mp-related .hy-model{padding:14px 14px 12px;gap:10px}
.mp-related .mg-desc{-webkit-line-clamp:2}
.mp-close{--hy-section-pad:56px}
.mp-close .hy-section__head{margin-bottom:20px}
.mp-close .hy-section__title{font-size:clamp(26px,2.6vw,36px)}
.mg-hero{padding-bottom:0}
.mg-sec .hy-models{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:0;background:none}
.mg-sec .mg-popular{grid-template-columns:repeat(5,minmax(0,1fr))}
.mg-sec .hy-model{padding:14px 14px 12px;gap:10px}
.mg-sec .hy-model__badges .hy-badge{height:20px;font-size:10.5px}
.mg-sec .mg-desc{-webkit-line-clamp:2}
.mg-sec .mg-toolbar{margin-bottom:12px;padding:10px 0}
.mg-sec .mg-advice{margin-bottom:12px;padding:12px 16px}
.mg-sec .mg-count{margin-bottom:10px}
.rank-hero .rank-panel .hy-section__title{font-size:clamp(22px,2vw,28px);letter-spacing:-.03em}
@media (max-width:1180px){.mg-sec .hy-models,.mg-sec .mg-popular{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.mg-sec .hy-models,.mg-sec .mg-popular{grid-template-columns:1fr}}
@media (max-width:1180px){.mp-duo{grid-template-columns:1fr}.mp-duo>.mp-panel{order:-1}.mp-related{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.mp-related{grid-template-columns:1fr}.mp-rows dd{white-space:normal;text-align:right}}
.mp-rows--price .mp-rows__note{min-height:0;padding:6px 0 10px;border-top:0}
.mp-rows--price .mp-rows__note dt{font-size:12.5px;color:var(--hy-muted)}
.rank-hero .hy-tabs__panel{padding-top:14px}
.rank-hero .hy-table td{padding:9px 18px}
.mg-toolbar{grid-template-columns:minmax(0,1fr)}.mg-row,.mg-chips{min-width:0}.mg-chips{max-width:100%}
@media (max-width:720px){.mg-row>.mg-chips{flex-basis:100%}.mp-sec+.mp-sec{padding-top:16px}}
.mp-code{margin:0}

/* ---- /models/rankings ----------------------------------------------- */
.rank-tabs{margin-bottom:28px}
.rank-panel h2{margin:0}
.rank-panel .hy-section__sub,.rank-sub{margin:8px 0 20px;font-size:15px;color:var(--hy-muted)}
.rank-model a{font-weight:500;color:var(--hy-ink);text-decoration:none}
.rank-model a:hover{color:var(--hy-accent-strong)}
.rank-model .hy-badge{margin-left:6px;vertical-align:middle}
.rank-pub{display:block;margin-top:2px;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.rank-bar{display:inline-block;width:80px;height:6px;margin-left:10px;vertical-align:middle;background:var(--hy-raise-2)}
.rank-bar i{display:block;height:100%;border-radius:inherit;background:var(--hy-accent)}
.rank-na{color:var(--hy-faint)}
.rank-note{margin:14px 0 0;max-width:760px;font-size:13px;line-height:1.6;color:var(--hy-muted)}
.rank-note a{color:var(--hy-accent-strong)}

/* "Most used models": ten cards as two rows of five on a wide screen */
@media (min-width:1181px){.mg-popular{grid-template-columns:repeat(5,minmax(0,1fr))}}
.mg-popular .hy-model__stats{grid-template-columns:repeat(2,auto)}
.mg-popular .hy-model__name{white-space:normal}
/* the context slider: a square thumb on a flat track */
.gw-range[type=range]{-webkit-appearance:none;appearance:none;height:16px;background:transparent}
.gw-range[type=range]::-webkit-slider-runnable-track{height:4px;background:var(--hy-faint)}
.gw-range[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;background:var(--hy-accent-strong);border:0}
.gw-range[type=range]::-moz-range-track{height:4px;background:var(--hy-faint)}
.gw-range[type=range]::-moz-range-thumb{width:14px;height:14px;background:var(--hy-accent-strong);border:0;border-radius:0}
.gw-range[type=range]:focus{outline:none}
.gw-range[type=range]:focus-visible::-webkit-slider-thumb{outline:2px solid var(--hy-accent-strong);outline-offset:2px}

/* ===================================================================== */
/* 10. Page components: homepage chapters                                */
/*    components/site/home-*; the product windows (router, models, sizer, */
/*    activity, tools) are reused by the layer pages /control, /serve,   */
/*    /eu-compute                                                        */
/* ===================================================================== */
.home{display:block}
.home,.home *,.home *::before,.home *::after{box-sizing:border-box}
/* marks keep their own colours on light surfaces (5 Nov 2026); brand.css turns them light in the dark theme */
.home-logo{display:inline-block;flex:none}
.home-logo--loes{filter:none;width:var(--home-logo,16px)}
.home-logo--loes svg{display:block;width:100%;height:auto}
.home-note{margin:14px 0 0;font-size:14px;color:var(--hy-muted)}
.home-note a{color:var(--hy-ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--hy-faint)}
.home-note a:hover{text-decoration-color:var(--hy-ink)}
.home-chip{display:inline-flex;align-items:center;gap:7px;min-height:28px;padding:0 10px;background:var(--hy-raise);font-size:13px;color:var(--hy-ink-2)}
.home-toggle{display:inline-block;position:relative;width:34px;height:18px;background:var(--hy-raise-2)}
.home-toggle::after{content:"";position:absolute;top:3px;left:3px;width:12px;height:12px;background:var(--hy-muted)}
.home-toggle.is-on{background:var(--hy-accent-strong)}
.home-toggle.is-on::after{left:19px;background:var(--hy-on-accent)}
.home-key{fill:var(--hy-accent-strong);flex:none}

/* --- hero flow ----------------------------------------------------------- */
.home-flow{display:flex;flex-direction:column;min-width:0;background:var(--hy-band)}
.home-flow__head{display:flex;flex-wrap:wrap;align-items:center;gap:12px;row-gap:0;min-height:44px;padding:0 6px 0 16px;background:var(--hy-raise);font:400 12px var(--hy-mono);color:var(--hy-muted)}
.home-flow__path{color:var(--hy-ink-2);white-space:nowrap}
.home-flow__sel{display:inline-flex;align-items:center;gap:7px;height:24px;padding:0 8px;background:var(--hy-accent-strong);color:var(--hy-on-accent);white-space:nowrap;min-width:0;overflow:hidden}
.home-flow__sel b{font-weight:400;color:var(--hy-on-accent)}
.home-flow__sel.is-noprompt b{display:none}
.home-flow__cur{display:inline-block;height:13px;width:7px;background:var(--hy-on-accent);vertical-align:-2px}
.home-flow__head.is-nopath .home-flow__path{display:none}
.home-flow__head.is-sm .home-flow__sel{font-size:11px}
.home-flow__head.is-two::after{content:"";order:2;flex-basis:100%;height:0}
.home-flow__head.is-two .home-flow__sel{order:3;margin:0 0 10px}
.home-flow__tabs{margin-left:auto;display:flex;gap:2px}
.home-flow__tabs button{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 12px;border:0;background:transparent;color:var(--hy-muted-2);font:400 12px var(--hy-mono);cursor:pointer}
.home-flow__tabs button:hover{color:var(--hy-ink)}
.home-flow__tabs button.is-on{background:var(--hy-cream);color:var(--hy-ink)}
.home-flow__tabs .home-logo{width:13px;height:13px}
.home-flow__body{position:relative;padding:10px}
.home-flow__steps{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.home-flow__step{display:grid;grid-template-columns:32px minmax(0,1fr) auto;column-gap:18px;row-gap:12px;align-items:center;padding:15px 14px 14px 12px}
.home-flow__step.is-on{background:var(--hy-raise)}
.home-flow__num{grid-row:1;align-self:center;position:relative;z-index:3;display:grid;place-items:center;width:32px;height:32px;background:var(--hy-cream);font:400 12px var(--hy-mono);color:var(--hy-muted)}
.home-flow__step.is-on .home-flow__num{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.home-flow__step.is-done .home-flow__num{color:var(--hy-ink)}
.home-flow__name{min-width:0}
.home-flow__name b{display:block;font-weight:500;font-size:17px;line-height:1.25;letter-spacing:-.02em;color:var(--hy-ink)}
.home-flow__tiles{display:flex;gap:6px}
.home-flow__tiles>i{display:grid;place-items:center;width:40px;height:40px;background:var(--hy-cream);font:400 11px/1 var(--hy-mono);font-style:normal;color:var(--hy-muted)}
.home-flow__tiles>i .home-logo{width:18px;height:18px}
.home-flow__tiles>i.is-hub .hy-mark{background:transparent}
.home-flow__tiles>i.is-rule{color:var(--hy-muted-2)}
.home-flow__tiles>i.is-ck{color:var(--hy-ink)}
.home-flow__tiles>i.is-hit{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.home-flow__tiles>i.is-hit .home-logo{filter:brightness(0) invert(1)}
.home-flow__out{grid-column:2/-1;display:block;height:19px;font:400 12.5px/19px var(--hy-mono);color:var(--hy-ink-2);white-space:nowrap;overflow:hidden}
.home-flow__ty{display:inline-block;overflow:hidden;vertical-align:top;white-space:nowrap}
.home-flow__out .d{color:var(--hy-muted-2)}
.home-flow__out b{font-weight:400;color:var(--hy-ink)}
.home-flow__out .ok{font-style:normal;color:var(--hy-ink)}
.home-flow__out.is-old,.home-flow__out.is-old b,.home-flow__out.is-old .d,.home-flow__out.is-old .ok{color:var(--hy-subtle)}
.home-flow.is-tight .home-flow__out{height:auto;min-height:19px;white-space:normal}
.home-flow.is-tight .home-flow__ty{display:inline;white-space:normal}
.home-flow.is-tight .home-flow__sel{display:none}
.home-flow__track{position:absolute;left:37px;top:0;width:2px;height:0;background:var(--hy-raise-2);z-index:2}
.home-flow__track i{position:absolute;left:0;top:0;width:2px;height:0;background:var(--hy-accent);transition:height .6s steps(8,end)}
.home-flow__packet{position:absolute;left:34px;top:0;width:8px;height:8px;background:var(--hy-accent-strong);z-index:2;transition:transform .6s steps(8,end)}
.home-flow__foot{display:flex;align-items:center;gap:14px;min-height:40px;margin-top:auto;padding:0 16px;background:var(--hy-deep);font:400 11.5px var(--hy-mono);color:var(--hy-muted)}
.home-flow__foot b{color:var(--hy-ink-2);font-weight:400}
.home-flow__foot .d{color:var(--hy-muted-2)}
.home-flow__key{display:inline-flex;align-items:center;gap:9px;font:500 13px var(--hy-font);letter-spacing:-.01em;color:var(--hy-ink)}
.home-flow__status{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-flow__prog{margin-left:auto;display:flex;align-items:center;gap:4px}
.home-flow__prog i{width:6px;height:6px;border-radius:var(--hy-r-dot);background:var(--hy-raise-2);transition:width .25s,background-color .25s}
.home-flow__prog i.is-on{width:16px;background:var(--hy-accent-strong)}

/* --- 01 code: activity and tools ----------------------------------------- */
.home-activity__table{width:100%;border-collapse:collapse;font-size:13.5px;color:var(--hy-ink-2)}
.home-activity__table th,.home-activity__table td{padding:0 0 0 14px;height:46px;text-align:left;font-weight:400;white-space:nowrap}
.home-activity__table tr>:first-child{padding-left:18px}
.home-activity__table tr>:last-child{padding-right:18px}
.home-activity__table thead th{height:38px;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.home-activity__table tbody tr>*{border-top:1px solid var(--hy-raise)}
.home-activity__table .is-num{text-align:right;font:400 12.5px var(--hy-mono)}
.home-activity__time{font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.home-activity__who,.home-activity__x,.home-activity__serve{display:flex;align-items:center;gap:9px;color:var(--hy-ink);min-width:0}
.home-activity__x{color:var(--hy-ink-2)}
.home-activity__x .hy-mono{font-size:12.5px;color:var(--hy-muted)}
.home-activity__serve{color:var(--hy-muted)}
.home-tools{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.home-tools li{display:grid;gap:12px;min-width:0;padding:18px 18px 16px;background:var(--hy-band)}
.home-tools__name{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:500;color:var(--hy-ink)}
.home-tools code{display:block;padding:9px 10px;background:var(--hy-cream);font-size:12px;line-height:1.5;color:var(--hy-ink-2);white-space:nowrap;overflow-x:auto;scrollbar-width:none}
.home-tools code b{font-weight:400;color:var(--hy-accent-strong)}

/* --- 02 control: team router ---------------------------------------------- */
.home-router__term .hy-win__body{min-height:244px}
.home-router__out[hidden]{display:none}
.home-router__tabs{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:100%}
.home-router__tabs>.hy-tabs__list{display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:14px 10px;background:var(--hy-deep)}
.home-router__tabs .hy-tabs__tab{height:auto;min-height:44px;padding:10px 12px;text-align:left;position:relative}
.home-router__tabs .hy-tabs__tab:hover{background:var(--hy-band)}
.home-router__tabs .hy-tabs__tab[aria-selected="true"]{background:var(--hy-raise);color:var(--hy-ink)}
.home-router__tabs .hy-tabs__tab[aria-selected="true"]::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--hy-accent)}
.home-router__panel{padding:14px 22px 20px;min-width:0}
.home-router__tabs .hy-tabs__tab{display:grid;grid-template-columns:58px 1fr;align-items:center;gap:2px 12px;padding:12px 10px;font-weight:500;font-size:14.5px;color:var(--hy-ink)}
.home-router__crew{display:flex;gap:1px;margin:0}
.home-router__note{margin:6px 0 0;font-size:13px;color:var(--hy-muted-2)}
.home-router__budget{display:grid;gap:10px;padding:16px 0 18px}
.home-router__top{display:flex;justify-content:space-between;margin:0;font-size:14px;color:var(--hy-muted)}
.home-router__top b{color:var(--hy-ink);font-weight:500}
.home-router__meter{display:grid;grid-template-columns:repeat(40,1fr);gap:3px;height:22px;margin:0}
.home-router__meter i{background:var(--hy-raise-2)}
.home-router__meter i.is-on{background:var(--hy-accent)}
.home-router__meter i.is-hot{background:var(--hy-accent-hover)}
.home-cur{display:inline-block;width:8px;height:15px;border-radius:var(--hy-r-dot);background:var(--hy-ink);vertical-align:-3px}
.home-router__term .ok{font-style:normal;color:var(--hy-ink)}
.home-router__pct{margin:0;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
.home-router__rows{margin:0}
.home-router__rows>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;align-items:center;min-height:52px;padding:8px 0;border-top:1px solid var(--hy-raise);font-size:14px}
.home-router__rows dt{color:var(--hy-muted)}
.home-router__rows dd{margin:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;color:var(--hy-ink)}
.home-router__levels>.is-on{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.home-router__eu{font-size:12px;color:var(--hy-muted)}
.home-router__pii{display:grid;gap:8px;margin-top:14px;padding:14px 16px;background:var(--hy-cream);font:400 12.5px/1.6 var(--hy-mono);color:var(--hy-ink)}
.home-router__pii p{margin:0}
.home-router__pii p:first-child{color:var(--hy-muted)}
.home-router__pii span{display:inline-block;width:72px;color:var(--hy-muted-2)}
.home-router__pii mark{padding:0 4px;background:var(--hy-accent-strong);color:var(--hy-on-accent)}

/* --- 04 compute: sizer ------------------------------------------------------ */
.home-sizer__form{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:460px}
.home-sizer__controls{display:grid;gap:22px;align-content:start;padding:22px 20px;background:var(--hy-deep)}
.home-sizer__slider{display:grid;grid-template-columns:1fr auto;gap:10px;font-size:13.5px;color:var(--hy-muted)}
.home-sizer__slider output{font:400 13px var(--hy-mono);color:var(--hy-ink)}
.home-sizer__slider input{grid-column:1/-1}
.home-sizer__presets{display:flex;justify-content:space-between;margin-top:-14px}
.home-sizer__presets button{padding:2px 0;background:none;border:0;font:400 11px var(--hy-mono);color:var(--hy-muted-2);cursor:pointer}
.home-sizer__presets button:hover{color:var(--hy-ink)}
.home-sizer__presets button.is-on{color:var(--hy-accent-hover)}
.home-sizer input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:16px;margin:0;background:transparent;cursor:pointer}
.home-sizer input[type=range]::-webkit-slider-runnable-track{height:4px;background:var(--hy-faint)}
.home-sizer input[type=range]::-moz-range-track{height:4px;background:var(--hy-faint)}
.home-sizer input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-6px;background:var(--hy-accent-strong);border:0}
.home-sizer input[type=range]::-moz-range-thumb{width:16px;height:16px;background:var(--hy-accent-strong);border:0;border-radius:0}
.home-sizer input[type=range]:focus-visible{outline-offset:6px}
.home-sizer__result{display:flex;flex-direction:column;gap:22px;min-width:0;padding:24px 26px}
.home-sizer__sentence{margin:0;max-width:26em;font-weight:500;font-size:22px;line-height:1.3;letter-spacing:-.025em;color:var(--hy-ink)}
.home-sizer__nodes{display:grid;gap:8px}
/* v7k: every node reads as a small server: a card with its label square and eight GPU chips */
.home-sizer__node{display:grid;grid-template-columns:96px 1fr 180px;gap:16px;align-items:center;padding:10px 14px;background:var(--hy-cream);border-radius:var(--hy-r-card);font-size:13px;color:var(--hy-muted-2);transition:background .25s}
.home-sizer__node.is-on{background:var(--hy-band)}
.home-sizer__node>span:first-child{display:flex;align-items:center;gap:8px;font:400 12px var(--hy-mono)}
.home-sizer__node>span:first-child::before{content:"";flex:none;width:12px;height:12px;border-radius:var(--hy-r-dot);background:var(--hy-raise-2);transition:background .25s}
.home-sizer__node.is-on>span:first-child::before{background:var(--hy-accent-strong)}
.home-sizer__node.is-on>span:first-child,.home-sizer__node.is-on [data-node-note]{color:var(--hy-ink-2)}
.home-sizer__node [data-node-note]{font-size:12.5px}
.home-sizer__cells{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.home-sizer__cells i{position:relative;height:28px;border-radius:var(--hy-r-tag);background:var(--hy-raise)}
.home-sizer__cells i::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;transform:translate(-50%,-50%);border-radius:var(--hy-r-dot);background:var(--hy-raise-2);transition:background .2s}
.home-sizer__cells i.is-on{background:var(--hy-accent)}
.home-sizer__cells i.is-on::after{background:var(--hy-chip-core)}
.home-sizer__cells i.is-shared{background:var(--hy-graphic)}
.home-sizer__cells i.is-shared::after{background:var(--hy-chip-core)}
.home-sizer__facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:auto 0 0;padding-top:18px;border-top:1px solid var(--hy-raise)}
.home-sizer__facts dt{font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.home-sizer__facts dd{margin:4px 0 0;font-size:15px;color:var(--hy-ink)}

/* --- cases, security, guides ------------------------------------------------ */
.home-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.home-cards--four{grid-template-columns:repeat(4,minmax(0,1fr))}
.home-cards--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.home-cards>li{display:flex;min-width:0}
.home-card{display:flex;flex-direction:column;gap:10px;width:100%;padding:22px 22px 20px;background:var(--hy-band);color:var(--hy-ink)}
.home-section--band .home-card,.hy-section--band .home-card{background:var(--hy-cream)}
.home-card p{margin:0;font-size:14.5px;line-height:1.5;color:var(--hy-muted)}
.home-card--wide{grid-column:1/-1}
.home-card__links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:auto!important;padding-top:6px}
.home-card__links .hy-more{font-size:14px}
.home-card--link{transition:background-color .15s}
.home-card--link:hover{background:var(--hy-raise)}
.home-card--link .hy-badge{align-self:flex-start}
.home-card--link .hy-more{margin-top:auto;font-size:14px}
.home-links{display:flex;flex-wrap:wrap;gap:8px 28px;margin:28px 0 0}

/* --- hero (pro-07-paper-v7k): the gradient panel holds the copy and the "how it works" window */
.home-hero{padding:40px 0 var(--hy-sec)}
.home-hero__panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:48px;align-items:center;padding:var(--hy-grad-pad)}
.home-hero__eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 36px;font:400 12px var(--hy-mono);color:var(--hy-muted)}
.home-hero__eyebrow .hy-label{font-size:12px;padding:4px 8px;background:var(--hy-band)}
.home-hero__h1{margin:0;font-weight:500;font-size:var(--hy-t-display);line-height:1;hyphens:manual;letter-spacing:-.045em;color:var(--hy-ink)}
.home-hero__h1 span{color:var(--hy-subtle)}
.home-hero__sub{margin:28px 0 0;max-width:30em;font-size:20px;line-height:1.45;letter-spacing:-.015em;color:var(--hy-muted)}
.home-hero__sub b{color:var(--hy-ink);font-weight:500}
.home-hero__ctas{display:grid;grid-template-columns:max-content max-content;gap:12px;margin-top:32px}
.home-hero__ctas>.hy-cmd{grid-column:1/-1;justify-self:start}
.home-hero__small{margin:22px 0 0;max-width:34em;font-size:14px;color:var(--hy-muted-2)}
/* the window on the panel: cream with band strips, wells one step darker */
.home-hero__flow{position:relative;min-width:0;display:flex;flex-direction:column}
.home-hero__flow>.home-flow{flex:1;background:var(--hy-cream)}
.home-hero__flow .home-flow__head{background:var(--hy-band)}
.home-hero__flow .home-flow__num,.home-hero__flow .home-flow__tiles>i{background:var(--hy-deep)}
.home-hero__flow .home-flow__step.is-on{background:var(--hy-paper)}
.home-hero__flow .home-flow__step.is-on .home-flow__tiles>i{background:var(--hy-deep-2)}
.home-hero__flow .home-flow__step.is-on .home-flow__num,.home-hero__flow .home-flow__tiles>i.is-hit{background:var(--hy-accent-strong)}
/* the HostYourAI tile stays neutral until the request reaches Control (pro-07-paper-v7k) */
.home-flow__tiles>i.is-hub,.home-hero__flow .home-flow__tiles>i.is-hub{background:var(--hy-deep)}
.home-flow__tiles>i.is-hub .hy-mark{color:var(--hy-ink);transition:color .2s}
:is(.home-flow__step.is-on,.home-flow__step.is-done) .home-flow__tiles>i.is-hub{background:var(--hy-accent-strong)}
:is(.home-flow__step.is-on,.home-flow__step.is-done) .home-flow__tiles>i.is-hub .hy-mark{color:var(--hy-on-accent)}
.home-hero__flow .home-flow__foot{background:var(--hy-paper)}
.home-hero__flow .home-flow__tabs button.is-on{background:var(--hy-cream)}
/* Loes walks on top of the window, her shoes on its top edge: hover asks, click opens her game */
.home-walker{position:absolute;left:16px;bottom:100%;z-index:4;width:32px;padding:0;border:0;background:none;cursor:pointer;line-height:0}
.home-walker__loes{display:block;width:100%;height:auto;image-rendering:pixelated;transform-origin:50% 100%}
.home-walker__loes.is-flip{transform:scaleX(-1)}
.home-walker::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);white-space:nowrap;background:var(--hy-ink);color:var(--hy-paper);font:500 13px/1 var(--hy-font);padding:9px 12px;border-radius:var(--hy-r-ctl);opacity:0;pointer-events:none;transition:opacity .15s}
.home-walker.is-tip-l::after{left:0;transform:none}
.home-walker.is-tip-r::after{left:auto;right:0;transform:none}
.home-walker:hover::after,.home-walker:focus-visible::after{opacity:1}
.home-walker:focus-visible{outline-offset:4px}
@keyframes home-walker-hop{0%{transform:translateY(0)}50%{transform:translateY(-10px)}100%{transform:translateY(0)}}
.home-walker:hover,.home-walker:focus-visible{animation:home-walker-hop .36s steps(4)}

/* --- why: the label close to one running paragraph ----------------------- */
.home-why{padding:0 0 var(--hy-sec)}
.home-why__grid{display:grid;gap:18px;justify-items:start}
.home-why__label{margin:0}
.home-why__label .hy-label{font-size:14px;padding:7px 12px}
.home-why__text{margin:0;max-width:24em;font-weight:500;font-size:clamp(32px,3.3vw,48px);line-height:1.16;letter-spacing:-.03em;color:var(--hy-ink)}
.home-why__text span{color:var(--hy-subtle)}
.home-why__text em{font-style:normal;color:var(--hy-accent-strong)}
@media (min-width:721px){.home-why__text em{white-space:nowrap}}

/* --- models and tools: one slow band, two thin rows in opposite directions */
.home-logos{padding:0 0 var(--hy-sec)}
.home-mq{overflow:hidden;padding:7px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.home-mq__track{display:flex;width:max-content;animation:home-mq 56s linear infinite}
.home-mq--rev .home-mq__track{animation-direction:reverse}
.home-mq ul{display:flex;align-items:center;gap:44px;margin:0;padding:0 44px 0 0;list-style:none;flex:none}
.home-mq li{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:500;letter-spacing:-.02em;color:var(--hy-ink-2);white-space:nowrap}
.home-mq:hover .home-mq__track{animation-play-state:paused}
@keyframes home-mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.home-mq__track{animation:none;width:auto}.home-mq ul[aria-hidden]{display:none}.home-mq ul{flex-wrap:wrap;gap:10px 28px;padding-right:0}.home-mq{-webkit-mask-image:none;mask-image:none}}

/* --- plans: Personal, Teams, Enterprise ----------------------------------- */
.home-plans{padding:0}
.home-plans__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.home-plan{display:flex;flex-direction:column;min-width:0;background:var(--hy-band);border-radius:var(--hy-r-card);overflow:hidden}
.home-plan__art{position:relative;display:grid;place-items:center;height:216px;margin:8px 8px 0;background:var(--hy-cream);border-radius:var(--hy-r-card);overflow:hidden}
.home-plan__body{display:flex;flex-direction:column;flex:1;padding:24px}
.home-plan__name{margin:0;font-weight:500;font-size:var(--hy-t-h3);line-height:1.2;letter-spacing:-.02em;color:var(--hy-ink)}
.home-plan__name span{color:var(--hy-subtle)}
.home-plan__for{margin:6px 0 0;font-size:16px;color:var(--hy-muted)}
.home-plan__layers{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 24px}
.home-plan__layers a{padding:5px 9px;border-radius:var(--hy-r-tag);font:400 12px var(--hy-mono);color:var(--hy-muted-2);outline:1px solid var(--hy-raise-2);outline-offset:-1px;transition:background .15s,color .15s}
.home-plan__layers a:hover{background:var(--hy-raise);color:var(--hy-ink)}
.home-plan__layers a.is-on{background:var(--hy-accent-tint);color:var(--hy-accent-hover);outline:0}
.home-plan__layers a.is-on:hover{background:var(--hy-accent-tint-2)}
.home-plan__list{display:grid;gap:12px;flex:1;align-content:start;margin:0;padding:0;list-style:none}
.home-plan__list li{display:grid;grid-template-columns:16px minmax(0,1fr);gap:12px;align-items:start;font-size:15px;line-height:1.45;color:var(--hy-ink-2)}
.home-plan__list svg{width:16px;height:16px;margin-top:3px;color:var(--hy-graphic)}
.home-plan__list b{font-weight:500;color:var(--hy-ink)}
.home-plan__foot{display:grid;gap:14px;margin-top:24px}
.home-plan__foot small{font-size:14px;color:var(--hy-muted)}
.home-plan__foot .hy-btn--secondary{background:var(--hy-cream)}
.home-plan__foot .hy-btn--secondary:hover{background:var(--hy-ink)}
.home-plans__note{margin:20px 0 0;font-size:14px;color:var(--hy-muted)}
.home-plans__note a{color:var(--hy-ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--hy-faint)}
/* personal: a grid of model marks, the middle row shifted half a tile */
.home-plan__marks{display:grid;gap:12px}
.home-plan__marks>span{display:flex;gap:12px}
.home-plan__marks>span:nth-child(2){margin-left:30px}
.home-plan__marks i,.home-plan__tk i{display:grid;place-items:center;width:44px;height:44px;background:var(--hy-band);border-radius:var(--hy-r-ctl)}
/* teams: one router, three models under it, a budget bar */
.home-plan__tree,.home-plan__gpu{display:grid;justify-items:center;align-content:center}
.home-plan__chip{display:inline-flex;align-items:center;height:34px;padding:0 12px;background:var(--hy-band);border-radius:var(--hy-r-ctl);font:400 13px var(--hy-mono);color:var(--hy-ink)}
.home-plan__chip span{color:var(--hy-muted-2)}
.home-plan__stem{width:2px;height:22px;background:var(--hy-raise-2);border-radius:var(--hy-r-dot)}
.home-plan__tk{display:flex;gap:12px}
.home-plan__tk i{width:48px;height:48px}
.home-plan__tk i.is-dim .home-logo{opacity:.3}
.home-plan__bar{position:relative;width:240px;height:8px;margin-top:22px;background:var(--hy-band);border-radius:var(--hy-r-dot);overflow:hidden}
.home-plan__bar i{position:absolute;inset:0 auto 0 0;width:62%;background:var(--hy-accent-strong)}
/* enterprise: the card tiles of the sizer, one rack reserved and its first token */
.home-plan__cards{display:flex;gap:12px}
.home-plan__cards i{display:grid;place-items:center;height:48px;padding:0 14px;background:var(--hy-band);border-radius:var(--hy-r-ctl);font:400 13px var(--hy-mono);font-style:normal;color:var(--hy-ink)}
.home-plan__cards i.is-on{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.home-plan__rack{display:flex;gap:6px;margin-top:22px}
.home-plan__rack i{width:22px;height:12px;background:var(--hy-accent-strong);border-radius:var(--hy-r-dot)}
.home-plan__line{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:14px;font:400 12.5px/1.4 var(--hy-mono);color:var(--hy-ink)}
.home-plan__line span{color:var(--hy-muted-2)}

/* --- 03 serve: the model garden window with a real search ----------------- */
.home-models__bar{display:flex;align-items:center;gap:10px;padding:12px 18px;background:var(--hy-deep)}
.home-models__q{flex:1;display:flex;align-items:center;gap:10px;min-width:0;height:32px;margin:0;padding:0 12px;background:var(--hy-cream);border-radius:var(--hy-r-ctl);font:400 12.5px var(--hy-mono);color:var(--hy-muted-2);cursor:text}
.home-models__q:focus-within{outline:2px solid var(--hy-accent);outline-offset:-2px}
.home-models__q input{flex:1;min-width:0;margin:0;padding:0;border:0;background:transparent;font:inherit;color:var(--hy-ink);outline:0}
.home-models__q input::placeholder{color:var(--hy-muted-2)}
.home-models__q input::-webkit-search-cancel-button{display:none}
.home-models__n{font:400 11px var(--hy-mono);color:var(--hy-muted-2);white-space:nowrap}
.home-models__filters button{padding:5px 10px;border:0;background:none;font:400 12px var(--hy-mono);color:var(--hy-muted-2);cursor:pointer}
.home-models__filters button.is-on{background:var(--hy-cream);color:var(--hy-accent-strong)}
.home-models__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;height:236px;align-content:start;overflow:hidden;padding:2px;background:var(--hy-paper)}
.home-models__grid .home-mc{display:grid;gap:14px;align-content:start;min-width:0;padding:18px 18px 16px;background:var(--hy-band);border-radius:var(--hy-r-ctl);color:inherit;transition:background .15s}
.home-models__grid .home-mc:hover{background:var(--hy-cream)}
.home-models__grid .home-mc[hidden]{display:none}
.home-mc__hd{display:flex;align-items:center;gap:10px;min-width:0}
.home-mc__hd b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;font-size:15.5px;letter-spacing:-.02em;color:var(--hy-ink)}
.home-mc__tag{margin-left:auto;flex:none;padding:4px 6px;border-radius:var(--hy-r-tag);background:var(--hy-raise);font:400 10.5px/1 var(--hy-mono);color:var(--hy-ink-2)}
.home-mc dl{display:grid;grid-template-columns:repeat(2,auto);justify-content:start;gap:2px 22px;margin:0}
.home-mc dt{font:400 10.5px var(--hy-mono);color:var(--hy-muted-2)}
.home-mc dd{margin:0;font:400 12.5px var(--hy-mono);color:var(--hy-ink-2)}
.home-models__empty{grid-column:1/-1;margin:0;padding:28px 18px;font-size:14px;color:var(--hy-muted)}
.home-models__empty a{color:var(--hy-ink);text-decoration:underline;text-underline-offset:3px}

/* --- lab: the Bench window, three steps with an illustration each --------- */
.home-lab .hy-chapter__head{margin-bottom:28px}
.home-lab__links{display:flex;flex-wrap:wrap;gap:0 28px}
.home-lab__bench{margin-bottom:12px}
.home-lab__example{margin-left:10px;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.home-lab__tabs{display:inline-flex;padding:2px;background:var(--hy-paper);border-radius:var(--hy-r-ctl)}
.home-lab__tabs button{padding:5px 10px;border:0;border-radius:var(--hy-r-tag);background:none;font:400 12px var(--hy-mono);color:var(--hy-muted-2);cursor:pointer}
.home-lab__tabs button[aria-selected="true"]{background:var(--hy-cream);color:var(--hy-accent-strong)}
.home-lab__rows{margin:0;padding:0;list-style:none}
.home-lab__row{display:grid;grid-template-columns:24px 176px minmax(0,1fr) 84px;gap:14px;align-items:center;height:42px;padding:0 18px;font-size:14px}
.home-lab__row+.home-lab__row{border-top:1px solid var(--hy-raise)}
.home-lab__rk{font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.home-lab__nm{display:flex;align-items:center;gap:10px;min-width:0;color:var(--hy-ink);white-space:nowrap}
.home-lab__nm span{overflow:hidden;text-overflow:ellipsis}
.home-lab__bar{display:block;height:8px;background:var(--hy-raise-2);border-radius:var(--hy-r-dot);overflow:hidden}
.home-lab__bar i{display:block;height:100%;width:var(--w,0);background:var(--hy-faint);border-radius:var(--hy-r-dot);transition:width .8s var(--hy-ease)}
.home-lab__row.is-measured .home-lab__bar i{background:var(--hy-accent)}
.home-lab__row.is-translated .home-lab__bar i{background:var(--hy-muted)}
.home-lab__bd{justify-self:end;font:400 11px var(--hy-mono);color:var(--hy-muted-2)}
.home-lab__row.is-measured .home-lab__bd{color:var(--hy-accent-strong)}
.home-lab__legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;width:100%}
.home-lab__legend span{display:inline-flex;align-items:center;gap:7px}
.home-lab__legend i{width:8px;height:8px;border-radius:var(--hy-r-dot);background:var(--hy-faint)}
.home-lab__legend i.is-measured{background:var(--hy-accent)}
.home-lab__legend i.is-translated{background:var(--hy-muted)}
.home-lab__legend .r{margin-left:auto}
.home-lab__steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:44px 0 0;padding:0;list-style:none}
.home-lab__step{display:flex;flex-direction:column;min-width:0;padding:24px;background:var(--hy-band);border-radius:var(--hy-r-card)}
.home-lab__step-h{display:flex;align-items:baseline;gap:12px}
.home-lab__step-h span{font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.home-lab__step-h h3{margin:0;font-weight:500;font-size:var(--hy-t-h3);line-height:1.1;letter-spacing:-.02em;color:var(--hy-ink)}
.home-lab__step>p{flex:1;margin:12px 0 0;font-size:14.5px;line-height:1.55;color:var(--hy-muted)}
.home-lab__card{position:relative;display:flex;flex-direction:column;justify-content:center;height:144px;margin-top:18px;padding:18px 18px 16px;background:var(--hy-cream);border-radius:var(--hy-r-card)}
.home-lab__rank{display:grid;gap:8px;margin:0;padding:0;list-style:none;font-size:13px}
.home-lab__rank li{display:grid;grid-template-columns:12px 104px 1fr;gap:10px;align-items:center}
.home-lab__rank .k{font:400 11px/1 var(--hy-mono);color:var(--hy-muted-2)}
.home-lab__rank .m{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;color:var(--hy-ink-2)}
.home-lab__rank li.is-loes .home-lab__bar i{background:var(--hy-accent)}
.home-lab__ftx{display:grid;grid-template-columns:auto minmax(48px,1fr) auto;align-items:center;height:100%}
.home-lab__src-list{display:grid;gap:18px}
.home-lab__src{display:flex;align-items:center;gap:8px;padding:6px 10px 6px 6px;background:var(--hy-paper);border-radius:var(--hy-r-ctl);font-size:13px;line-height:1.15;color:var(--hy-ink-2);white-space:nowrap}
.home-lab__src small{display:block;margin-bottom:3px;font:400 10.5px/1 var(--hy-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--hy-muted-2)}
.home-lab__src-tag{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:var(--hy-r-tag);background:var(--hy-cream);font:500 9.5px/1 var(--hy-mono);color:var(--hy-ink-2)}
.home-lab__src--eu .home-lab__src-tag{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.home-lab__wire{position:relative;height:100%;min-height:96px}
.home-lab__wire svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.home-lab__wire path{fill:none;vector-effect:non-scaling-stroke;stroke-width:2;stroke:var(--hy-faint)}
.home-lab__wire path.is-eu{stroke:var(--hy-accent)}
.home-lab__out{display:inline-flex;align-items:center;gap:9px;padding:8px 12px 8px 8px;background:var(--hy-paper);color:var(--hy-ink);border-radius:var(--hy-r-ctl);line-height:1.1}
.home-lab__out .hy-maatje{width:22px}
.home-lab__out b{display:block;font-size:14px;font-weight:500}
.home-lab__out small{display:block;margin-top:3px;font:400 10.5px/1 var(--hy-mono);letter-spacing:.04em;color:var(--hy-muted-2);white-space:nowrap}
.home-lab__loss{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;height:94px}
.home-lab__loss .ax{display:flex;justify-content:space-between;font:400 10.5px/1 var(--hy-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--hy-muted-2)}
.home-lab__loss svg{display:block;width:100%;height:100%;min-height:0;overflow:visible}
.home-lab__loss .gl{fill:none;stroke:var(--hy-raise);stroke-width:1;vector-effect:non-scaling-stroke}
.home-lab__loss .cv{fill:none;stroke:var(--hy-accent);stroke-width:2;vector-effect:non-scaling-stroke}
.home-lab__loss rect{fill:var(--hy-accent)}
.home-lab__run{display:grid;grid-template-columns:auto minmax(0,1fr) 12px;gap:12px;align-items:center;margin-top:14px;padding:10px 12px;background:var(--hy-raise);border-radius:var(--hy-r-ctl);font-size:13px;color:var(--hy-ink-2);transition:background .15s,color .15s}
.home-lab__run b{font:400 12px var(--hy-mono);color:var(--hy-accent-strong)}
.home-lab__run span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-lab__run:hover{background:var(--hy-raise-2);color:var(--hy-ink)}
/* the illustrations draw in once, when the steps scroll into view */
.home-lab__steps.is-wait:not(.is-in) .home-lab__rank .home-lab__bar i{transform:scaleX(0)}
.home-lab__rank .home-lab__bar i{transform-origin:0 50%;transition:transform 1s var(--hy-ease)}
.home-lab__rank li:nth-child(2) i{transition-delay:.08s}.home-lab__rank li:nth-child(3) i{transition-delay:.16s}.home-lab__rank li:nth-child(4) i{transition-delay:.24s}
.home-lab__loss svg{clip-path:inset(0);transition:clip-path 1.8s cubic-bezier(.3,.6,.2,1)}
.home-lab__steps.is-wait:not(.is-in) .home-lab__loss svg{clip-path:inset(0 100% 0 0)}

/* --- closing: the gradient panel with the people and the digital colleagues */
.home-close{padding:var(--hy-sec) 0 72px}
.home-close__box{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:72px;align-items:center;padding:var(--hy-grad-pad)}
.home-close__text{margin:22px 0 0;font-size:17px;color:var(--hy-muted)}
.home-close__ctas{margin-top:32px}
.home-close__ctas+.home-close__ctas{margin-top:12px}
.home-faces{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.home-faces li{display:grid;gap:8px;font-size:13px;color:var(--hy-ink-2)}
.home-faces img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:var(--hy-raise)}
.home-faces--bots{margin-top:10px}
.home-faces__bot{display:grid;place-items:center;aspect-ratio:1;background:var(--hy-cream)}
.home-faces__bot .hy-maatje{width:46%}
.home-faces__bot .hy-maatje svg{width:100%;height:auto}
.home-faces small{display:block;margin-top:2px;font:400 12px var(--hy-mono);color:var(--hy-muted-2)}
.home-faces__play{display:grid;gap:8px;padding:0;border:0;background:none;font:inherit;font-size:13px;color:inherit;text-align:left;cursor:pointer}
.home-faces__play .home-faces__bot{position:relative}
.home-faces__ph{position:absolute;left:8px;top:8px;display:inline-flex;align-items:center;gap:8px;height:24px;padding:0 8px;border-radius:var(--hy-r-tag);background:var(--hy-ink);color:var(--hy-paper);font:400 11.5px var(--hy-mono);visibility:hidden}
.home-faces__ph i{width:0;height:0;border-left:6px solid currentColor;border-top:4px solid transparent;border-bottom:4px solid transparent}
.home-faces__play:hover .home-faces__ph,.home-faces__play:focus-visible .home-faces__ph{visibility:visible}
.home-faces__play:hover .home-faces__bot,.home-faces__play:focus-visible .home-faces__bot{outline:2px solid var(--hy-accent-strong);outline-offset:-2px}
.home-faces__play:focus-visible{outline:0}

/* the console above the footer (home-console) */
.home-console-wrap{padding-bottom:96px}
.home-console{display:grid;grid-template-columns:minmax(0,1fr) 120px;background:var(--hy-band)}
.home-console__out{min-height:84px;max-height:200px;overflow:auto;padding:16px 18px;font:400 12.5px/1.8 var(--hy-mono);color:var(--hy-ink-2)}
.home-console__out .ln{display:block}
.home-console__out .p{color:var(--hy-accent-strong)}
.home-console__out .d{color:var(--hy-muted-2)}
.home-console__out .hc{color:var(--hy-ink-2);cursor:pointer}
.home-console__out .hc:hover{color:var(--hy-ink)}
.home-console__out b{font-weight:500;color:var(--hy-ink)}
.home-console__hello{display:flex!important;align-items:flex-end;gap:14px;padding:6px 0}
.home-console__fig{display:inline-block;width:40px}
.home-console__fig svg{width:100%;height:auto}
.home-console__in{grid-column:1;display:flex;align-items:center;gap:10px;height:44px;padding:0 18px;background:var(--hy-raise);font:400 12.5px var(--hy-mono)}
.home-console__in .p{color:var(--hy-accent-strong)}
.home-console__in input{flex:1;min-width:0;border:0;background:none;font:inherit;color:var(--hy-ink);outline:0}
.home-console__in input::placeholder{color:var(--hy-muted-2)}
.home-console__in:focus-within{outline:2px solid var(--hy-accent-strong);outline-offset:-2px}
.home-console__lo{grid-row:1/span 2;grid-column:2;display:grid;place-items:center;background:var(--hy-deep);color:var(--hy-faint)}
.home-console__lo svg{width:64px;height:auto;image-rendering:pixelated}
.home-console__egg{margin:12px 0 0;text-align:right}
.home-console__egg button{padding:0;border:0;background:none;font:400 11.5px var(--hy-mono);color:var(--hy-muted-2);cursor:pointer}
.home-console__egg button:hover,.home-console__egg button:focus-visible{color:var(--hy-accent-strong)}

/* --- the chapter line's quiet "next 02 Control" link (pro-07-paper-v7k) */
.hy-chapter__next{margin-left:auto;display:inline-flex;align-items:center;gap:8px;flex:none;color:var(--hy-muted);transition:color .15s}
.hy-chapter__next:hover{color:var(--hy-ink)}
.hy-chapter__next svg{transition:transform .15s var(--hy-ease)}
.hy-chapter__next:hover svg{transform:translateX(3px)}

/* --- homepage responsive (pro-07-paper-v7k) ------------------------------ */
@media (max-width:1340px) and (min-width:1181px){
  .home-hero__panel{gap:32px;padding:64px 40px}
}
@media (max-width:1180px){
  .home-hero__panel{grid-template-columns:1fr;gap:48px}
  .home-hero__flow{width:100%;max-width:640px;justify-self:center}
  .home-tools{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-close__box{grid-template-columns:1fr}
  .home-cards,.home-cards--four,.home-cards--three{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-router__term .hy-win__body{min-height:0}
  .home-plan__body{padding:22px 20px}
  .home-lab__steps{gap:10px}
  .home-lab__step{padding:20px 18px 16px}
}
@media (max-width:980px){
  .home-plans__grid{grid-template-columns:1fr}
  .home-plan__art{height:220px}
}
@media (max-width:760px){
  .home-models__grid{height:auto;max-height:420px}
  .home-why__text{font-size:28px}
}
@media (max-width:720px){
  .home-hero{padding:16px 0 var(--hy-sec)}
  .home-hero__panel{gap:32px;padding-bottom:64px;border-radius:16px}
  .home-hero__eyebrow{margin-bottom:24px}
  .home-hero__sub{font-size:18px}
  .home-hero__ctas{grid-template-columns:1fr 1fr}
  .home-hero__ctas .hy-cmd{width:100%;justify-content:space-between}
  .home-walker{left:12px;width:28px}
  .home-flow__body{padding:6px}
  .home-flow__step{grid-template-columns:32px minmax(0,1fr);column-gap:14px;padding:12px 10px}
  .home-flow__tiles{grid-column:2;flex-wrap:wrap}
  .home-flow__tiles>i{width:36px;height:36px}
  .home-flow__out{grid-column:2;white-space:normal;line-height:1.5}
  .home-mq ul{gap:28px;padding-right:28px}
  .home-plan__name{font-size:22px}
  .home-activity__table tr>:nth-child(1),.home-activity__table tr>:nth-child(3),.home-activity__table tr>:nth-child(5){display:none}
  .home-activity__table th,.home-activity__table td{padding-left:10px}
  .home-tools{grid-template-columns:1fr}
  .home-router__tabs{grid-template-columns:1fr}
  .home-router__tabs>.hy-tabs__list{flex-direction:row;overflow-x:auto;padding:8px;scrollbar-width:none}
  .home-router__tabs .hy-tabs__tab{flex:none}
  .home-router__panel{padding:10px 14px 14px}
  .home-router__rows>div{grid-template-columns:110px 1fr;font-size:13px}
  .home-models__bar{flex-wrap:wrap}
  .home-models__q{flex-basis:100%}
  .home-models__grid{grid-template-columns:1fr 1fr}
  .home-sizer__form{grid-template-columns:1fr}
  .home-sizer__node{grid-template-columns:72px 1fr}
  .home-sizer__node [data-node-note]{display:none}
  .home-sizer__facts{grid-template-columns:repeat(2,1fr)}
  .home-lab__bench .hy-win__head{flex-wrap:wrap;gap:8px}
  .home-lab__example{display:none}
  .home-lab__row{grid-template-columns:22px 118px 1fr;font-size:13px;padding:0 14px}
  .home-lab__bd{display:none}
  .home-lab__legend .r{margin-left:0}
  .home-lab__steps{grid-template-columns:1fr}
  .home-cards,.home-cards--four,.home-cards--three{grid-template-columns:1fr}
  .home-close__box{padding:40px 22px;gap:40px;border-radius:16px}
  .home-close{padding:var(--hy-sec) 0 56px}
  .home-console{grid-template-columns:1fr}.home-console__lo{display:none}
  .home-console-wrap{padding-bottom:80px}
  .home-console__egg{text-align:left}
}
@media (max-width:480px){
  .home-activity .hy-win__actions{display:none}
  .home-models__grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .home-walker{animation:none!important}
  .home-card--link,.home-lab__bar i,.home-lab__loss svg{transition:none}
}

/* --- homepage chapters: the section title label, the chapter's own call to action and the
   sticky chapter index (Jantine, 2 Nov 2026). The index stays calm: the current item is ink
   text with a small indigo bar, never a fill, a tint or a lit border while scrolling. */
.hy-chapter__eyebrow{display:inline-flex;align-items:baseline;gap:8px;flex:none;font:500 15px/1 var(--hy-font);letter-spacing:-.01em;color:var(--hy-ink)}
.hy-chapter__eyebrow .hy-chapter__num{font:400 13px/1 var(--hy-mono);color:var(--hy-muted-2)}
.hy-chapter__cta{margin-top:32px}
.home-index{position:sticky;top:var(--hy-nav);z-index:40;background:var(--hy-paper)}
.home-index__list{display:flex;gap:4px 32px;height:48px;align-items:center;margin:0;padding:0;list-style:none;overflow-x:auto;scrollbar-width:none}
.home-index__list a{position:relative;display:inline-flex;align-items:baseline;gap:7px;padding:6px 0;font-size:14px;font-weight:500;letter-spacing:-.01em;color:var(--hy-muted);white-space:nowrap;transition:color .15s}
.home-index__list a:hover,.home-index__list a[aria-current="true"]{color:var(--hy-ink)}
.home-index__list a::after{content:"";position:absolute;left:0;bottom:0;width:16px;height:2px;border-radius:var(--hy-r-dot);background:var(--hy-accent-strong);opacity:0;transition:opacity .15s}
.home-index__list a[aria-current="true"]::after{opacity:1}
.home-index__num{font:400 11.5px var(--hy-mono);color:var(--hy-muted-2)}
html:has(.home-index){scroll-padding-top:calc(var(--hy-nav) + 72px)}
@media (max-width:760px){.home-index{display:none}html:has(.home-index){scroll-padding-top:calc(var(--hy-nav) + 24px)}}
@media (prefers-reduced-motion:reduce){.home-index__list a,.home-index__list a::after{transition:none}}

/* --- "Run, Loes.": the fullscreen game (<x-site.game>, public/js/site-game.js) */
.hy-game{position:fixed;inset:0;z-index:200;background:var(--hy-paper);color:var(--hy-ink);font-family:var(--hy-font);overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:contain}
.hy-game[hidden]{display:none}
.hy-game:focus{outline:0}
.hy-game canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hy-game__top{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;pointer-events:none;font:400 13px/1 var(--hy-mono)}
.hy-game__hud{display:flex;align-items:center;gap:16px;height:40px;padding:0 14px;border-radius:var(--b-r-ctl,8px);background:var(--b-paper,#F8F4ED);color:var(--b-muted,#6B6152)}
.hy-game__hud:empty{display:none}
.hy-game__hud b{display:inline-block;color:var(--b-ink,#15110C);font-weight:400}
.hy-game__hud .hy-game__sc{min-width:3ch;font-size:15px;font-weight:500}
.hy-game__ct,.hy-game__hs{display:inline-flex;align-items:center;gap:7px}
.hy-game__ct img{flex:none;width:auto;height:10px;image-rendering:pixelated}
.hy-game__sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hy-game__hud b.is-pop{animation:hy-game-pop .24s steps(3)}
@keyframes hy-game-pop{50%{transform:translateY(-3px)}}
.hy-game__lv{display:inline-flex;gap:4px}
.hy-game__lv i{width:8px;height:8px;border-radius:var(--hy-r-dot);background:var(--b-line,#E1DDD6)}
.hy-game__lv i.is-on{background:var(--b-accent,#4F46E5)}
.hy-game__x{pointer-events:auto;display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 8px 0 14px;border:0;border-radius:var(--b-r-ctl,8px);background:var(--b-paper,#F8F4ED);color:var(--b-ink,#15110C);font:400 13px var(--b-mono);cursor:pointer;flex:none}
.hy-game__x:hover{background:var(--b-band,#F1EBE0)}
.hy-game__x kbd{font:inherit;font-size:12px;color:var(--b-muted,#6B6152);padding:4px 7px;border-radius:var(--b-r-tag,6px);background:var(--b-band,#F1EBE0)}
.hy-game__x:focus-visible,.hy-game__disc a:focus-visible{outline:2px solid var(--hy-accent);outline-offset:2px}
.hy-game__pn{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:min(480px,calc(100% - 40px));max-height:calc(100% - 120px);overflow:auto;padding:var(--b-pad-panel,32px) 28px;background:var(--b-paper,#F8F4ED);border-radius:var(--b-r-panel,24px);text-align:center;font-family:var(--b-font)}
.hy-game__pn[hidden]{display:none}
.hy-game__pn small{display:block;font:400 12px var(--b-mono);color:var(--b-ink,#15110C)}
.hy-game__pn h2{margin:12px 0;font:500 clamp(40px,7vw,64px)/1.02 var(--b-font);letter-spacing:var(--b-track,-.045em);color:var(--b-ink,#15110C)}
.hy-game__pn p{margin:0 auto 22px;max-width:28em;font-size:15px;line-height:1.5;color:var(--b-muted,#6B6152)}
.hy-game__pn .hy-game__ctl{margin:16px auto 0;font:400 12.5px/1.5 var(--b-mono);color:var(--b-muted,#6B6152)}
.hy-game__key{display:inline-flex;align-items:center;height:44px;padding:0 20px;background:var(--b-accent,#4F46E5);color:var(--b-on-accent,#FFFDF8);font:500 15px var(--b-font)}
.hy-game__legend{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:8px 22px;justify-content:center;margin-top:16px;text-align:left;font:400 12px var(--b-mono);color:var(--b-muted,#6B6152)}
.hy-game__legend span{display:inline-flex;align-items:center;gap:8px}
.hy-game__legend img{flex:none;width:auto;height:12px;image-rendering:pixelated}
.hy-game__legend i.is-err{flex:none;width:14px;height:10px;border-radius:var(--hy-r-dot);background:#E5484D}
.hy-game__row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.hy-game__fine{display:block;margin-top:16px;font:400 11.5px/1.5 var(--b-mono);color:var(--b-muted,#6B6152)}
.hy-game__disc{margin:0 0 18px}
.hy-game__disc[hidden]{display:none}
.hy-game__disc>span{display:block;margin-bottom:8px;font:400 12px var(--b-mono);color:var(--b-ink,#15110C)}
.hy-game__disc div{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.hy-game__disc a{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:var(--b-r-tag,6px);background:var(--b-band,#F1EBE0);color:var(--b-ink,#15110C);font:400 13px var(--b-font);text-decoration:none}
.hy-game__disc a:hover{background:var(--b-raised,#EBE4D8)}
.hy-game__disc a b{font:500 12px var(--b-mono);color:var(--b-ink,#15110C)}
.hy-game-fx{position:fixed;inset:0;z-index:201;pointer-events:none;overflow:hidden;background:repeating-linear-gradient(0deg,rgba(21,17,12,.16) 0 1px,transparent 1px 3px)}
.hy-game-fx[hidden]{display:none}
.hy-game-fx i{position:absolute;left:0;right:0;mix-blend-mode:difference}
.hy-game-svg{position:absolute}
html.hy-game-lock,html.hy-game-lock body{overflow:hidden}
@media (max-width:720px){
  .hy-game__top{padding:14px}
  .hy-game__hud{gap:10px 12px;padding:0 12px;font-size:12px}
  .hy-game__hud .hy-game__sc{font-size:14px}
  .hy-game__pn{top:41%;padding:24px 20px}
  .hy-game__pn p{font-size:14px}
  .hy-game__legend{gap:6px 14px;font-size:11px}
}
@media (hover:none){.hy-game__x kbd{display:none}}
@media (prefers-reduced-motion:reduce){.hy-game__hud b.is-pop{animation:none}}

/* ===================================================================== */
/* 11. Finish: the gradient panel, [data-finish="warm"]                    */
/* pro-07-paper-v7k: the page itself is flat (paper, cream, band, no       */
/* shadows, no glows). The one atmosphere is the gradient panel: paper on  */
/* the left into lavender, periwinkle and a peach wash, with a trace of    */
/* grain. It is used for the hero panel and the closing panel only.        */
/*  - .hy-grad: the panel, opt in per component (homepage hero and close)  */
/*  - [data-finish="warm"] on <body> (App\Support\SiteTheme::FINISH) also */
/*    paints the closing panels every page shares (call to action, team    */
/*    block above the footer) with it. Without the attribute they stay     */
/*    plain band.                                                          */
/* ===================================================================== */
.hy-grad,
[data-finish="warm"] :is(.hy-cta:not(.hy-cta--compact) .hy-cta__box,.hy-cm-cta){position:relative;isolation:isolate;overflow:hidden;background:var(--hy-cream);border-radius:var(--hy-r-panel)}
.hy-grad::before,
[data-finish="warm"] :is(.hy-cta:not(.hy-cta--compact) .hy-cta__box,.hy-cm-cta)::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:var(--hy-grad)}
.hy-grad::after,
[data-finish="warm"] :is(.hy-cta:not(.hy-cta--compact) .hy-cta__box,.hy-cm-cta)::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--hy-grain);opacity:.018;mix-blend-mode:multiply}
/* a closing panel carries the gradient a step quieter than the hero */
.hy-grad--quiet::before,
[data-finish="warm"] :is(.hy-cta:not(.hy-cta--compact) .hy-cta__box,.hy-cm-cta)::before{opacity:.65}
@media (max-width:1180px){
  .hy-grad::before,
  [data-finish="warm"] :is(.hy-cta:not(.hy-cta--compact) .hy-cta__box,.hy-cm-cta)::before{background:var(--hy-grad-stack)}
}

/* ===================================================================== */
/* 12. Corners: the rounded system                                       */
/* 2 Nov 2026 Jantine chose rounded corners like the apps (study          */
/* /x/pro-07-paper-v7e): panels 24, cards and windows 12, controls 8,     */
/* tags 6, the mark 7, tiny status squares 2. Never a circle, never a     */
/* shadow. A container with joined parts (tabs, bars, tile grids) rounds  */
/* itself and clips, so no part ends half rounded.                       */
/* ===================================================================== */
/* large panels */
.hy-cta__box,.home-close__box,.hy-cm-cta{border-radius:var(--hy-r-panel)}
/* cards */
.hy-card,.hy-stat,.hy-step,.hy-layer,.hy-panel,.hy-notice,
.hy-cm-fig,.hy-cm-plan,.hy-cm-panel,.hy-cm-callout,.hy-cm-flow__node,
.sv-case,.sv-when-card,.rk-calc,.mp-card,.mp-faq__item:only-child,.mg-advice,.toc-box,
.home-card,.home-tools li,.gw-panel,
.hy-nav__card,.prose-site pre,.prose-trust pre,.prose-table,.hy-codeline,.mp-usage,.home-router__pii,.gw-opt,.gw-talk,.gw-pick,.gw-sent,
.mp-stat,.mp-price,.rk-card,.sv-tile,.hy-cm-step__head,.hy-cm-step__body,.hy-model,.hy-tool{border-radius:var(--hy-r-card)}
/* containers of joined tiles: round and clip */
.hy-models,.hy-split,.hy-ncards,.hy-cm-steps,.sv-tiles,.rk-cards,.mp-stats,.mp-grid,
.mp-faq,.home-models__grid,.hy-table-wrap,.home-console{border-radius:var(--hy-r-card);overflow:hidden}
/* tiles inside such a container get the control radius */
:is(.hy-models,.hy-split,.hy-ncards,.hy-cm-steps,.sv-tiles,.rk-cards,.mp-stats,.mp-grid,.mp-faq,.home-models__grid)>*,
.hy-cm-steps>*>*,.hy-split>*>*{border-radius:var(--hy-r-ctl)}
.mp-stat{border-radius:var(--hy-r-tag)}
/* windows: clip, except the ones holding a search popup (they round head and foot instead) */
.hy-win,.home-flow{border-radius:var(--hy-r-card);overflow:hidden}
.hy-readcol__media,.hy-article__figure img,.hy-feature__media img,.hy-hero__media img{border-radius:var(--hy-r-ctl)}
/* controls */
.hy-btn,.hy-cmd,.hy-nav__burger,.hy-field__control,.hy-chip,
.sv-form select,.sv-form input,.sv-grid select,.sv-grid input,.rk-select,.rk-input,.mg-select,
.gw-text,.gw-input,.hy-cm-jump a,.hy-mnav__langs a,
.hy-tabs__list,.hy-seg,.sv-tabs[role=tablist],.rk-pills,.mg-chips,.hy-skip,
.hy-layer__cmd,.home-tools code,.hy-cta__bot,.hy-card__icon,.hy-step__no,.hy-layer__num,
.hy-cm-step__num,.hy-cm-plan__num,.home-flow__num,.home-flow__tiles>i,.gw-rank,.hy-nav__link,.hy-nav__lead{border-radius:var(--hy-r-ctl)}
/* photos */
.hy-person__photo,.hy-person__photo img,.home-faces img,
.home-faces__bot,.gw-avatar{border-radius:var(--hy-r-ctl)}
/* segments inside a control, tags and badges */
.hy-tabs__tab,.hy-seg>*,.sv-tab,.rk-pill,.mg-chips>*,.home-flow__tabs button,
.hy-cmd__copy,.hy-footer__eu,.hy-footer__langs a,.hy-badge,.hy-label,.rk-badge,.home-chip,.home-banner,.home-flow__sel,
.hy-tick,.hy-check-list .hy-tick,.prose-site code,.prose-trust code,.hy-cm-copy code{border-radius:var(--hy-r-tag)}
.home-router__pii mark{border-radius:4px}
/* the logo mark */
.hy-mark{border-radius:var(--hy-r-mark)}
.hy-mark--sm{border-radius:var(--hy-r-tag)}
/* the flow's progress: 6px squares, the reached ones a 16px bar */
.home-flow__prog i{border-radius:var(--hy-r-dot)}
.home-flow__prog i.is-on{border-radius:3px}
/* toggle: 6px with a 3px knob */
.home-toggle{border-radius:var(--hy-r-tag)}
.home-toggle::after{border-radius:3px}
/* range sliders */
.rk-range::-webkit-slider-thumb,.gw-range[type=range]::-webkit-slider-thumb,.home-sizer input[type=range]::-webkit-slider-thumb{border-radius:4px}
.rk-range::-moz-range-thumb,.gw-range[type=range]::-moz-range-thumb,.home-sizer input[type=range]::-moz-range-thumb{border-radius:4px}
.rk-range::-webkit-slider-runnable-track,.gw-range[type=range]::-webkit-slider-runnable-track,.home-sizer input[type=range]::-webkit-slider-runnable-track,
.rk-range::-moz-range-track,.gw-range[type=range]::-moz-range-track,.home-sizer input[type=range]::-moz-range-track{border-radius:var(--hy-r-dot)}
/* tiny status squares, meters and bars: square-ish, never a dot */
.hy-sq,.hy-win__dots i,.prose-site ul li::before,.hy-notice::before,
.hy-checks li::before,.home-flow__packet,.home-router__meter i{border-radius:var(--hy-r-dot)}
.rk-bar,.mp-meter,.rank-bar,.home-lab__bar{border-radius:var(--hy-r-bar)}
.rk-bar i,.mp-meter i,.rank-bar i,.home-lab__bar i{border-radius:inherit}
/* the request diagram panel, and air under the model page windows so their
   rounded bottoms do not read as cut off by the band below */
.hy-cm-flow{border-radius:var(--hy-r-card)}
.hy-chapter.mp-hero{padding-bottom:40px}

/* Hero flow fixes (2 Nov 2026): the active tool/model tile is indigo with a white logo in every
   step state (the is-on step background used to win, leaving a white logo on cream), and the
   HostYourAI cloud in the Control tile is 20x14 as in v7k, not the 15x11 window-head mark. */
.home-hero__flow .home-flow__step .home-flow__tiles>i.is-hit,.home-flow__step.is-on .home-flow__tiles>i.is-hit{background:var(--hy-accent-strong);color:var(--hy-on-accent)}
.home-flow__tiles>i.is-hub .hy-mark{width:auto;height:auto}
.home-flow__tiles>i.is-hub .hy-mark svg{width:20px;height:14px}
