
/* Layout: a full-bleed illustrated hillside (canvas) with the copy over the sky at left and the tree growing on the near hill at right; the group "backbone" band is the bedrock beneath. Light is the default; dark ships too. Tokens: DMLRD Ventures brand system v1.2 plus a landscape set shared in spirit with the Internet Services "Night ridge". */
:root{
  --paper-000:#faf8f5; --paper-100:#ffffff; --paper-200:#f1eee9;
  --line-100:#e4e0da; --line-200:#86818d;
  --ink-900:#221f26; --ink-600:#5f5a66; --ink-on-ascent:#ffffff;
  --ascent-500:#7d3aa0; --ascent-200:#ecdff4;
  --seed-500:#007a69; --seed-200:#d6f4ef;
  --scale-500:#b0008a; --scale-200:#f8dcf0;
  --lift:0 0 0 1px #ecdff4, 0 8px 28px 0 #7d3aa01f;
  --panel:#ffffffcc; --bar:rgba(250,248,245,.62);
  --wood:#3a2f45;
  --sky-1:#faf8f5; --sky-2:#ede8f0;
  --hill-far:#e4e9e1; --hill-mid:#cfe2d4; --hill-near:#b8d6c0; --grass:#8fbf9f;
  --font-display:"Lexend",system-ui,sans-serif;
  --font-body:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--paper-000);color:var(--ink-900);font-family:var(--font-body);font-size:17px;line-height:27px}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--ascent-500);outline-offset:2px;border-radius:8px}
.wrap{max-width:1440px;margin:0 auto}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* hero */
.hero{position:relative;overflow:hidden;background:var(--sky-1)}
.hdr{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 24px}
.hdr img{height:48px;width:auto}
img.dk{display:none}
.nav{display:flex;align-items:center;gap:28px;font:500 15px/20px var(--font-display)}
.nav a{display:inline-flex;align-items:center;min-height:44px}
.nav .sec{padding:0 20px;border:1px solid var(--line-200);border-radius:8px;background:var(--panel)}
@media (max-width:860px){.nav a:not(.sec){display:none}}
.scene{position:relative;min-height:640px}
.scene canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.main{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;padding:40px 24px 56px}
@media (max-width:980px){.main{grid-template-columns:1fr;padding:24px 16px 28px}}
@media (max-width:520px){.lead .l2{display:none}.main{padding:20px 16px 24px}.copy{gap:16px}}
.copy{display:flex;flex-direction:column;gap:24px;max-width:560px}
h1{margin:0;font:600 clamp(40px,5vw,64px)/1.06 var(--font-display);letter-spacing:-.02em;text-wrap:balance}
.lead{margin:0;font-size:20px;line-height:31px;color:var(--ink-600);max-width:42ch}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 26px;border-radius:8px;font:600 16px/20px var(--font-display);border:1px solid transparent;cursor:pointer;transition:box-shadow .18s ease-out,border-color .18s ease-out}
.btn.p{background:var(--ascent-500);color:var(--ink-on-ascent)} .btn.p:hover{box-shadow:var(--lift)}
.btn.s{border-color:var(--line-200);color:var(--ink-900);font-weight:500;background:var(--panel)} .btn.s:hover{border-color:var(--ascent-500)}

/* the life cycle, a subtle stage line under the CTAs */
.stagebox{margin-top:12px;padding:6px 14px 12px;border-radius:12px;background:var(--panel);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;flex-direction:column;gap:6px;align-self:flex-start;max-width:100%}
@media (max-width:980px){.stagebox{margin-top:clamp(300px,80vw,420px)}} /* v1.0.2: on narrow screens the hillside and tree get their own space between the buttons and the stage card */
.stages{display:flex;align-items:flex-start;flex-wrap:wrap;gap:0 4px}
.stg{position:relative;display:grid;grid-template-columns:auto auto;grid-template-areas:"dot word" ". tag";justify-content:start;align-items:center;column-gap:8px;min-height:44px;padding:4px 22px 6px 0;border:0;background:transparent;color:var(--ink-600);cursor:pointer;text-align:left;font:500 15px/20px var(--font-display);letter-spacing:.02em;transition:color .32s ease-out}
.stg i{grid-area:dot;width:8px;height:8px;border-radius:999px;background:var(--ink-600);display:inline-block;transition:background .32s ease-out,transform .32s ease-out}
.stg .w{grid-area:word;transition:font-size .32s ease-out,color .32s ease-out}
.stg small{grid-area:tag;font:500 12px/15px var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-600);white-space:nowrap;transition:color .32s ease-out}
.stg+.stg::before{content:"";position:absolute;left:-18px;top:14px;width:14px;height:1px;background:var(--line-100)}
.stg[aria-pressed="true"]{color:var(--ascent-500)} .stg[aria-pressed="true"] .w{font-size:20px;font-weight:600} .stg[aria-pressed="true"] small{color:var(--ascent-500)} .stg[aria-pressed="true"] i{background:var(--ascent-500);transform:scale(1.5)}
.stg[aria-pressed="true"] .w::after{content:"";display:block;height:2px;margin-top:1px;background:var(--ascent-500);border-radius:2px;transform-origin:left;animation:grow .4s ease-out}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.stg:hover{color:var(--ink-900)}
.stageline{display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:4px;align-items:baseline;font-size:15px;line-height:22px;color:var(--ink-600);min-height:48px;max-width:560px;transition:opacity .32s ease-out}
.stageline .who{font:600 11px/22px var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-900)}
.stageline .sl{color:var(--ink-600)}
@media (max-width:520px){ .stages{display:grid;grid-template-columns:1fr 1fr;gap:2px 8px} .stg{padding-right:8px} .stg+.stg::before{display:none} }

/* backbone band = the bedrock under the hills */
.backbone{position:relative;border-top:2px dashed var(--line-200);background:var(--paper-100);padding:28px 24px 36px}
.backbone .lbl{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-bottom:20px}
.backbone .lbl b{font:500 15px/20px var(--font-display);letter-spacing:.02em;color:var(--ink-900)}
.backbone .lbl span{font-size:15px;line-height:23px;color:var(--ink-600)}
.roots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:860px){.roots{grid-template-columns:1fr}}
.root{display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:22px 22px 20px;border:1px solid var(--line-200);border-radius:12px;background:var(--paper-000);min-height:160px;transition:border-color .18s ease-out,box-shadow .18s ease-out}
.root:hover{border-color:var(--ascent-500);box-shadow:var(--lift)}
/* owner's rule: equal visible height. The ISI SVG carries ~9.5% empty space top and bottom inside its viewBox, so it is set 84/68 taller to show the same 68px of artwork */
.root .logo{height:68px;display:flex;align-items:center}
.root .logo img{height:68px;width:auto;max-width:100%}
.root .logo.isi img{height:84px;margin:-8px 0}
.root > span{font-size:15px;line-height:23px;color:var(--ink-600)}
@media (max-width:520px){.root .logo,.root .logo img{height:58px}.root .logo.isi img{height:72px;margin:-7px 0}}
.rule{position:absolute;left:0;right:0;top:-1px;height:2px;background:linear-gradient(45deg,#00dec4,#da00ac)}
.ftr{position:relative;border-top:1px solid var(--line-100);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding:14px 24px;font-size:15px;line-height:23px;color:var(--ink-600)}
.ftr a{display:inline-flex;align-items:center;min-height:44px;color:var(--ascent-500);font:500 15px/20px var(--font-display)}
.dot{width:8px;height:8px;border-radius:999px;background:var(--seed-500);display:inline-block;margin-right:10px;vertical-align:middle}

@media (prefers-reduced-motion: reduce){ .stg,.root,.btn{transition:none} }
/* ===== sticky translucent header (Internet Services pattern, light only) ===== */
.hdr{position:sticky;top:0;z-index:6;background:var(--bar);backdrop-filter:blur(10px) saturate(1.3);-webkit-backdrop-filter:blur(10px) saturate(1.3);border-bottom:1px solid #e4e0da80}
@supports not (backdrop-filter:blur(1px)){.hdr{background:var(--paper-000)}}
.hdr .burger{display:none;width:44px;height:44px;border:1px solid var(--line-200);border-radius:8px;background:transparent;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.hdr .burger i{width:18px;height:2px;background:var(--ink-900);display:block;border-radius:2px}
.nav .cta{padding:0 20px;border-radius:8px;background:var(--ascent-500);color:var(--ink-on-ascent);font-weight:600}
@media (max-width:1180px){
  .hdr .burger{display:inline-flex}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;padding:8px 16px 16px;background:var(--paper-000);border-bottom:1px solid var(--line-100);box-shadow:0 12px 28px #221f261a}
  .nav.open{display:flex}
  .nav a{min-height:48px;padding:0 8px;border-bottom:1px solid var(--line-100)} .nav a.cta,.nav a.sec{margin-top:12px;justify-content:center;border-bottom:0}
}
@media (max-width:860px){.nav a:not(.sec){display:inline-flex}}

/* ===== page sections below the hero ===== */
.sec{padding:72px 24px 56px;scroll-margin-top:84px}
.sec > *{max-width:1152px;margin-left:auto;margin-right:auto}
.sec.alt{background:var(--paper-200)}
.sechd{display:flex;flex-direction:column;gap:8px;margin-bottom:32px}
.eyebrow{font:600 11px/16px var(--font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-600)}
h2{margin:0;font:600 clamp(28px,3.2vw,40px)/1.15 var(--font-display);letter-spacing:-.015em;text-wrap:balance;max-width:24ch}
h3{margin:0;font:600 22px/30px var(--font-display);letter-spacing:-.01em}
.two{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:32px;align-items:start}
.pts{list-style:none;margin:0;padding:0;display:grid;gap:14px;font-size:16px;line-height:25px;color:var(--ink-600)}
.pts li{display:flex;gap:14px;align-items:flex-start} .pts b{color:var(--ink-900);font-weight:600}
.d{flex:none;width:8px;height:8px;border-radius:999px;margin-top:9px} .d.seed{background:var(--seed-500)} .d.ascent{background:var(--ascent-500)}
.aside{padding:22px 24px;border:1px solid var(--line-100);border-radius:12px;background:var(--paper-100);display:flex;flex-direction:column;gap:8px}
.aside p{margin:0;font-size:16px;line-height:25px;color:var(--ink-600)} .aside b{color:var(--ink-900);font-weight:600}
.more{margin:28px auto 0;font:500 16px/22px var(--font-display)} .more a{display:inline-flex;align-items:center;min-height:44px;color:var(--ascent-500)} .more a:hover{text-decoration:underline;text-underline-offset:4px}
.cycle{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:st}
.cycle li{position:relative;display:flex;flex-direction:column;gap:6px;padding:22px 22px 18px;border-radius:12px;background:var(--paper-100);border:1px solid var(--line-100)}
.cycle li::before{content:"";position:absolute;left:22px;top:0;width:36px;height:3px;border-radius:0 0 3px 3px;background:var(--seed-500)}
.cycle li:nth-child(2)::before{background:#3f5fa8}.cycle li:nth-child(3)::before{background:var(--ascent-500)}.cycle li:nth-child(4)::before{background:var(--scale-500)}
.cycle .st{font:600 22px/28px var(--font-display)} .cycle .tg{font:500 11px/16px var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-600);margin-bottom:6px}
.cycle p{margin:0;font-size:14px;line-height:21px;color:var(--ink-600)} .cycle p b{color:var(--ink-900);font-weight:600}
.focus{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.fx{display:grid;grid-template-columns:48px 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;padding:18px 18px 16px;border-radius:12px;background:var(--paper-100);border:1px solid var(--line-100)}
.fx svg{grid-row:1/3;width:48px;height:48px}
.fx b{font:600 17px/22px var(--font-display)} .fx span{font-size:14px;line-height:20px;color:var(--ink-600)}
.pgrp{display:grid;grid-template-columns:236px minmax(0,1fr);gap:24px;padding:24px 0;border-top:1px solid var(--line-100)}
.plbl{display:flex;flex-direction:column;gap:4px} .plbl b{font:500 16px/22px var(--font-display)} .plbl span{font-size:14px;line-height:21px;color:var(--ink-600)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:14px}
.card{display:flex;flex-direction:column;gap:8px;padding:20px 20px 18px;border-radius:12px;background:var(--paper-100);border:1px solid var(--line-100);transition:border-color .18s ease-out,box-shadow .18s ease-out}
.card:hover{border-color:var(--ascent-500);box-shadow:var(--lift)}
.card h3{font-size:19px;line-height:26px;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px} .card h3 small{font:500 13px/18px var(--font-body);color:var(--ink-600)}
.card p{margin:0;font-size:15px;line-height:22px;color:var(--ink-600);flex:1}
.tag{align-self:flex-start;font:500 12px/16px var(--font-body);letter-spacing:.02em;padding:4px 10px;border-radius:999px;background:var(--paper-200);color:var(--ink-600)}
.tag.held{background:var(--ascent-200);color:var(--ascent-500)} .tag.exit{background:var(--scale-200);color:var(--scale-500)}
.tags{display:flex;flex-wrap:wrap;gap:6px} .tag.via{background:transparent;border:1px solid var(--line-100)}
.card.exited{background:transparent}
/* company logos: files to come from the owner; until a file is present the card shows a monogram */
.plogo{position:relative;display:flex;align-items:center;height:56px;margin-bottom:4px}
.plogo img{height:56px;width:auto;max-width:170px;object-fit:contain;object-position:left center}
.plogo.nofile::before{content:attr(data-mono);width:40px;height:40px;border-radius:10px;background:var(--paper-200);color:var(--ink-600);font:600 18px/40px var(--font-display);text-align:center}
.plogo.nofile img{display:none}
.plogo.sq img{border-radius:10px}
.plogo.dark:not(.nofile){background:var(--ink-900);border-radius:8px;padding:8px 12px;height:48px;width:fit-content;align-self:flex-start;box-sizing:border-box;margin:4px 0 8px} .plogo.dark img{height:32px}
.card .fd{font:500 13px/19px var(--font-body);color:var(--ink-900);flex:0}
.card .fd a{color:var(--ascent-500)} .card .fd a:hover{text-decoration:underline;text-underline-offset:3px}
.card h3 a{color:inherit} .card h3 a:hover{color:var(--ascent-500)}
.about{display:flex;flex-direction:column;gap:24px}
.gintro{margin:8px 0 0;font:500 16px/25px var(--font-display);color:var(--ink-900);max-width:70ch}
.big{margin:0;font-size:21px;line-height:33px;color:var(--ink-900);max-width:52ch}
.facts{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:18px 24px}
.facts div{display:flex;flex-direction:column;gap:2px} .facts dt{font:600 11px/16px var(--font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-600)} .facts dd{margin:0;font-size:16px;line-height:24px}
.gcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.gcard{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:20px 20px 18px;border:1px solid var(--line-100);border-radius:12px;background:var(--paper-100);font-size:14px;line-height:20px;color:var(--ink-600)}
a.gcard:hover{border-color:var(--ascent-500)}
/* group cards: equal visible height (owner's rule); the ISI SVG carries internal padding, so it is set taller */
.glogo{height:52px;display:flex;align-items:center} .glogo img{height:52px;width:auto;max-width:100%} .glogo.isi img{height:64px;margin:-6px 0}
/* ===== the wizard: Internet Services structure, Ventures tokens ===== */
.sec.talk .talkgrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:48px;align-items:start}
.tleft{display:flex;flex-direction:column;gap:18px} .tleft .sechd{margin-bottom:6px}
.lead2{margin:12px 0 0;font-size:18px;line-height:29px;color:var(--ink-600);max-width:40ch}
.btn.wa{background:var(--seed-200);border-color:var(--seed-200);color:var(--ink-900);font-weight:600;align-self:flex-start;width:100%;max-width:440px}
.btn.wa::before{content:"";width:20px;height:20px;margin-right:10px;background:var(--seed-500);mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 2a8 8 0 1 1-4.1 14.9l-.3-.2-3 .8.8-2.9-.2-.3A8 8 0 0 1 12 4zm-3 4.5c-.2 0-.5 0-.8.3-.3.3-1 1-1 2.4s1 2.8 1.2 3c.1.2 2 3.2 5 4.4 2.5 1 3 .8 3.5.7.5-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.2-1.4-.1-.1-.3-.2-.6-.3l-2-1c-.3-.1-.5-.2-.7.1l-1 1.2c-.2.2-.3.2-.6.1a7 7 0 0 1-3.4-3c-.3-.4 0-.5.2-.7l.5-.6.3-.5v-.5l-.9-2.2c-.2-.5-.5-.5-.7-.5h-.6z'/></svg>") center/contain no-repeat;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 2a8 8 0 1 1-4.1 14.9l-.3-.2-3 .8.8-2.9-.2-.3A8 8 0 0 1 12 4zm-3 4.5c-.2 0-.5 0-.8.3-.3.3-1 1-1 2.4s1 2.8 1.2 3c.1.2 2 3.2 5 4.4 2.5 1 3 .8 3.5.7.5-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.2-1.4-.1-.1-.3-.2-.6-.3l-2-1c-.3-.1-.5-.2-.7.1l-1 1.2c-.2.2-.3.2-.6.1a7 7 0 0 1-3.4-3c-.3-.4 0-.5.2-.7l.5-.6.3-.5v-.5l-.9-2.2c-.2-.5-.5-.5-.7-.5h-.6z'/></svg>") center/contain no-repeat}
.quick{margin:0;font-size:15px;line-height:23px;color:var(--ink-600);max-width:440px} .quick a{color:var(--ascent-500)}
.wiz{display:flex;flex-direction:column;gap:22px;padding:28px 28px 24px;border:1px solid var(--line-100);border-radius:16px;background:var(--paper-100);min-width:0}
.steps{list-style:none;margin:0 0 4px;padding:0 8px;display:grid;grid-template-columns:repeat(4,1fr)}
.steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;font:600 11px/14px var(--font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-600)}
.steps li i{width:28px;height:28px;border-radius:999px;border:1.5px solid var(--line-200);background:var(--paper-100);color:var(--ink-600);display:inline-flex;align-items:center;justify-content:center;font:600 13px/1 var(--font-display);font-style:normal;z-index:1}
.steps li+li::before{content:"";position:absolute;right:50%;left:-50%;top:13px;height:1.5px;background:var(--line-100)}
.steps li[aria-current="step"]{color:var(--ink-900)} .steps li[aria-current="step"] i{background:var(--ascent-500);border-color:var(--ascent-500);color:#fff}
.steps li.done i{border-color:var(--seed-500);color:var(--seed-500)} .steps li.done+li::before{background:var(--seed-500)}
.steps li.fin[aria-current="step"] i{background:var(--seed-500);border-color:var(--seed-500)}
.step{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
legend,.lg{margin:0;display:grid;grid-template-columns:28px 1fr;column-gap:12px;align-items:center;padding:0;margin-bottom:6px;font:600 22px/30px var(--font-display);width:100%}
legend .n,.lg .n{grid-row:1/3;width:28px;height:28px;border-radius:999px;background:var(--ink-900);color:#fff;display:inline-flex;align-items:center;justify-content:center;font:600 13px/1 var(--font-display);font-style:normal} legend .n.ok,.lg .n.ok{background:var(--seed-500)}
legend small,.lg small{display:block;font:400 15px/22px var(--font-body);color:var(--ink-600)}
.chosen{margin:0;font-size:15px;line-height:22px;color:var(--ink-600)} .chosen b{color:var(--ink-900);font-weight:600}
.lnk{background:none;border:0;padding:0;font:inherit;color:var(--ascent-500);text-decoration:underline;text-underline-offset:3px;cursor:pointer;min-height:0}
.opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.opt{position:relative;display:flex;flex-direction:column;gap:4px;padding:16px 16px 14px 46px;border:1px solid var(--line-200);border-radius:12px;background:var(--paper-000);cursor:pointer;min-height:44px}
.opt input{position:absolute;left:16px;top:19px;width:18px;height:18px;margin:0;accent-color:var(--ascent-500)}
.opt b{font:600 16px/22px var(--font-display)} .opt span{font-size:14px;line-height:20px;color:var(--ink-600)}
.opt:hover{border-color:var(--ascent-500)} .opt:has(input:checked){border-color:var(--ascent-500);box-shadow:var(--lift)}
.grp{display:flex;flex-direction:column;gap:8px} .lbl2{font:600 14px/18px var(--font-display);color:var(--ink-900)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{font:500 14px/18px var(--font-display);padding:0 16px;min-height:44px;border-radius:999px;border:1px solid var(--line-200);background:var(--paper-000);color:var(--ink-900);cursor:pointer}
.chips button[aria-pressed="true"]{background:var(--ascent-500);border-color:var(--ascent-500);color:#fff}
.shape{display:flex;flex-direction:column;gap:18px}
.fields{display:grid;gap:14px} .fields label{display:block;font:600 14px/18px var(--font-display);color:var(--ink-900)} .fields small{font:400 13px/18px var(--font-body);color:var(--ink-600);margin-left:6px}
.fields input,.fields textarea{display:block;width:100%;margin-top:6px;font:400 16px/24px var(--font-body);padding:11px 14px;border:1px solid var(--line-200);border-radius:8px;background:var(--paper-000);color:var(--ink-900);min-height:48px}
.fields input::placeholder,.fields textarea::placeholder{color:var(--ink-600)}
.fields input:focus,.fields textarea:focus{outline:2px solid var(--ascent-500);outline-offset:1px;border-color:var(--ascent-500)}
.fields input[aria-invalid="true"],.fields textarea[aria-invalid="true"]{border-color:var(--scale-500)}
.chk{display:flex!important;flex-direction:row;align-items:flex-start;gap:10px;font-weight:400!important;font-family:var(--font-body)!important;font-size:15px!important;line-height:22px!important;color:var(--ink-600)!important}
.chk input{display:inline-block;width:18px;height:18px;margin:2px 0 0;min-height:0;accent-color:var(--ascent-500)} .chk a{color:var(--ascent-500);text-decoration:underline;text-underline-offset:3px}
.hint{margin:0;font-size:14px;line-height:20px;color:var(--ink-600)}
.err{margin:0;font-size:14px;line-height:20px;color:var(--scale-500)} .err a{color:var(--scale-500);text-decoration:underline}
.wbtns{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:6px;padding-top:18px;border-top:1px solid var(--line-100)}
.done{display:flex;flex-direction:column;gap:12px} .done p{margin:0;color:var(--ink-600)} .done code{font:500 15px/20px ui-monospace,monospace;color:var(--ink-900)} .done .wbtns{justify-content:flex-start;border-top:0;padding-top:0}
@media (max-width:900px){.sec.talk .talkgrid{grid-template-columns:1fr}.wiz{padding:20px 16px 18px}}
@media (max-width:520px){.opts{grid-template-columns:1fr}.steps li span{font-size:10px;letter-spacing:.06em}}

/* ===== footer ===== */
footer.site{background:var(--paper-100)}
.rule2{height:2px;background:linear-gradient(45deg,#00dec4,#da00ac)}
.sf{max-width:1200px;margin:0 auto;padding:36px 24px 44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px 40px;font-size:14px;line-height:22px;color:var(--ink-600)}
.sf-brand{display:flex;flex-direction:column;gap:12px} .sf-brand img{height:40px;width:auto;align-self:flex-start} .sf a{color:var(--ascent-500)}
.sf-legal{display:flex;flex-direction:column;gap:6px}
@media (max-width:900px){.two,.sf{grid-template-columns:1fr}.focus,.cycle{grid-template-columns:repeat(2,minmax(0,1fr))}.pgrp{grid-template-columns:1fr;gap:14px}.sec{padding:56px 16px 44px}.gcards{grid-template-columns:1fr}.gcard{flex-direction:row;align-items:center}}
@media (max-width:520px){.focus,.cycle{grid-template-columns:1fr}.gcard{flex-direction:column;align-items:flex-start;gap:8px}}
@media (prefers-reduced-motion: reduce){.card,.gcard{transition:none}}

/* ===== production additions ===== */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%} @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.skip{position:absolute;left:16px;top:-60px;z-index:50;padding:10px 16px;border-radius:8px;background:var(--ink-900);color:#fff;font:500 15px var(--font-display)} .skip:focus{top:12px}
main:focus{outline:none}
.hdr .brand{display:inline-flex;align-items:center} .hdr .brand img{height:48px;width:auto}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--ascent-500);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.consent{position:fixed;z-index:60;left:16px;right:16px;bottom:16px;display:flex;flex-direction:column;gap:12px;padding:16px 18px;border-radius:12px;background:var(--paper-100);border:1px solid var(--line-100);box-shadow:0 20px 48px rgba(34,31,38,.18);font-size:14px;line-height:21px;max-width:560px;margin-left:auto}
.consent p{margin:0;color:var(--ink-900)} .consent a{color:var(--ascent-500);text-decoration:underline;text-underline-offset:3px}
.consent-actions{display:flex;gap:10px} .consent-actions .btn{flex:1;min-height:44px}
.doc{max-width:760px;margin:0 auto;padding:56px 24px 72px} .doc h1{font:600 clamp(32px,4vw,44px)/1.12 var(--font-display);letter-spacing:-.02em;margin:0 0 20px} .doc h2{font-size:24px;line-height:32px;margin:32px 0 10px;max-width:none} .doc p,.doc li{color:var(--ink-600)} .doc ul{padding-left:22px} .doc li{margin:6px 0} .doc a{color:var(--ascent-500);text-decoration:underline;text-underline-offset:3px} .doc code{font:500 .95em ui-monospace,monospace;color:var(--ink-900)}
