/* DMLRD Group — dmlrd.com. Tokens from brand/tokens.json (v0.2). Night first, daybreak second.
   Layout: one long story told in seven acts — hello, the name, the road, the family, the wheel, the ground, the horizon. */
:root{
  --g0:#0D0C11;--g1:#15131B;--g2:#1D1A25;--line:#2A2633;--line2:#6E687A;
  --ink:#E6E1EE;--ink-h:#DCD7E8;--ink2:#A49EB0;
  --teal:#2FE0CB;--indigo:#9AA0F5;--violet:#C49BE3;--pink:#EE6ACF;--amber:#E9B34E;--leaf:#7FC46A;
  --bar:rgba(13,12,17,.58);--glass:rgba(255,255,255,.035);--glass2:rgba(255,255,255,.06);
  --grad:linear-gradient(45deg,#00DEC4 0%,#3B429B 48%,#843EA6 62%,#DA00AC 100%);
  --grad-h:linear-gradient(90deg,#00DEC4,#3B429B 45%,#843EA6 62%,#DA00AC);
  --tint:linear-gradient(135deg,rgba(0,222,196,.12),rgba(218,0,172,.12));
  --ease:cubic-bezier(.2,.7,.2,1);
  --wrap:1240px;--gut:max(16px,8vw);
  --r-s:10px;--r-m:18px;--r-l:28px;
  --f-d:Lexend,Jost,system-ui,sans-serif;--f-b:Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:dark;
}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){
  --g0:#F7F6FA;--g1:#FFFFFF;--g2:#EEECF3;--line:#E2DFE8;--line2:#8A8494;
  --ink:#1B1922;--ink-h:#2C2836;--ink2:#5C5767;
  --teal:#007A69;--indigo:#3B429B;--violet:#7D3AA0;--pink:#B0008A;--amber:#8A5A00;--leaf:#3E7A2E;
  --bar:rgba(247,246,250,.66);--glass:rgba(27,25,34,.025);--glass2:rgba(27,25,34,.05);
  --tint:linear-gradient(135deg,rgba(0,170,150,.10),rgba(176,0,138,.08));
  color-scheme:light;
}}
:root[data-theme="light"]{
  --g0:#F7F6FA;--g1:#FFFFFF;--g2:#EEECF3;--line:#E2DFE8;--line2:#8A8494;
  --ink:#1B1922;--ink-h:#2C2836;--ink2:#5C5767;
  --teal:#007A69;--indigo:#3B429B;--violet:#7D3AA0;--pink:#B0008A;--amber:#8A5A00;--leaf:#3E7A2E;
  --bar:rgba(247,246,250,.66);--glass:rgba(27,25,34,.025);--glass2:rgba(27,25,34,.05);
  --tint:linear-gradient(135deg,rgba(0,170,150,.10),rgba(176,0,138,.08));
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--g0);color:var(--ink);font:400 17px/1.65 var(--f-b);-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background-color .5s var(--ease),color .5s var(--ease)}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{margin:0;font-family:var(--f-d);font-weight:600;color:var(--ink-h);text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:6px}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nw{white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--g1);color:var(--ink);padding:10px 16px;border-radius:var(--r-s);text-decoration:none}
.skip:focus{top:12px}
main:focus{outline:none}
.wrap{max-width:calc(var(--wrap) + 2*var(--gut));margin:0 auto;padding:0 var(--gut)}

/* theme-dependent logos */
.on-light{display:none!important}
:root[data-theme="light"] .on-dark{display:none!important}
:root[data-theme="light"] .on-light{display:block!important}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .on-dark{display:none!important}:root:not([data-theme="dark"]) .on-light{display:block!important}}
/* equal visible artwork height (owner's rule). --lh is the ink height; the two SVG lockups carry a little
   built-in margin, so they are scaled up by their measured ratio (critic round 1). */
.lg{height:var(--lh,34px);width:auto}
.lg-is{height:calc(var(--lh,34px)*1.053)}
.lg-ven{height:calc(var(--lh,34px)*1.111)}

/* buttons and links */
.btn{--h:52px;display:inline-flex;align-items:center;gap:10px;min-height:var(--h);padding:0 26px;border-radius:999px;font:600 16px/1 var(--f-d);text-decoration:none;cursor:pointer;border:0;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.btn-s{--h:44px;padding:0 18px;font-size:15px}
.btn-quiet{color:var(--ink-h);background:var(--tint) padding-box,linear-gradient(var(--g1),var(--g1)) padding-box,var(--grad) border-box;border:1.5px solid transparent}
.btn-quiet:hover{transform:translateY(-1px);box-shadow:0 10px 30px -12px rgba(132,62,166,.55)}
.btn-wa{color:var(--ink-h);background:var(--glass2);border:1.5px solid var(--line)}
.btn-wa svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6}
.btn-wa:hover{border-color:var(--teal)}
.link-arrow{font:500 16px/1 var(--f-d);color:var(--ink-h);text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:44px}
.link-arrow::after{content:"";width:18px;height:2px;background:var(--grad-h);transition:width .4s var(--ease)}
.link-arrow:hover::after{width:30px}
.linkbtn{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.fl{display:inline-flex;align-items:center;min-height:44px}

/* top bar */
.bar{position:fixed;inset:0 0 auto 0;z-index:50;padding-top:env(safe-area-inset-top,0px);transition:background .4s var(--ease),border-color .4s var(--ease);border-bottom:1px solid transparent}
.bar.solid{background:var(--bar);-webkit-backdrop-filter:blur(12px) saturate(1.3);backdrop-filter:blur(12px) saturate(1.3);border-bottom-color:var(--line)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.bar.solid{background:var(--g1)}}
.bar-in{display:flex;align-items:center;gap:28px;height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink-h);margin-right:auto;min-height:48px}
.brand-sym{width:44px;height:auto}
.brand-wm{width:96px;height:auto;color:var(--ink-h);overflow:visible}
.brand-wm text{font:600 104px var(--f-d);fill:currentColor}
.nav{display:flex;gap:26px}
.nav a{font:500 15px/1 var(--f-d);color:var(--ink2);text-decoration:none;min-height:48px;display:flex;align-items:center;position:relative;transition:color .3s}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:8px;height:2px;background:var(--grad-h);transition:right .4s var(--ease)}
.nav a:hover,.nav a.on{color:var(--ink-h)}
.nav a.on::after,.nav a:hover::after{right:0}
.nav .nav-talk{display:none}
.bar-right{display:flex;align-items:center;gap:10px}
.theme{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--glass);display:grid;place-items:center;cursor:pointer;color:var(--ink-h)}
.theme svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.theme .t-moon{display:none}
:root[data-theme="light"] .theme .t-sun,:root[data-theme="light"] .theme .t-rays{display:none}
:root[data-theme="light"] .theme .t-moon{display:block}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .theme .t-sun,:root:not([data-theme="dark"]) .theme .t-rays{display:none}:root:not([data-theme="dark"]) .theme .t-moon{display:block}}
.menu{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--glass);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.menu span{width:18px;height:1.7px;background:var(--ink-h);border-radius:2px;transition:transform .35s var(--ease),opacity .3s}
.menu[aria-expanded="true"] span:nth-child(1){transform:translateY(5.7px) rotate(45deg)}
.menu[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.7px) rotate(-45deg)}

/* consent */
.consent{position:fixed;z-index:60;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));max-width:560px;margin:0 auto;background:var(--g1);border:1px solid var(--line);border-radius:var(--r-m);padding:16px 18px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;box-shadow:0 20px 50px -20px rgba(0,0,0,.5);font-size:15px;line-height:1.5}
.consent p{flex:1 1 280px;color:var(--ink2)}
.consent a{color:var(--ink-h)}
.consent-actions{display:flex;gap:8px}

/* ---------- hero ---------- */
.hero{position:relative;min-height:max(100svh,720px);display:flex;flex-direction:column;justify-content:center;overflow:hidden;isolation:isolate;padding-top:72px}
.streams{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.aurora{position:absolute;inset:-20% 0 auto 0;height:90%;z-index:-2;pointer-events:none;
  background:radial-gradient(40% 55% at 22% 40%,rgba(0,222,196,.11),transparent 70%),radial-gradient(38% 50% at 78% 30%,rgba(218,0,172,.10),transparent 70%),radial-gradient(45% 50% at 52% 62%,rgba(132,62,166,.12),transparent 70%);
  animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate3d(1.5%,3%,0) scale(1.04)}}
.hero-in{position:relative;text-align:center;padding-top:5vh;padding-bottom:180px}
.hello-line{font:500 clamp(18px,2vw,24px)/1.3 var(--f-d);color:var(--ink2);letter-spacing:.01em;min-height:1.3em;display:inline-flex;align-items:center;gap:2px}
.caret{display:inline-block;width:2px;height:1.05em;background:var(--teal);margin-left:3px;animation:blink 1s steps(1) infinite}
.done .caret{opacity:0;animation:none;transition:opacity .6s}
@keyframes blink{50%{opacity:0}}
.name{font:600 clamp(64px,14.6vw,232px)/.95 var(--f-d);letter-spacing:-.035em;margin:.12em 0 .14em;color:var(--ink-h);white-space:nowrap}
.name-row{display:inline-flex;align-items:baseline}
.ch{display:inline-block;position:relative;transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease)}
.ch.v{transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease),width 1.1s cubic-bezier(.7,0,.2,1)}
.ch.v>span{display:inline-block;transition:color .7s var(--ease),transform 1.2s cubic-bezier(.55,0,.3,1),opacity 1s ease,filter 1s ease}
.js .ch{opacity:0;transform:translateY(.25em);filter:blur(8px)}
.js .in .ch{opacity:1;transform:none;filter:none}
.hollow .ch.v>span{color:transparent;-webkit-text-stroke:2px var(--violet)}
.drop .ch.v>span{transform:translateY(.9em) rotate(14deg) scale(.7);opacity:0;filter:blur(6px)}
.drop .ch.v{width:0!important}
.no-js-name .ch.v{display:none}
.signed .ch:not(.v){background:linear-gradient(100deg,var(--ink-h) 0 38%,#2FE0CB 44%,#843EA6 50%,#EE6ACF 56%,var(--ink-h) 62% 100%);background-size:400% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 1.6s var(--ease) forwards}
.signed .ch:nth-child(4){animation-delay:.12s}.signed .ch:nth-child(5){animation-delay:.24s}.signed .ch:nth-child(7){animation-delay:.36s}.signed .ch:nth-child(8){animation-delay:.48s}
@keyframes sheen{from{background-position:100% 0}to{background-position:0 0}}
.hero-after{transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .hero-after{opacity:0;transform:translateY(18px)}
.js .after .hero-after{opacity:1;transform:none}
.tagline{font:500 clamp(22px,2.6vw,34px)/1.25 var(--f-d);color:var(--ink-h);letter-spacing:-.01em;display:inline-block;position:relative;padding-bottom:16px}
.tagline::after{content:"";position:absolute;left:50%;bottom:0;width:120px;height:3px;border-radius:3px;background:var(--grad-h);transform:translateX(-50%) scaleX(0);transition:transform 1.4s var(--ease) .2s}
.after .tagline::after,html:not(.js) .tagline::after{transform:translateX(-50%) scaleX(1)}
.hero .lead{max-width:640px;margin:22px auto 0;color:var(--ink2)}
.hero-cta{display:flex;gap:22px;align-items:center;justify-content:center;margin-top:34px;flex-wrap:wrap}
.replay{display:inline-flex;align-items:center;gap:8px;background:none;border:0;color:var(--ink2);font:500 15px/1 var(--f-d);cursor:pointer;min-height:44px;padding:0 4px}
.replay svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .6s var(--ease)}
.replay:hover{color:var(--ink-h)}.replay:hover svg{transform:rotate(-180deg)}
.family{position:absolute;left:0;right:0;bottom:0;padding-bottom:calc(30px + env(safe-area-inset-bottom,0px))}
.family-rule{display:block;height:1px;background:var(--grad-h);opacity:.55;margin-bottom:24px;transform-origin:left;transition:transform 1.6s var(--ease)}
.js .family-rule{transform:scaleX(0)}
.js .after .family-rule{transform:scaleX(1)}
.family-logos{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.family-logos li{opacity:.86;transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .family-logos li{opacity:0;transform:translateY(10px)}
.js .after .family-logos li{opacity:.86;transform:none}
.after .family-logos li:nth-child(2){transition-delay:.12s}.after .family-logos li:nth-child(3){transition-delay:.24s}.after .family-logos li:nth-child(4){transition-delay:.36s}
.js .after .family-logos li:hover{opacity:1}
.family-logos a{display:flex;align-items:center;min-height:48px}
.family .lg{--lh:40px}

/* ---------- sections ---------- */
.sec{position:relative;padding:144px 0}
.sec-head{max-width:760px;margin-bottom:64px}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.eyebrow{font:500 15px/1 var(--f-d);color:var(--teal);margin-bottom:20px;display:flex;align-items:center;gap:12px}
.center .eyebrow{justify-content:center}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--grad-h);border-radius:2px}
.h2{font-size:clamp(36px,5vw,64px);line-height:1.04;letter-spacing:-.025em}
.lead{font-size:clamp(18px,1.6vw,20px);line-height:1.6;color:var(--ink2);margin-top:22px;max-width:640px;text-wrap:pretty}
.center .lead{margin-left:auto;margin-right:auto}
.reveal{transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .reveal{opacity:0;transform:translateY(16px)}
.js .reveal.seen{opacity:1;transform:none}
.tag{display:inline-flex;align-items:center;gap:7px;font:500 14px/1 var(--f-d);padding:7px 12px;border-radius:999px;background:var(--g1);color:var(--ink2);border:1px solid var(--line)}
.tag-co{color:var(--violet)}
.tag-dl{color:var(--pink)}
.tag-live{color:var(--teal);border-color:color-mix(in srgb,var(--teal) 40%,transparent)}
.tag-live i{width:7px;height:7px;border-radius:50%;background:var(--teal);animation:pulse 2.6s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--teal) 60%,transparent)}100%{box-shadow:0 0 0 9px transparent}}
.tag-planned{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 40%,transparent)}
.tag-proposed{border-style:dashed}

/* ---------- the name ---------- */
.name-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.name-grid>*{min-width:0}
.term{margin:0;border-radius:var(--r-l);border:1px solid var(--line);background:var(--g1);overflow:hidden;box-shadow:0 40px 80px -50px rgba(132,62,166,.45)}
.term-bar{display:flex;align-items:center;gap:7px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--glass)}
.term-bar i{width:11px;height:11px;border-radius:50%;background:var(--line2);opacity:.6}
.term-bar span{margin-left:10px;font:500 14px/1 var(--f-d);color:var(--ink2)}
.term-body{padding:24px 26px 28px;font:500 16px/1.75 var(--f-d);color:var(--ink-h);overflow-x:auto}
.term-body p{white-space:nowrap}
.term-body .pr{color:var(--teal);margin-right:8px}
.term-body .out{color:var(--ink2);padding-left:20px;margin-bottom:10px}
.term-body .out+.out{margin-top:-10px}
.term-body .out b{color:var(--pink);font-weight:600}
.cur{display:inline-block;width:9px;height:1.1em;vertical-align:-3px;background:var(--teal);animation:blink 1s steps(1) infinite}
.steps3{margin-top:40px}
.steps3 li{display:grid;grid-template-columns:40px 1fr;column-gap:14px;padding:18px 0;border-top:1px solid var(--line)}
.steps3 li:last-child{border-bottom:1px solid var(--line)}
.s-n{font:500 15px/1.9 var(--f-d);color:var(--ink2);grid-row:span 2}
.steps3 h3{font-size:22px;line-height:1.3;font-weight:500}
.steps3 p{color:var(--ink2);margin-top:4px}

/* ---------- story: a vertical list by default, a pinned horizontal road when JS and space allow ---------- */
.story{position:relative;padding:120px 0 96px}
.story-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.story-head .eyebrow{flex-basis:100%;margin-bottom:0}
.story-hint{display:none;font:500 15px/1 var(--f-d);color:var(--ink2)}
.hint-chev{display:inline-block;letter-spacing:-.1em;color:var(--teal);animation:nudge 1.8s var(--ease) infinite}
@keyframes nudge{50%{transform:translateX(5px)}}
.track-wrap{position:relative;margin-top:44px}
.track-line{display:none}
.track{display:flex;flex-direction:column;gap:14px;padding:0 var(--gut);max-width:calc(var(--wrap) + 2*var(--gut));margin:0 auto}
.stop{position:relative;padding:24px 22px 22px 70px;background:var(--glass);border:1px solid var(--line);border-radius:var(--r-l);transition:border-color .5s var(--ease)}
.stop::before{content:"";position:absolute;left:24px;top:30px;width:16px;height:16px;border-radius:50%;background:var(--violet);border:2px solid var(--violet)}
.stop-dl::before{background:var(--pink);border-color:var(--pink)}
.stop-now::before{background:var(--teal);border-color:var(--teal);box-shadow:0 0 18px var(--teal)}
.yr{display:block;font:600 32px/1 var(--f-d);letter-spacing:-.02em;color:var(--ink-h)}
.pl{display:block;font:500 14px/1 var(--f-d);color:var(--ink2);margin-top:10px}
.stop h3{font-size:20px;line-height:1.3;font-weight:500;margin-top:18px}
.stop p{font-size:15px;line-height:1.6;color:var(--ink2);margin-top:6px}
.stop .tag{margin-top:16px}
.story-foot{display:none}
.story.pinned{height:var(--story-h,420vh);padding:0}
.story.pinned .story-pin{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.story.pinned .story-head{padding-top:72px}
.story.pinned .story-hint{display:block}
.story.pinned .track-line{display:block;position:absolute;left:0;top:38px;width:100%;height:8px;overflow:visible}
.tl-base{stroke:var(--line);stroke-width:2}
.tl-fill{stroke:url(#tl);stroke-width:2.5;stroke-dasharray:100 100;stroke-dashoffset:100}
.story.pinned .track{flex-direction:row;gap:24px;max-width:none;margin:0;padding:0 var(--gut);will-change:transform;width:max-content}
.story.pinned .stop{flex:0 0 clamp(260px,22vw,310px);padding:74px 24px 24px}
.story.pinned .stop::before{left:24px;top:30px;background:var(--g0);border-color:var(--line2);transition:border-color .5s,background .5s,box-shadow .5s}
.story.pinned .stop.lit{border-color:color-mix(in srgb,var(--violet) 45%,var(--line))}
.story.pinned .stop.lit::before{border-color:var(--violet);background:var(--violet);box-shadow:0 0 18px color-mix(in srgb,var(--violet) 70%,transparent)}
.story.pinned .stop-dl.lit{border-color:color-mix(in srgb,var(--pink) 45%,var(--line))}
.story.pinned .stop-dl.lit::before{border-color:var(--pink);background:var(--pink);box-shadow:0 0 18px color-mix(in srgb,var(--pink) 60%,transparent)}
.story.pinned .stop-now.lit::before{border-color:var(--teal);background:var(--teal);box-shadow:0 0 22px var(--teal)}
.story.pinned .yr{font-size:44px}
.story.pinned .story-foot{display:block;margin-top:40px}
.story-progress{height:2px;background:var(--line);border-radius:2px;overflow:hidden;max-width:320px}
.story-progress span{display:block;height:100%;width:0;background:var(--grad-h)}

/* ---------- companies ---------- */
.co-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.co{--c:var(--violet);position:relative;display:flex;flex-direction:column;padding:30px 26px 22px;background:var(--glass);border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;transition:border-color .5s var(--ease),transform .5s var(--ease)}
@supports (grid-template-rows:subgrid){.co{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0}}
.co::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--c);opacity:.85}
.co::after{content:"";position:absolute;width:260px;height:260px;right:-120px;top:-120px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 22%,transparent),transparent);opacity:0;transition:opacity .6s var(--ease);pointer-events:none}
.co:hover,.co:focus-within{border-color:color-mix(in srgb,var(--c) 50%,var(--line));transform:translateY(-4px)}
.co:hover::after,.co:focus-within::after{opacity:1}
.co[data-k="tech"]{--c:var(--pink)}.co[data-k="is"]{--c:var(--teal)}.co[data-k="ven"]{--c:var(--violet)}.co[data-k="mot"]{--c:var(--indigo)}
.co-logo{height:56px;display:flex;align-items:center}
.co-logo .lg{--lh:30px}
.verb{font:600 34px/1.05 var(--f-d);letter-spacing:-.02em;color:var(--c);margin-top:24px}
.co-line{font-size:16px;line-height:1.5;color:var(--ink-h);margin-top:10px}
.co-facts{margin-top:18px;display:grid;gap:12px;align-content:start;font-size:15px;line-height:1.45;color:var(--ink2)}
.co-facts li{padding-left:16px;position:relative}
.co-facts li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:2px;background:var(--c);border-radius:2px}
.co-facts b{font-weight:500;color:var(--ink-h);display:block}
.co-link{margin-top:20px;font:500 15px/1.3 var(--f-d);color:var(--ink-h);text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;overflow-wrap:anywhere;align-self:end}
.co-link:not(.co-soon)::after{content:"→";color:var(--c);transition:transform .35s var(--ease)}
.co-link:hover::after{transform:translateX(4px)}
.co-soon{color:var(--ink2)}
.counts{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:72px;padding-top:40px;border-top:1px solid var(--line)}
.counts b{display:block;font:500 56px/1 var(--f-b);letter-spacing:-.02em;color:var(--ink-h);font-variant-numeric:tabular-nums}
.counts span{display:block;margin-top:10px;font-size:15px;color:var(--ink2);line-height:1.45}

/* ---------- how we work ---------- */
.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.how-grid>*{min-width:0}
.wheel-wrap{max-width:520px;width:100%;margin:0 auto}
.wheel{width:100%;height:auto;overflow:visible}
.w-ring{fill:none;stroke:var(--line);stroke-width:1.5}
.w-ring2{fill:none;stroke:url(#wg);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:22 78;transform-origin:260px 260px;animation:spin 18s linear infinite;opacity:.9}
.w-orbit{transform-origin:260px 260px;animation:spin 18s linear infinite}
.w-chev{fill:none;stroke:var(--ink2);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:.75}
@keyframes spin{to{transform:rotate(360deg)}}
.w-core circle{fill:var(--g1);stroke:var(--line)}
.w-core text{font:500 22px var(--f-d);fill:var(--ink2)}
.w-node{cursor:pointer;outline:none}
.w-node circle{fill:var(--g1);stroke:var(--line2);stroke-width:1.5;transition:fill .5s var(--ease),stroke .5s}
.w-node text{font:600 26px var(--f-d);fill:var(--ink-h);pointer-events:none}
.w-node[data-k="ven"]{--c:var(--violet)}.w-node[data-k="tech"]{--c:var(--pink)}.w-node[data-k="is"]{--c:var(--teal)}.w-node[data-k="mot"]{--c:var(--indigo)}
.w-node.on circle,.w-node:hover circle{stroke:var(--c);stroke-width:3;fill:color-mix(in srgb,var(--c) 18%,var(--g1))}
.w-node:focus-visible circle{stroke:var(--teal);stroke-width:3;stroke-dasharray:6 5}
.w-panels{display:grid;margin-top:34px}
.w-panel{grid-area:1/1;padding:26px 28px;border-radius:var(--r-m);background:var(--glass);border:1px solid var(--line);transition:opacity .6s var(--ease),transform .6s var(--ease),visibility .6s}
.js .w-panel{opacity:0;transform:translateY(8px);visibility:hidden}
.js .w-panel.on{opacity:1;transform:none;visibility:visible}
html:not(.js) .w-panels{gap:12px}
html:not(.js) .w-panel{grid-area:auto}
.w-co{font:500 14px/1 var(--f-d);color:var(--violet)}
.w-co[data-k="tech"]{color:var(--pink)}.w-co[data-k="is"]{color:var(--teal)}.w-co[data-k="mot"]{color:var(--indigo)}
.w-panel h3{font-size:30px;line-height:1.15;margin-top:12px}
.w-panel p:last-child{color:var(--ink2);margin-top:8px}

/* ---------- vision ---------- */
.vision{background:linear-gradient(180deg,transparent,var(--glass) 30%,var(--glass) 70%,transparent)}
.vm{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1080px;margin:0 auto}
.vm-card{padding:34px 34px 36px;border-radius:var(--r-l);border:1px solid var(--line);background:var(--g1);position:relative;overflow:hidden}
.vm-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad)}
.vm-k{font:500 15px/1 var(--f-d);color:var(--teal)}
.vm-card+.vm-card .vm-k{color:var(--pink)}
.vm-t{font:500 clamp(21px,2vw,26px)/1.4 var(--f-d);color:var(--ink-h);margin-top:16px;letter-spacing:-.01em}
.elements{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:56px}
.el{text-align:center;padding:30px 22px 32px;border-radius:var(--r-l);border:1px solid var(--line);background:var(--glass)}
.el svg{width:96px;height:96px;margin:0 auto 14px;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.el[data-k="energy"] svg{stroke:var(--amber)}.el[data-k="water"] svg{stroke:var(--teal)}.el[data-k="food"] svg{stroke:var(--leaf)}.el[data-k="land"] svg{stroke:var(--violet)}
.el h3{font-size:22px;font-weight:500}
.el p{color:var(--ink2);font-size:15px;margin-top:8px;line-height:1.55}
.e-rays{transform-origin:60px 60px;animation:spin 40s linear infinite}
.e-core{animation:breathe 6s ease-in-out infinite;transform-origin:60px 60px}
@keyframes breathe{50%{transform:scale(1.08)}}
.e-drop{animation:bob 5s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(4px)}}
.e-rip{transform-origin:60px 100px;animation:ripple 4s ease-out infinite;opacity:0}
.e-rip.r2{animation-delay:2s}
@keyframes ripple{0%{transform:scale(.4);opacity:.9}100%{transform:scale(1.7);opacity:0}}
.e-cane{transform-origin:50% 100%;transform-box:fill-box;animation:sway 5s ease-in-out infinite}
.e-cane.c2{animation-delay:-1.6s}.e-cane.c3{animation-delay:-3.1s}
@keyframes sway{50%{transform:rotate(4deg)}}
.e-box{stroke-width:2.6}
.el .e-panel{stroke:var(--amber)}
.e-hill.h2{opacity:.55}

/* ---------- next ---------- */
.next{overflow:hidden}
.road{position:absolute;inset:auto 0 0 0;height:62%;perspective:420px;perspective-origin:50% 0;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);opacity:.55}
.road-plane{position:absolute;left:50%;top:0;width:220%;height:200%;transform:translateX(-50%) rotateX(68deg);transform-origin:50% 0;background-image:linear-gradient(var(--line) 1.5px,transparent 1.5px),linear-gradient(90deg,var(--line) 1.5px,transparent 1.5px);background-size:80px 80px;animation:road 10s linear infinite}
@keyframes road{to{background-position:0 80px,0 0}}
.horizon{position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--grad-h);opacity:.6;box-shadow:0 0 40px 6px rgba(132,62,166,.25)}
.next .wrap{position:relative}
.horizons{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.hz{padding:30px 28px;border-radius:var(--r-l);border:1px solid var(--line);background:color-mix(in srgb,var(--g1) 90%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hz[data-s="proposed"]{border-style:dashed;border-color:var(--line2)}
.hz-h{display:flex;align-items:center;justify-content:space-between;flex-direction:row-reverse;font:600 30px/1 var(--f-d);color:var(--ink-h);letter-spacing:-.015em}
.hz ul{margin-top:24px;display:grid;gap:14px}
.hz li{padding-left:22px;position:relative;color:var(--ink2);font-size:16px;line-height:1.5}
.hz li::before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;border-right:2px solid var(--line2);border-bottom:2px solid var(--line2);transform:rotate(-45deg)}
.hz[data-s="live"] li::before{border-color:var(--teal)}
.hz[data-s="planned"] li::before{border-color:var(--amber)}

/* ---------- sign-off ---------- */
.signoff{text-align:center;padding-bottom:120px}
.so-line{font:500 clamp(22px,2.6vw,32px)/1.3 var(--f-d);color:var(--ink2)}
.so-h{font-size:clamp(40px,6.4vw,88px);line-height:1.02;letter-spacing:-.03em;margin-top:10px}
.so-sig{font:600 clamp(40px,6vw,76px)/1 var(--f-d);letter-spacing:-.03em;margin-top:40px;color:var(--ink-h)}
.so-sig i{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--violet)}
.so-rule{display:block;width:140px;height:3px;border-radius:3px;margin:22px auto 0;background:var(--grad-h)}
.talk{margin:64px auto 0;max-width:980px;display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:center;text-align:left;padding:36px 38px;border-radius:var(--r-l);border:1px solid transparent;background:linear-gradient(var(--g1),var(--g1)) padding-box,var(--grad) border-box}
.talk>*{min-width:0}
.talk h3{font-size:30px}
.talk p{color:var(--ink2);margin-top:8px}
.talk-cta{display:grid;gap:12px}
.talk-cta .btn{justify-content:center}

/* ---------- footer ---------- */
.foot{position:relative;padding:72px 0 calc(24px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);font-size:15px;color:var(--ink2)}
.foot-rule{position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--grad-h);opacity:.7}
.foot-grid{display:grid;grid-template-columns:1.1fr 1.4fr 1.4fr;gap:48px}
.foot-grid>*{min-width:0}
.foot-sym{width:56px;height:auto;margin-bottom:16px}
.foot-name{font:600 20px/1.2 var(--f-d);color:var(--ink-h);margin-bottom:6px}
.foot a,.foot .linkbtn{color:var(--ink-h);text-underline-offset:3px}
.foot-k{font:500 14px/1 var(--f-d);color:var(--ink-h);margin-bottom:12px}
.foot-list{display:grid;gap:8px}
.foot-list li>*{display:flex}
.foot-list a,.fl-name{color:var(--ink-h);font-weight:500;text-decoration:none}
.foot-list a:hover{text-decoration:underline}
.fl-name{min-height:28px;align-items:flex-end}
.foot-list span:not(.fl-name){line-height:1.5}
.foot-base{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center;margin-top:48px;padding-top:12px;border-top:1px solid var(--line)}
.foot-links{display:flex;gap:22px;flex-wrap:wrap}

/* ---------- responsive ---------- */
@media (min-width:1680px){
  :root{--wrap:1400px}
  body{font-size:18px}
  .lead{font-size:22px}
  .stop p,.co-facts,.el p,.hz li{font-size:16.5px}
  .family .lg{--lh:46px}
}
@media (max-width:1180px){
  .nav{position:fixed;top:calc(72px + env(safe-area-inset-top,0px));left:0;right:0;flex-direction:column;gap:0;padding:12px var(--gut) 24px;background:var(--g1);border-bottom:1px solid var(--line);transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),transform .35s var(--ease),visibility .35s}
  .nav.open{opacity:1;transform:none;visibility:visible}
  .nav a{font-size:17px;border-bottom:1px solid var(--line)}
  .nav a::after{display:none}
  .nav .nav-talk{display:flex;color:var(--teal)}
  .menu{display:flex}
  .co-grid{grid-template-columns:repeat(2,1fr)}
  .elements{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .sec{padding:96px 0}
  .name-grid,.how-grid{grid-template-columns:1fr;gap:48px}
  .name-grid .term{order:2}
  .horizons,.vm,.talk{grid-template-columns:1fr}
  .counts{grid-template-columns:repeat(2,1fr);row-gap:32px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
  .family .lg{--lh:26px}
  .family-logos{justify-content:center;column-gap:36px;row-gap:6px}
}
@media (max-width:600px){
  .bar-cta{display:none}
  .sec{padding:72px 0}
  .story{padding:72px 0}
  .hero-in{padding-bottom:200px}
  .co-grid,.elements{grid-template-columns:1fr}
  .counts b{font-size:44px}
  .foot-grid{grid-template-columns:1fr}
  .family .lg{--lh:22px}
  .talk{padding:28px 22px}
  .hero-cta{gap:12px}
  .term-body{font-size:14.5px;padding:20px 18px 22px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .w-ring2,.w-orbit,.e-rays,.road-plane,.aurora,.cur,.caret{animation:none!important}
}

/* v0.2 additions: terminal print-in and year column */
.term-body em{font-style:normal;color:var(--teal);margin-right:10px}
.js .term .term-body p{opacity:0;transform:translateY(4px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.js .term.run .term-body p{opacity:1;transform:none}
.signed-done .ch:not(.v){color:var(--ink-h)}
.el .tag{margin-top:14px}
/* plain pages (privacy, 404) */
.plain-main{padding-top:120px;padding-bottom:96px;max-width:860px}
.plain-main .h2{margin-bottom:8px}
.h3p{font:600 22px/1.3 var(--f-d);margin:40px 0 10px}
.plain-main p{color:var(--ink2);max-width:68ch}
.plain-main a{color:var(--ink-h)}
.consent[hidden]{display:none!important}
html:not(.js) .replay,html:not(.js) #consent-open{display:none}
.nav a{padding-left:4px;padding-right:4px}
@media (max-width:600px){.term-body p{white-space:normal}.term-body .out{padding-left:20px;text-indent:0}.term-body{overflow-x:visible}}

/* intro: while "Hello, world. I'm DooMLoRD" plays, the bar and the analytics banner wait (owner, 13 Oct) */
.bar,.consent{transition:opacity .8s var(--ease),transform .8s var(--ease),visibility 0s linear 0s}
.intro .bar{opacity:0;transform:translateY(-100%);visibility:hidden;transition:opacity .4s var(--ease),transform .4s var(--ease),visibility 0s linear .4s}
.intro .consent{opacity:0;transform:translateY(16px);visibility:hidden;pointer-events:none;transition:none}
.intro .bar:focus-within{opacity:1;transform:none;visibility:visible}
