:root{
  --black:#0a0a0a;
  --ink:#0e0e0e;
  --line:#232323;
  --cream:#f1ede5;
  --cream-dim:#a9a49b;
  --blue:#3149ff;
  --blue-soft:#5d70ff;
  --cobalt:#1d34f0;
  --display:'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, Menlo, monospace;
  --pad:clamp(20px, 4vw, 56px);
  --ease:cubic-bezier(.2,.7,.1,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--black)}
body{
  background:var(--black); color:var(--cream);
  font-family:var(--display); font-variation-settings:'wdth' 100;
  font-size:16px; line-height:1.5;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ol{list-style:none}
::selection{background:var(--blue);color:var(--cream)}
:focus-visible{outline:1px solid var(--blue-soft);outline-offset:4px}

.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--cream);color:var(--black);padding:10px 14px}
.skip:focus{left:8px}

.micro{
  font-family:var(--mono); font-size:11px; line-height:1.5;
  letter-spacing:.18em; text-transform:uppercase; color:var(--cream-dim);
  font-weight:400;
}
.blue{color:var(--blue-soft)}
.wrap{width:100%;max-width:1360px;margin:0 auto;padding:0 var(--pad)}

/* ---------- NAV ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  display:flex; justify-content:space-between; align-items:center;
  padding:0 var(--pad); height:64px;
  background:rgba(10,10,10,.86); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  transform:translateY(-100%); transition:transform .5s var(--ease);
}
.nav.is-on, body.menu-open .nav{transform:none}
.nav__brand{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.26em;font-weight:500;min-height:44px}
.mark{width:20px;height:20px}
.nav__right{display:flex;align-items:center;gap:8px}
.lang,.menu-btn{
  font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  min-height:44px; padding:0 12px; display:inline-flex; align-items:center; gap:12px; color:var(--cream-dim);
}
.lang [data-l].on{color:var(--cream)}
.menu-btn{color:var(--cream);border:1px solid var(--line)}
.menu-btn:hover{border-color:var(--blue)}
.menu-btn i{position:relative;width:16px;height:1px;background:currentColor;transition:transform .3s var(--ease)}
.menu-btn i::after{content:"";position:absolute;left:0;top:-5px;width:16px;height:1px;background:currentColor;transition:transform .3s var(--ease),top .3s var(--ease)}
body.menu-open .menu-btn i{transform:rotate(45deg)}
body.menu-open .menu-btn i::after{top:0;transform:rotate(90deg)}

.menu{
  position:fixed; inset:0; z-index:40; background:var(--black);
  display:flex; align-items:center; padding:96px var(--pad) 40px;
  opacity:0; transition:opacity .35s var(--ease);
}
.menu[hidden]{display:none}
.menu.is-open{opacity:1}
.menu__inner{width:100%;max-width:1360px;margin:0 auto;display:flex;flex-direction:column;gap:40px}
.menu ol{border-top:1px solid var(--line)}
.menu li{border-bottom:1px solid var(--line)}
.menu li a{
  display:flex; align-items:baseline; gap:24px; padding:18px 0;
  font-variation-settings:'wdth' 72; font-weight:800; text-transform:uppercase;
  font-size:clamp(30px, 4.6vw, 60px); line-height:.92; letter-spacing:-.02em;
  transition:color .25s, padding-left .35s var(--ease);
}
.menu li a .micro{transform:translateY(-.6em)}
.menu li a:hover{color:var(--blue-soft);padding-left:12px}

/* ---------- HERO (full-screen key visual) ---------- */
.hero{
  --H:min(92svh, calc(68vw * 1173 / 1281));
  --W:calc(var(--H) * 1281 / 1173);
  position:relative; height:100vh; height:100svh; min-height:560px;
  background:#0e0e0e; overflow:hidden;
}
.hero__arch{
  position:absolute; right:0; bottom:0; width:var(--W); height:var(--H); max-width:none;
  opacity:0; animation:fade 1.8s var(--ease) .1s forwards;
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 9%), linear-gradient(to bottom, transparent 0, #000 6%);
  -webkit-mask-composite:source-in; mask-image:linear-gradient(to right, transparent 0, #000 9%), linear-gradient(to bottom, transparent 0, #000 6%); mask-composite:intersect;
}
.hero__bar{
  position:absolute; inset:0 0 auto 0; z-index:3;
  display:flex; justify-content:space-between; align-items:center;
  padding:22px var(--pad) 0;
}
.hero__brand,.hero__btn{
  font-family:var(--display); font-weight:500; font-size:13px; letter-spacing:.26em; text-transform:uppercase; color:var(--cream);
  min-height:44px; display:inline-flex; align-items:center;
}
.hero__btn{font-size:11px; letter-spacing:.2em; padding:0 0 0 clamp(20px, 4vw, 64px)}
.hero__btn [data-l]{color:var(--cream-dim)} .hero__btn [data-l].on{color:var(--cream)}
.hero__btn [data-l]+*{margin-left:0}
.hero__btn:hover,.hero__brand:hover{color:#fff}
.hero__ctrl{display:flex}

.hero__title{
  position:absolute; z-index:2; left:var(--pad); top:calc(22px + 44px + 4svh);
  font-variation-settings:'wdth' 72; font-weight:800; text-transform:uppercase; color:var(--cream);
  font-size:clamp(48px, min(8.2vw, 12.5svh), 180px); line-height:.84; letter-spacing:-.025em;
  opacity:0; transform:translateY(10px); animation:in 1.2s var(--ease) .25s forwards;
}
.hero__title span{display:block}

.beam{position:absolute; z-index:1; background:var(--blue); pointer-events:none}
.beam--h{left:0; height:1px; width:var(--bw, 50vw); top:var(--by, 60svh); transform-origin:left; transform:scaleX(0); animation:drawX 1.6s var(--ease) .9s forwards}
.beam--v{left:calc(var(--pad) + 18px); width:1px; top:calc(var(--by, 60svh) - 7svh); bottom:0; transform-origin:top; transform:scaleY(0); animation:drawY 1.6s var(--ease) .7s forwards}
@keyframes drawX{to{transform:scaleX(1)}}
@keyframes drawY{to{transform:scaleY(1)}}
.hero__coords{
  position:absolute; z-index:2; left:calc(var(--pad) + 30px); top:calc(var(--by, 60svh) - 52px);
  display:grid; gap:6px; font-size:10px; letter-spacing:.2em;
  opacity:0; animation:fade 1s ease 1.6s forwards;
}
.hero__coords .blue{color:#3a52ff; line-height:1.45}
.sig{display:flex; align-items:center; gap:8px; color:var(--cream-dim)}
.hero__cta{
  position:absolute; z-index:2; left:calc(var(--pad) + 48px); bottom:clamp(40px, 9svh, 96px);
  font-family:var(--display); font-weight:500; font-size:12px; letter-spacing:.26em; text-transform:uppercase; color:var(--cream);
  min-height:44px; display:inline-flex; align-items:center; gap:12px;
  opacity:0; animation:fade 1s ease 1.3s forwards; transition:gap .3s var(--ease);
}
.hero__cta:hover{gap:20px}
.hero__foot{
  position:absolute; z-index:2; right:var(--pad); bottom:18px; display:flex; gap:32px; align-items:center;
  opacity:0; animation:fade 1s ease 1.6s forwards;
}
.hero__foot a{min-height:44px; display:inline-flex; align-items:center; color:var(--cream)}
.pulse{width:6px;height:6px;background:var(--blue);display:inline-block;animation:blink 2.4s steps(2,end) infinite}
@keyframes in{to{opacity:1;transform:none}}
@keyframes fade{to{opacity:1}}
@keyframes blink{50%{opacity:.15}}

/* ---------- SECTIONS ---------- */
.section{position:relative;padding:clamp(80px, 10vw, 150px) 0;border-top:1px solid var(--line)}
.sec-head{display:grid;gap:20px;margin-bottom:clamp(40px, 5vw, 80px)}
.sec-title{
  font-variation-settings:'wdth' 72; font-weight:800; text-transform:uppercase;
  font-size:clamp(32px, 4.4vw, 68px); line-height:.9; letter-spacing:-.025em; color:var(--cream);
  max-width:12ch;
}

/* services: rail = blue beam turned into navigation line */
.rail{position:absolute;top:0;bottom:0;left:calc(var(--pad) * .5);width:1px;pointer-events:none}
.rail__line{position:absolute;top:0;left:0;width:1px;height:100%;background:var(--blue);transform-origin:top;transform:scaleY(var(--p,0))}
.services .wrap{padding-left:calc(var(--pad) * 1.5)}
.svc{display:grid}
.svc__item{
  position:relative; display:grid;
  grid-template-columns:minmax(60px, 1fr) 7fr 4fr; column-gap:clamp(16px, 3vw, 48px); row-gap:12px;
  align-items:end; padding:clamp(32px, 3.6vw, 48px) 0;
}
.svc__line{position:absolute;top:0;left:calc(var(--pad) * -1);right:0;height:1px;background:var(--line);overflow:visible}
.svc__line::before{content:"";position:absolute;inset:0;background:var(--blue);transform-origin:left;transform:scaleX(0);transition:transform 1.4s var(--ease) .2s}
.svc__item.is-in .svc__line::before{transform:scaleX(.32)}
.tick{position:absolute;left:0;top:-4px;width:1px;height:9px;background:var(--blue)}
.svc__num{align-self:start;padding-top:.6em}
.svc__name{
  font-variation-settings:'wdth' 72; font-weight:800; text-transform:uppercase;
  font-size:clamp(40px, 5.6vw, 88px); line-height:.86; letter-spacing:-.03em;
}
.svc__desc{font-size:clamp(16px, 1.25vw, 19px);line-height:1.4;max-width:22ch;color:var(--cream);padding-bottom:.4em}
.svc__tag{grid-column:2 / -1}

/* work */
.cases{display:grid;grid-template-columns:repeat(3, 1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.case{
  position:relative; background:var(--ink); padding:clamp(24px, 2.4vw, 36px);
  min-height:clamp(320px, 30vw, 420px);
  display:flex; flex-direction:column; overflow:hidden; outline:none;
}
.case__top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.case__name{
  margin-top:auto; padding-top:80px;
  font-variation-settings:'wdth' 72; font-weight:800; text-transform:uppercase;
  font-size:clamp(36px, 3.4vw, 56px); line-height:.88; letter-spacing:-.025em;
}
.case__meta{display:grid;gap:16px;margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.case__meta dd{font-size:15px;line-height:1.4;color:var(--cream);margin-top:4px}
.case__lock{position:absolute;right:clamp(24px, 2.4vw, 36px);top:50%;opacity:0;transition:opacity .3s}
/* crosshair lock */
.xh{position:absolute;background:var(--blue);pointer-events:none;transition:transform .7s var(--ease), opacity .3s}
.xh--h{left:0;right:0;top:46%;height:1px;transform:scaleX(0);transform-origin:left}
.xh--v{top:0;bottom:0;left:22%;width:1px;transform:scaleY(0);transform-origin:top}
.corner{position:absolute;width:14px;height:14px;border-color:var(--blue-soft);border-style:solid;border-width:0;opacity:0;transition:opacity .3s, transform .5s var(--ease)}
.c1{top:10px;left:10px;border-top-width:1px;border-left-width:1px;transform:translate(8px,8px)}
.c2{top:10px;right:10px;border-top-width:1px;border-right-width:1px;transform:translate(-8px,8px)}
.c3{bottom:10px;left:10px;border-bottom-width:1px;border-left-width:1px;transform:translate(8px,-8px)}
.c4{bottom:10px;right:10px;border-bottom-width:1px;border-right-width:1px;transform:translate(-8px,-8px)}
.case:hover .xh, .case:focus-visible .xh{transform:none}
.case:hover .corner, .case:focus-visible .corner{opacity:1;transform:none}
.case:hover .case__lock, .case:focus-visible .case__lock{opacity:1}
.case h3, .case .case__top, .case dl{position:relative}

/* protocol */
.steps{position:relative;display:grid;grid-template-columns:repeat(3, 1fr);gap:clamp(24px, 4vw, 64px)}
.steps::before{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:var(--line)}
.steps::after{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:var(--blue);transform-origin:left;transform:scaleX(var(--p,0))}
.step{position:relative;padding-top:40px;display:grid;gap:14px;align-content:start}
.node{position:absolute;left:0;top:0;width:9px;height:9px;z-index:1}
.node::before,.node::after{content:"";position:absolute;background:var(--blue)}
.node::before{left:4px;top:-6px;width:1px;height:21px}
.node::after{left:-6px;top:4px;width:21px;height:1px}
.step__name{
  font-variation-settings:'wdth' 72; font-weight:800; text-transform:uppercase;
  font-size:clamp(30px, 3vw, 48px); line-height:.9; letter-spacing:-.025em;
}
.step__desc{font-size:17px;line-height:1.45;max-width:28ch;color:var(--cream-dim)}

/* contact — cobalt */
.contact{background:var(--cobalt);color:var(--cream);padding:clamp(96px, 12vw, 180px) 0 0}
.contact .micro{color:rgba(241,237,229,.78)}
.contact__grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(48px, 7vw, 120px);align-items:start}
.contact__head{display:grid;gap:24px}
.contact__title{
  font-variation-settings:'wdth' 72; font-weight:800; text-transform:uppercase;
  font-size:clamp(40px, 5.6vw, 88px); line-height:.88; letter-spacing:-.03em;
}
.contact__sub{font-size:clamp(17px, 1.4vw, 21px);line-height:1.35;max-width:20ch}
.contact__coord{margin-top:16px}
.form{display:grid;gap:28px}
.field{display:grid;gap:8px}
.field input,.field textarea{
  width:100%; background:transparent; color:var(--cream);
  font-family:var(--display); font-size:20px; line-height:1.4;
  border:0; border-bottom:1px solid rgba(241,237,229,.45); border-radius:0;
  padding:12px 0; min-height:52px; resize:vertical; transition:border-color .2s;
}
.field textarea{min-height:120px}
.field input:focus,.field textarea:focus{outline:none;border-bottom-color:var(--cream)}
.field.has-err input,.field.has-err textarea{border-bottom-color:#0a0a0a}
.err{min-height:1.5em;color:var(--black) !important}
.send{
  justify-self:start; min-height:60px; padding:0 32px;
  background:var(--black); color:var(--cream);
  font-family:var(--mono); font-size:13px; letter-spacing:.2em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:16px;
  transition:background .25s, color .25s, gap .3s var(--ease);
}
.send:hover{background:var(--cream);color:var(--black);gap:24px}
.send:disabled{opacity:.6;cursor:wait}
.status{min-height:1.5em;color:var(--cream) !important}
.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:28px;padding-bottom:32px;margin-top:clamp(80px, 10vw, 140px);border-top:1px solid rgba(241,237,229,.25)}

/* reveal */
.reveal{opacity:0;transform:translateY(14px);transition:opacity 1s var(--ease), transform 1s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 960px){
  .cases{grid-template-columns:1fr}
  .case{min-height:360px}
  .contact__grid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .hero{--W:130vw; --H:calc(var(--W) * 1173 / 1281); min-height:640px}
  .hero__arch{right:-10vw}
  .hero__title{font-size:clamp(44px, 15.5vw, 84px); top:calc(16px + 44px + 3svh)}
  .hero__bar{padding-top:12px}
  .hero__brand{font-size:12px; letter-spacing:.2em}
  .hero__btn{padding-left:18px}
  .hero__cta{left:calc(var(--pad) + 30px); bottom:76px; font-size:11px}
  .hero__foot{left:var(--pad); right:var(--pad); justify-content:space-between; gap:12px; bottom:10px}
  .hero__foot{font-size:9px; letter-spacing:.1em; white-space:nowrap}
  .beam--v{left:calc(var(--pad) + 6px)}
  .hero__coords{left:calc(var(--pad) + 16px)}
  .micro{font-size:10px;letter-spacing:.14em}
  .svc__item{grid-template-columns:1fr;row-gap:16px}
  .svc__num{padding-top:0}
  .svc__tag{grid-column:auto}
  .steps{grid-template-columns:1fr;gap:56px;padding-left:28px}
  .steps::before,.steps::after{left:4px;right:auto;top:0;bottom:0;width:1px;height:auto}
  .steps::after{transform-origin:top;transform:scaleY(var(--p,0))}
  .step{padding-top:0}
  .node{left:-28px;top:6px}
  .menu li a{gap:16px}
  .foot{flex-direction:column}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .reveal{opacity:1;transform:none}
}

/* =========================================================
   PHASE 2 — ART DIRECTION: deep space, scanned by a signal
   (hero/poster untouched)
   ========================================================= */
:root{
  --void:#0B0C0B;
  --carbon:#121310;
  --graphite:#1B1C19;
  --concrete-shadow:#242521;
  --paper:#F1EFE8;
  --signal:#184CFF;
  --signal-text:#5079FF;            /* same hue, lifted for tiny text legibility */
  --hair:rgba(241,239,232,.09);
  --hair-2:rgba(241,239,232,.18);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5  0 0 0 0 .5  0 0 0 0 .5  0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
html,body{background:var(--void)}
body{color:var(--paper)}
.blue{color:var(--signal-text)}
.nav{background:rgba(11,12,11,.82);border-bottom-color:var(--hair)}
.menu{background:var(--void)}
.menu ol,.menu li{border-color:var(--hair)}
.menu li a:hover{color:var(--signal-text)}
.menu-btn{border-color:var(--hair-2)}
.menu-btn:hover{border-color:var(--signal)}

/* section states: several near-blacks, grain, faint vignette */
.section,.contact{position:relative;isolation:isolate;border-top:0}
.services{background:var(--carbon)}
.work{background:var(--void)}
.protocol{background:var(--carbon)}
.contact{background:var(--void)}
.section::before,.contact::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:var(--grain);background-size:180px 180px;opacity:.055;mix-blend-mode:screen;
}
.section::after,.contact::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  box-shadow:inset 0 0 220px 40px rgba(0,0,0,.42), inset 0 28px 40px -28px rgba(0,0,0,.55);
}

/* the scan: one continuous signal rail through all sections */
.scan{position:relative}
.scan__rail{position:absolute;top:0;bottom:0;left:calc(var(--pad) * .5);width:1px;background:var(--hair);z-index:5;pointer-events:none}
.scan__beam{position:absolute;inset:0;background:var(--signal);transform-origin:top;transform:scaleY(var(--p,0));box-shadow:0 0 6px rgba(24,76,255,.55);transition:transform .35s linear}

/* section axes */
.axis{position:absolute;top:0;left:0;right:0;height:1px;background:var(--hair);z-index:4;pointer-events:none}
.axis__node{position:absolute;left:calc(var(--pad) * .5 - 7px);top:-7px;width:15px;height:15px}
.axis__node::before,.axis__node::after{content:"";position:absolute;background:var(--hair-2);transition:background .6s var(--ease)}
.axis__node::before{left:7px;top:0;width:1px;height:15px}
.axis__node::after{left:0;top:7px;width:15px;height:1px}
.axis__seg{position:absolute;left:calc(var(--pad) * .5);top:0;height:1px;width:clamp(80px, 14vw, 220px);background:var(--signal);transform-origin:left;transform:scaleX(0);transition:transform 1.4s var(--ease) .1s}
.axis__label{position:absolute;left:calc(var(--pad) * .5 + 16px);top:10px;font-size:9px;letter-spacing:.22em;color:var(--signal-text);opacity:0;transition:opacity .8s ease .5s}
.axis.is-locked .axis__node::before,.axis.is-locked .axis__node::after{background:var(--signal)}
.axis.is-locked .axis__seg{transform:scaleX(1)}
.axis.is-locked .axis__label{opacity:.9}

/* services: retire the old local rail, keep its line ticks */
.rail{display:none}
.svc__line{background:var(--hair)}
.svc__line::before{background:var(--signal)}
.tick{background:var(--signal)}
.svc__desc{color:var(--paper)}

/* work cards: graphite surfaces with weight */
.cases{background:var(--hair);border-color:var(--hair);box-shadow:0 40px 80px -40px rgba(0,0,0,.8)}
.case{background:var(--carbon);transition:background .5s var(--ease)}
.case:hover,.case:focus-visible{background:var(--graphite)}
.case__meta{border-top-color:var(--hair)}
.xh{background:var(--signal)}
.corner{border-color:var(--signal-text)}

/* protocol */
.steps::before{background:var(--hair)}
.steps::after{background:var(--signal)}
.node::before,.node::after{background:var(--signal)}
.step__desc{color:var(--cream-dim)}

/* ---------- CONTACT: back to deep void ---------- */
.contact{color:var(--paper);overflow:hidden}
.contact .micro{color:var(--cream-dim)}
.contact__title{color:var(--paper)}
.contact__coord{color:var(--signal-text) !important}
/* single local light: narrow cobalt wedge entering from the top-right corner */
.contact__wedge{
  position:absolute;z-index:-1;pointer-events:none;
  top:-10%;right:-4%;width:min(46vw, 640px);height:120%;
  background:linear-gradient(200deg, rgba(24,76,255,.20) 0%, rgba(24,76,255,.07) 38%, rgba(24,76,255,0) 70%);
  clip-path:polygon(100% 0, 97.5% 0, 16% 100%, 44% 100%);
  filter:blur(18px);opacity:0;transition:opacity 2.2s ease .2s;
}
.contact.is-lit .contact__wedge{opacity:1}

.form{position:relative;padding:clamp(28px, 3vw, 44px) 0 0 clamp(28px, 3vw, 44px)}
.form__frame{position:absolute;inset:0;pointer-events:none}
.fx{position:absolute;background:var(--signal)}
.fx--h{left:-14px;top:0;width:44px;height:1px}
.fx--v{left:0;top:-14px;width:1px;height:44px}
.form__coord{position:absolute;left:44px;top:-5px;font-size:9px;letter-spacing:.22em;color:var(--signal-text) !important}
.field label{color:var(--cream-dim)}
.field input,.field textarea{color:var(--paper);border-bottom:1px solid var(--hair-2);background:transparent}
.field input:focus,.field textarea:focus{border-bottom-color:var(--signal);box-shadow:0 1px 0 0 var(--signal)}
.field:focus-within label{color:var(--signal-text)}
.field.has-err input,.field.has-err textarea{border-bottom-color:#C9705F}
.err{color:#D98B7B !important}
.status{color:var(--signal-text) !important}
.send{background:transparent;color:var(--paper);border:1px solid var(--hair-2)}
.send:hover,.send:focus-visible{background:var(--signal);border-color:var(--signal);color:var(--paper)}
.foot{border-top-color:var(--hair)}
.foot .micro{color:rgba(241,239,232,.45)}

@media (max-width: 720px){
  .contact__wedge{width:90vw;right:-20%}
  .form{padding-left:22px}
  .axis__label{display:none}
}
@media (prefers-reduced-motion: reduce){
  .axis__seg{transition:none}
}