/* css/tokens.css */
/* Studio Swing redesign, concept D "The Line-up". Tokens only. Ground changed to #FDFBF7 (22 Oct build contract). */
:root{
  /* colour: surfaces */
  --c-paper:#FDFBF7;      /* page ground: warm off-white (contract: --ground #FDFBF7) */
  --ground:#FDFBF7;
  --c-white:#FFFFFF;
  --c-card:#F8F8F8;       /* form card, polaroid frame (#F9F7F4 in art) */
  --c-black:#0F0F0F;      /* dark band + footer (sampled #0E0E0D to #131312) */
  --c-footer:#0A0A0A;     /* footer: solid near-black (24 Oct), distinct from the navy closing section */
  --c-blue:#0B1F3A;       /* navy (logo navy), replaced electric blue 23 Oct */
  /* colour: ink and text */
  --c-ink:#0A0A0A;        /* headlines, body on paper (sampled #040403) */
  --c-text-muted:#4A4A4A; /* secondary text (DESIGN-RULES grey) */
  /* colour: action */
  --c-cta:#C2410C;        /* primary CTA fill, white label (rule; art sampled #BF3B09) */
  --c-cta-hover:#9A3412;
  /* colour: motifs */
  --c-fill-warm:#F1EDE4;  /* soft warm fill for table heads and tinted rows (neutral, not a motif) */
  --c-ph:#AAA9A7;         /* grey placeholder block on paper (art #AAA9A7 to #B3B2B0) */
  --c-ph-light:#DDDBD7;   /* placeholder card on paper */
  --c-ph-lilac:#D5D8F5;   /* placeholder on blue */
  --c-rule:#0A0A0A;
  --c-rule-soft:#C9C7C2;  /* decorative only */
  --c-field-border:#6B6A67; /* form border, >3:1 UI contrast */
  --c-focus:#C2410C;
  --c-focus-on-dark:#FFFFFF;

  /* type families */
  --f-display:"Anton","Archivo Narrow","Impact",sans-serif;
  --f-body:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono","IBM Plex Mono",ui-monospace,Menlo,monospace;
  --f-hand:"Caveat","Reenie Beanie",cursive;

  /* type scale, desktop (1440) */
  --fs-hero:176px;  --lh-hero:.86;
  --fs-h2:104px;    --lh-h2:.9;
  --fs-sub:60px;    --lh-sub:.95;
  --fs-h3:36px;     --lh-h3:1;
  --fs-lead:22px;   --lh-lead:1.4;
  --fs-body:18px;   --lh-body:1.55;
  --fs-small:16px;  --lh-small:1.5;
  --fs-label:14px;  --lh-label:1.4; --ls-label:.08em;
  --fs-btn:16px;    --ls-btn:.06em;
  --fs-hand:36px;

  /* spacing, 4 px base */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px;
  --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;
  --section-y:96px;
  --gutter:clamp(24px,5vw,80px);
  --container:1344px;
  --nav-h:72px;

  /* shape */
  --r-0:0; --r-1:2px; --r-card:2px;
  --bw:1px; --bw-strong:2px; --bw-frame:14px;
  --shadow-card:0 8px 18px rgba(0,0,0,.22),0 1px 3px rgba(0,0,0,.18);
  --target:48px;
  --c-accent:#C2410C;     /* burnt orange: action and emphasis */
  --c-structure:#0B1F3A;  /* navy: frames, screens, diagrams (was electric blue) */
  --c-error:#B42318;
  --shadow-hard:4px 4px 0 rgba(10,10,10,.9);
  --z-header:50;

  /* motion */
  --t-fast:120ms; --t-base:200ms; --ease:cubic-bezier(.2,.7,.2,1);
}
@media (max-width:767px){
  :root{
    --fs-hero:64px;  --lh-hero:.88;
    --fs-h2:46px;    --lh-h2:.92;
    --fs-sub:30px;   --lh-sub:1;
    --fs-h3:28px;
    --fs-lead:18px;  --lh-lead:1.45;
    --fs-body:16px;  --lh-body:1.55;
    --fs-label:14px;
    --fs-hand:28px;
    --section-y:56px;
    --nav-h:60px;
    --target:52px;
    --bw-frame:10px;
  }
}
/* css/base.css */
/* Base: fonts (self-hosted), reset, type, layout helpers. Owned by FOUNDATION. */
@font-face{font-family:Anton;font-weight:400;font-display:swap;src:url(../assets/fonts/anton.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:400;font-display:swap;src:url(../assets/fonts/dm-sans-400-latin.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:700;font-display:swap;src:url(../assets/fonts/dm-sans-700-latin.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-display:swap;src:url(../assets/fonts/JetBrainsMono-400.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:700;font-display:swap;src:url(../assets/fonts/JetBrainsMono-700.woff2) format("woff2")}
@font-face{font-family:Caveat;font-weight:700;font-display:swap;src:url(../assets/fonts/caveat-700.woff2) format("woff2")}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 16px)}
body{margin:0;background:var(--ground);color:var(--c-ink);font:400 var(--fs-body)/var(--lh-body) var(--f-body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.menu-open{overflow:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{margin:0 0 var(--s-4);font-family:var(--f-display);text-transform:uppercase;font-weight:400;letter-spacing:-.005em;line-height:1;overflow-wrap:break-word}
h1{font-size:var(--fs-hero);line-height:var(--lh-hero)}
h2{font-size:var(--fs-h2);line-height:var(--lh-h2)}
h3{font-size:var(--fs-h3);line-height:var(--lh-h3)}
h4{font-size:var(--fs-lead)}
p{margin:0 0 var(--s-4);max-width:68ch}
ul,ol{margin:0;padding:0}
a{color:var(--c-ink);text-underline-offset:.2em;text-decoration-thickness:1.5px}
a:hover{color:var(--c-cta)}
:focus-visible{outline:3px solid var(--c-focus);outline-offset:3px}
.on-dark :focus-visible,.sec--dark :focus-visible,.site-footer :focus-visible{outline-color:var(--c-focus-on-dark)}
::selection{background:var(--c-fill-warm);color:var(--c-ink)}
html{caret-color:var(--c-ink);accent-color:var(--c-ink);-webkit-tap-highlight-color:rgba(194,65,12,.18)}
input,textarea{caret-color:var(--c-ink)}
.skip-link{position:absolute;left:var(--gutter);top:-100px;z-index:100;background:var(--c-ink);color:#fff;padding:.75rem 1rem;min-height:44px;display:inline-flex;align-items:center}
.skip-link:focus{top:var(--s-4);color:#fff}
.wrap{max-width:calc(var(--container) + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter);width:100%}
.sec{position:relative;padding-block:var(--section-y)}
.visually-hidden,.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
main:focus{outline:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
/* css/components.css */
/* Shared components. Owned by FOUNDATION. Documented in build/components.html.
   Sections use these plus their own .sec--NAME scoped classes. */

/* ---- Buttons: 44px minimum target (token --target is 48/52) ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:var(--target);padding:.75rem 1.5rem;border:2px solid transparent;border-radius:var(--r-1);font:700 var(--fs-btn)/1.2 var(--f-mono);text-transform:uppercase;letter-spacing:var(--ls-btn);text-decoration:none;cursor:pointer;transition:background var(--t-base) var(--ease),color var(--t-base) var(--ease),border-color var(--t-base) var(--ease);-webkit-tap-highlight-color:transparent}
.btn::after{content:"";flex:none;width:22px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 14' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M0 7h20M14 1l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 14' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M0 7h20M14 1l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}
.btn--plain::after{content:none}
.btn-primary{background:var(--c-cta);color:#fff}
.btn-primary:hover{background:var(--c-cta-hover);color:#fff}
.btn-primary:active{transform:translateY(1px)}
.btn-secondary{background:transparent;color:var(--c-ink);border-color:var(--c-ink)}
.btn-secondary:hover{background:var(--c-ink);color:var(--ground)}
.on-dark .btn-secondary,.sec--dark .btn-secondary{color:#fff;border-color:#fff}
.on-dark .btn-secondary:hover,.sec--dark .btn-secondary:hover{background:#fff;color:var(--c-ink)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.btn-block{width:100%}
.link-arrow{display:inline-flex;align-items:center;min-height:44px;font:700 var(--fs-label)/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;text-decoration:underline;text-underline-offset:5px}
.link-arrow::after{content:"\2192";margin-left:.5rem;text-decoration:none;display:inline-block}

/* ---- Eyebrow: mono caps label with a rule running to the right edge. Use a <p>, never a heading. ---- */
.eyebrow{display:flex;align-items:center;gap:var(--s-4);margin:0 0 var(--s-4);max-width:none;font:400 var(--fs-label)/var(--lh-label) var(--f-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--c-text-muted)}
.eyebrow::after{content:"";flex:1;height:1px;background:var(--c-rule)}
.eyebrow--plain::after{content:none}
.on-dark .eyebrow,.sec--dark .eyebrow{color:#D9D8D4}
.on-dark .eyebrow::after,.sec--dark .eyebrow::after{background:#fff}

/* ---- Display type helpers (any element) ---- */
.h-display{font-family:var(--f-display);font-weight:400;text-transform:uppercase;letter-spacing:-.005em;font-size:var(--fs-h2);line-height:var(--lh-h2);margin:0 0 var(--s-4)}
.h-display--hero{font-size:var(--fs-hero);line-height:var(--lh-hero)}
.h-display--sub{font-size:var(--fs-sub);line-height:var(--lh-sub)}
.h-display--h3{font-size:var(--fs-h3);line-height:var(--lh-h3)}
.lead{font-size:var(--fs-lead);line-height:var(--lh-lead)}
.muted{color:var(--c-text-muted)}
.hand{font-family:var(--f-hand);font-weight:700;font-size:var(--fs-hand);line-height:1}

/* ---- Label chip (plain label: ink 2px border on paper, mono small caps, no tilt) ---- */
.tag-chip{display:inline-block;position:relative;background:var(--c-paper);color:var(--c-ink);border:2px solid var(--c-ink);padding:.3rem .8rem;font:700 var(--fs-label)/1.2 var(--f-mono);text-transform:uppercase;letter-spacing:.08em}
.tag-chip--abs{position:absolute;z-index:2}

/* ---- Cards and placeholders ---- */
.card{position:relative;background:var(--c-card);border:1.5px solid var(--c-ink);padding:var(--s-5);display:flex;flex-direction:column;gap:var(--s-2);box-shadow:var(--shadow-card)}
.card h3{margin:0}
.card p{margin:0}
a.card{text-decoration:none;color:var(--c-ink)}
.card .tag-chip--abs{top:-14px;left:var(--s-4)}
.placeholder{display:grid;place-items:center;text-align:center;min-height:200px;padding:var(--s-5);background:repeating-linear-gradient(135deg,var(--c-ph-light) 0 12px,var(--c-card) 12px 24px);border:2px dashed var(--c-text-muted);color:var(--c-text-muted);font:400 var(--fs-label)/1.4 var(--f-mono);text-transform:uppercase}

/* ---- Form fields: label above, 16px text, 1px #6B6A67 border (3:1 UI contrast) ---- */
.field{display:grid;gap:var(--s-2);margin-bottom:var(--s-5)}
.field label,.field legend{font:700 var(--fs-small)/1.3 var(--f-mono);letter-spacing:.02em}
.field .opt{font-weight:400;color:var(--c-text-muted)}
.field .hint{margin:0;font-size:var(--fs-small);color:var(--c-text-muted)}
.input,.textarea,.select{width:100%;min-height:var(--target);padding:.7rem .85rem;font:400 16px/1.4 var(--f-body);color:var(--c-ink);background:#fff;border:1px solid var(--c-field-border);border-radius:var(--r-1);-webkit-appearance:none;appearance:none}
.textarea{min-height:140px;resize:vertical}
.select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none' stroke='%230A0A0A' stroke-width='2'%3E%3Cpath d='M1 1l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85rem center;padding-right:2.5rem}
.input:focus-visible,.textarea:focus-visible,.select:focus-visible{outline:3px solid var(--c-focus);outline-offset:2px}
.field.is-error .input,.field.is-error .textarea,.input[aria-invalid="true"],.textarea[aria-invalid="true"]{border:2px solid var(--c-error)}
.field .error{margin:0;color:var(--c-error);font-size:var(--fs-small);font-weight:700}
.field .error[hidden]{display:none}
.choice{position:relative;display:flex;gap:.75rem;align-items:center;min-height:44px}
.choice input{position:absolute;opacity:0;width:44px;height:44px;margin:0;left:0;cursor:pointer}
.choice .mark{flex:none;width:24px;height:24px;border:1.5px solid var(--c-ink);background:#fff;display:grid;place-items:center}
.choice input[type=radio]+.mark{border-radius:50%}
.choice input:checked+.mark::after{content:"";width:12px;height:12px;background:var(--c-ink)}
.choice input[type=radio]:checked+.mark::after{border-radius:50%}
.choice input:focus-visible+.mark{outline:3px solid var(--c-focus);outline-offset:3px}
.choice span.text{font-size:var(--fs-small)}
.choice-row{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5)}
.form-status{min-height:1.5em;font-weight:700}

/* ---- FAQ disclosure: works with no JS. MOTION animates height via data-accordion. ---- */
.faq{border-top:1px solid var(--c-ink)}
.faq details{border-bottom:1px solid var(--c-ink)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:var(--s-4);min-height:64px;padding:var(--s-3) 0;cursor:pointer;font:400 var(--fs-h3)/1.05 var(--f-display);text-transform:uppercase;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 32px/1 var(--f-mono);flex:none;width:44px;text-align:center}
.faq details[open] summary::after{content:"\2212"}
.faq .faq-body{padding:0 0 var(--s-5);max-width:68ch}
.faq .faq-body p:last-child{margin-bottom:0}

/* ---- Skip + header ---- */
.site-header{position:sticky;top:0;z-index:var(--z-header);padding:0 48px;background:var(--ground);pointer-events:auto}
.site-header>*{pointer-events:auto}
.header-bar{max-width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);min-height:var(--nav-h);padding:0 var(--s-4) 0 var(--s-5);background:var(--ground);border:0;box-shadow:none;transition:min-height var(--t-base) var(--ease)}
.site-header.is-scrolled .header-bar{min-height:64px;border-bottom:1px solid var(--c-ink)}
.logo{display:inline-flex;align-items:center;min-height:44px;min-width:44px;text-decoration:none;flex:none}
.logo{gap:12px}.logo img{height:44px;width:auto}
.logo-word{font:700 25px/1 var(--f-body);letter-spacing:-.02em;color:var(--c-ink);white-space:nowrap}
.nav-desktop{display:none;flex:1;justify-content:center}
.nav-list{display:flex;align-items:center;gap:clamp(20px,3vw,48px);list-style:none;margin:0;padding:0}
.nav-list>li{position:relative}
.nav-link,.nav-sub-btn{display:inline-flex;align-items:center;min-height:44px;padding:0;background:none;border:0;border-bottom:2px solid transparent;font:400 16px/1 var(--f-body);text-decoration:none;color:var(--c-ink);cursor:pointer}
.nav-link:hover,.nav-sub-btn:hover,.nav-link[aria-current="page"],.nav-sub-btn[aria-expanded="true"]{border-bottom-color:var(--c-accent);color:var(--c-ink)}
.nav-sub{position:absolute;left:-12px;top:calc(100% + 4px);min-width:340px;list-style:none;margin:0;padding:0;background:var(--ground);border:1px solid var(--c-ink);box-shadow:var(--shadow-hard);z-index:2}
.nav-sub[hidden]{display:none}
.nav-sub li+li{border-top:1px solid var(--c-ink)}
.nav-sub a{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 20px;font:400 16px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;text-decoration:none;color:var(--c-ink)}
.nav-sub a::before{content:"";width:14px;height:14px;background:transparent;flex:none;margin-left:-6px}
.nav-sub a:hover,.nav-sub a:focus-visible{background:rgba(10,10,10,.04)}
.nav-sub a:hover::before,.nav-sub a:focus-visible::before{background:var(--c-accent)}
.header-actions{display:flex;align-items:center;gap:var(--s-3);flex:none}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;background:none;border:0;color:var(--c-ink);cursor:pointer;text-decoration:none}
.icon-btn:hover{color:var(--c-cta)}
.header-cta{display:none;min-height:52px}
.menu-toggle{min-width:64px;height:44px;padding:0 10px;border:0;background:var(--ground);font:700 14px/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink);cursor:pointer;border-radius:0}
/* Desktop nav needs ~1100px of bar; below 1280 the bar shows menu button + CTA instead (root cause of 74px overflow: nav + 304px CTA at 1024). */
.header-cta{padding:.5rem 1.1rem;min-height:48px}
@media (min-width:600px){.header-cta{display:inline-flex}}
.header-bar>*{min-width:0}.logo{min-width:0}
@media (min-width:1280px){
  .nav-desktop{display:flex}.menu-toggle{display:none}
  .header-bar{padding-left:var(--s-5)}
}
@media (max-width:1279px){
  .site-header{padding:0;background:var(--ground)}
  .header-bar{border-width:0 0 1px;box-shadow:none;min-height:var(--nav-h);padding:0 20px;max-width:none}
  .site-header.is-scrolled .header-bar{box-shadow:0 2px 0 rgba(10,10,10,.12)}
  .logo img{height:44px}
}
@media (max-width:480px){
  .header-bar{padding:0 16px;gap:var(--s-2)}
  .logo{gap:8px}.logo-word{font-size:20px}
  .header-actions{gap:var(--s-1)}
}

/* ---- Mobile menu (phone and tablet) ---- */
.mobile-menu{position:fixed;inset:var(--nav-h) 0 0 0;z-index:49;background:var(--ground);overflow-y:auto;display:flex;flex-direction:column;-webkit-overflow-scrolling:touch}
.mobile-menu[hidden]{display:none}
.mobile-menu ul{list-style:none;margin:0;padding:0}
.mobile-menu .m-main{padding:0 20px}
.m-main>li{border-bottom:1px solid var(--c-ink)}
.m-main>li:last-child{border-bottom:0}
.m-row{display:flex;align-items:center;justify-content:space-between;min-height:64px;width:100%;padding:8px 0;background:none;border:0;font:400 44px/1 var(--f-display);text-transform:uppercase;text-decoration:none;color:var(--c-ink);text-align:left;cursor:pointer}
.m-row::after{content:"";width:12px;height:12px;border-top:2px solid var(--c-ink);border-right:2px solid var(--c-ink);transform:rotate(45deg);margin-right:6px;flex:none}
button.m-row::after{transform:rotate(135deg);margin-top:-6px}
button.m-row[aria-expanded="true"]::after{transform:rotate(-45deg);margin-top:6px}
.mobile-menu .m-sub{padding:0 0 16px 16px}
.m-sub[hidden]{display:none}
.m-sub a{display:flex;align-items:center;min-height:44px;font:400 16px/1.3 var(--f-mono);letter-spacing:.04em;text-decoration:none;color:var(--c-ink)}
.m-search{display:flex;align-items:center;gap:16px;min-height:64px;padding:0 20px;border-top:1px solid var(--c-ink);border-bottom:1px solid var(--c-ink);font:400 16px/1 var(--f-mono);text-decoration:none;color:var(--c-ink)}
.m-search svg{flex:none}
.m-foot{margin-top:auto}
.m-foot .btn{width:100%;min-height:64px;justify-content:space-between;border-radius:0;font-size:18px;padding-inline:24px}
@media (min-width:1280px){.mobile-menu{display:none!important}}

/* ---- Footer ---- */
.site-footer,.site-footer.on-dark{background:var(--c-footer,#0A0A0A);color:#fff;padding-block:var(--s-8) var(--s-6)}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{color:var(--c-rule-soft)}
.footer-logo{display:inline-flex;align-items:center;justify-content:center;background:none;color:#FDFBF7;padding:10px 0;margin-bottom:var(--s-7);min-height:44px}
.footer-logo{gap:12px}.footer-logo img{height:48px;width:auto}
.footer-grid{display:grid;gap:var(--s-7) var(--s-6);grid-template-columns:1fr}
.footer-col h2{font:700 14px/1.2 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;margin:0 0 var(--s-4);color:#FDFBF7;position:relative} /* 23 Oct: navy footer with small mono labels, as in the page designs */
.footer-col ul{list-style:none}
.footer-col li a{display:inline-flex;align-items:center;min-height:44px;font:400 17px/1.3 var(--f-body,'DM Sans',sans-serif);letter-spacing:0} /* 23 Oct: regular type, as in the page designs */
.footer-col p{font:400 17px/1.5 var(--f-body,'DM Sans',sans-serif);color:#fff;max-width:30ch}
.footer-start .btn{margin-top:var(--s-2)}
.footer-bar{margin-top:var(--s-7);padding-top:var(--s-5);border-top:1px solid #fff;display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-2) var(--s-6);align-items:center;font:400 15px/1.5 var(--f-mono)}
.footer-bar p{margin:0;max-width:60ch}
.footer-links{display:flex;flex-wrap:wrap;gap:0 var(--s-6);list-style:none}
.footer-links a{display:inline-flex;align-items:center;min-height:44px;font-size:15px}
.footer-agency{opacity:.9}
@media (min-width:768px){.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.footer-grid{grid-template-columns:1fr 1fr 1.15fr 1.25fr}.footer-grid .footer-start{order:4}}
.footer-intro{display:none}
@media (max-width:1023px){
  .site-footer{padding-block:var(--s-6) var(--s-5)}
  .footer-logo{display:none}
  .footer-intro{display:block;margin:0 0 var(--s-5);font:400 16px/1.45 var(--f-body);color:#D9D8D4;max-width:none}
  .footer-grid{grid-template-columns:1fr 1fr;gap:var(--s-5) var(--s-5)}
  .footer-grid .footer-col:nth-child(1){grid-row:1 / span 2}
  .footer-start{grid-column:1 / -1;order:0;padding-top:var(--s-4);border-top:1px solid rgba(255,255,255,.25)}
  .footer-col h2{font:400 14px/1.4 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#D9D8D4;margin:0 0 var(--s-2)}
  .footer-col li a{font:400 16px/1.3 var(--f-body);text-decoration:underline;text-underline-offset:3px;min-height:44px}
  .footer-col li.f-cat{display:none}
  .footer-col p{font:400 16px/1.45 var(--f-body);max-width:none}
  .footer-start .btn{width:100%;border-radius:var(--r-1);margin-top:var(--s-2)}
  .footer-bar{flex-direction:column;align-items:flex-start;margin-top:var(--s-5);padding-top:var(--s-4);border-top:1px solid rgba(255,255,255,.25);font:400 16px/1.5 var(--f-body)}
  .footer-bar p{display:none}
  .footer-links{flex-direction:column;width:100%;gap:0}
  .footer-links a{font:400 16px/1.3 var(--f-body);text-decoration:underline;text-underline-offset:3px}
}

/* ---- Page transition wrapper (MOTION implements the effect; FOUNDATION provides the hook) ---- */
[data-transition]{min-height:60vh}

/* ---- Section background helpers ---- */
.sec--dark,.on-dark{background:var(--c-black);color:#fff}
.sec--blue{background:var(--c-blue);color:#fff}
@media print{.site-header,.mobile-menu{position:static}}

/* ---- 44px touch areas without visual change ---- */
.nav-chev{width:44px!important;margin-left:-8px}
.footer-col li a,.footer-links a,.footer-bar a{min-height:44px}
.footer-bar a,.footer-links a{display:inline-flex;align-items:center}
.logo picture,.footer-logo picture{display:contents}

/* ---- Orange accent details (restrained). MOTION animates .ix-link; this is the static fallback. ---- */
.eyebrow::before{content:"";flex:none;width:8px;height:8px;background:var(--c-accent)}
.eyebrow--plain::before{content:none}
.btn-secondary:hover{border-color:var(--c-ink)}
.btn-primary:focus-visible{outline-color:var(--c-focus)}
.ix-link{text-decoration-color:transparent;text-decoration-line:underline;text-underline-offset:.25em;text-decoration-thickness:2px;transition:text-decoration-color var(--t-base) var(--ease)}
.ix-link:hover,.ix-link:focus-visible{text-decoration-color:var(--c-accent)}
.site-footer a.ix-link:hover{color:#fff;text-decoration-color:var(--c-accent)}
.faq summary:hover::after,.link-arrow:hover{color:var(--c-accent)}
/* phone brush art: picture wrapper must not change layout */
picture:has(>.ix-icon){display:contents}
picture>source{display:none} /* 23 Oct: with display:contents the <source> became a grid item and pushed row text into the wrong columns */
.site-footer .logo-word{color:#FDFBF7} /* 23 Oct: light wordmark on navy footer */

/* ---- FAQ rows, one hover shade for every FAQ block (24 Oct 2026) ----
   The shade is the row's own ix-row::before (inset:0 = the row box). Padding lives on the row, so the text sits
   >=20px (phone 16px) from the left and right edge of the shade and >=14px (phone 12px) from the top and bottom,
   on all four sides, identically in every block. Summary-level shades were removed. */
:root{--faq-px:20px;--faq-py:14px}
@media (max-width:767px){:root{--faq-px:16px;--faq-py:12px}}
details.ix-row:is(.faq-item,.fg-item,.s4faq-item,.ws-q,.os-q,.sh-q,.b2-q){padding-inline:var(--faq-px)}
details.ix-row:is(.faq-item,.fg-item,.s4faq-item,.os-q,.sh-q)>summary{padding-block:var(--faq-py);padding-inline:0}
details.ix-row:is(.faq-item,.fg-item,.s4faq-item,.os-q,.sh-q)>:is(.faq-a,.fg-a,.s4faq-a,.os-a,.sh-a){padding-inline:0;padding-bottom:max(var(--faq-py),var(--s-4))}
details.ix-row:is(.ws-q,.b2-q){padding-block:var(--faq-py)}
details.ix-row.ws-q .ws-q__a{padding-block:0}
details.ix-row:is(.faq-item,.fg-item,.s4faq-item,.ws-q,.os-q,.sh-q,.b2-q):has(>summary:focus-visible){outline:0}
.footer-credit{margin:var(--s-3) 0 0;font:400 14px/1.5 var(--f-body);color:rgba(255,255,255,.75)}
.footer-credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}

.footer-mail{margin:var(--s-3,12px) 0 0}.footer-mail a{display:inline-flex;align-items:center;min-height:44px;font-size:17px}

/* ---- Success pop-out (26 Oct 2026, owner pick "The Cursor"). js/success-overlay.js builds a native <dialog>.
   The unanimated state is the finished state, so reduced motion simply removes the animations. ---- */
html:has(dialog.ss-pop[open]){overflow:hidden}
.ss-pop{width:100vw;height:100dvh;max-width:none;max-height:100dvh;margin:0;padding:0;border:0;overflow:auto;background:var(--c-blue);color:var(--c-white);font:400 var(--fs-body)/var(--lh-body) var(--f-body);animation:ss-wipe 520ms var(--ease) both}
.ss-pop::backdrop{background:rgba(10,10,10,.62)}
.ss-pop :focus-visible{outline:3px solid var(--c-focus-on-dark);outline-offset:3px}
.ss-pop__body{position:relative;display:grid;grid-template-columns:minmax(0,1fr);justify-items:start;align-content:center;gap:var(--s-6);min-height:100%;max-width:var(--container);margin:0 auto;padding:var(--s-9) var(--gutter) var(--s-6);box-sizing:border-box}
.ss-pop__bar{position:absolute;inset:var(--s-5) var(--gutter) auto;display:flex;align-items:center;justify-content:space-between;gap:var(--s-4)}
.ss-pop__logo{display:inline-flex;align-items:center;gap:var(--s-2)}
.ss-pop__logo img{display:block;height:36px;width:auto}
.ss-pop__word{font:700 17px/1 var(--f-body);color:var(--c-white)}
.ss-pop__x{flex:none;display:inline-flex;align-items:center;justify-content:center;width:var(--target);height:var(--target);border:var(--bw-strong) solid currentColor;border-radius:var(--r-1);background:transparent;color:inherit;font:400 30px/1 var(--f-body);cursor:pointer;transition:background var(--t-base) var(--ease),color var(--t-base) var(--ease)}
.ss-pop__x:hover{background:var(--c-white);color:var(--c-blue)}
.ss-pop__h{margin:0;font:400 clamp(56px,11vw,156px)/1 var(--f-display);text-transform:uppercase;letter-spacing:.01em}
.ss-pop__h:focus{outline:0}
.ss-pop__w{display:inline-block;max-inline-size:100%;overflow-wrap:anywhere}
.ss-pop__c{display:inline-block;animation:ss-char 1ms both}
.ss-pop__cur{display:inline-block;width:.34em;height:.78em;margin-left:.08em;vertical-align:baseline;background:var(--c-cta);animation:ss-char 1ms 1.6s both,ss-blink 1s 1.6s steps(1) infinite}
.ss-pop__log{display:grid;gap:var(--s-2);margin:0;padding:0;list-style:none;font:700 17px/1.5 var(--f-mono);text-transform:uppercase;letter-spacing:var(--ls-label)}
.ss-pop__log li{animation:ss-fade var(--t-base) var(--ease) both}
.ss-pop__log li::before{content:"> ";content:"> " / "";color:var(--c-cta)}
.ss-pop__actions{display:flex;flex-wrap:wrap;gap:var(--s-3)}
.ss-pop .btn-secondary{color:var(--c-white);border-color:var(--c-white)}
.ss-pop .btn-secondary:hover{background:var(--c-white);color:var(--c-blue)}
@keyframes ss-fade{from{opacity:0}}
@keyframes ss-wipe{from{clip-path:inset(100% 0 0 0)}}
@keyframes ss-char{from{opacity:0}}
@keyframes ss-blink{50%{opacity:0}}
@media (max-width:767px){
  .ss-pop__actions .btn{width:100%}
  .ss-pop__log{font-size:16px}
}
@media (prefers-reduced-motion:reduce){
  .ss-pop,.ss-pop *{animation:none!important}
}
/* css/motion.css */
/* Studio Swing motion system. Transform and opacity only (accordion/expand height is the one agreed exception).
   Hidden start states exist ONLY under html.js-motion, so no-JS and reduced-motion see static content. */
:root{
  --m-out:cubic-bezier(.22,1,.36,1);        /* things arriving */
  --m-io:cubic-bezier(.65,0,.35,1);         /* things leaving / moving between states */
  --m-spring:cubic-bezier(.34,1.56,.64,1);  /* pops, stamps, button release */
  --m-t-micro:160ms; --m-t-ui:280ms; --m-t-reveal:640ms; --m-t-hero:900ms;
  --m-dist:28px; --m-dist-x:40px;
}

/* ---------- reveal ---------- */
html.js-motion [data-reveal]{opacity:0;translate:0 var(--m-dist);will-change:opacity,translate}
html.js-motion [data-reveal="left"]{translate:calc(var(--m-dist-x) * -1) 0}
html.js-motion [data-reveal="right"]{translate:var(--m-dist-x) 0}
html.js-motion [data-reveal="scale"]{translate:0 12px;scale:.94}
html.js-motion [data-reveal].is-in{opacity:1;translate:0 0;scale:1;
  transition:opacity var(--m-t-reveal) var(--m-out) var(--m-delay,0ms),translate var(--m-t-reveal) var(--m-out) var(--m-delay,0ms),scale var(--m-t-reveal) var(--m-out) var(--m-delay,0ms);will-change:auto}

/* ---------- brush icon pop ---------- */
html.js-motion [data-pop]{opacity:0;scale:.55;rotate:-14deg}
html.js-motion [data-pop].is-in{opacity:1;scale:1;rotate:0deg;
  transition:opacity 220ms ease var(--m-delay,0ms),scale 640ms var(--m-spring) var(--m-delay,0ms),rotate 640ms var(--m-spring) var(--m-delay,0ms)}

/* ---------- stamp: label fades in (no tilt) ---------- */
html.js-motion [data-stamp]{opacity:0}
html.js-motion [data-stamp].is-in{opacity:1;transition:opacity 260ms ease var(--m-delay,0ms)}

/* ---------- blue splash drift (individual transform props so it composes with parallax) ---------- */
@keyframes m-drift-a{0%{translate:0 0;rotate:0deg;scale:1}50%{translate:2.2% -3%;rotate:2.5deg;scale:1.04}100%{translate:-1.5% 2%;rotate:-2deg;scale:1.02}}
@keyframes m-drift-b{0%{translate:0 0;rotate:0deg;scale:1.02}50%{translate:-2.6% 2.4%;rotate:-3deg;scale:.97}100%{translate:1.8% -1.6%;rotate:2deg;scale:1.05}}
html.js-motion [data-splash]{animation:m-drift-a 19s ease-in-out infinite alternate;will-change:translate,rotate,scale}
html.js-motion [data-splash]:nth-of-type(even),html.js-motion [data-splash="b"]{animation-name:m-drift-b;animation-duration:24s}

/* ---------- parallax / tilt / magnetic (JS writes custom properties, CSS owns the transform) ---------- */
[data-parallax]{transform:translate3d(0,var(--m-py,0px),0)}
[data-tilt]{transform:perspective(900px) rotateX(var(--m-rx,0deg)) rotateY(var(--m-ry,0deg)) translate3d(0,var(--m-lift,0px),0);transition:transform var(--m-t-ui) var(--m-out),box-shadow var(--m-t-ui) var(--m-out)}
[data-tilt].is-tilting{transition:transform 80ms linear,box-shadow var(--m-t-ui) var(--m-out);box-shadow:0 18px 32px rgba(0,0,0,.18)}
[data-magnetic]{transform:translate3d(var(--m-mx,0px),var(--m-my,0px),0);transition:transform 380ms var(--m-spring),background .15s,color .15s}
[data-magnetic].is-magnet{transition:transform 90ms linear,background .15s,color .15s}
[data-magnetic]:active{scale:.96;transition:scale 90ms var(--m-io)}

/* ---------- progress line ---------- */
[data-progress-line]{position:relative}
[data-progress-line]::after{content:"";position:absolute;inset:0;background:var(--m-line-fill,var(--c-cta,#C2410C));transform-origin:50% 0;transform:scaleY(var(--m-p,0));pointer-events:none}
[data-progress-line="x"]::after,[data-progress-line].is-x::after{transform-origin:0 50%;transform:scaleX(var(--m-p,0))}
html:not(.js-motion) [data-progress-line]::after{transform:none}
html.is-leaving .nav-sub{display:none!important}
/* steps are never dimmed or scaled: unreached = normal. Sections may style .is-active/.is-passed as a small accent. */

/* ---------- header ---------- */
.site-header{transition:none}
.site-header::after{content:"";position:absolute;inset:auto 0 -14px 0;height:14px;pointer-events:none;background:linear-gradient(rgba(0,0,0,.14),rgba(0,0,0,0));opacity:0;transition:opacity var(--m-t-ui) ease}
.site-header.is-scrolled::after{opacity:1}
.site-header .brand,.site-header .logo,.site-header [data-header-logo]{transform-origin:left center;transition:transform var(--m-t-ui) var(--m-out)}
.site-header.is-scrolled .brand,.site-header.is-scrolled .logo,.site-header.is-scrolled [data-header-logo]{transform:scale(.86)}
.site-header.is-hidden-up{translate:0 0}

/* ---------- accordion / expand ---------- */
[data-accordion] [aria-expanded] .m-chevron,[data-accordion] summary::after{transition:rotate var(--m-t-ui) var(--m-out)}
[data-accordion] [aria-expanded="true"] .m-chevron{rotate:180deg}
[data-accordion] details[open]>summary .m-chevron{rotate:180deg}
html.js-motion [data-expand-panel]:not(.is-open):not(.is-animating){display:none}
[data-expand-panel].is-animating{overflow:hidden}

.hook-word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.hook-word>span{display:inline-block;translate:0 112%;rotate:5deg;transform-origin:0 100%;transition:translate 820ms var(--m-out) var(--m-delay,0ms),rotate 820ms var(--m-out) var(--m-delay,0ms)}
html:not(.js-motion) .hook-word>span,.hook-words-in .hook-word>span{translate:0 0;rotate:0deg}

/* ---------- page transition ---------- */
@view-transition{navigation:auto}
.site-header{view-transition-name:site-header}
::view-transition-old(root){animation:m-vt-out 200ms var(--m-io) both}
::view-transition-new(root){animation:m-vt-in 420ms var(--m-out) 60ms both}
@keyframes m-vt-out{to{opacity:0;translate:0 -8px}}
@keyframes m-vt-in{from{opacity:0;translate:0 14px}}
html.m-vt-fallback.is-leaving body{opacity:0;transition:opacity 180ms var(--m-io)}
html.m-vt-fallback.js-motion body{animation:m-page-in 420ms var(--m-out) both}
@keyframes m-page-in{from{opacity:0}to{opacity:1}}


/* ---------- hero: ambient float + scroll-linked layers (hero.js sets .hero-float and --hp 0..1) ---------- */
@keyframes m-float-a{0%{translate:0 0;rotate:0deg}50%{translate:0 -7px;rotate:.8deg}100%{translate:0 3px;rotate:-.6deg}}
@keyframes m-float-b{0%{translate:0 0;rotate:0deg}50%{translate:0 6px;rotate:-1deg}100%{translate:0 -4px;rotate:.7deg}}
.hero-float .hr-lineup>li{animation:m-float-a 7s ease-in-out infinite alternate}
.hero-float .hr-lineup>li:nth-child(even){animation-name:m-float-b;animation-duration:8.5s}
.hero-float .hr-lineup>li:nth-child(3n){animation-duration:9.5s;animation-delay:-3s}
.hero-float .hr-you{animation:m-float-b 10s ease-in-out infinite alternate}

/* ---------- interaction API (hover = focus-visible = :active/tap) ---------- */
.ix-row{position:relative;isolation:isolate}
.ix-row::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ix-tint,rgba(194,65,12,.08));transform:scaleX(0);transform-origin:0 50%;transition:transform 440ms var(--m-out);pointer-events:none}
.ix-row:is(:hover,:active,:focus-visible)::before,.ix-row:has(:focus-visible)::before{transform:scaleX(1)}
.ix-arrow{display:inline-block;opacity:0;translate:-12px 0;transition:opacity var(--m-t-ui) ease,translate 420ms var(--m-out);color:var(--c-accent,#C2410C)}
.ix-row:is(:hover,:active,:focus-visible) .ix-arrow,.ix-row:has(:focus-visible) .ix-arrow{opacity:1;translate:0 0}
@media (hover:none){.ix-arrow{opacity:.85;translate:0 0}.ix-row:active .ix-arrow{translate:5px 0}}
@keyframes m-wiggle{0%{rotate:0deg;translate:0 0}25%{rotate:-9deg;translate:0 -3px}55%{rotate:7deg;translate:0 -1px}80%{rotate:-3deg}100%{rotate:0deg;translate:0 0}}
.ix-icon{display:inline-block;transform-origin:50% 70%}
.ix-row:is(:hover,:active,:focus-visible) .ix-icon,.ix-row:has(:focus-visible) .ix-icon{animation:m-wiggle 620ms var(--m-spring) 1}
.ix-card{transition:translate 300ms var(--m-out),box-shadow 300ms var(--m-out)}
.ix-card:is(:hover,:active,:focus-visible),.ix-card:has(:focus-visible){translate:0 -6px;box-shadow:0 18px 32px rgba(0,0,0,.2),0 3px 6px rgba(0,0,0,.12)}
.ix-link{text-decoration:none;background:linear-gradient(var(--c-accent,#C2410C),var(--c-accent,#C2410C)) 0 100%/0 2px no-repeat;transition:background-size 360ms var(--m-out),color .15s;padding-bottom:2px}
.ix-link:is(:hover,:active,:focus-visible){background-size:100% 2px;color:inherit}
.ix-press{transition:scale 140ms var(--m-io),background .15s,color .15s}
.ix-press:active{scale:.97}


/* ---------- text layer (motion.js initText: attached by selector, opt out with data-no-motion) ----------
   Hidden start states exist only under html.js-motion AND only on elements JS has already prepared, so a JS failure or
   reduced motion leaves plain, fully visible text. Transform/opacity only (individual translate/scale properties). */
/* headline: each word rises out of its own clipping mask; stagger runs line by line */
.m-mask .m-w{display:inline-block;overflow:hidden;vertical-align:top;padding:.14em .08em;margin:-.14em -.08em}
.m-mask .m-wi{display:inline-block}
html.js-motion .m-mask:not(.m-t-in) .m-wi{translate:0 118%}
html.js-motion .m-mask.m-t-in .m-wi{translate:0 0;transition:translate var(--m-dur,700ms) var(--m-out) var(--m-delay,0ms)}
.m-mask.m-done .m-w{overflow:visible}
/* lede / intro: words fade and settle in sequence */
.m-fade .m-w{display:inline-block}
html.js-motion .m-fade:not(.m-t-in) .m-w{opacity:0;translate:0 .6em}
html.js-motion .m-fade.m-t-in .m-w{opacity:1;translate:0 0;transition:opacity 520ms ease var(--m-delay,0ms),translate 680ms var(--m-out) var(--m-delay,0ms)}
.m-hero{--m-dur:700ms}
/* eyebrow label, hero extras (buttons, small print), list rows: one rise each */
html.js-motion .m-eb:not(.m-t-in){opacity:0;translate:-16px 0}
html.js-motion .m-eb.m-t-in{opacity:1;translate:0 0;transition:opacity 520ms ease var(--m-delay,0ms),translate 640ms var(--m-out) var(--m-delay,0ms)}
html.js-motion .m-rise:not(.m-t-in),html.js-motion .m-li:not(.m-t-in){opacity:0;translate:0 20px}
html.js-motion .m-rise.m-t-in,html.js-motion .m-li.m-t-in{opacity:1;translate:0 0;transition:opacity 560ms ease var(--m-delay,0ms),translate 680ms var(--m-out) var(--m-delay,0ms)}
/* body paragraphs, captions, quotes: small fade-up */
html.js-motion .m-p:not(.m-t-in){opacity:0;translate:0 16px}
html.js-motion .m-p.m-t-in{opacity:1;translate:0 0;transition:opacity 520ms ease var(--m-delay,0ms),translate 640ms var(--m-out) var(--m-delay,0ms)}
html.js-motion .m-stage:not(.m-t-in){opacity:0;scale:.965;translate:0 18px}
html.js-motion .m-stage.m-t-in{opacity:1;scale:1;translate:0 0;transition:opacity 1100ms ease var(--m-delay,0ms),scale 1400ms var(--m-out) var(--m-delay,0ms),translate 1400ms var(--m-out) var(--m-delay,0ms)}
/* rules draw from the left (or top) */
html.js-motion .m-rule:not(.m-t-in){scale:0 1;transform-origin:0 50%}
html.js-motion .m-rule.m-v:not(.m-t-in){scale:1 0;transform-origin:50% 0}
html.js-motion .m-rule.m-t-in{scale:1 1;transition:scale 700ms var(--m-out) var(--m-delay,0ms)}
/* emphasis on key words (em / mark inside headlines): an underline draws under the word */
.m-em{position:relative}
.m-em::after{content:"";position:absolute;left:0;right:0;bottom:-.02em;height:.085em;background:currentColor;pointer-events:none;transform-origin:0 50%}
html.js-motion .m-em:not(.m-t-in)::after{scale:0 1}
html.js-motion .m-em.m-t-in::after{scale:1 1;transition:scale 700ms var(--m-out) var(--m-delay,0ms)}
.m-instant,.m-instant *,.m-instant::after{transition:none!important}
/* hover roll for button links: the label slides up and a copy slides in from below (real pointers only) */
@media (hover:hover) and (pointer:fine){
  .m-roll{display:inline-block;overflow:hidden;vertical-align:top;position:relative}
  .m-roll-i{display:block;transition:translate 420ms var(--m-out)}
  .m-roll::after{content:attr(data-t);content:attr(data-t) / "";position:absolute;left:0;top:100%;width:100%;white-space:inherit;text-align:inherit;transition:translate 420ms var(--m-out)}
  a:is(:hover,:focus-visible) .m-roll-i{translate:0 -100%}
  a:is(:hover,:focus-visible) .m-roll::after{translate:0 -100%}
}
@media print{.m-mask .m-wi,.m-fade .m-w,.m-eb,.m-rise,.m-li,.m-p,.m-stage,.m-rule{opacity:1!important;translate:none!important;scale:none!important}.m-em::after{scale:none!important}}

/* ---------- reduced motion: static, content visible ---------- */
@media (prefers-reduced-motion:reduce){
  [data-reveal],[data-pop],[data-stamp],[data-splash],.hook-word>span{opacity:1!important;translate:none!important;scale:none!important;rotate:none!important;animation:none!important;transition:none!important}
  [data-parallax],[data-tilt],[data-magnetic]{transform:none!important;transition:none!important}
  [data-progress-line]::after{transform:none!important}
  .hero-float *{animation:none!important;transform:none!important}
  .ix-row::before{transition:none}.ix-arrow{transition:none;translate:none}.ix-icon{animation:none!important}
  .ix-card,.ix-press,.ix-link{transition:none!important}
  .ix-card:is(:hover,:active,:focus-visible){translate:none}.ix-press:active{scale:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
  .site-header::after{transition:none}
  .m-mask .m-wi,.m-fade .m-w,.m-eb,.m-rise,.m-li,.m-p,.m-stage,.m-rule,.m-em::after{opacity:1!important;translate:none!important;scale:none!important;transition:none!important}
  .m-roll-i,.m-roll::after{transition:none!important;translate:none!important}
  .m-roll::after{display:none}
}

/* text motion v2: details/FAQ icon turns with the expand; opt out any element or subtree with data-motion="off" (JS skips it) */
[data-motion="off"] .m-w,[data-motion="off"] .m-wi{translate:none!important;opacity:1!important}
/* css/sections/about-01-07.css */
/* About page. Own classes only (.ab-*). */
.ab-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sec--ab-hero,.sec--ab-jobs,.sec--ab-concepts,.sec--ab-stand,.sec--ab-standards,.sec--ab-own,.sec--ab-faq,.sec--ab-close{background:var(--ground)}
.sec--ab-hero{padding-block:var(--s-5) var(--s-8)}
.sec--ab-jobs,.sec--ab-concepts{padding-block:var(--s-8)}
.sec--ab-jobs,.sec--ab-concepts,.sec--ab-stand,.sec--ab-standards,.sec--ab-own{border-top:1px solid var(--c-rule-soft)}
.ab-h2{font-size:clamp(34px,4.6vw,68px);line-height:.95;margin-bottom:var(--s-5);text-transform:none;letter-spacing:-.01em}
.sec--ab-stand .ab-h2,.sec--ab-standards .ab-h2,.sec--ab-own .ab-h2{text-transform:uppercase}
.ab-crumb ol{list-style:none;display:flex;gap:var(--s-2);margin:0 0 var(--s-5);padding:0;font-size:var(--fs-small)}
.ab-crumb li+li::before{content:">";margin-right:var(--s-2)}
.ab-crumb a{min-height:44px;display:inline-flex;align-items:center}
.ab-hero__grid{display:grid;gap:var(--s-6);grid-template-columns:1fr}
.ab-hero__h1{font-family:var(--f-display);font-weight:400;font-size:clamp(40px,5.6vw,82px);line-height:.98;margin:0 0 var(--s-5);letter-spacing:-.005em}
.ab-hero__lead{font-size:clamp(17px,1.5vw,20px);line-height:1.55;max-width:34em;margin:0 0 var(--s-5)}
.ab-hero__cta .btn{width:100%}
.ab-fine{margin:var(--s-3) 0 0;color:var(--c-text-muted);font-size:var(--fs-body)}
.ab-hero__art img,.ab-con__art img{width:100%;height:auto;display:block;mix-blend-mode:multiply}
.ab-jobs__list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-6);grid-template-columns:1fr}
.ab-job{position:relative;padding-bottom:var(--s-4)}
.ab-job__art{display:block;width:100%;max-width:300px;height:auto;mix-blend-mode:multiply;margin-bottom:var(--s-4)}
.ab-job__h{font-family:var(--f-display);font-weight:400;font-size:clamp(30px,2.6vw,38px);line-height:1;margin:0 0 var(--s-2);letter-spacing:-.005em}
.ab-job p{margin:0;font-size:var(--fs-body);line-height:1.5}
.ab-jobs__foot{margin-top:var(--s-6);border-top:1px solid var(--c-rule-soft);padding-top:var(--s-5)}
.ab-jobs__foot p{margin:0 0 var(--s-3)}
.ab-link{text-decoration-line:underline;text-decoration-color:var(--c-blue);text-underline-offset:.25em;text-decoration-thickness:1px;color:var(--c-blue);display:inline-flex;align-items:center;min-height:44px}
.ab-link:hover,.ab-link:focus-visible{text-decoration-color:var(--c-accent)}
.ab-link--mono{font-family:var(--f-mono);font-size:var(--fs-small);color:var(--c-ink);text-decoration-color:var(--c-ink)}
.ab-con__grid{display:grid;gap:var(--s-5);grid-template-columns:1fr;align-items:center}
.ab-con__text p{font-size:clamp(17px,1.4vw,19px);line-height:1.55;max-width:30em;margin:0 0 var(--s-4)}
.ab-head{display:grid;gap:var(--s-4);grid-template-columns:1fr;align-items:end;margin-bottom:var(--s-5)}
.ab-head__lead{font-size:clamp(17px,1.4vw,19px);line-height:1.5;max-width:36em;margin:0}
.ab-head__art img{display:block;width:100%;max-width:220px;height:auto;mix-blend-mode:multiply}
.ab-head__art--wide img{max-width:300px}
.ab-stand__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;border-top:1px solid var(--c-blue)}
.ab-stand__item{padding:var(--s-5) 0;border-bottom:1px solid var(--c-blue)}
.ab-stand__item h3{font:700 clamp(17px,1.4vw,19px)/1.3 var(--f-body);margin:0 0 var(--s-2)}
.ab-stand__item p{margin:0;font-size:var(--fs-body);line-height:1.5}
.ab-table{margin:0;border-top:1px solid var(--c-blue)}
.ab-row{display:grid;grid-template-columns:1fr;border-bottom:1px solid var(--c-blue);padding:var(--s-4) 0;gap:var(--s-1)}
.ab-row dt{font:700 var(--fs-body)/1.35 var(--f-body)}
.ab-row dd{margin:0;font-size:var(--fs-body);line-height:1.5}
.ab-faq__grid{display:grid;gap:var(--s-5);grid-template-columns:1fr}
.ab-faq__art{max-width:260px}
.ab-faq__art img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.ab-q{border-bottom:1px solid var(--c-rule-soft);padding:var(--s-4) 0}
.ab-q summary{list-style:none;cursor:default}
.ab-q summary::-webkit-details-marker{display:none}
.ab-q h3{font-family:var(--f-display);font-weight:400;font-size:clamp(24px,2.1vw,30px);line-height:1.05;margin:0 0 var(--s-2);letter-spacing:-.005em}
.ab-q p{margin:0;font-size:var(--fs-body);line-height:1.5}
.ab-faq__more{margin:var(--s-4) 0 0}
.sec--ab-close{padding-block:var(--s-8) var(--s-9)}
.ab-close__h{font-size:clamp(34px,5vw,74px);line-height:.95;max-width:14em;margin-bottom:var(--s-5)}
.ab-close__lead{font-size:clamp(17px,1.5vw,20px);line-height:1.5;max-width:36em;margin:0 0 var(--s-5)}
.sec--ab-close .btn{width:100%}
.ab-close__links{margin:var(--s-4) 0 0;display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center}
@media (min-width:768px){
  .sec--ab-hero{padding-block:var(--s-6) var(--s-9)}
  .ab-hero__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--s-7);align-items:center}
  .ab-hero__cta .btn,.sec--ab-close .btn{width:auto}
  .ab-jobs__list{grid-template-columns:repeat(3,1fr);gap:0}
  .ab-job{padding:0 var(--s-5)}
  .ab-job:first-child{padding-left:0}
  .ab-job+.ab-job{border-left:1px solid var(--c-rule-soft)}
  .ab-con__grid{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:var(--s-7)}
  .ab-head{grid-template-columns:minmax(0,1fr) auto}
  .ab-head__art img{max-width:280px}
  .ab-head__art--wide img{max-width:340px}
  .ab-stand__list{grid-template-columns:1fr 1fr}
  .ab-stand__item{padding:var(--s-5) var(--s-6) var(--s-5) 0}
  .ab-stand__item:nth-child(even){padding-left:var(--s-6);padding-right:0;border-left:1px solid var(--c-blue)}
  .ab-row{grid-template-columns:minmax(200px,.45fr) 1fr;gap:var(--s-5);padding:var(--s-3) var(--s-4)}
  .ab-row dt{border-right:1px solid var(--c-blue);padding-right:var(--s-4)}
  .ab-faq__grid{grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr);gap:var(--s-7)}
  .ab-faq__art{max-width:none}
}
.ab-q summary{min-height:44px;display:flex;align-items:center}
.ab-hero__h1,.ab-job__h,.ab-q h3,.ab-stand__item h3{text-transform:none}
.sec--ab-stand,.sec--ab-standards,.sec--ab-own,.sec--ab-faq{padding-block:var(--s-8)}
@media (max-width:767px){.sec--ab-stand,.sec--ab-standards,.sec--ab-own,.sec--ab-faq,.sec--ab-jobs,.sec--ab-concepts{padding-block:var(--s-7)}}
.ab-crumb ol{align-items:center}.ab-crumb li{display:inline-flex;align-items:center}
.ab-hero__h1{line-height:1.03}.ab-h2{line-height:1.02}.ab-q h3{line-height:1.1}
@media (min-width:768px){.ab-head__art img{max-width:210px}.ab-head__art--wide img{max-width:270px}}
.ab-head{margin-bottom:var(--s-6)}
/* measured pass: sizes from the design slices scaled x1.406 to 1440 */
@media (min-width:768px){
  .ab-hero__h1{font-size:clamp(56px,6.7vw,97px);line-height:1.0}
  .ab-hero__lead{font-size:22px;line-height:1.58}
  .ab-h2{font-size:clamp(40px,4.8vw,69px)}
  .sec--ab-concepts .ab-h2{font-size:clamp(34px,3.7vw,53px);white-space:nowrap}
  .sec--ab-stand .ab-h2,.sec--ab-standards .ab-h2,.sec--ab-own .ab-h2{font-size:clamp(48px,6.1vw,88px);line-height:.98}
  .sec--ab-own .ab-h2{max-width:9.6em}
  .ab-q h3{font-size:clamp(26px,2.45vw,35px)}
  .ab-job__art{max-width:380px}
  .ab-con__grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr)}
  .ab-con__text p{max-width:25em;font-size:19px}
}
@media (min-width:1100px){
  .ab-hero__grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0}
  .ab-hero__art{margin-left:-110px}
}
.ab-br{display:none}
@media (min-width:768px){
  .ab-br{display:inline}
  .sec--ab-own .ab-h2{max-width:none}
  .sec--ab-concepts .ab-h2{font-size:clamp(34px,4.07vw,58px)}
  .sec--ab-stand{padding-top:var(--s-9)}
  .ab-q{padding:var(--s-5) 0}
}
@media (min-width:1100px){
  .ab-hero__grid{grid-template-columns:minmax(0,860px) minmax(0,1fr)}
  .ab-hero__art{margin-left:-150px}
}
/* measured pass 2: design body text is about 21px at 1440; art larger */
@media (min-width:768px){
  .ab-hero__h1{font-size:clamp(50px,5.3vw,76px);line-height:1.22}
  .ab-hero__lead{max-width:800px}
  .ab-job p,.ab-stand__item p,.ab-row dd,.ab-q p,.ab-head__lead,.ab-close__lead,.ab-fine{font-size:21px;line-height:1.5}
  .ab-con__text p{font-size:21px;line-height:1.5;max-width:30em}
  .ab-row dt{font-size:21px}
  .ab-stand__item h3{font-size:22px}
  .ab-stand__item{padding-block:var(--s-6)}
  .ab-job__art{max-width:340px}
  .ab-con__grid{grid-template-columns:minmax(0,1fr) 500px}
  .sec--ab-concepts .ab-h2{font-size:clamp(34px,3.9vw,56px)}
  .ab-head__art img{max-width:330px}
  .sec--ab-standards .ab-head__art img{max-width:290px}
  .ab-head__art--wide img{max-width:370px}
  #standards .ab-row{grid-template-columns:minmax(200px,.35fr) 1fr}
  #ownership .ab-row{grid-template-columns:minmax(180px,.25fr) 1fr}
  .ab-row{padding-block:var(--s-4)}
}
@media (min-width:1100px){.ab-hero__art{width:620px;margin-left:-130px}}
@media (min-width:768px){
  .ab-head__art img{max-width:290px}
  .sec--ab-standards .ab-head__art img{max-width:250px}
  .ab-head__art--wide img{max-width:330px}
  .ab-stand__item{padding-block:var(--s-5)}
}
.ab-hero__main{position:relative;z-index:2}
.ab-ul{position:relative;display:inline-block}
.ab-ul::after{content:"";position:absolute;left:0;bottom:-.06em;width:min(100%,2.3em);height:.07em;min-height:4px;background:var(--c-accent);border-radius:3px;transform:rotate(-.6deg)}
#about-faq .ab-link--mono::after{content:"\2192";margin-left:.6em;text-decoration:none;display:inline-block}
@media (min-width:768px){
  .sec--ab-hero{padding-top:var(--s-7)}
  .ab-job p,.ab-stand__item p,.ab-row dd,.ab-q p,.ab-head__lead,.ab-close__lead,.ab-fine,.ab-con__text p{font-size:22px}
  .ab-row dt{font-size:22px}
  .ab-stand__item h3{font-size:23px}
  .ab-hero__lead{font-size:22px}
  .ab-hero__cta .btn,.sec--ab-close .btn{min-height:58px;padding-inline:28px;font-size:18px}
  .ab-faq__art img{max-width:400px}
  .ab-faq__grid{grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:var(--s-6)}
}
/* measured pass 3 */
@media (min-width:768px){
  .ab-jobs__foot p{font-size:21px}
  .ab-link{font-size:21px}
  .ab-link--mono{font-size:19px}
  .ab-job__art{max-width:100%;width:auto;height:290px;object-fit:contain;object-position:left center}
  .ab-job__art--seo{height:290px}
  .sec--ab-own .ab-h2{font-size:clamp(44px,5.15vw,74px)}
  .ab-head__art--wide img{max-width:400px}
  #ownership .ab-row{grid-template-columns:minmax(220px,.28fr) 1fr}
  .ab-close__h{font-size:clamp(40px,4.9vw,70px);max-width:1100px}
  .ab-close__lead{max-width:1000px}
  .ab-hero__lead{max-width:770px}
}
@media (min-width:1100px){.ab-hero__art{width:570px;margin-left:-70px}}
@media (min-width:768px){.sec--ab-own .ab-h2{font-size:clamp(40px,4.5vw,65px)}.sec--ab-own .ab-head{grid-template-columns:minmax(0,1fr) 330px}}
@media (max-width:767px){.ab-ul::after{display:none}}
/* review fixes */
.sec--ab-concepts .ab-h2{white-space:normal}
.ab-stand__list{position:relative}
@media (min-width:768px){
  .sec--ab-concepts .ab-h2{font-size:clamp(34px,3.6vw,52px);white-space:normal}
  .ab-con__grid{grid-template-columns:minmax(0,1fr) 480px}
  .ab-q h3{font-size:clamp(24px,2.15vw,31px)}
  .ab-stand__list::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--c-blue)}
  .ab-stand__item:nth-child(even){border-left:0}
  .ab-stand__item{padding-block:var(--s-4)}
  .sec--ab-stand .ab-h2,.sec--ab-standards .ab-h2,.sec--ab-own .ab-h2{color:var(--c-ink)}
}
@media (max-width:767px){
  .ab-hero__art img,.ab-con__art img{max-width:300px;margin-inline:auto}
  .ab-job__art{max-width:210px}
  .ab-head__art img{max-width:170px}
  .ab-head__art--wide img{max-width:200px}
  .ab-faq__art img{max-width:200px}
  .ab-stand__item{padding:var(--s-4) 0}
  .ab-hero__art{margin-top:var(--s-4)}
}
@media (min-width:768px){.sec--ab-concepts .ab-h2{font-size:clamp(30px,3.05vw,44px)}.ab-con__grid{grid-template-columns:minmax(0,1fr) 520px;gap:var(--s-6)}}
/* design's own drawings (sharpened crops) at design sizes */
@media (min-width:768px){
  .ab-job__art,.ab-job__art--seo{width:100%;max-width:380px;height:auto;object-fit:initial}
  .ab-con__art img{width:100%;max-width:520px}
  .ab-head__art img{max-width:360px}
  .sec--ab-standards .ab-head__art img{max-width:270px}
  .ab-head__art--wide img{max-width:400px}
  .ab-faq__art img{max-width:400px}
}
@media (min-width:1100px){.ab-hero__art{width:577px;margin-left:-70px}}
@media (min-width:768px){#standards .ab-row{grid-template-columns:minmax(300px,.4fr) 1fr}.sec--ab-stand .ab-h2,.sec--ab-standards .ab-h2{font-size:clamp(46px,5.75vw,83px)}}
/* round 3 */
@media (min-width:768px){
  .ab-job__art{margin-bottom:var(--s-2)}
  .ab-job__h{margin-bottom:var(--s-1)}
  .sec--ab-jobs{padding-block:var(--s-7) var(--s-7)}
  .sec--ab-concepts{padding-block:var(--s-6)}
  .ab-con__grid{align-items:start}
  .ab-con__art{margin-top:calc(var(--s-5) * -1)}
  .ab-stand__list{border-top:0}
  .ab-stand__item{border-bottom:1px solid var(--c-blue)}
  .ab-stand__item:nth-last-child(-n+2){border-bottom:0}
  .ab-stand__list::before{background:rgba(11,31,58,.55)}
  .ab-row dt{font-weight:600}
  .ab-q h3{font-size:clamp(24px,2.05vw,30px)}
  .ab-faq__grid{align-items:start}
  .ab-faq__art{padding-top:var(--s-5)}
  #about-faq .ab-link--mono{font-size:20px}
  #about-faq .ab-link--mono::after{content:"";width:24px;height:15px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 14' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M0 7h20M14 1l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 14' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M0 7h20M14 1l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;margin-left:.7em}
  .ab-close__h{font-size:clamp(36px,4.6vw,66px);max-width:none}
}
@media (min-width:768px){.ab-close__h{font-size:clamp(34px,4.2vw,60px)}.ab-close__lead{max-width:760px}.ab-faq__art img{max-width:440px}.ab-faq__art{padding-top:0;margin-left:-20px}}
/* layout fix: hero art inside the viewport and clear of the h1 below 1440 (1440 unchanged) */
@media (min-width:1100px) and (max-width:1439px){
.ab-hero__grid{grid-template-columns:minmax(0,1fr) min(440px,36vw)}
.ab-hero__art{width:100%;margin-left:0}
}
/* layout fix: concepts grid single column on tablet */
@media (min-width:768px) and (max-width:900px){
.ab-con__grid{grid-template-columns:minmax(0,1fr)}
.ab-con__art{margin-top:0}
.ab-con__art img{max-width:420px}
}
/* mobile audit 24 Oct: smaller illustrations, no stray separator, 44px link rows, owner tag as label */
@media (max-width:767px){
  .ab-hero__art img,.ab-con__art img{max-width:210px}
  .ab-job__art{max-width:130px;margin-bottom:var(--s-2)}
  .ab-head__art{display:none}
  .ab-faq__art img{max-width:150px}
  .ab-close__links{flex-direction:column;align-items:flex-start;gap:0}
  .ab-close__links>span{display:none}
  .ab-close__links .ab-link{min-height:44px}
  .ab-owner{display:block;margin-top:var(--s-1);font:400 var(--fs-small) var(--f-mono);color:var(--c-text-muted);text-transform:uppercase;letter-spacing:.06em}
}
/* css/sections/analytics-consent.css */
/* Hidden until a configured analytics property needs an explicit choice. */
.analytics-choice[hidden],.analytics-settings[hidden]{display:none!important}
.analytics-choice{position:fixed;inset:auto 16px 16px;z-index:1000;max-width:680px;padding:24px;background:#fff;color:#14181c;border:2px solid #14181c;box-shadow:0 4px 24px #0002}
.analytics-choice h2{margin:0 0 12px;font-size:26px;line-height:1.2}
.analytics-choice p{margin:0 0 16px;font-size:17px;line-height:1.5}
.analytics-choice p a{color:#14181c;text-decoration:underline;text-underline-offset:3px;font-weight:600}
.analytics-choice p a:focus-visible{outline:3px solid #b74408;outline-offset:3px}
.analytics-choice__actions{display:flex;flex-wrap:wrap;gap:12px}
.analytics-choice button,.analytics-settings{font:inherit;font-size:16px;line-height:1.4;min-height:44px;padding:10px 16px;cursor:pointer}
.analytics-choice button{flex:1;border:2px solid #14181c;background:#fff;color:#14181c}
.analytics-choice button:focus-visible,.analytics-settings:focus-visible{outline:3px solid #b74408;outline-offset:4px}
.analytics-settings{background:transparent;color:inherit;border:1px solid currentColor}
@media(max-width:600px){.analytics-choice{inset:auto 12px 12px;padding:20px;max-height:calc(100dvh - 24px);overflow:auto}.analytics-choice h2{font-size:26px}}
/* The consent banner and its buttons are never part of the entrance motion: visible and un-translated from the first frame. */
.analytics-choice,.analytics-choice *,.analytics-settings{opacity:1!important;translate:none!important;scale:none!important;rotate:none!important;animation:none!important;transition:none!important}
/* css/sections/guide-scale.css */
/* GUIDE template type-and-space scale pass, 24 Oct 2026. Scoped to the guide classes (gd-*), all 47 g-* guides plus "guide". Loaded by build.py's sorted glob; the `html` prefix keeps it above guide.css whatever the order.
   Targets: H1 56 desktop / 32 phone (uppercase condensed), H2 40 / 26, body 17-18 (never below 16), section padding 56 desktop / 32 phone, first view carries information. Copy untouched. */

/* headings */
html .gd-h1{font-size:clamp(36px,3.9vw,56px);line-height:1.02;letter-spacing:.005em;text-transform:uppercase;max-inline-size:18em}
html .gd-h2{font-size:clamp(28px,2.8vw,40px);line-height:1.05;letter-spacing:.005em;text-transform:uppercase;margin-bottom:var(--s-4,16px);padding-top:0;min-height:64px}
html .gd-h3{font-size:clamp(22px,2vw,28px);line-height:1.1;letter-spacing:.005em;text-transform:uppercase}
html .gd-handtag{font-size:clamp(18px,1.6vw,22px)}
html .gd-bandh{font-size:clamp(28px,2.8vw,40px);line-height:1.05;text-transform:uppercase}
html .gd-reltitle{font-size:clamp(26px,2.6vw,36px);line-height:1.05;text-transform:uppercase}
html .gd-ctitle{font-size:clamp(22px,2vw,26px)}
html .gd-launch__title{font-size:clamp(24px,2.2vw,30px)}

/* body copy 17-18, tighter leading */
html .gd-lede{font-size:clamp(18px,1.5vw,20px);line-height:1.45;max-inline-size:40em}
html .gd-p,html .gd-list{font-size:clamp(17px,1.25vw,18px);line-height:1.5;max-inline-size:42em}
html .gd-small,html .gd-src,html .gd-tintro,html .gd-sources{font-size:17px}
html .gd-checks li,html .gd-rel,html .gd-bandfine,html .gd-bandquiet a{font-size:17px;line-height:1.4}
html .gd-bandline{font-size:clamp(17px,1.3vw,19px)}
html .gd-ic{font-size:clamp(16px,1.3vw,18px)}
html .gd-table,html .gd-table th{font-size:16px}
html .gd-tfoot{font-size:16px}
html .gd-handnote{font-size:clamp(20px,1.7vw,24px)}
html .gd-toc__a{font-size:16px}
html .gd-lede{margin-top:0}

/* section and chapter rhythm: 56 px between chapters */
html .sec--gd{padding-block:var(--s-4,16px) 56px}
html .gd-chaps{margin-top:var(--s-5,24px)}
html .gd-chap{padding-block:28px}
html .gd-hero{margin-top:var(--s-4,16px)}
html .gd-num{width:64px;height:64px;left:calc(-1 * var(--gd-rail) + var(--gd-line) - 32px);top:28px;font-size:clamp(24px,2.2vw,30px)}
html .gd-chap:first-child>.gd-num{top:28px;font-size:clamp(30px,2.8vw,40px)}
html .sec--gdrel{padding-block:0 56px}
html .sec--gdband{padding-block:56px}
html .gd-ic img{height:120px}

/* tablet and phone */
@media (max-width:1100px){html .gd-chap{padding-block:16px}}
@media (max-width:767px){
  html .gd-h1{font-size:32px;line-height:1.04}
  html .gd-h2{font-size:26px;line-height:1.08;min-height:0;margin-bottom:var(--s-3,12px)}
  html .gd-h3{font-size:22px}
  html .gd-bandh{font-size:26px}
  html .gd-reltitle{font-size:26px}
  html .gd-lede{font-size:17px;line-height:1.45}
  html .gd-p,html .gd-list{font-size:17px;line-height:1.5}
  html .gd-checks li{font-size:17px}
  html .gd-table td{font-size:16px}
  html .sec--gd{padding-block:var(--s-3,12px) 32px}
  html .gd-chap{padding-block:16px}
  html .sec--gdrel{padding-block:0 32px}
  html .sec--gdband{padding-block:32px}
  html .gd-ic img{height:72px}
}

/* hero art: no taller than needed so the contents and the first chapter arrive sooner */
@media (min-width:1101px){html .gd-hero .gd-svg--d{width:auto;max-width:100%;height:min(460px,32vw);margin-inline:auto}}
html .gd-ctitle,html .gd-launch__title{text-transform:uppercase}

/* nothing under 16 px */
html .gd-crumb ol,html .gd-eyebrow,html .gd-by,html .gd-rel__note,html .gd-toc__a,html .gd-tocm__a,html .gd-code,html .gd-tfoot,html .gd-ttitle,html .gd-align ul{font-size:16px}
html .gd-p code,html .gd-list code,html .gd-checks code,html .gd-mono{font-size:16px}
html .gd-table th,html .gd-table td::before,html .gd-ribbon__row li{font-size:16px}
@media (max-width:767px){html .gd-code{font-size:16px}html .gd-table td::before{font-size:16px}html .gd-crumb ol{font-size:16px}}

/* variants: steps, hero image caps */
html .gd-steps{font-size:clamp(17px,1.25vw,18px);line-height:1.5}
html .gd-steps--cards{font-size:17px}
html .gd-sn{font-size:clamp(20px,1.7vw,24px)}
@media (min-width:1101px){
  html .gd-heroimg{width:auto!important;max-width:100%;max-height:min(440px,31vw);height:auto;object-fit:contain}
  html .gd-hv-right .gd-heroimg,html .gd-hv-left .gd-heroimg{width:100%!important;max-height:none}
}

/* contents rail vs chapter timeline (24 Oct 2026): the article's two blocks (hero zone, chapters) become rows of the page grid, so chapter 01 and its rail start below whichever is taller, the contents list or the header. Fixes the rail and the "01" badge running through tall contents lists. */
@media (min-width:1101px){
  html .gd-article{display:contents}
  html .gd-toc{grid-column:1;grid-row:1}
  html .gd-herozone{display:block;grid-column:2;grid-row:1;min-width:0}
  html .gd-hv-right .gd-herozone,html .gd-hv-left .gd-herozone{display:grid}
  html .gd-chaps{grid-column:2;grid-row:2;min-width:0;margin-top:var(--s-6,32px)}
}
/* long contents lists: tighter rows (44 px touch target kept) so the header gap beside a 13 to 15 item list stays short */
@media (min-width:1101px){
  html .gd--long .gd-toc__a{min-height:44px;padding-block:3px;line-height:1.3}
  html .gd--long .gd-toc__label{margin-bottom:var(--s-4,16px)}
}

/* text clearance (12 px min from any border or box edge), 24 Oct 2026 */
html .gd-num{width:84px;height:84px;left:calc(-1 * var(--gd-rail) + var(--gd-line) - 42px);top:20px}
html .gd-eyebrow{margin-bottom:20px}
html .gd-table th{padding-block:14px}
html .gd-ccard{padding-top:22px}
html .gd-h3row{margin-bottom:16px}
html .gd-pill{padding:11px 16px}
html .gd-sn{width:64px;height:64px;font-size:24px}
html .gd-ribbon__row li{padding:12px 16px}
html .sec--gd:not(.gd-tv-ruled) .gd-ttitle{padding:12px 18px}
html .gd-tcard .gd-ttitle,html .gd-tcard--plain .gd-ttitle{font-size:16px}
html .gd-icons{padding-top:44px}
html .gd-icons__tag{padding:12px 20px;top:-32px}
html .gd-bandv-split .gd-bandfine{margin-top:16px}
@media (max-width:767px){
  html .gd-eyebrow{margin-bottom:16px}
  html .gd-h2{margin-bottom:20px}
  html .gd-table thead{display:none}
  html .gd-table tr{padding-block:14px}
  html .gd-table th.gd-phase{padding:12px 14px;margin-bottom:12px}
  html .gd-svg__t,html .gd-svg__s{font-size:16px}
}
html .gd-pill{padding:13px 16px}
html .sec--gd:not(.gd-tv-ruled) .gd-ttitle{padding:14px 18px}
html .gd-ribbon__row li{padding:14px 16px}
html .gd-align,html .gd-launch{padding-top:26px}
/* the "icons" label sits inside its box (not straddling the border line) so no text touches a rule */
html .gd-icons{padding-top:28px}
html .gd-icons__tag{position:static;display:inline-block;border:0;background:none;padding:0;margin:0 0 var(--s-4,16px)}
@media (max-width:767px){
  html .gd-table td:has(.gd-pill){padding-block:12px}
}
@media (max-width:767px){
  html .gd-align li,html .gd-align .gd-mono,html .gd-align__dest{overflow-wrap:anywhere;white-space:normal;min-width:0;max-width:100%}
}
html .sec--gd .gd-tcard:has(.gd-twrap){max-inline-size:none}
html .gd-checks li,html .gd-checks li>span{min-width:0;overflow-wrap:anywhere}
html .gd-h3row{margin-bottom:22px}
@media (max-width:767px){html .gd-table th.gd-phase{padding:14px}}
@media (min-width:768px){html .gd-tcard:has(th:nth-child(8)){padding-inline:8px}}
html .gd-ttitle:empty{display:none}
@media (min-width:1101px){html .gd-railart{left:calc(-1 * var(--gd-rail) + var(--gd-line) + 52px)}}
@media (max-width:767px){html .gd-svg__t,html .gd-svg__s{letter-spacing:-.05em}}

/* round 2 (24 Oct 2026): empty callout card (empty checklist) is not drawn; breadcrumb separator stays with its item at phone width */
html .gd-checks:empty{display:none}
html .gd-ccard:has(>.gd-checks:empty:only-child){display:none}
@media (max-width:767px){html .gd-crumb li{flex:none;max-width:100%}html .gd-crumb li+li::before{display:none}html .gd-crumb li:not(:nth-last-child(-n+2))::after{content:">";margin-inline-start:.4em;color:var(--c-ink);flex:none}}

/* polish 25 Oct 2026: tablet and desktop breadcrumb. The ">" separator stays with the crumb it follows (trailing), so a long title that wraps never starts a line with ">" */
@media (min-width:768px){html .gd-crumb li+li::before{display:none}html .gd-crumb li:not(:last-child)::after{content:">";margin-inline-start:.5em;color:var(--c-ink);flex:none}html .gd-crumb li{max-width:100%}}
/* css/sections/guide.css */
/* CLS: metric-matched local fallbacks so a late webfont swap keeps line wraps and box heights (size-adjust measured against Arial/Courier New/Impact widths) */
@font-face{font-family:"DM Sans Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:103.5%;ascent-override:95.8%;descent-override:29.9%;line-gap-override:0%}
@font-face{font-family:"JetBrains Mono Fallback";src:local("Courier New"),local("Liberation Mono"),local("Courier");size-adjust:100%;ascent-override:102%;descent-override:30%;line-gap-override:0%}
@font-face{font-family:"Anton Fallback";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("Helvetica Bold");size-adjust:83.5%;ascent-override:140.9%;descent-override:39.3%;line-gap-override:0%}
:root{--f-body:"DM Sans","DM Sans Fallback",system-ui,-apple-system,"Segoe UI",sans-serif;--f-mono:"JetBrains Mono","JetBrains Mono Fallback","IBM Plex Mono",ui-monospace,Menlo,monospace;--f-display:"Anton","Anton Fallback","Archivo Narrow","Impact",sans-serif}
/* Guide template (T-GUIDE): .sec--gd .sec--gdrel .sec--gdband. Scoped with gd-. One stylesheet for all 48 guides.
   Sizes measured from the design slices (1024 wide x 1.406 = 1440). */
.sec--gd,.sec--gdrel{background:var(--ground,#FDFBF7);color:var(--c-ink,#0A0A0A)}
.sec--gd{--gd-rail:261px;--gd-line:50px;padding-block:var(--s-5,24px) var(--s-8,64px);font-family:var(--f-body)}
.gd-grid{display:grid;grid-template-columns:var(--gd-rail) minmax(0,1fr);margin-inline:var(--gutter);max-width:var(--container,1344px);column-gap:0}
@media (min-width:1500px){.gd-grid{margin-inline:auto}}
.gd-mono{font-family:var(--f-mono);font-size:.86em;overflow-wrap:normal}
.gd-link,.gd-p a,.gd-sources a,.gd-rel a{color:var(--c-blue,#0B1F3A);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.gd-link:hover,.gd-p a:hover,.gd-sources a:hover,.gd-rel a:hover{text-decoration-thickness:2px;color:var(--c-cta)}
.gd-link:focus-visible,.gd-p a:focus-visible,.gd-sources a:focus-visible,.gd-rel a:focus-visible,.gd-toc__a:focus-visible,.gd-crumb a:focus-visible{outline:3px solid var(--c-focus,#C2410C);outline-offset:3px}
.gd-arr{display:inline-block;vertical-align:-1px;margin-inline-start:2px}

/* contents rail */
.gd-toc{position:relative;z-index:3;align-self:start;padding-top:var(--s-4,16px);font-family:var(--f-mono)}
.gd-toc__label{font:700 clamp(16px,1.25vw,18px)/1.2 var(--f-mono);letter-spacing:.04em;margin:0 0 var(--s-5,24px);position:relative;z-index:4}
.gd-toc__list{list-style:none;margin:0;padding:0 0 0 var(--s-4,16px);position:relative;display:grid;gap:0}
.gd-toc__list::before{content:"";position:absolute;left:5px;top:12px;bottom:12px;width:0;border-left:2px dotted #B9B5AD}
.gd-toc__list li{position:relative}
.gd-toc__list li::before{content:"";position:absolute;left:-16px;top:calc(50% - 5px);width:11px;height:11px;border-radius:50%;background:var(--c-cta)}
.gd-toc__a{display:flex;gap:var(--s-4,16px);align-items:center;min-height:clamp(44px,3.75vw,54px);padding-block:6px;font-size:clamp(14px,1.11vw,16px);color:var(--c-blue,#0B1F3A);text-decoration:none}
.gd-toc__a span{color:var(--c-cta);font-weight:700}
.gd-toc__a:hover{text-decoration:underline;text-underline-offset:4px}

/* header block */
.gd-article{min-width:0}
.gd-crumb ol{list-style:none;margin:0 0 var(--s-2,8px);padding:0;display:flex;flex-wrap:wrap;gap:0 .5em;font:400 clamp(14px,1.11vw,16px)/1.4 var(--f-mono)}
.gd-crumb li{display:flex;align-items:center}
.gd-crumb ol{align-items:center}
.gd-crumb li+li::before{content:">";margin-inline-end:.5em;color:var(--c-ink)}
.gd-crumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-blue,#0B1F3A);text-decoration:underline;text-underline-offset:4px}
.gd-crumb [aria-current]{color:var(--c-text-muted,#4A4A4A)}
.gd-eyebrow{display:flex;align-items:center;gap:.7em;margin:0 0 var(--s-3,12px);font:400 clamp(14px,1.11vw,16px)/1.4 var(--f-mono)}
.gd-eyedot{width:7px;height:7px;border-radius:50%;background:var(--c-cta)}
.gd-h1{font:400 clamp(40px,4.31vw,62px)/1.12 var(--f-display);letter-spacing:-.03em;text-transform:none;margin:0;color:var(--c-ink);max-inline-size:14em}
.gd-by{font:700 clamp(14px,1.04vw,15px)/1.4 var(--f-mono);margin:var(--s-3,12px) 0 var(--s-2,8px)}
.gd-lede{font-size:clamp(17px,1.67vw,24px);line-height:1.4;margin:0;max-inline-size:37.5em}

.gd-hero{margin:var(--s-5,24px) calc(-1 * var(--s-8,64px)) 0 calc(-1 * var(--s-8,64px));position:relative}
.gd-svg{display:block;width:100%;height:auto;overflow:visible}
.gd-svg--m{display:none}
.gd-svg__t{font-family:var(--f-mono);font-size:21px;font-weight:700}
.gd-svg__h{font-family:var(--f-display);font-size:30px;font-weight:400;letter-spacing:.01em}
.gd-svg__s{font-size:16.5px;font-weight:700}

/* chapters with the timeline rail */
.gd-chaps{position:relative;margin-top:var(--s-6,32px)}
.gd-chap{position:relative;padding-block:var(--s-5,24px) var(--s-6,32px)}
.gd-chap::before{content:"";position:absolute;left:calc(-1 * var(--gd-rail) + var(--gd-line));top:0;bottom:0;border-left:2px dotted #B9B5AD}
.gd-chap:first-child::before{top:12px}
.gd-chap:last-child::before{bottom:auto;height:100%}
.gd-num{position:absolute;left:calc(-1 * var(--gd-rail) + var(--gd-line) - 42px);top:calc(var(--s-5,24px) - 8px);width:84px;height:84px;border-radius:50%;background:var(--c-cta);border:2px solid var(--c-ink);color:#fff;display:grid;place-items:center;font:400 clamp(26px,2.8vw,40px)/1 var(--f-display)}
.gd-h2{font:400 clamp(30px,3.47vw,50px)/1.08 var(--f-display);text-transform:none;letter-spacing:-.005em;margin:0 0 var(--s-5,24px);padding-top:4px;color:var(--c-ink);min-height:84px;display:flex;align-items:center}
.gd-chap__body>*{max-inline-size:none}
.gd-p,.gd-lede{color:#2B2B2B}
.gd-p{font-size:clamp(16px,1.67vw,24px);line-height:1.4;margin:0 0 var(--s-4,16px);max-inline-size:38.5em}
.gd-small{font-size:clamp(16px,1.4vw,20px)}
.gd-h3row{display:flex;align-items:baseline;gap:var(--s-4,16px);flex-wrap:wrap;margin:var(--s-5,24px) 0 var(--s-2,8px)}
.gd-h3{font:400 clamp(26px,2.82vw,40.6px)/1.05 var(--f-display);text-transform:none;letter-spacing:0;margin:0}
.gd-handtag{font:700 clamp(20px,1.9vw,27px)/1 var(--f-hand);color:var(--c-ink);transform:rotate(-2deg)}
.gd-src{margin:var(--s-3,12px) 0 0;font-size:clamp(16px,1.3vw,18.7px)}
.gd-src .gd-link{display:inline-flex;align-items:center;min-height:44px}

/* tables */
.gd-tcard{position:relative;margin:var(--s-5,24px) 0;background:#FBF6EC;border:1px solid var(--c-ink);padding:var(--s-4,16px) var(--s-5,24px) var(--s-5,24px)}
.gd-tcard:focus-visible{outline:3px solid var(--c-focus);outline-offset:3px}
.gd-tcard--plain{background:transparent;border:0;border-top:2px solid var(--c-ink);padding:var(--s-3,12px) 0 0}
.gd-tcard--notebook{margin-inline:calc(-1 * var(--s-4,16px)) 0;padding-left:var(--s-8,64px);background:#FBF6EC;box-shadow:0 0 0 1px rgba(10,10,10,.15)}
.gd-tcard--notebook::before,.gd-tcard--ring::before{content:"";position:absolute;left:-14px;top:28px;bottom:20px;width:46px;background:radial-gradient(ellipse 18px 8px at 20px 12px,var(--c-ink) 0 7px,transparent 8px) 0 0/46px 46px repeat-y}
.gd-tcard--ring{padding-left:var(--s-8,64px);margin-inline:calc(-1 * var(--s-4,16px)) calc(-1 * var(--s-4,16px));background:#FBF6EC;box-shadow:8px 8px 0 var(--c-blue,#0B1F3A)}
.gd-ttitle{position:relative;display:inline-block;margin:0 0 var(--s-3,12px);padding:4px 14px;background:var(--c-paper);border:2px solid var(--c-ink);font:700 clamp(15px,1.2vw,17px)/1.3 var(--f-mono)}
.gd-tcard--plain .gd-ttitle{background:none;padding:0;font-size:clamp(16px,1.4vw,20px)}
.gd-tintro{font-size:clamp(16px,1.3vw,18.7px);margin:0 0 var(--s-3,12px)}
.gd-tfoot{margin:var(--s-3,12px) 0 0;font-size:clamp(15px,1.1vw,16px);color:var(--c-text-muted,#4A4A4A)}
.gd-twrap{overflow-x:auto}
.gd-table{border-collapse:collapse;width:100%;font-size:clamp(14px,1.18vw,17px);line-height:1.4}
.gd-table th{background:var(--c-fill-warm);text-align:left;font:700 clamp(14px,1.18vw,17px)/1.3 var(--f-mono);padding:10px 12px;border-bottom:2px solid var(--c-ink)}
.gd-table td{padding:10px 12px;border-bottom:1px solid #CFC7B6;vertical-align:top}
.gd-pill{display:inline-block;padding:2px 8px;border:1px solid var(--c-ink);background:#fff;font-weight:700;white-space:nowrap}
.gd-pill--keep{background:#EFE3C8}
.gd-pill--improve{background:#F9DCCB;border-color:var(--c-cta)}
.gd-pill--combine{background:#E4E9F1;border-color:var(--c-blue)}
.gd-pill--move{background:#fff;border-color:var(--c-blue);color:var(--c-blue)}
.gd-pill--retire{background:#E8E6E1}
.gd-table--phases th.gd-phase{width:130px;border-right:2px solid var(--c-ink);background:#F3E6CB;vertical-align:top;font-family:var(--f-body);font-weight:700}
.gd-table--phases th.gd-phase--2{background:#F9E3D3}.gd-table--phases th.gd-phase--3{background:#E4E9F1}.gd-table--phases th.gd-phase--4{background:#EFE3C8}
.gd-pencil{position:absolute;pointer-events:none;height:auto}
.gd-pencil--nb{width:150px;right:-15px;bottom:-64px;transform:rotate(-58deg);transform-origin:50% 50%}
.gd-tcard:has(.gd-pencil--nb){margin-bottom:104px}
.gd-tcard--notebook{margin-bottom:var(--s-7,48px)}

/* page decisions icons */
.gd-icons{position:relative;margin:var(--s-6,32px) 0;border:2px solid var(--c-ink);background:#FBF6EC;padding:var(--s-6,32px) var(--s-5,24px) var(--s-4,16px)}
.gd-icons__tag{position:absolute;left:var(--s-4,16px);top:-18px;margin:0;padding:4px 18px;background:var(--c-paper);border:2px solid var(--c-ink);font:700 clamp(16px,1.5vw,21px)/1.3 var(--f-mono)}
.gd-icons__row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:var(--s-3,12px)}
.gd-ic{display:flex;flex-direction:column;align-items:center;gap:var(--s-2,8px);font:700 clamp(16px,1.6vw,23px)/1.2 var(--f-mono);text-align:center}
.gd-ic img{width:min(100%,170px);height:150px;object-fit:contain}

/* checklists */
.gd-ccard{position:relative;margin:var(--s-5,24px) 0;border:2px solid var(--c-ink);background:#fff;padding:var(--s-4,16px) var(--s-5,24px);max-inline-size:36em;box-shadow:6px 6px 0 var(--c-rule-soft)}
.gd-ctitle{margin:0 0 var(--s-3,12px);font:400 clamp(22px,2.1vw,30px)/1.1 var(--f-display)}
.gd-checks{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.gd-checks--cols{grid-template-columns:1fr 1fr;column-gap:var(--s-5,24px);padding-right:60px}
.gd-checks li{display:flex;gap:var(--s-3,12px);align-items:flex-start;font-size:clamp(16px,1.5vw,21.6px);line-height:1.35;padding-block:4px}
.gd-box{flex:none;margin-top:1px}
.gd-ccard--inline{max-inline-size:34em}
.gd-launch{position:relative;margin:var(--s-4,16px) 0 var(--s-5,24px);overflow:visible;border:2px solid var(--c-ink);background:#fff;box-shadow:10px 10px 0 var(--c-rule-soft);padding:var(--s-4,16px) var(--s-6,32px) var(--s-5,24px);max-inline-size:44em}
.gd-launch__title{margin:0 0 var(--s-3,12px);font:400 clamp(26px,2.5vw,36px)/1.1 var(--f-display)}
.gd-launch__title--2{margin-top:0}

.gd-pencil--launch{width:200px;right:0;bottom:-100px;transform:rotate(-58deg);transform-origin:50% 50%}
.gd-launch{margin-bottom:140px}
.gd-handnote{font:700 clamp(22px,2vw,28px)/1.1 var(--f-hand);transform:rotate(-3deg);margin:var(--s-3,12px) 0 0;color:var(--c-ink)}

/* code + alignment */
.gd-code{margin:var(--s-3,12px) 0 var(--s-5,24px);padding:var(--s-4,16px) var(--s-5,24px);background:#FBF6EC;border:2px solid var(--c-ink);overflow-x:auto;font:400 clamp(14px,1.1vw,16px)/1.6 var(--f-mono)}
.gd-code__line{display:block;white-space:pre-wrap;overflow-wrap:anywhere;padding-left:2em;text-indent:-2em}
.gd-code i{display:inline-block;width:2em;color:var(--c-text-muted);font-style:normal}
.gd-code em{font-style:normal;background:#F9DCCB}
.gd-align{margin:var(--s-5,24px) 0;max-inline-size:44em;border:2px solid var(--c-ink);background:#fff;padding:var(--s-4,16px) var(--s-5,24px)}
.gd-align ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3,12px);font-size:clamp(14px,1.1vw,16px)}
.gd-align li{display:flex;gap:var(--s-3,12px)}
.gd-dot{flex:none;width:12px;height:12px;border-radius:50%;background:var(--c-cta);margin-top:6px}
.gd-align__row{display:grid;grid-template-columns:1fr auto auto;gap:var(--s-4,16px);align-items:center}
.gd-align__flow{color:var(--c-cta)}.gd-align__flow .gd-arr{width:44px;height:26px}
.gd-align__dest{margin:0;padding:var(--s-3,12px) var(--s-4,16px);border:2px solid var(--c-ink);background:var(--c-fill-warm);font-weight:700}

/* sources + cta */
.gd-sources{margin:var(--s-5,24px) 0;font-size:clamp(16px,1.3vw,18.7px);line-height:1.5}
.gd-sources p{margin:0 0 4px}
.gd-sources__links a{display:inline-flex;align-items:center;min-height:44px}
.gd-sources__note{color:var(--c-text-muted)}
.gd-cta{margin-top:var(--s-5,24px)}
.gd-cta .btn{margin-top:var(--s-3,12px);min-height:56px}
.gd-railart{position:absolute;left:calc(-1 * var(--gd-rail) + var(--gd-line) + 28px);top:24%;width:140px;height:auto}

/* keep going */
.sec--gdrel{padding-block:0 var(--s-8,64px)}
.gd-relwrap{margin-inline:var(--gutter);padding-left:var(--gd-rail,261px);max-width:var(--container,1344px)}
@media (min-width:1500px){.gd-relwrap{margin-inline:auto}}
.gd-rule{border:0;border-top:1px solid var(--c-blue);margin:0 0 var(--s-5,24px)}
.gd-reltitle{font:400 clamp(28px,2.9vw,42px)/1 var(--f-display);text-transform:none;margin:0 0 var(--s-3,12px)}
.gd-rel{list-style:none;margin:0;padding:0;font-size:clamp(16px,1.4vw,20px);line-height:1.4}
.gd-rel li{padding-block:2px}
.gd-rel a{display:inline-flex;align-items:center;min-height:44px}
.gd-rel__note{display:block;font-size:.8em;color:var(--c-text-muted);margin-top:-8px}

/* closing band */
.sec--gdband{background:var(--c-blue,#0B1F3A);color:#fff;padding-block:var(--s-7,48px)}
.gd-bandwrap{margin-inline:var(--gutter);max-width:var(--container,1344px)}
@media (min-width:1500px){.gd-bandwrap{margin-inline:auto}}
.gd-bandh{font:400 clamp(30px,3.47vw,50px)/1.05 var(--f-display);text-transform:none;margin:0 0 var(--s-3,12px)}
.gd-bandline{font:700 clamp(16px,1.5vw,21px)/1.4 var(--f-mono);margin:0 0 var(--s-4,16px)}
.gd-bandfine{font-size:clamp(16px,1.4vw,20px);margin:var(--s-4,16px) 0 var(--s-2,8px)}
.gd-bandquiet a{display:inline-flex;align-items:center;min-height:44px;color:#fff;text-decoration:underline;text-underline-offset:4px;font-size:clamp(16px,1.4vw,20px)}
.sec--gdband .btn:focus-visible,.sec--gdband a:focus-visible{outline:3px solid var(--c-focus-on-dark,#fff);outline-offset:3px}

/* tablet and phone */
@media (max-width:1100px){
  .sec--gd{--gd-rail:0px}
  .gd-grid{grid-template-columns:1fr}
  .gd-toc{display:none}
  .gd-chap::before,.gd-num{display:none}
  .gd-relwrap{padding-left:0}
  .gd-hero{margin-inline:0}
  .gd-railart{display:none}
}
@media (max-width:767px){
  .sec--gd{--gd-rail:0px;padding-block:var(--s-3,12px) var(--s-7,48px)}
  .gd-grid,.gd-relwrap,.gd-bandwrap{margin-inline:var(--s-5,24px)}
  .gd-h1{font-size:clamp(34px,9.8vw,42px);line-height:1.1}
  .gd-svg__t{font-size:14.5px}.gd-svg__s{font-size:14px}.gd-svg__l{font-size:18px}
  .gd-svg--d{display:none}.gd-svg--m{display:block;margin-inline:auto;max-width:360px}
  .gd-hero{margin-top:var(--s-4,16px)}
  .gd-chap{padding-left:0}
  .gd-h2{font-size:clamp(30px,8.6vw,34px);min-height:0;display:block;line-height:1.1}
  .gd-chap{display:block}
  .gd-chap>.gd-num{display:none}
  .gd-p,.gd-lede{color:#2B2B2B}
.gd-p{font-size:17px;line-height:1.5}
  .gd-lede{max-inline-size:none}
  .gd-h3{font-size:28px}
  .gd-tcard,.gd-tcard--notebook,.gd-tcard--ring{margin-inline:0;padding:var(--s-4,16px)}
  .gd-tcard--notebook::before,.gd-tcard--ring::before{display:none}
  .gd-tcard--ring{box-shadow:5px 5px 0 var(--c-blue)}
  .gd-pencil--nb,.gd-pencil--launch{display:none}
  .gd-table,.gd-table thead,.gd-table tbody,.gd-table tr,.gd-table th,.gd-table td{display:block}
  .gd-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .gd-table tr{border-bottom:2px solid var(--c-ink);padding-block:var(--s-2,8px)}
  .gd-table td{border:0;padding:4px 0;font-size:16px}
  .gd-table td::before{content:attr(data-label);display:block;font:700 14px/1.3 var(--f-mono);color:var(--c-text-muted)}
  .gd-table th.gd-phase{display:block;width:auto;border:0;padding:6px 8px;margin-bottom:4px}
  .gd-table--phases tr:not(.gd-first) th{display:none}
  .gd-table--phases th.gd-phase::before{content:none}
  .gd-icons__row{grid-template-columns:repeat(3,1fr);row-gap:var(--s-4,16px)}
  .gd-ic img{height:84px}
  .gd-launch{padding:var(--s-4,16px);box-shadow:6px 6px 0 var(--c-rule-soft)}
  .gd-checks--cols{grid-template-columns:1fr;padding-right:0}
  .gd-align__row{grid-template-columns:1fr}
  .gd-align__flow{transform:rotate(90deg);justify-self:start}
  .gd-checks li{font-size:16px}
  .gd-lede{font-size:18px}
  .gd-code{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.gd-link,.gd-toc__a{transition:none}}

/* art option: .gd--clean = guide uses the -clean cuts (no orange splash); generator sets it from data art_style */
.gd--clean .gd-pencil,.gd--clean .gd-ic img,.gd--clean .gd-railart{filter:none}

/* notebook frame for every table card (design: spiral rings left, rough edge) */
.gd-tcard,.gd-tcard--plain,.gd-tcard--notebook,.gd-tcard--ring{position:relative;background:#FBF6EC;border:2px solid var(--c-ink);border-radius:3px 7px 4px 6px/6px 3px 7px 4px;box-shadow:5px 5px 0 var(--c-rule-soft);padding:var(--s-5,24px) var(--s-5,24px) var(--s-5,24px) 68px;margin:var(--s-6,32px) 0 var(--s-6,32px) 14px}
.gd-tcard--ring{box-shadow:7px 7px 0 var(--c-blue,#0B1F3A)}
.gd-tcard::before,.gd-tcard--plain::before,.gd-tcard--notebook::before,.gd-tcard--ring::before{content:"";position:absolute;left:-14px;top:28px;bottom:20px;width:46px;background:radial-gradient(ellipse 18px 8px at 20px 12px,var(--c-ink) 0 7px,transparent 8px) 0 0/46px 46px repeat-y;display:block}
.gd-tcard--plain .gd-ttitle{background:var(--c-paper);border:2px solid var(--c-ink);padding:4px 14px;font-size:clamp(15px,1.2vw,17px)}
.gd-table td{padding-block:14px}
.gd-table th{padding-block:12px}
.gd-chap:first-child>.gd-num{background:none;border:0;color:var(--c-cta);width:auto;height:auto;font-size:clamp(34px,3.6vw,52px);left:calc(-1 * var(--gd-rail) + var(--gd-line) - 26px);top:calc(var(--s-5,24px) - 2px);display:block;background:var(--ground,#FDFBF7);padding:0 6px}
@media (max-width:767px){
  .gd-tcard,.gd-tcard--plain,.gd-tcard--notebook,.gd-tcard--ring{padding:var(--s-5,24px) var(--s-4,16px) var(--s-4,16px);margin:var(--s-6,32px) 0 var(--s-5,24px)}
  .gd-tcard::before,.gd-tcard--plain::before,.gd-tcard--notebook::before,.gd-tcard--ring::before{display:none}
  .gd-tcard::after{left:16px;width:64px}
  .gd-chap:first-child>.gd-num{display:none}
}
@media (max-width:1100px){.gd-chap:first-child>.gd-num{display:none}}

/* body lists (ul/ol blocks) */
.gd-list{margin:0 0 var(--s-4,16px);padding-left:1.3em;max-inline-size:38.5em;font-size:clamp(16px,1.67vw,24px);line-height:1.4;color:#2B2B2B}
.gd-list li{margin:0 0 .4em;padding-left:.2em}
.gd-list li::marker{color:var(--c-cta);font-weight:700}
.gd-list a{color:var(--c-blue,#0B1F3A);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.gd-list a:hover{text-decoration-thickness:2px;color:var(--c-cta)}
.gd-list a:focus-visible,.gd-checks a:focus-visible{outline:3px solid var(--c-focus,#C2410C);outline-offset:3px}
.gd-checks a{color:var(--c-blue,#0B1F3A);text-decoration:underline;text-underline-offset:4px}
.gd-list code,.gd-checks code,.gd-p code{font-family:var(--f-mono);font-size:.86em;overflow-wrap:anywhere}
@media (max-width:767px){.gd-list{font-size:17px;line-height:1.5}}

/* optional intro between the hero and chapter 01 */
.gd-intro{margin-top:var(--s-6,32px)}

/* long contents rail (9+ chapters): the rail is taller than the header, so the hero stops at the article edge instead of reaching under it */
@media (min-width:1101px){.gd--long .gd-hero{margin-left:0}}
@media (min-width:1101px){.gd-toc{padding-right:14px}}
@media (max-width:767px){.gd-code{overflow-x:visible}.gd-code__line{white-space:pre-wrap;overflow-wrap:anywhere;padding-left:2em;text-indent:-2em}}

/* ===== VARIATION (data "variants"): composition only, never colour, font or brand. No key = the look above. ===== */
.gd-herozone{display:contents}
.gd-custom{margin:var(--s-5,24px) 0;max-inline-size:44em}

/* hero: right / left (art beside header on desktop), diagram (framed figure) */
@media (min-width:1101px){
  .gd-hv-right .gd-herozone,.gd-hv-left .gd-herozone{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);column-gap:var(--s-6,32px);align-items:center}
  .gd-hv-left .gd-herozone{grid-template-columns:minmax(0,.95fr) minmax(0,1fr)}
  .gd-hv-left .gd-hero{order:-1}
  .gd-hv-right .gd-hero,.gd-hv-left .gd-hero{margin:0}
  .gd-hv-right .gd-svg--d,.gd-hv-left .gd-svg--d{margin-left:0;width:100%}
  .gd-hv-right .gd-heroimg,.gd-hv-left .gd-heroimg{width:100%!important}
  .gd-hv-right .gd-lede,.gd-hv-left .gd-lede{max-inline-size:none}
  .gd-hv-right .gd-h1,.gd-hv-left .gd-h1{max-inline-size:none}
}
.gd-hv-diagram .gd-hero{margin:var(--s-5,24px) 0 0;padding:var(--s-4,16px);background:#FBF6EC;border:2px solid var(--c-ink);border-radius:3px 7px 4px 6px/6px 3px 7px 4px;box-shadow:6px 6px 0 var(--c-rule-soft)}
.gd-hv-diagram .gd-svg--d{margin-left:0;width:100%}
.gd-hv-diagram .gd-heroimg{width:100%!important}
@media (max-width:767px){.gd-hv-diagram .gd-hero{padding:var(--s-3,12px);margin-top:var(--s-5,24px)}}

/* intro callout (lead paragraph or intro block in a box) */
.gd-intro--callout,.gd-lead-callout{border:2px solid var(--c-ink);background:#FBF6EC;box-shadow:5px 5px 0 var(--c-rule-soft);padding:var(--s-4,16px) var(--s-5,24px);border-radius:3px 7px 4px 6px/6px 3px 7px 4px}
.gd-intro--callout .gd-p:last-child{margin-bottom:0}
.gd-lead-callout{max-inline-size:36em}

/* quote styles (bar = original) */
.gd-q--card{position:relative;background:var(--c-white);border:2px solid var(--c-ink);padding:var(--s-4,16px) var(--s-5,24px);margin-block:var(--s-5,24px);overflow-wrap:anywhere}
.gd-q--marks{position:relative;padding:var(--s-5,24px) var(--s-4,16px) 0 var(--s-6,32px);font-style:italic;overflow-wrap:anywhere}
.gd-q--marks::before{content:"\201C";position:absolute;left:0;top:-4px;font:400 64px/1 var(--f-display);color:var(--c-cta);font-style:normal}

/* table frame: notebook (default above) | ruled | card */
.gd-tv-ruled .gd-tcard,.gd-tv-ruled .gd-tcard--plain,.gd-tv-ruled .gd-tcard--notebook,.gd-tv-ruled .gd-tcard--ring{background:transparent;border:0;border-top:2px solid var(--c-ink);border-bottom:2px solid var(--c-ink);border-radius:0;box-shadow:none;padding:var(--s-4,16px) 0;margin-left:0}
.gd-tv-ruled .gd-tcard::before,.gd-tv-ruled .gd-tcard::after{display:none}
.gd-tv-ruled .gd-table th{background:transparent;border-bottom:2px solid var(--c-ink)}
.gd-tv-ruled .gd-ttitle{background:none;padding:0}
.gd-tv-card .gd-tcard,.gd-tv-card .gd-tcard--plain,.gd-tv-card .gd-tcard--notebook,.gd-tv-card .gd-tcard--ring{background:#fff;border:2px solid var(--c-ink);border-radius:2px;box-shadow:none;padding:var(--s-4,16px) var(--s-5,24px);margin-left:0;max-inline-size:44em}
.gd-tv-card .gd-tcard::before{display:none}
.gd-tv-card .gd-tcard::after{left:auto;right:-10px;top:-12px;width:60px;height:22px;transform:rotate(6deg)}
.gd-tv-card .gd-table th{background:#F3E6CB}
@media (max-width:767px){.gd-tv-ruled .gd-tcard,.gd-tv-card .gd-tcard{padding:var(--s-4,16px) 0}.gd-tv-card .gd-tcard{padding:var(--s-4,16px)}}

/* steps: timeline | cards (list = original paragraphs) */
.gd-steps{list-style:none;margin:var(--s-4,16px) 0 var(--s-5,24px);padding:0;font-size:clamp(16px,1.67vw,24px);line-height:1.4;color:#2B2B2B;max-inline-size:38.5em}
.gd-steps li{display:flex;gap:var(--s-4,16px);align-items:flex-start;overflow-wrap:anywhere}
.gd-sn{flex:none;display:grid;place-items:center;font:400 clamp(20px,1.9vw,26px)/1 var(--f-display);color:#fff;background:var(--c-cta);width:2em;height:2em;border-radius:50%;border:2px solid var(--c-ink);position:relative;z-index:1}
.gd-sb a{color:var(--c-blue,#0B1F3A);text-decoration:underline;text-underline-offset:4px}
.gd-steps--timeline li{position:relative;padding-bottom:var(--s-4,16px)}
.gd-steps--timeline li::before{content:"";position:absolute;left:calc(1em + 1px);top:2em;bottom:0;border-left:2px dotted #B9B5AD}
.gd-steps--timeline li:last-child::before{display:none}
.gd-steps--cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4,16px);max-inline-size:44em;font-size:clamp(16px,1.4vw,20px)}
.gd-steps--cards li{flex-direction:column;border:2px solid var(--c-ink);background:#fff;box-shadow:4px 4px 0 var(--c-rule-soft);padding:var(--s-4,16px)}
@media (max-width:767px){.gd-steps{font-size:17px;line-height:1.5}.gd-steps--cards{grid-template-columns:1fr;font-size:16px}}

/* closing CTA: split (heading and line left, button and reassurance right) */
@media (min-width:900px){
  .gd-bandv-split .gd-bandwrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);column-gap:var(--s-7,48px);align-items:start}
  .gd-bandv-split .gd-bandh,.gd-bandv-split .gd-bandline{grid-column:1}
  .gd-bandv-split .btn,.gd-bandv-split .gd-bandfine,.gd-bandv-split .gd-bandquiet{grid-column:2}
  .gd-bandv-split .btn{grid-row:1;justify-self:start;align-self:end}
  .gd-bandv-split .gd-bandfine{grid-row:2;margin-top:0}
  .gd-bandv-split .gd-bandquiet{grid-row:3}
  .gd-bandv-split .gd-bandh{grid-row:1}.gd-bandv-split .gd-bandline{grid-row:2 / span 2}
}

/* custom block: step ribbon (a creative moment for guides whose design is a run of steps) */
.gd-ribbon__row{list-style:none;counter-reset:rb;margin:0 0 var(--s-5,24px);padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2,8px)}
.gd-ribbon__row li{counter-increment:rb;display:flex;align-items:center;gap:var(--s-2,8px);padding:6px 14px;border:2px solid var(--c-ink);background:#FBF6EC;font:700 clamp(14px,1.18vw,17px)/1.3 var(--f-mono)}
.gd-ribbon__row li::before{content:counter(rb);display:grid;place-items:center;width:1.8em;height:1.8em;border-radius:50%;background:var(--c-cta);color:#fff;border:2px solid var(--c-ink);font:400 1em/1 var(--f-display)}

/* ===== MOBILE PASS 24 Oct 2026: phone-only additions; desktop hides every new element ===== */
.gd-tocm,.gd-cta-m,.gd-backtop{display:none}
@media (max-width:1100px){
  .gd-tocm{display:block;margin:var(--s-4,16px) 0 0;border:2px solid var(--c-ink);background:#FBF6EC;font-family:var(--f-mono)}
  .gd-tocm__sum{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 var(--s-4,16px);font:700 16px/1.2 var(--f-mono);letter-spacing:.04em;cursor:pointer;list-style:none}
  .gd-tocm:not([open]) .gd-tocm__list{display:none}
  .gd-tocm__sum::-webkit-details-marker{display:none}
  .gd-tocm__sum::after{content:"+";font-size:22px;color:var(--c-cta)}
  .gd-tocm[open] .gd-tocm__sum::after{content:"\2212"}
  .gd-tocm__sum:focus-visible,.gd-tocm__a:focus-visible,.gd-backtop a:focus-visible{outline:3px solid var(--c-focus,#C2410C);outline-offset:3px}
  .gd-tocm__list{list-style:none;margin:0;padding:0 var(--s-4,16px) var(--s-2,8px);border-top:1px solid #CFC7B6}
  .gd-tocm__a{display:flex;gap:var(--s-3,12px);align-items:center;min-height:44px;padding-block:6px;font-size:16px;line-height:1.3;color:var(--c-blue,#0B1F3A);text-decoration:none}
  .gd-tocm__a span{color:var(--c-cta);font-weight:700}
  .gd-cta-m{display:block;margin:var(--s-4,16px) 0 0}
  .gd-cta-m .btn{width:100%;min-height:56px}
  .gd-backtop{display:block;margin:var(--s-4,16px) 0 0}
  .gd-backtop a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-blue,#0B1F3A);text-decoration:underline;text-underline-offset:4px;font-size:16px}
}
@media (max-width:767px){
  /* concept note under the link, no overlap */
  .gd-rel__note{margin-top:4px;font-size:16px;line-height:1.35}
  /* breadcrumb: wrap cleanly, 44 px Home */
  .gd-crumb ol{gap:0 .4em}
  .gd-crumb li+li::before{margin-inline-end:.4em}
  .gd-crumb li:first-child a{min-width:44px;justify-content:center}
  .gd-crumb li[aria-current]{display:none}
  /* empty navy space before the footer */
  .sec--gdrel{padding-bottom:var(--s-4,16px)}
  .sec--gdband{padding-block:var(--s-6,32px) var(--s-4,16px)}
  .gd-bandquiet{margin:0}
  /* code sample line number not clipped */
  .gd-code{padding-inline:var(--s-4,16px) var(--s-3,12px)}
  .gd-code__line{padding-left:2.4em;text-indent:-2.4em}
  .gd-code i{width:2.4em;text-indent:0}
  /* stacked tables: no blank band at top, no doubled rule, denser rows */
  .gd-table{margin:0}
  .gd-table tbody tr:first-child{padding-top:0}
  .gd-table tr:last-child{border-bottom:0;padding-bottom:0}
  .gd-table tr{padding-block:var(--s-2,8px)}
  .gd-table td{padding:2px 0}
  .gd-table td::before{display:inline;margin-right:.5em;font-size:14px;content:attr(data-label) ":"}
  .gd-table td[data-label]:first-child{font-weight:700}
  .gd-table td[data-label]:first-child::before{display:block;font-weight:700;content:attr(data-label)}
  .gd-tcard .gd-table{margin-block:0}
}

/* LAST FIX 24 Oct: a card with exactly one link opens it from anywhere (stretched link, focus ring round the card) */
.gd-tcard--one a::after{content:"";position:absolute;inset:0;z-index:3}
.gd-tcard--one a:focus-visible{outline:0}
.gd-tcard--one a:focus-visible::after{outline:3px solid var(--c-focus,#C2410C);outline-offset:3px}
/* css/sections/landing-01-02.css */
/* LANDING-1: sections 01 hero and 02 starting. Scoped to .sec--hero / .sec--starting. */
.sec--hero,.sec--starting{background:var(--ground,#FDFBF7);color:var(--c-ink)}

/* ---------- 01 HERO (walk-ins scene). Everything scoped under .hx; keyframes prefixed hx-. ---------- */
.sec--hero.hx{--hxh:var(--hx-hdr,var(--nav-h));--ink:#0A0A0A;--paper:#FDFBF7;--muted:#3d3d3d;--accent:#C2410C;--accent-hover:#9A3412;--structure:#0B1F3A;--tint:color-mix(in srgb,var(--structure) 14%,#fff);--tint2:color-mix(in srgb,var(--structure) 55%,#fff);
  background:var(--paper);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif;padding:0;overflow:hidden;box-sizing:border-box;height:calc(100svh - var(--hxh));min-height:520px}
.hx *,.hx *::before,.hx *::after{box-sizing:border-box}
.hx :focus-visible{outline:3px solid var(--structure);outline-offset:3px}
.hx a{color:inherit}
.hx h1{font-size:inherit;line-height:inherit;text-transform:none}
.hx .hx-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;background:var(--accent);color:#fff;font:700 16px/1 "DM Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);transition:transform .15s,box-shadow .15s,background .15s}
.hx .hx-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink);background:var(--accent-hover);color:#fff}
.hx .hx-btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.sec--hero.hx{display:grid;grid-template-columns:minmax(0,9fr) minmax(0,15fr);gap:clamp(20px,3vw,48px);align-items:center;padding:0 var(--gutter);max-width:1760px;margin:0 auto}
.hx .copy{display:flex;flex-direction:column;gap:clamp(14px,2.6svh,26px);min-width:0}
.hx h1{margin:0;display:flex;flex-direction:column;gap:clamp(10px,2svh,20px);font-weight:400}
.hx .hook{font:400 min(4.6vw,7.8svh)/1.02 Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.004em;text-wrap:balance}
.hx .hook em{font-style:normal;white-space:nowrap;color:var(--accent)}
.hx .hook em.w{white-space:normal}
.hx .kw{font:400 clamp(16px,min(1.3vw,2.4svh),21px)/1.45 "DM Sans",sans-serif;max-width:33em;color:#222}
.hx .cta{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-bottom:6px}
.hx .cta .alt{font-weight:700;font-size:16px;text-underline-offset:5px;text-decoration-thickness:2px;min-height:44px;display:inline-flex;align-items:center}
.hx .cta .alt:hover{text-decoration-color:var(--accent)}
.hx .micro{margin:0;font-size:15px;color:var(--muted)}
.hx .stage{position:relative;justify-self:end;width:min(100%,calc((100svh - var(--hxh) - 40px) * 1.4615));aspect-ratio:760/520;overflow:hidden;background:linear-gradient(#F4F1EA 0,#FDFBF7 62%);border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.hx .scene{position:absolute;left:0;top:0;width:760px;height:520px;transform-origin:0 0;will-change:transform}
.hx .scene *{-webkit-user-select:none;user-select:none}
.hx .sky{position:absolute;left:0;top:0;width:760px;height:120px;overflow:hidden;pointer-events:none}
.hx .cloud{position:absolute;height:16px;border-radius:8px;background:#fff;opacity:.9;box-shadow:12px -8px 0 -2px #fff,-10px -5px 0 -3px #fff}
.hx .cloud.c1{left:120px;top:26px;width:70px;animation:hx-drift 38s linear infinite}
.hx .cloud.c2{left:520px;top:48px;width:52px;animation:hx-drift 52s linear infinite -20s}
@keyframes hx-drift{from{transform:translateX(-160px)}to{transform:translateX(820px)}}
.hx .skyline{position:absolute;left:0;right:0;bottom:0;height:70px}
.hx .skyline i{position:absolute;bottom:0;background:#E7E3DA;display:block}
.hx .skyline i::after{content:"";position:absolute;inset:8px 6px auto 6px;height:30px;background:repeating-linear-gradient(90deg,#D8D4C9 0 6px,transparent 6px 14px)}
.hx .pave{position:absolute;left:0;right:0;top:452px;height:68px;background:#ECE8DF;border-top:2px solid var(--ink)}
.hx .pave::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:#DAD5C9}
.hx .pave::after{content:"";position:absolute;left:0;right:0;top:44px;border-top:2px dashed #CFCABD}
.hx .kerb{position:absolute;left:0;right:0;top:500px;height:20px;background:#DAD5C9;border-top:2px solid var(--ink)}
.hx .lamp{position:absolute;left:366px;top:300px;width:6px;height:152px;background:var(--ink);z-index:3}
.hx .lamp::before{content:"";position:absolute;left:-10px;top:-8px;width:26px;height:14px;background:var(--ink);border-radius:13px 13px 3px 3px}
.hx .shop{position:absolute;top:110px;width:168px;height:342px;padding:0;border:2px solid #BEB9AD;background:#E4E0D7;overflow:hidden;cursor:pointer;font:inherit;color:inherit;text-align:left;
  background-image:repeating-linear-gradient(0deg,transparent 0 17px,rgba(0,0,0,.05) 17px 18px),repeating-linear-gradient(90deg,transparent 0 33px,rgba(0,0,0,.035) 33px 34px)}
.hx .shop>*{position:absolute}
.hx .shop .cornice{left:-2px;right:-2px;top:0;height:14px;background:#CFCAC0;border-bottom:2px solid #BEB9AD}
.hx .shop .sign{left:10px;right:10px;top:24px;height:54px;background:#D4D0C6;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 16px}
.hx .shop .sign i{display:block;height:6px;background:#BFBAAE;position:static}
.hx .shop .sign i+i{width:50%}
.hx .shop .uw{top:94px;width:34px;height:44px;background:#CBC7BC;border:2px solid #BEB9AD}
.hx .shop .uw.a{left:26px}
.hx .shop .uw.b{right:26px}
.hx .shop .win{left:12px;top:184px;width:90px;height:112px;background:#CFCBC1;border:2px solid #BEB9AD;overflow:hidden}
.hx .shop .win::after{content:"";position:absolute;left:-20px;top:-10px;width:30px;height:160px;background:rgba(255,255,255,.35);transform:rotate(18deg)}
.hx .shop .door{left:112px;bottom:0;width:44px;height:112px;background:#C0BBB0;border:2px solid #AFAA9E;border-bottom:0}
.hx .shop .paint{inset:0;background:var(--structure);transform:scaleY(0);transform-origin:50% 100%;z-index:1;
  background-image:repeating-linear-gradient(0deg,transparent 0 17px,rgba(255,255,255,.07) 17px 18px)}
.hx .shop .corn2{left:-2px;right:-2px;top:0;height:14px;background:var(--structure);z-index:3;transform:scaleX(0);transform-origin:0 50%}
.hx .shop .awn{left:-4px;right:-4px;top:146px;height:34px;border:2px solid var(--ink);background:repeating-linear-gradient(90deg,var(--accent) 0 21px,#FDFBF7 21px 42px);transform:scaleY(0);transform-origin:50% 0;z-index:4;
  -webkit-mask:radial-gradient(circle 10.5px at 10.5px 100%,transparent 98%,#000) 0 0/21px 100% repeat-x;mask:none}
.hx .shop .awn::after{content:"";position:absolute;left:-2px;right:-2px;bottom:-9px;height:9px;background:repeating-linear-gradient(90deg,var(--accent) 0 21px,#FDFBF7 21px 42px);border:2px solid var(--ink);border-top:0}
.hx .shop .winon{left:12px;top:184px;width:90px;height:112px;background:#FDFBF7;border:2px solid var(--ink);z-index:2;opacity:0;padding:8px;display:flex;flex-direction:column;gap:6px;overflow:hidden}
.hx .winon i{display:block;height:8px;background:var(--structure);position:static;transform:scaleX(0);transform-origin:0 50%}
.hx .winon i:nth-child(2){width:68%;background:#b9b9b9}
.hx .winon i:nth-child(3){width:100%;height:30px;background:var(--tint)}
.hx .winon i:nth-child(4){width:46px;height:14px;background:var(--accent);margin-top:auto}
.hx .shop .uwon{top:94px;width:34px;height:44px;background:#FFE9A8;border:2px solid var(--ink);z-index:2;opacity:0}
.hx .shop .uwon.a{left:26px}
.hx .shop .uwon.b{right:26px}
.hx .shop .hole{left:112px;bottom:0;width:44px;height:112px;background:var(--ink);z-index:2;opacity:0}
.hx .shop .doron{left:112px;bottom:0;width:44px;height:112px;background:var(--accent);border:2px solid var(--ink);z-index:3;opacity:0;transform-origin:0 50%}
.hx .doron::after{content:"";position:absolute;right:6px;top:56px;width:6px;height:6px;border-radius:50%;background:#FDFBF7}
.hx .shop .open{left:116px;top:216px;width:36px;height:16px;z-index:5;background:#FDFBF7;border:2px solid var(--ink);font:700 8px/12px "JetBrains Mono",monospace;letter-spacing:.06em;text-align:center;text-transform:uppercase;opacity:0;transform-origin:50% 0;color:var(--ink)}
.hx .shop .signon{left:10px;right:10px;top:24px;height:54px;z-index:5;background:#FDFBF7;border:2px solid var(--ink);display:flex;align-items:center;justify-content:center;font:400 22px/1 Anton,Impact,sans-serif;white-space:nowrap;letter-spacing:.03em;text-transform:uppercase;opacity:0;transform:rotate(-84deg);transform-origin:12px 0;box-shadow:3px 3px 0 var(--ink)}
.hx .shop .glow{left:-30px;right:-30px;top:200px;height:160px;z-index:2;background:radial-gradient(ellipse at 50% 0,rgba(255,226,140,.8),transparent 70%);opacity:0}
.hx .shop.on{border-color:var(--ink);cursor:default}
.hx .shop.on .paint{transform:scaleY(1);transition:transform .9s cubic-bezier(.7,0,.2,1)}
.hx .shop.on .corn2{transform:scaleX(1);transition:transform .5s .7s}
.hx .shop.on .awn{transform:scaleY(1);transition:transform .5s cubic-bezier(.3,1.6,.5,1) .75s}
.hx .shop.on .winon{opacity:1;transition:opacity .35s .95s}
.hx .shop.on .winon i{transform:scaleX(1);transition:transform .35s cubic-bezier(.3,.9,.4,1)}
.hx .shop.on .winon i:nth-child(1){transition-delay:1.1s}
.hx .shop.on .winon i:nth-child(2){transition-delay:1.25s}
.hx .shop.on .winon i:nth-child(3){transition-delay:1.4s}
.hx .shop.on .winon i:nth-child(4){transition-delay:1.6s}
.hx .shop.on .uwon{opacity:1;transition:opacity .4s 1.2s}
.hx .shop.on .hole,.hx .shop.on .doron{opacity:1;transition:opacity .3s 1s}
.hx .shop.on .glow{opacity:1;transition:opacity .8s 1.3s}
.hx .shop.on .signon{opacity:1;animation:hx-swing 1.2s .4s cubic-bezier(.3,.7,.4,1) both}
.hx .shop.on .open{opacity:1;animation:hx-hang 2.6s 1.5s ease-in-out infinite alternate both}
@keyframes hx-swing{0%{transform:rotate(-84deg)}30%{transform:rotate(17deg)}52%{transform:rotate(-9deg)}72%{transform:rotate(4deg)}100%{transform:rotate(0)}}
@keyframes hx-hang{from{transform:rotate(-7deg)}to{transform:rotate(7deg)}}
.hx .shop.on.enter .doron{transform:scaleX(.16);transition:transform .25s}
.hx .shop:not(.on):hover .paint,.hx .shop:not(.on):focus-visible .paint{transform:scaleY(.08);transition:transform .25s}
.hx .shop:not(.on):hover{border-color:var(--ink)}
.hx .tally{position:absolute;left:calc(var(--vx,0px) + 18px);top:14px;width:284px;height:80px;background:#FDFBF7;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);display:flex;align-items:center;gap:14px;padding:0 16px;z-index:9}
.hx .tally .n{font:400 58px/1 Anton,Impact,sans-serif;color:var(--structure);min-width:40px;transform-origin:50% 60%}
.hx .tally .l{font:700 12px/1.35 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}
.hx .tally .l b{display:block;font-weight:700}
.hx .tally .l span{display:block;color:var(--accent)}
.hx .tally .n.hx-bump{animation:hx-bump .42s}
@keyframes hx-bump{0%{transform:scale(1)}40%{transform:scale(1.4)}100%{transform:scale(1)}}
.hx .tip{position:absolute;left:calc(var(--vx,0px) + 18px);top:104px;z-index:9;display:flex;align-items:center;gap:8px;font:700 12px/1.3 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.06em;opacity:0;transition:opacity .5s;pointer-events:none;background:#FDFBF7;border:2px solid var(--ink);padding:5px 10px}
.hx .tip.show{opacity:1}
.hx .tip u{display:block;width:12px;height:12px;border-radius:50%;background:var(--accent);animation:hx-pulse 1.4s infinite}
.hx .want{position:absolute;left:calc(var(--vr,760px) - 18px - 392px);top:14px;width:392px;z-index:10;background:#FDFBF7;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:5px 8px 8px}
.hx .want .wl{display:block;font:700 calc(11px/var(--s,1))/1.2 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.hx .want .wb{display:flex;gap:6px}
.hx .want button{flex:1;min-height:calc(44px/var(--s,1));padding:0 4px;font:700 calc(13px/var(--s,1))/1 "DM Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em;background:#FDFBF7;color:var(--ink);border:2px solid var(--ink);cursor:pointer}
.hx .want button:hover{background:#EDE9E0}
.hx .want button[aria-pressed="true"]{background:var(--accent);color:#fff}
.hx .want button:focus-visible{outline:3px solid var(--structure);outline-offset:2px}
@keyframes hx-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.7);opacity:.35}}
.hx .walker{position:absolute;left:0;top:418px;width:24px;height:64px;margin-left:-12px;z-index:6;will-change:transform}
.hx .walker .sh{position:absolute;left:-2px;bottom:-4px;width:28px;height:7px;border-radius:50%;background:rgba(0,0,0,.14)}
.hx .walker .in{position:absolute;inset:0;animation:hx-bob .46s ease-in-out infinite alternate}
.hx .walker .in::before{content:"";position:absolute;left:4px;top:0;width:16px;height:16px;border-radius:50%;background:var(--c,#0A0A0A)}
.hx .walker .in::after{content:"";position:absolute;left:0;top:18px;width:24px;height:42px;border-radius:12px 12px 3px 3px;background:var(--c,#0A0A0A)}
.hx .walker.bag .in b{position:absolute;left:15px;top:36px;width:13px;height:15px;background:var(--b,#777);border:2px solid var(--ink);z-index:2}
@keyframes hx-bob{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-4px) rotate(2deg)}}
.hx .chip{position:absolute;left:0;top:0;z-index:8;background:var(--accent);color:#fff;border:2px solid var(--ink);padding:6px 12px;font:700 14px/1 "DM Sans",sans-serif;white-space:nowrap;opacity:0;will-change:transform,opacity;box-shadow:3px 3px 0 var(--ink)}
.hx .ring{position:absolute;width:60px;height:60px;margin:-30px 0 0 -30px;border:3px solid var(--accent);border-radius:50%;z-index:7;opacity:0;pointer-events:none}
@media (max-width:860px){
.sec--hero.hx{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:14px;padding:16px var(--gutter) 28px;height:auto;min-height:0}
.hx .copy{display:contents}
.hx .copy-top{order:1}
.hx .want.out{order:2}
.hx .stage{order:3;width:100%;justify-self:auto;aspect-ratio:470/500;flex:none;box-shadow:5px 5px 0 var(--ink)}
.hx .cta-wrap{order:4;display:flex;flex-direction:column;gap:8px}
.hx .hook{font-size:clamp(30px,9.4vw,44px);line-height:.98}
.hx h1{gap:8px}
.hx .kw{font-size:15px;line-height:1.4}
.hx .micro{font-size:14px}
.hx .cta{gap:0;flex-direction:column;align-items:stretch}
.hx .cta .alt{justify-content:center;min-height:40px}
.hx .hx-btn{width:100%}

}
@media (max-width:860px){.hx .tally{height:54px;top:8px;width:250px;padding:0 12px;gap:10px}
.hx .tally .n{font-size:40px}
.hx .tally .l{font-size:11px;line-height:1.25}
.hx .want.out{position:static;width:auto;margin:0;padding:4px 8px 6px;box-shadow:3px 3px 0 var(--ink)}
.hx .want.out .wl{font-size:11px;margin-bottom:3px}
.hx .want.out .wb{gap:5px}
.hx .want.out button{font-size:13px;min-height:44px}
.hx .tip{top:auto;bottom:34px}

}
@media (max-width:860px) and (max-height:760px){.hx .kw{display:none}}
@media (prefers-reduced-motion:reduce){.hx .walker .in,.hx .tip u,.hx .cloud,.hx .shop .open{animation:none!important}
.hx .shop *,.hx .shop{transition:none!important;animation:none!important}
.hx .hx-btn{transition:none}

}



/* ---------- 02 STARTING ---------- */
.sec--starting{padding-block:var(--s-8) var(--s-9)}
.sec--starting .wrap{max-width:none;padding-inline:var(--gutter)}
.st-head{margin-bottom:0}
.sec--starting h2{font-size:clamp(46px,7.3vw,112px);line-height:1.04;text-transform:none;margin:.2em 0 .25em;max-width:none}
.st-lead,.st-who{font-size:clamp(18px,1.6vw,24px);line-height:1.45;margin:0;max-width:none}
.st-cols{display:grid;grid-template-columns:1fr 1px 1fr;column-gap:3vw;margin-top:2.6vw}
.st-vr{background:var(--c-ink);margin-top:.4vw}
.st-chip{display:inline-block;position:relative;font:400 clamp(14px,1.3vw,20px)/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;padding:.7em 1.2em;margin:0 0 .6em}
.st-list{list-style:none;margin:0;padding:0}
.st-row{display:flex;align-items:center;gap:1.4vw;padding:1.4vw 0;border-top:1px solid var(--c-ink)}
.st-chip+.st-list .st-row:first-child{border-top:0}
.st-icon{flex:none;width:clamp(150px,13vw,190px);height:auto;aspect-ratio:1;margin:-1.8vw -1.4vw -1.8vw -2vw;object-fit:contain}
.st-q{font:700 clamp(18px,1.6vw,23px)/1.25 var(--f-body);color:var(--c-ink);margin:0 0 4px}
.st-a{font-size:clamp(16px,1.3vw,19px);line-height:1.45;color:var(--c-text-muted);margin:0}
.st-text{min-width:0}
@media (max-width:767px){
  .sec--starting{padding-block:var(--s-6) var(--s-6)}
  .sec--starting .wrap{padding-inline:var(--gutter)}
  .sec--starting h2{font-size:40px;text-transform:uppercase;margin:10px 0 12px}
  .st-lead{font-size:18px}.st-who{font-size:16px;margin-top:10px}
  .st-cols{display:block;margin-top:0}.st-vr{display:none}
  .st-panel{position:relative;background:#fff;border:1.5px solid var(--c-ink);margin-top:34px;padding:30px 16px 2px}
  .st-chip{position:absolute;left:14px;top:-18px;margin:0;font:700 15px/1.2 var(--f-body);letter-spacing:0;text-transform:none;padding:7px 12px;max-width:340px}
  .st-row{gap:20px;padding:12px 0}
  .st-icon{width:112px;height:auto;aspect-ratio:3/5;margin:-4px 0 -4px -10px}
  .st-q{font-size:16px;margin-bottom:3px}.st-a{font-size:16px;line-height:1.45}
}
@media (min-width:768px) and (max-width:1023px){.st-cols{grid-template-columns:1fr}.st-vr{display:none}.st-panel+.st-vr+.st-panel{margin-top:32px}}
.st-chip{background:var(--c-paper);color:var(--c-ink);border:2px solid var(--c-ink)}


/* section 02 interaction rows + orange details */
.sec--starting .st-list{counter-reset:st}
.sec--starting .st-row{position:relative;counter-increment:st}
.sec--starting .st-q::before{content:counter(st,decimal-leading-zero);display:block;font:700 13px/1 var(--f-mono);letter-spacing:.1em;color:var(--c-accent,#C2410C);margin-bottom:5px}
.sec--starting .st-chip{border-bottom:3px solid var(--c-accent,#C2410C)}


/* 23 Oct: "Your business" shop front is orange; its door and awning switch to navy so they stay visible */
.hx .shop.warm .paint{background:var(--accent)}
.hx .shop.warm .doron{background:var(--structure)}
.hx .shop.warm .awn,.hx .shop.warm .awn::after{background:repeating-linear-gradient(90deg,var(--structure) 0 21px,#FDFBF7 21px 42px)}

/* narrow phones: shrink icon column so st-text keeps width */
@media (max-width:480px){.st-row{gap:12px}.st-icon{width:72px;margin:-4px 0 -4px -6px}}

/* Audit repair: readable assurance text and clear hero actions. */
html .hx .micro{font-size:16px}
html .hx .cta-wrap{display:flex;flex-direction:column;gap:16px}
html .hx .cta-wrap .cta{margin-bottom:0}
@media(max-width:767px){html .hx .cta .alt{margin-top:6px;min-height:44px}}
/* css/sections/learn-page.css */
/* Guides hub (/learn/): .sec--lhero .sec--lsit .sec--lall .sec--lcta .sec--lown .sec--lfaq .sec--lclose. Scoped. */
.sec--lhero,.sec--lsit,.sec--lall,.sec--lcta,.sec--lown,.sec--lfaq,.sec--lclose{background:var(--ground,#FDFBF7);color:var(--c-ink,#0A0A0A)}
.sec--lhero .ix-link,.sec--lsit .ix-link,.sec--lall .ix-link,.sec--lown .ix-link,.sec--lclose .ix-link{color:var(--c-blue,#0B1F3A);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;background:linear-gradient(var(--c-accent,#C2410C),var(--c-accent,#C2410C)) left bottom/0 2px no-repeat;transition:background-size .3s var(--ease,ease)}
.sec--lsit .ix-link:hover,.sec--lall .ix-link:hover,.sec--lown .ix-link:hover,.sec--lclose .ix-link:hover,.sec--lsit .ix-link:focus-visible,.sec--lall .ix-link:focus-visible,.sec--lown .ix-link:focus-visible,.sec--lclose .ix-link:focus-visible{background-size:100% 2px}
.lh-cta{display:block}
.lh-cta .btn{min-width:min(418px,100%);min-height:64px;font-size:clamp(15px,1.5vw,21px)}
.lh-cta p{margin:var(--s-4,16px) 0 0;max-inline-size:34ch;font-size:clamp(16px,1.45vw,21px);line-height:1.5;color:var(--c-blue,#0B1F3A)}
.ix-icon img{display:block;width:100%;height:auto}

/* hero */
.sec--lhero{padding-block:var(--s-7,48px) var(--s-8,64px)}
.lh-crumb{font:400 clamp(14px,1.4vw,20px)/1.4 var(--f-body);color:var(--c-ink);margin:0 0 var(--s-3,12px)}
.lh-crumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-blue,#0B1F3A);text-decoration:underline;text-underline-offset:4px}
.lh-row{display:grid;grid-template-columns:minmax(0,68%) minmax(0,1fr);gap:0 var(--s-5,24px);align-items:start}
.lh-title{font-size:clamp(34px,6.63vw,95.4px);line-height:1.04;text-transform:uppercase;margin:0;color:var(--c-ink)}
.lh-lead{font-size:clamp(17px,1.8vw,26px);line-height:1.55;margin:var(--s-5,24px) 0 var(--s-5,24px);max-inline-size:36em}
.lh-art-wrap{display:block;width:100%;margin-top:0;transform-origin:50% 80%}

/* find your situation */
.sec--lsit{border-top:1px solid var(--c-rule-soft);padding-block:var(--s-8,64px) var(--s-8,64px);margin-inline:var(--gutter);}
.sec--lsit .wrap{position:relative;padding-inline:0;max-width:var(--container,1344px)}
.ls-title{font-size:clamp(34px,5.24vw,75.4px);line-height:1;margin:0;text-transform:uppercase}
.ls-sub{font-size:clamp(17px,1.8vw,26px);line-height:1.5;margin:var(--s-3,12px) 0 var(--s-6,32px);max-inline-size:none}
.ls-art-wrap{position:absolute;right:2%;top:-16px;width:clamp(120px,15vw,210px)}
.ls-list{list-style:none;margin:0;padding:0 0 0 9.4%;position:relative}
.ls-list::before{content:"";position:absolute;left:1.2%;top:8px;bottom:12px;width:4px;border-radius:2px;background:var(--c-fill-warm)}
.ls-row{position:relative;display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:var(--s-1,4px) var(--s-5,24px);padding-block:var(--s-5,24px);border-bottom:1px solid var(--c-rule-soft);align-items:start}
.ls-row:last-child{border-bottom:0}
.ls-row::before{content:"";position:absolute;left:-8.2%;top:calc(var(--s-5,24px) + .7em);width:5.2%;height:4px;border-radius:2px;background:var(--c-fill-warm)}
.ls-q{grid-column:1/-1;text-transform:none;letter-spacing:0;font:700 clamp(19px,1.82vw,26px)/1.25 var(--f-body);margin:0;color:var(--c-ink)}
.ls-read,.ls-do{margin:0;font-size:clamp(16px,1.5vw,21.6px);line-height:1.5}
.ls-k{font-weight:500;color:var(--c-ink)}
.ls-read a,.ls-do a{display:inline-block;padding-block:11px;margin-block:-11px}

/* all guides */
.sec--lall{padding-block:var(--s-7,48px) var(--s-8,64px)}
.la-title{font-size:clamp(34px,4.29vw,61.7px);line-height:1;margin:0;text-transform:none}
.la-sub{font-size:clamp(17px,1.8vw,26px);line-height:1.5;margin:var(--s-3,12px) 0 var(--s-6,32px)}
.lg-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s-7,48px) 0;border-top:0}
.lg{grid-column:span 2;padding:0 var(--s-5,24px) 0;position:relative}
.lg:nth-child(3n+1){padding-left:0}
.lg:nth-child(n+2):nth-child(-n+3),.lg:nth-child(5){border-left:1px solid var(--c-rule-soft)}
.lg:nth-child(n+4){grid-column:span 3;border-top:1px solid var(--c-rule-soft);padding-top:var(--s-6,32px)}
.lg:nth-child(4){padding-left:0}
.lg:nth-child(5){padding-left:var(--s-6,32px)}
.lg-art-wrap{display:block;height:clamp(120px,12.4vw,176px);margin-bottom:var(--s-4,16px)}
.lg-art-wrap img{width:auto;height:100%;max-width:100%;object-fit:contain;object-position:left bottom}
.lg-h{text-transform:none;letter-spacing:0;font:400 clamp(28px,2.58vw,37.2px)/1.05 var(--f-display);margin:0 0 var(--s-3,12px);color:var(--c-ink)}
.lg-n{text-transform:none;font:400 clamp(16px,1.6vw,23px)/1 var(--f-mono);color:var(--c-ink);margin-inline-start:.2em}
.lg-i{font-size:clamp(16px,1.44vw,20.8px);line-height:1.5;margin:0 0 var(--s-5,24px);max-inline-size:30em}
.lg-list{list-style:none;margin:0;padding:0}
.lg-list li{margin:0}
.lg-list a{display:inline-block;padding-block:var(--s-2,8px);font-size:clamp(16px,1.37vw,19.7px);line-height:1.4}
.lg-more{display:none}

/* conversation + ownership */
.sec--lcta{padding-block:var(--s-6,32px) var(--s-6,32px)}
.lc-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--s-6,32px);align-items:center}
.lc-title{font-size:clamp(34px,4.93vw,71px);line-height:1.02;margin:0 0 var(--s-4,16px);text-transform:none}
.lc-lead{font-size:clamp(17px,1.58vw,22.7px);line-height:1.55;margin:0 0 var(--s-5,24px);max-inline-size:32em}
.lc-art-wrap{display:block;width:100%;max-width:520px;justify-self:end;transform-origin:50% 80%}
.sec--lown{padding-block:var(--s-5,24px) var(--s-6,32px)}
.lo-box{position:relative;display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:var(--s-6,32px);align-items:center;border:1px solid var(--c-rule-soft);background:#FBF6EC;padding:var(--s-6,32px) var(--s-7,48px)}
.lo-title{font-size:clamp(30px,3.56vw,51.3px);line-height:1.02;margin:0 0 var(--s-3,12px);text-transform:none}
.lo-text p{font-size:clamp(16px,1.52vw,21.9px);line-height:1.55;margin:0 0 var(--s-3,12px);max-inline-size:36em}
.lo-k{color:var(--c-ink)}
.lo-art-wrap{display:block;width:100%;max-width:360px;justify-self:end}

/* FAQ */
.sec--lfaq{padding-block:var(--s-6,32px) var(--s-6,32px)}
.lf-title{font-size:clamp(32px,4.21vw,60.6px);line-height:1;margin:0 0 var(--s-5,24px);text-transform:none}
.lf-list{border-bottom:1px solid var(--c-rule-soft)}
.lf-item{position:relative;border-top:1px solid var(--c-rule-soft);padding:var(--s-4,16px) 0 var(--s-4,16px) var(--s-6,32px)}
.lf-item summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;font:700 clamp(18px,1.67vw,24px)/1.3 var(--f-body)}
.lf-item summary::-webkit-details-marker{display:none}
.lf-item summary:focus-visible{outline:3px solid var(--c-focus,#C2410C);outline-offset:3px}
.lf-a p{margin:0;font-size:clamp(16px,1.52vw,21.9px);line-height:1.5}

/* close */
.sec--lclose{padding-block:var(--s-6,32px) var(--s-9,96px)}
.sec--lclose .wrap{border-top:1px solid var(--c-rule-soft);padding-top:var(--s-7,48px)}
.lcl-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--s-6,32px);align-items:center}
.lcl-title{font-size:clamp(32px,4.05vw,58.3px);line-height:1.02;margin:0 0 var(--s-3,12px);text-transform:none}
.lcl-lead{font-size:clamp(17px,1.5vw,21.6px);line-height:1.5;margin:0 0 var(--s-5,24px)}
.lcl-also{margin:var(--s-5,24px) 0 0;font-size:clamp(16px,1.4vw,20px)}
.lcl-also a{display:inline-flex;align-items:center;min-height:44px}
.lcl-art-wrap{display:block;width:100%;max-width:340px;justify-self:end}

@media (max-width:1023px){
  .lg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg,.lg:nth-child(n+4){grid-column:auto;border:0;padding:0 var(--s-4,16px) 0 0;border-top:1px solid var(--c-rule-soft);padding-top:var(--s-6,32px)}
  .lg:nth-child(-n+2){border-top:0;padding-top:0}
  .lg:nth-child(even){padding-left:var(--s-4,16px);border-left:1px solid var(--c-rule-soft)}
  .lg:nth-child(n+3):nth-child(even){border-left:1px solid var(--c-rule-soft)}
}
@media (max-width:767px){
  .sec--lhero{padding-block:var(--s-2,8px) var(--s-6,32px)}
  .lh-row{display:grid;grid-template-columns:minmax(0,1fr) 36%;gap:0 var(--s-3,12px)}
  .lh-text{display:contents}
  .lh-title{grid-column:1/-1;font-size:9.2vw}
  .lh-lead{grid-column:1;grid-row:2;font-size:16px;margin:var(--s-4,16px) 0}
  .lh-art-wrap{grid-column:2;grid-row:2;margin-top:var(--s-4,16px);align-self:center}
  .lh-cta{grid-column:1/-1;grid-row:3}
  .lh-cta .btn{width:100%}
  .lh-cta p{font-size:16px;max-inline-size:none}
  .sec--lsit{padding-block:var(--s-6,32px)}
  .ls-title{font-size:9.2vw}
  .ls-sub{font-size:16px}
  .ls-art-wrap{display:none}
  .ls-list{padding-left:var(--s-6,32px)}
  .ls-list::before{left:2px}
  .ls-row::before{left:-30px;width:20px;top:calc(var(--s-5,24px) + .65em)}
  .ls-row{display:block;padding-block:var(--s-4,16px)}
  .ls-q{font-size:19px;margin-bottom:var(--s-2,8px)}
  .ls-read,.ls-do{font-size:16px;margin:0}
  .ls-read a,.ls-do a{padding-block:12px;margin-block:-8px}
  .sec--lall{padding-block:var(--s-5,24px) var(--s-6,32px)}
  .la-title{font-size:9.2vw}
  .la-sub{font-size:16px}
  .lg-grid{display:block}
  .lg,.lg:nth-child(n+4),.lg:nth-child(even){display:grid;grid-template-columns:minmax(0,1fr) 28%;gap:0 var(--s-3,12px);border:0;border-top:1px solid var(--c-rule-soft);padding:var(--s-5,24px) 0}
  .lg:nth-child(-n+2){padding-top:var(--s-5,24px);border-top:1px solid var(--c-rule-soft)}
  .lg:nth-child(1){border-top:0}
  .lg>*{grid-column:1/-1}
  .lg-art-wrap{grid-column:2;grid-row:1/3;height:auto;margin:0;align-self:center}
  .lg-art-wrap img{width:100%;height:auto;max-height:110px}
  .lg-h{grid-column:1;grid-row:1;font-size:30px;align-self:end;margin:0}
  .lg-i{grid-column:1;grid-row:2;font-size:16px;margin:var(--s-2,8px) 0 var(--s-3,12px);align-self:start}
  .lg-list{grid-row:3;margin-top:var(--s-2,8px)}
  .lg-list a{font-size:16px;padding-block:12px;min-height:44px;box-sizing:border-box}
  .lg.is-collapsible:not(.is-open) .lg-list li:nth-child(n+6){display:none}
  .lg-more{grid-row:4;display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin-top:var(--s-3,12px);padding:0 var(--s-5,24px);background:transparent;border:2px solid var(--c-blue,#0B1F3A);color:var(--c-blue,#0B1F3A);font:500 15px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;cursor:pointer;justify-self:start}
  .lg-more[hidden]{display:none}
  .lg-more:focus-visible{outline:3px solid var(--c-focus,#C2410C);outline-offset:3px}
  .lc-grid,.lcl-grid{grid-template-columns:minmax(0,1fr) 34%;gap:var(--s-3,12px)}
  .lc-text,.lcl-grid>div{display:contents}
  .lc-title,.lcl-title{grid-column:1/-1;font-size:9vw}
  .lc-lead,.lcl-lead{grid-column:1;font-size:16px;margin:0}
  .lc-art-wrap,.lcl-art-wrap{grid-column:2;align-self:center;max-width:none}
  .lc-text .lh-cta,.lcl-grid .lh-cta,.lcl-also{grid-column:1/-1}
  .sec--lcta{padding-block:var(--s-5,24px)}
  .lo-box{grid-template-columns:minmax(0,1fr) 30%;padding:var(--s-5,24px) var(--s-4,16px);gap:var(--s-3,12px)}
  .lo-text{display:contents}
  .lo-title{grid-column:1/-1;font-size:9vw}
  .lo-text p{grid-column:1/-1;font-size:16px}
  .lo-art-wrap{grid-column:2;grid-row:3;max-width:none;align-self:center;display:none}
  .lf-title{font-size:9vw}
  .lf-item summary{font-size:18px}
  .lf-a p{font-size:16px}
  .sec--lclose{padding-block:var(--s-5,24px) var(--s-8,64px)}
  .lcl-also{font-size:16px}
}
@media (prefers-reduced-motion:reduce){.sec--lhero .ix-link,.sec--lsit .ix-link,.sec--lall .ix-link,.sec--lown .ix-link,.sec--lclose .ix-link{transition:none}}
/* design headings are tall and tightly tracked */
.lh-title,.ls-title,.la-title,.lc-title,.lo-title,.lf-title,.lcl-title,.lg-h{letter-spacing:-.025em;word-spacing:.05em}
.lg-n{letter-spacing:0;word-spacing:0}
@media (min-width:768px){
  .lh-row{grid-template-columns:minmax(0,73%) minmax(0,1fr)}
  .lh-art-wrap{width:128%;margin-left:-14%;margin-top:var(--s-3,12px)}
  .ls-art-wrap{top:-80px;width:180px}
  .ls-row{padding-block:30px}
  .ls-row::before{top:calc(30px + .7em)}
  .ls-row{grid-template-columns:minmax(0,1fr) auto}
  .ls-do{justify-self:end;max-inline-size:480px}
  .ls-read{max-inline-size:none}
}
.lh-lead{max-inline-size:800px}
.lf-a p{max-inline-size:none}
@media (min-width:768px){
  .lh-title{white-space:nowrap}
  .lo-box{padding:var(--s-5,24px) var(--s-7,48px)}
  .lo-art-wrap{max-width:290px}
  .lcl-art-wrap{max-width:270px}
  .lc-art-wrap{max-width:440px}
  .lf-item{padding-block:12px}
}
@media (max-width:767px){.lh-br{display:none}}
@media (max-width:767px){
  .ls-read a,.ls-do a{display:inline;padding-block:12px;margin-block:0}
  .lg-grid .lg,.lg-grid .lg:nth-child(n){border-left:0}
  .lg-h{white-space:nowrap;font-size:28px}
  .lg{grid-template-columns:minmax(0,1fr) 26%}
}
@media (max-width:767px){
  .lg-h{white-space:normal}
  .lg-n{display:inline-block;white-space:nowrap}
  .lc-title,.lcl-title{grid-row:1}
  .lc-lead,.lcl-lead{grid-row:2}
  .lc-art-wrap,.lcl-art-wrap{grid-row:2}
  .lc-text .lh-cta,.lcl-grid .lh-cta{grid-row:3}
  .lcl-also{grid-row:4}
}
/* round 2: review fixes */
.ls-th{display:none}
@media (min-width:768px){
  .lh-row{position:relative;display:block}
  .lh-art-wrap{position:absolute;right:0;top:0;width:490px;margin:0}
  .lh-title{margin-top:0}
  .la-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-5,24px)}
  .la-art-wrap{display:block;flex:none;width:clamp(150px,15vw,215px);margin-bottom:var(--s-3,12px)}
  .lg-art-wrap{height:clamp(180px,18vw,260px)}
  .lcl-grid{grid-template-columns:minmax(0,1fr) 240px}
  .lcl-title{white-space:normal;text-wrap:balance;font-size:clamp(26px,3.2vw,46px);padding-right:12px}
  .lcl-art-wrap{max-width:240px}
}
@media (max-width:767px){
  .la-art-wrap{display:none}
  .lh-row{grid-template-columns:minmax(0,1fr) 31%;align-items:start}
  .lh-title{grid-column:1;grid-row:1;font-size:9vw}
  .lh-lead{grid-column:1;grid-row:2}
  .lh-art-wrap{grid-column:2;grid-row:1/3;align-self:start;margin-top:var(--s-3,12px);width:100%}
  .lh-cta{grid-row:3}
  .sec--lsit{margin-inline:var(--gutter)}
  .sec--lsit .wrap{border:1px solid var(--c-rule-soft);padding:var(--s-5,24px) var(--s-4,16px);position:relative}
  .ls-list{padding-left:0}
  .ls-list::before,.ls-row::before{display:none}
  .ls-row{display:grid;grid-template-columns:76px minmax(0,1fr);gap:0 var(--s-3,12px);align-items:start}
  .ls-th{display:block;grid-row:1/4;grid-column:1;width:76px;height:auto;align-self:center}
  .ls-row>:not(.ls-th){grid-column:2}
  .ls-q{margin-bottom:var(--s-2,8px)}
}
@media (min-width:768px){
  .lh-row{min-height:clamp(420px,40vw,580px)}
  .lh-art-wrap{top:clamp(150px,17vw,250px);width:min(490px,34vw)}
}
@media (min-width:768px){
  .lg-art-wrap{height:clamp(200px,20.8vw,300px)}
  .lg-art-wrap img{width:auto;max-width:100%;object-position:left bottom}
  .lg-art-wrap img[src*="grp-planning"],.lg-art-wrap img[src*="grp-measure"]{height:100%}
  .lg-art-wrap img[src*="grp-search"]{height:84%}
  .lg-art-wrap img[src*="grp-redesign"]{height:78%}
  .lg-art-wrap img[src*="grp-design"]{height:64%}
}
@media (max-width:767px){
  .lh-row{grid-template-columns:minmax(0,1fr) 37%}
  .lh-title{font-size:8.1vw}
  .lh-art-wrap{margin-top:var(--s-6,32px)}
}
@media (max-width:767px){.lh-title{font-size:7.6vw}}
@media (max-width:767px){.lh-row{grid-template-columns:minmax(0,1fr) 32%}.lh-title{font-size:7.5vw}}
/* round 3 */
@media (min-width:768px){
  .lh-art-wrap{width:min(460px,32vw)}
  .ls-row{grid-template-columns:minmax(0,58%) minmax(0,1fr)}
  .ls-do{justify-self:start;max-inline-size:none}
  .lg:nth-child(n+4) .lg-art-wrap{height:clamp(240px,25vw,360px)}
  .lg-art-wrap img[src*="grp-redesign"]{height:80%}
}
@media (max-width:767px){
  .lh-title{grid-column:1/-1;grid-row:1;font-size:8.6vw}
  .lh-lead{grid-column:1;grid-row:2}
  .lh-art-wrap{grid-column:2;grid-row:2;width:100%;margin-top:var(--s-3,12px);align-self:center}
  .lh-row{grid-template-columns:minmax(0,1fr) 44%}
  .ls-title{font-size:7.3vw;white-space:nowrap}
  .ls-row{padding-block:12px}
  .ls-q{margin-bottom:var(--s-1,4px);font-size:18px}
  .lg,.lg:nth-child(n+4),.lg:nth-child(even){grid-template-columns:minmax(0,1fr) 36%;padding-block:var(--s-4,16px)}
  .lg-art-wrap img{max-height:160px}
  .lg-list a{padding-block:10px}
}
@media (min-width:768px) and (max-width:1100px){.lh-lead{max-inline-size:calc(100% - 350px)}}
/* mobile audit 24 Oct: hero text full width, shelf image below the intro */
@media (max-width:767px){
  .lh-row{grid-template-columns:minmax(0,1fr)}
  .lh-title{grid-column:1;grid-row:1;font-size:9vw}
  .lh-lead{grid-column:1;grid-row:2}
  .lh-art-wrap{grid-column:1;grid-row:3;width:56%;max-width:210px;margin:0 0 var(--s-4,16px) auto;align-self:start}
  .lh-cta{grid-column:1;grid-row:4}
  .ls-read a,.ls-do a{min-height:44px;padding-block:12px}
}
/* css/sections/seo-01.css */
/* SEO page (services/seo/). Scoped .seo-* only. Design: design/pages-2026-10-23/seo/images */
.seo-hero,.seo-for,.seo-what,.seo-receive,.seo-promise,.seo-own,.seo-steps,.seo-concepts,.seo-faq,.seo-close{background:var(--ground,#FDFBF7);color:var(--c-ink);padding-block:0}
.sec[class*="seo-"] *{box-sizing:border-box}
.seo-hero picture,.seo-own picture{display:block}
.seo-hero img,.seo-own img{display:block;width:100%;height:auto}

.seo-h1{text-transform:none;font:400 clamp(44px,6.7vw,97px)/1.08 var(--f-display);letter-spacing:-.012em;margin:0;color:var(--c-ink);max-width:14em}
.seo-h2{text-transform:none;font:400 clamp(34px,4.2vw,60px)/1.08 var(--f-display);letter-spacing:-.012em;margin:0 0 var(--s-4);color:var(--c-ink)}
.seo-h2--md{font-size:clamp(32px,4.2vw,60px)}.seo-own .seo-h2--md{font-size:clamp(32px,4.65vw,67px)}.seo-steps .seo-h2--md{font-size:clamp(32px,4vw,58px)}.seo-concepts .seo-h2--md{font-size:clamp(32px,4.55vw,65.5px)}.seo-receive .seo-h2{font-size:clamp(34px,5.2vw,75px)}.seo-promise .seo-h2{font-size:clamp(34px,4.6vw,66.5px)}
.seo-p{font:400 clamp(17px,1.9vw,27px)/1.5 var(--f-body);margin:0 0 var(--s-4);max-width:60em}
.seo-p--sm{font-size:clamp(16px,1.8vw,26px);max-width:24em}
.seo-p--wide{max-width:58em}
.seo-fine{font:400 clamp(16px,1.55vw,22px)/1.5 var(--f-body);margin:0;color:var(--c-ink)}
.seo-link{color:var(--c-blue);text-decoration-line:underline;text-underline-offset:.2em;text-decoration-thickness:1px}
.seo-link.ix-link:hover,.seo-link.ix-link:focus-visible{text-decoration-color:var(--c-accent)}
.seo-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.seo-rule{height:1px;margin:0 0 clamp(24px,3vw,44px);background:linear-gradient(90deg,var(--c-blue) 0 47.5%,transparent 47.5% 50.5%,var(--c-blue) 50.5% 100%)}
.seo-rule--solid{background:var(--c-ink)}
.seo-rule--stroke{background:linear-gradient(90deg,var(--c-ink) 0 100%) left center/calc(100% - 150px) 1px no-repeat;height:auto;display:flex;justify-content:flex-end;align-items:center}
.seo-rule--stroke img{width:clamp(110px,10vw,140px);height:auto}

/* hero */
.seo-hero{padding-top:clamp(12px,1.4vw,20px)}
.seo-crumb ol{list-style:none;margin:0 0 var(--s-3);padding:0;display:flex;flex-wrap:wrap;font:400 clamp(14px,1.25vw,18px)/1.4 var(--f-mono);letter-spacing:.02em}
.seo-crumb li{display:inline-flex;align-items:center;min-height:44px}
.seo-crumb li+li::before{content:">";margin:0 .6em}
.seo-crumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-ink);text-decoration:none}
.seo-hero__art{margin:clamp(4px,1vw,14px) 0 clamp(16px,2vw,28px)}
.seo-hero__art img{width:100%}
.seo-lead{font:400 clamp(19px,1.95vw,28px)/1.45 var(--f-body);margin:0 0 var(--s-5);max-width:none}
.seo-cta{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-3)}
.seo-cta .btn{font-size:clamp(14px,1.4vw,20px);min-height:clamp(52px,4.8vw,70px)}
.seo-ticks{font:400 clamp(16px,1.6vw,23px)/1.5 var(--f-body);margin:var(--s-4) 0 var(--s-3)}
.seo-limit{margin:0 0 clamp(28px,3.4vw,52px);font:400 clamp(17px,1.6vw,23px)/1.4 var(--f-body)}
.seo-limit strong{font-weight:700;display:inline-block;padding-bottom:6px;background:linear-gradient(var(--c-accent),var(--c-accent)) left bottom/100% 3px no-repeat}
.seo-hero .seo-fine{font-size:clamp(16px,1.6vw,23px)}

/* for + what */
.seo-for{padding-bottom:clamp(28px,3.4vw,52px)}
.seo-for .seo-h2{font-size:clamp(34px,4.2vw,60px);line-height:1}
.seo-what{padding-bottom:clamp(36px,4vw,60px)}
.seo-rows{list-style:none;margin:var(--s-4) 0 0;padding:0}
.seo-row{display:grid;grid-template-columns:minmax(0,.31fr) minmax(0,.69fr);align-items:start;border-top:1px solid var(--c-ink);padding:clamp(14px,1.5vw,22px) 0;gap:0 clamp(16px,2vw,28px)}
.seo-row:first-child{border-top:0;padding-top:0}
.seo-row h3{text-transform:none;font:400 clamp(24px,2.6vw,38px)/1.1 var(--f-display);margin:0;letter-spacing:-.005em}
.seo-row p{margin:0;font:400 clamp(16px,1.85vw,26px)/1.45 var(--f-body);max-width:none}

/* receive */
.seo-receive{padding-top:clamp(20px,2.4vw,36px);padding-bottom:clamp(36px,4vw,60px)}
.seo-receive__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,43%);column-gap:clamp(20px,2vw,30px);align-items:start}
.seo-dash{list-style:none;margin:0 0 var(--s-5);padding:0}
.seo-dash li{position:relative;padding:6px 0 6px 2em;font:400 clamp(16px,1.85vw,26px)/1.45 var(--f-body);margin-bottom:var(--s-2)}
.seo-dash li::before{content:"\2013";position:absolute;left:0;color:var(--c-accent);font-weight:700}
.seo-cta--mid{margin-top:var(--s-5)}
.seo-brief{position:relative;margin:0 clamp(8px,1.2vw,18px) 0 0;padding:clamp(22px,3vw,44px);background:var(--c-paper);border:3px solid var(--c-ink);box-shadow:10px 10px 0 -2px var(--c-rule-soft),14px 14px 0 -4px rgba(194,65,12,.35);transform:rotate(1.2deg)}
.seo-brief__cap{font:500 clamp(16px,1.9vw,27px)/1.3 var(--f-mono);margin:0 0 var(--s-4)}
.seo-brief__list{margin:0;display:grid;gap:clamp(10px,1.4vw,20px)}
.seo-brief__list>div{background:var(--c-fill-warm);padding:clamp(12px,1.5vw,22px) clamp(14px,2vw,30px)}
.seo-brief__list dt{font:700 clamp(15px,1.65vw,24px)/1.3 var(--f-mono)}
.seo-brief__list dd{margin:2px 0 0;font:400 clamp(15px,1.55vw,22px)/1.4 var(--f-mono)}
.seo-brief__tab{position:absolute;right:-14px;top:22%;width:14px;height:clamp(40px,4vw,56px);background:var(--c-accent);border:2px solid var(--c-ink);border-left:0}

/* promise */
.seo-promise{padding-bottom:clamp(28px,3.4vw,52px)}
.seo-promise .seo-h2{font-size:clamp(34px,4.6vw,66.5px);line-height:1}

/* own */
.seo-own{padding-bottom:clamp(28px,3.4vw,52px)}
.seo-own__grid{display:grid;grid-template-columns:clamp(160px,21vw,300px) minmax(0,1fr);column-gap:clamp(20px,2.4vw,36px);align-items:center}
.seo-own__art{width:calc(100% + var(--gutter));max-width:none;justify-self:start;margin-left:calc(-1 * var(--gutter))}
.seo-own .seo-p{max-width:none;font-size:clamp(16px,1.85vw,26px)}

/* steps */
.seo-steps{padding-bottom:clamp(28px,3.4vw,52px)}
.seo-two{list-style:none;margin:var(--s-4) 0 var(--s-5);padding:0;display:grid;grid-template-columns:1fr 1fr}
.seo-two li{padding-right:clamp(20px,3vw,44px)}
.seo-two li+li{border-left:1px solid var(--c-ink);padding-left:clamp(20px,3vw,44px);padding-right:0}
.seo-two h3{text-transform:none;font:400 clamp(26px,2.9vw,42px)/1.1 var(--f-display);margin:0 0 var(--s-2)}
.seo-two p{margin:0;font:400 clamp(16px,1.85vw,26px)/1.45 var(--f-body);max-width:24em}
.seo-note{margin:0;border-top:1px solid var(--c-ink);padding-top:var(--s-4);font:400 clamp(16px,1.85vw,26px)/1.5 var(--f-body)}

/* concepts */
.seo-concepts{padding-top:clamp(8px,1vw,16px);padding-bottom:clamp(20px,2.4vw,36px)}
.seo-concepts .seo-h2{max-width:11em}
.seo-links a,.seo-links--close a{display:inline-flex;align-items:center;min-height:44px}
.seo-links{margin-bottom:0}

/* faq */
.seo-faq{padding-bottom:clamp(20px,2.4vw,36px)}
.seo-faqgrid{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--c-ink)}
.seo-faqcol:first-child{padding-right:clamp(16px,2.4vw,36px);border-right:1px solid var(--c-ink)}
.seo-faqcol:last-child{padding-left:clamp(16px,2.4vw,36px)}
.seo-q{border-top:1px solid var(--c-ink);padding:clamp(14px,1.6vw,22px) 0}
.seo-q:first-child{border-top:0}
.seo-q summary{list-style:none;cursor:default;text-transform:none;font:400 clamp(22px,2.2vw,32px)/1.15 var(--f-display);margin:0 0 var(--s-2)}
.seo-q summary::-webkit-details-marker{display:none}
.seo-a p{margin:0;font:400 clamp(16px,1.75vw,24px)/1.45 var(--f-body)}
.seo-a p+p{margin-top:var(--s-1)}

/* close */
.seo-close{padding-top:clamp(20px,2.4vw,36px);padding-bottom:clamp(40px,5vw,72px)}
.seo-close .seo-h2{font-size:clamp(34px,3.9vw,56px);line-height:1;white-space:nowrap}
.seo-cta--close{margin-bottom:var(--s-3)}
.seo-links--close{margin:var(--s-5) 0 0;font:400 clamp(16px,1.75vw,24px)/1.5 var(--f-body)}

.seo-hero a:focus-visible,.seo-for a:focus-visible,.seo-what a:focus-visible,.seo-own a:focus-visible,.seo-steps a:focus-visible,.seo-concepts a:focus-visible,.seo-faq a:focus-visible,.seo-close a:focus-visible,.seo-q summary:focus-visible{outline:3px solid var(--c-focus);outline-offset:3px}

@media (max-width:1023px){
  .seo-receive__grid{grid-template-columns:1fr}
  .seo-brief{max-width:460px;margin:var(--s-6) auto 0 0}
}
@media (max-width:767px){
  .seo-h1{font-size:clamp(34px,10.4vw,44px);line-height:1.05;max-width:none}
  .seo-h1__o{color:var(--c-accent);display:block}
  .seo-hero picture.seo-hero__art{display:none}
  .seo-lead{font-size:18px;margin-top:var(--s-4)}
  .seo-cta{align-items:stretch}
  .seo-cta .btn{width:100%;font-size:14px;min-height:52px}
  .seo-hero .seo-fine,.seo-ticks,.seo-limit{font-size:16px}
  .seo-h2,.seo-h2--md,.seo-for .seo-h2,.seo-promise .seo-h2,.seo-close .seo-h2{white-space:normal;font-size:clamp(34px,10.6vw,44px);line-height:1.02}
  .seo-p,.seo-own .seo-p{font-size:17px}
  .seo-row{grid-template-columns:1fr;gap:var(--s-2)}
  .seo-row h3{font-size:30px}
  .seo-row p{font-size:17px}
  .seo-dash li,.seo-p--sm{font-size:17px}
  .seo-own__grid{grid-template-columns:1fr;row-gap:var(--s-4)}
  .seo-own__art{width:160px;margin-left:calc(-1 * var(--gutter))}
  .seo-two{grid-template-columns:1fr;row-gap:var(--s-5)}
  .seo-two li,.seo-two li+li{border-left:0;padding:0}
  .seo-two p,.seo-note{font-size:17px}
  .seo-faqgrid{grid-template-columns:1fr}
  .seo-faqcol:first-child{border-right:0;padding-right:0}
  .seo-faqcol:last-child{padding-left:0;border-top:1px solid var(--c-ink)}
  .seo-q summary{font-size:26px}
  .seo-a p{font-size:17px}
  .seo-rule--stroke{background-size:calc(100% - 120px) 1px}
  .seo-brief{margin-right:14px}
}
/* close h2 wraps where nowrap overflows (1440 untouched) */
@media (min-width:768px) and (max-width:1023px){
  .seo-close .seo-h2{white-space:normal}
}

/* MOBILE FIX 24 Oct round 2 (phone only): FAQ accordion, first open, 48px summaries */
@media (max-width:767px){
.seo-q{display:block}
.seo-q summary{pointer-events:auto;cursor:pointer;float:none;width:auto;margin:0;padding:8px 0;border:0;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:48px;font:400 24px/1.3 var(--f-display)}
.seo-q summary::after{content:"+";display:block;flex:none;font:400 28px/1 var(--f-body);color:var(--c-accent)}
.seo-q[open] summary::after{content:"\2212"}
.seo-q:not([open]) .seo-a{display:none}
.seo-q summary:focus-visible{outline:3px solid var(--c-focus);outline-offset:2px}
}
@media (max-width:767px){
.seo-links{display:flex;flex-direction:column}
.seo-links span[aria-hidden]{display:none}
.seo-links a{display:flex;align-items:center;min-height:44px}
}
/* css/sections/services-01-03.css */
/* SERVICES-1: hero, ownership, doors. Scoped .sec--svc-*; tokens only. */
.sec--svc-hero,.sec--svc-doors{background:var(--ground,#FDFBF7)}

/* ---------- 01 hero ---------- */
.sec--svc-hero{padding-block:var(--s-6) 0}
.svc-hero__grid{display:grid;gap:var(--s-6);grid-template-columns:1fr}
.svc-hero__h1{font-size:clamp(40px,7.3vw,106px);line-height:.88;margin-bottom:var(--s-5);max-width:none}
.svc-hero__sub{font-size:clamp(18px,1.6vw,24px);line-height:1.4;max-width:30em;color:var(--c-ink)}
.svc-hero__cta{margin-block:var(--s-5) var(--s-4)}
.svc-hero__cta .btn{width:100%}
.svc-hero__fine{margin:var(--s-3) 0 0;color:var(--c-text-muted);font-size:var(--fs-body)}
.svc-hero__ticks{list-style:none;margin:var(--s-4) 0;padding:0;display:grid;gap:var(--s-3)}
.svc-hero__ticks li{position:relative;padding-left:var(--s-6)}
.svc-hero__ticks li::before{content:"";position:absolute;left:0;top:.35em;width:14px;height:14px;background:var(--c-blue)}
.svc-hero__work a{font-family:var(--f-mono)}
.svc-hero__cards{display:none}
.svc-jump{margin-top:var(--s-6)}
.svc-jump ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);border:2px solid var(--c-ink);background:var(--ground,#FDFBF7)}
.svc-jump li+li{border-top:1px solid var(--c-ink)}
.svc-jump a{display:flex;align-items:center;gap:var(--s-3);min-height:48px;padding:0 var(--s-4);font:500 var(--fs-small) var(--f-mono);text-transform:uppercase;letter-spacing:.06em;text-decoration:none}
.svc-jump a::before{content:"";width:12px;height:12px;background:var(--c-blue);flex:none}
.svc-jump a:hover{color:var(--c-cta)}
@media (max-width:899px){.svc-jump ul{grid-template-columns:1fr 1fr}.svc-jump li{border-top:1px solid var(--c-ink)!important}.svc-jump li:nth-child(-n+2){border-top:0!important}.svc-jump li:nth-child(odd){border-right:1px solid var(--c-ink)}}
@media (min-width:900px){
  .sec--svc-hero{padding-block:var(--s-7) 0}
  .svc-hero__grid{grid-template-columns:minmax(0,1.9fr) minmax(300px,.85fr);gap:var(--s-7);align-items:start}
  .svc-hero__cta .btn{width:auto}
  .svc-hero__ticks,.svc-hero__who{display:none}
  .svc-hero__cards{display:grid;gap:var(--s-6);padding-top:var(--s-5)}
  .svc-note{position:relative;background:var(--c-card);padding:var(--s-5) var(--s-5) var(--s-5);box-shadow:var(--shadow-card);transition:transform var(--t-base) var(--ease)}
  .svc-note__t{font:500 28px/1.1 var(--f-mono);margin-bottom:var(--s-3);text-transform:uppercase}
  .svc-note p{margin:0;font-size:var(--fs-lead);line-height:1.4;color:var(--c-text-muted)}
  .svc-note__tick{position:relative;padding-left:var(--s-6)}
  .svc-note__tick::before{content:"";position:absolute;left:0;top:.4em;width:20px;height:20px;background:var(--c-blue)}
  .svc-note__link{display:inline-block;margin-top:var(--s-3);color:var(--c-blue);font-size:var(--fs-lead);min-height:44px}
  .svc-jump{margin-top:var(--s-7)}
  .svc-jump ul{display:flex}
  .svc-jump li{flex:1;border-top:0!important}
  .svc-jump li+li{border-left:1px solid var(--c-ink)}
  .svc-jump a{justify-content:center;min-height:80px}
}

/* ---------- 02 ownership ---------- */
.sec--svc-own{background:var(--c-black);color:var(--c-paper);padding-block:var(--s-8)}
.sec--svc-own .eyebrow{color:var(--c-paper)}
.sec--svc-own :focus-visible{outline-color:var(--c-focus-on-dark)}
.svc-own__grid{display:grid;gap:var(--s-6);grid-template-columns:1fr;align-items:center}
.svc-own__h{font-size:clamp(40px,6.2vw,90px);line-height:.92;max-width:8em}
.svc-own__lead{font-size:var(--fs-lead);line-height:1.4;color:var(--c-paper);max-width:24em}
.svc-own__plate{display:inline-block;margin-top:var(--s-4);padding:var(--s-3) var(--s-5) var(--s-3) var(--s-4);background:var(--ground,#FDFBF7);clip-path:polygon(28px 0,100% 0,100% 100%,0 100%,0 28px)}
.svc-own__plate img{width:min(250px,60vw);height:auto}
.svc-own__lines{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3);grid-template-columns:1fr}
.svc-own__card{position:relative;border:1px solid rgba(253,251,247,.7);padding:var(--s-5);min-height:120px}
.svc-own__card h3{font:700 clamp(24px,2.4vw,40px)/1.05 var(--f-body);text-transform:none;margin-bottom:var(--s-2);letter-spacing:0}
.svc-own__card p{margin:0;font-size:var(--fs-body);line-height:1.5}
@media (min-width:900px){
  .sec--svc-own{padding-block:var(--s-9)}
  .svc-own__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--s-8)}
  .svc-own__plate img{width:250px}
  .svc-own__lines{grid-template-columns:1fr 1fr;gap:var(--s-4)}
  .svc-own__card{min-height:260px;display:flex;flex-direction:column;justify-content:flex-end}
}

/* ---------- 03 doors ---------- */
.sec--svc-doors{padding-block:var(--s-8)}
.svc-doors__h{font-size:clamp(40px,7.3vw,106px);line-height:.9;text-transform:none;margin-bottom:var(--s-6)}
.svc-doors__grid{display:grid;gap:var(--s-6);grid-template-columns:1fr;padding-top:var(--s-3)}
.svc-door{position:relative;background:var(--c-white);border:1px solid var(--c-ink);padding:var(--s-6) var(--s-5) var(--s-5);box-shadow:var(--shadow-card);display:flex;flex-direction:column;transition:transform var(--t-base) var(--ease)}
.svc-door__ltr{position:absolute;left:var(--s-4);top:-24px;min-width:52px;height:48px;padding:0 var(--s-4);display:grid;place-items:center;background:var(--c-paper);border:2px solid var(--c-ink);font:700 22px/1 var(--f-mono)}
.svc-door:nth-child(2) .svc-door__ltr{transform:rotate(4deg)}
.svc-door h3{font-size:clamp(26px,2.3vw,34px);line-height:1.02;text-transform:none;margin-bottom:var(--s-3)}
.svc-door p{color:var(--c-text-muted);font-size:var(--fs-body);margin-bottom:var(--s-3)}
.svc-door .svc-door__links{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);margin-top:auto;padding-top:var(--s-4);color:var(--c-ink)}
.svc-door__links a,.svc-door__aside a{display:inline-flex;align-items:center;min-height:44px;font:500 var(--fs-small) var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--c-ink);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.25em}
.svc-door__links a:hover,.svc-door__aside a:hover{color:var(--c-cta)}
.svc-door .svc-door__aside{margin:0 0 var(--s-2);color:var(--c-text-muted)}
.svc-door__art{align-self:flex-end;width:auto;height:96px;margin-top:var(--s-2)}
.svc-door__art--tall{height:110px}
.svc-door--quiet{background:transparent;border:1px dashed var(--c-ink);box-shadow:none}
.svc-doors__note{margin:var(--s-7) 0 0;padding-top:var(--s-5);border-top:2px solid var(--c-ink);max-width:none;font-size:var(--fs-lead)}
.svc-doors__note a{color:var(--c-blue);display:inline-flex;min-height:44px;align-items:center}
@media (min-width:700px){.svc-doors__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){
  .sec--svc-doors{padding-block:var(--s-9)}
  .svc-doors__grid{grid-template-columns:repeat(4,1fr);gap:var(--s-5);align-items:stretch}
  .svc-door__art{height:112px}
  .svc-door__art--tall{height:132px}
  .svc-door--quiet{min-height:0}
}
.svc-door--quiet .svc-door__links{margin-top:0}
@media (max-width:699px){
  .svc-own__plate img{width:170px}
  .svc-door{padding-bottom:var(--s-6)}
  .svc-door__art{position:absolute;right:var(--s-4);bottom:var(--s-4);height:96px;width:auto;margin:0}
  .svc-door__art--tall{height:96px}
  .svc-door:not(.svc-door--quiet) p{padding-right:64px}
  .svc-door:not(.svc-door--quiet){min-height:230px}
}
/* paper shadows per design */
.sec--svc-hero .svc-jump ul{box-shadow:0 6px 14px rgba(0,0,0,.14)}
.sec--svc-hero .svc-note,.sec--svc-doors .svc-door:not(.svc-door--quiet){box-shadow:0 10px 22px rgba(0,0,0,.2),0 1px 3px rgba(0,0,0,.16)}
.sec--svc-own .svc-own__plate{filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
/* interactions: structure only; motion.css owns the effects */
.sec--svc-doors .svc-door__links a.ix-link,.sec--svc-hero .svc-jump a.ix-link{text-decoration-color:currentColor}
.sec--svc-hero .svc-jump a{transition:background var(--t-base)}
.sec--svc-hero .svc-jump a:hover,.sec--svc-hero .svc-jump a:focus-visible,.sec--svc-hero .svc-jump a:active{background:rgba(194,65,12,.08)}

/* CARD-CLICK FIX 24 Oct: a card whose purpose is its one link opens it from anywhere (stretched link, focus ring round the whole card) */
.svc-note--link,.svc-door--link{position:relative}
.svc-note__link::after,.svc-door--link .svc-door__links a::after{content:"";position:absolute;inset:0;z-index:2}
.svc-note__link:focus-visible,.svc-door--link .svc-door__links a:focus-visible{outline:0}
.svc-note__link:focus-visible::after,.svc-door--link .svc-door__links a:focus-visible::after{outline:3px solid var(--c-focus);outline-offset:2px}

/* MOBILE FIX 24 Oct round 2 (phone only): path from the chooser to the form and back, labelled jump list */
.svc-jump__lab,.svc-jump__form,.svc-back{display:none}
@media (max-width:767px){
.svc-jump__lab{display:block;margin:0 0 var(--s-2);font:500 14px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.06em}
.svc-jump__form{display:list-item;grid-column:1/-1;border-top:1px solid var(--c-ink)!important}
.svc-jump__form a{background:var(--c-cta,#C2410C);color:#fff;font-size:14px;line-height:1.3;white-space:normal}
.svc-jump__form a::before{background:#fff}
.svc-jump a{min-height:48px;font-size:14px}
.svc-back{display:flex;flex-wrap:wrap;gap:0 var(--s-5);margin:var(--s-4) 24px 0;padding:0}
.svc-back a{display:inline-flex;align-items:center;min-height:48px;font:500 14px/1.3 var(--f-mono);letter-spacing:.04em}
input[name="website_url"]{font-size:16px}
}

/* REVIEW FIX 25 Oct (c13): plain mono link rows read as unstyled text; show the underline like the door and jump links */
.svc-back a.ix-link,.sv3-links a.ix-link{text-decoration-line:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:.25em}
.svc-back a.ix-link:hover,.svc-back a.ix-link:focus-visible,.sv3-links a.ix-link:hover,.sv3-links a.ix-link:focus-visible{text-decoration-color:var(--c-accent)}