/* ==========================================================================
   LOUZER — Apparel & Embroidery
   Baseline: the Aug 2026 launch poster.
   Ink #050505 / Acid #BFF223 / Orange #FF6000 / Stone #2D6E93
   ========================================================================== */

:root{
  --ink:#050505;
  --ink-2:#0b0b0b;
  --ink-3:#131313;
  --acid:#bff223;
  --acid-dim:#8fb51a;
  --orange:#ff6000;
  --stone:#2d6e93;
  --paper:#e9e9e4;
  --mute:#7d7d76;
  --hair:rgba(191,242,35,.22);
  --hair-soft:rgba(233,233,228,.12);

  --font-display:"Jost","Futura","Century Gothic",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;

  --gut:clamp(1.25rem,4.5vw,4.5rem);
  --sec:clamp(5rem,12vw,11rem);
  --maxw:1560px;
}

*,*::before,*::after{box-sizing:border-box;}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;}
}

body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-display);
  font-weight:300;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}

::selection{background:var(--acid);color:var(--ink);}

.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--acid);color:var(--ink);
  padding:.75rem 1.25rem;font-family:var(--font-mono);font-size:.75rem;
}
.skip:focus{left:0;}

:focus-visible{
  outline:2px solid var(--acid);
  outline-offset:3px;
}

/* ---------- type primitives ---------- */

.display{
  font-family:var(--font-display);
  font-weight:200;
  text-transform:uppercase;
  letter-spacing:.14em;
  line-height:1.06;
  margin:0;
}

.mono{
  font-family:var(--font-mono);
  font-weight:300;
  letter-spacing:.04em;
}

.body{
  font-size:clamp(.98rem,1.15vw,1.18rem);
  line-height:1.75;
  font-weight:300;
  letter-spacing:.015em;
  color:rgba(233,233,228,.74);
  margin:0 0 1.15em;
  max-width:62ch;
}

.eyebrow{
  font-size:.7rem;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:var(--acid);
  margin:0 0 1.75rem;
}

.rule{
  height:1px;
  background:var(--hair);
  width:100%;
}

/* ---------- nav ---------- */

.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  gap:2rem;
  padding:1.15rem var(--gut);
  transition:background .4s ease,backdrop-filter .4s ease,border-color .4s ease,padding .4s ease;
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  background:rgba(5,5,5,.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--hair);
  padding-block:.85rem;
}

.nav__logo{position:relative;z-index:2;}
.nav__logo img{width:clamp(112px,11vw,158px);}

.nav__links{
  display:flex;align-items:center;gap:clamp(1.1rem,2.4vw,2.4rem);
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.nav__links a{
  color:rgba(233,233,228,.62);
  transition:color .25s ease;
  position:relative;
  padding-block:.35rem;
}
.nav__links a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--acid);
  transform:scaleX(0);transform-origin:right;
  transition:transform .35s cubic-bezier(.2,.7,.3,1);
}
.nav__links a:hover{color:var(--paper);}
.nav__links a:hover::after{transform:scaleX(1);transform-origin:left;}

.nav__cta{
  color:var(--acid)!important;
  border:1px solid var(--hair);
  padding:.6rem 1.15rem!important;
  transition:background .25s ease,color .25s ease,border-color .25s ease;
}
.nav__cta::after{display:none;}
.nav__cta:hover{background:var(--acid);color:var(--ink)!important;border-color:var(--acid);}

.nav__toggle{
  display:none;
  position:relative;z-index:2;
  background:none;border:0;cursor:pointer;
  width:38px;height:38px;padding:0;
  flex-direction:column;justify-content:center;gap:7px;
}
.nav__toggle span{
  display:block;height:1px;width:26px;background:var(--acid);
  transition:transform .3s ease,opacity .3s ease;
}
.nav__toggle[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg);}
.nav__toggle[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg);}

@media (max-width:900px){
  .nav__toggle{display:flex;}
  .nav__links{
    position:fixed;inset:0;
    background:var(--ink);
    flex-direction:column;justify-content:center;
    gap:2.25rem;
    font-size:1rem;
    opacity:0;visibility:hidden;
    transition:opacity .35s ease,visibility .35s ease;
  }
  .nav__links.is-open{opacity:1;visibility:visible;}
  .nav__cta{padding:.85rem 1.75rem!important;}
}

/* ---------- hero ---------- */

.hero{
  position:relative;
  min-height:100svh;
  padding:clamp(6rem,13vh,9rem) var(--gut) clamp(2rem,5vh,3.5rem);
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:clamp(1.5rem,4vh,3rem);
  overflow:hidden;
}

.hero__chrome{
  display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;
}
.corner{margin:0;}
.corner--tl{
  font-size:clamp(.82rem,1.35vw,1.05rem);
  text-transform:uppercase;
  letter-spacing:.3em;
  line-height:1.6;
  color:var(--acid);
  font-weight:300;
}
.corner--tr{
  width:clamp(52px,6vw,86px);
  opacity:.95;
}
@media (max-width:900px){.corner--tr{display:none;}}

.hero__stone{
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-52%);
  margin:0;
  width:clamp(230px,40vw,560px);
  z-index:0;
  pointer-events:none;
  animation:stoneIn 1.6s cubic-bezier(.16,.84,.3,1) both;
}
.hero__stone img{
  /* the WebP carries a real alpha matte, so the stone sits on the page with no
     edge to hide; brightness keeps it behind the headline as on the poster */
  filter:brightness(.84) contrast(1.05) drop-shadow(0 24px 70px rgba(45,110,147,.26));
}
@keyframes stoneIn{
  from{opacity:0;transform:translate(-50%,-46%) scale(.94);}
  to{opacity:1;transform:translate(-50%,-52%) scale(1);}
}

.hero__type{
  position:relative;z-index:2;
  align-self:center;
  pointer-events:none;
}
.hero h1.display{
  font-size:clamp(2.1rem,7.4vw,6.6rem);
  color:var(--acid);
  letter-spacing:.1em;
  line-height:1.12;
  display:grid;
  text-shadow:0 0 40px rgba(5,5,5,.85);
}
.hero h1.display span{
  display:block;
  animation:lineIn 1s cubic-bezier(.16,.84,.3,1) both;
}
.hero h1.display span:nth-child(1){animation-delay:.15s;}
.hero h1.display span:nth-child(2){animation-delay:.27s;}
.hero h1.display span:nth-child(3){animation-delay:.39s;}
.hero h1.display span:nth-child(4){animation-delay:.51s;}
@keyframes lineIn{
  from{opacity:0;transform:translateY(.55em);}
  to{opacity:1;transform:none;}
}

.hero__foot{position:relative;z-index:2;}

.lore{
  display:grid;
  grid-template-columns:clamp(130px,15vw,215px) 1fr;
  gap:clamp(1.25rem,4vw,3.5rem);
  align-items:start;
  padding-top:1.35rem;
}
.lore__logo{width:100%;}
.lore__text{
  font-size:clamp(.5rem,.66vw,.68rem);
  line-height:1.72;
  color:var(--acid);
  margin:0;
  max-width:none;
  opacity:.9;
}
@media (max-width:700px){
  .lore{grid-template-columns:1fr;gap:1.1rem;}
  .lore__logo{width:min(180px,50%);}
  .lore__text{font-size:.56rem;line-height:1.7;}
}

.scroll-hint{
  position:absolute;
  right:var(--gut);
  bottom:clamp(7rem,16vh,11rem);
  font-size:.62rem;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:rgba(191,242,35,.5);
  writing-mode:vertical-rl;
  animation:pulse 2.6s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:.35;}50%{opacity:.9;}}
@media (max-width:900px){.scroll-hint{display:none;}}

/* ---------- reveal ---------- */

.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .9s cubic-bezier(.16,.84,.3,1),transform .9s cubic-bezier(.16,.84,.3,1);
}
.reveal.is-in{opacity:1;transform:none;}

/* ---------- section head ---------- */

.sec-head{
  max-width:var(--maxw);
  margin:0 auto clamp(2.75rem,6vw,4.5rem);
}
.sec-head__title{
  font-size:clamp(1.9rem,5.2vw,4.2rem);
  color:var(--paper);
}

/* ---------- statement ---------- */

.statement{
  padding:var(--sec) var(--gut);
  max-width:var(--maxw);
  margin-inline:auto;
}
.statement__line{
  font-size:clamp(1.75rem,5.4vw,4.6rem);
  letter-spacing:.09em;
  line-height:1.22;
  margin-bottom:clamp(2rem,4vw,3.25rem);
}
.statement__line em{
  font-style:normal;
  color:var(--acid);
}
.statement__body{margin-left:auto;max-width:52ch;}

@media (min-width:1000px){
  .statement{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:end;}
  .statement .eyebrow{grid-column:1/-1;}
  .statement__line{margin-bottom:0;}
}

/* ---------- band ---------- */

.band{
  position:relative;
  padding-inline:var(--gut);
  max-width:var(--maxw);
  margin-inline:auto;
}
.band img{
  width:100%;
  /* The source black point is remapped to the page ink at build time, so the panel
     bleeds into the background with no border. Avoid contrast/brightness filters
     here — they would shift that ground away from the page and re-expose the edge. */
}
.band__caption{
  margin:1.25rem 0 0;
  font-size:.68rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--mute);
}

/* ---------- work grid ---------- */

.work{padding:var(--sec) var(--gut);max-width:var(--maxw);margin-inline:auto;}

.grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(.85rem,2vw,1.75rem);
}
@media (max-width:760px){.grid{grid-template-columns:1fr;}}

.card{
  margin:0;
  position:relative;
  overflow:hidden;
  background:var(--ink-2);
  border:1px solid var(--hair-soft);
}
.card--wide{grid-column:1/-1;}
.card img{
  width:100%;
  height:100%;
  object-fit:cover;
  aspect-ratio:4/5;
  transition:transform 1.1s cubic-bezier(.16,.84,.3,1),filter .6s ease;
}
.card--wide img{aspect-ratio:16/9;object-position:center 38%;}
.card--tall img{aspect-ratio:3/4;}
.card:hover img{transform:scale(1.04);}

.card figcaption{
  position:absolute;left:0;right:0;bottom:0;
  display:grid;
  gap:.3rem;
  padding:clamp(1rem,2.2vw,1.6rem);
  background:linear-gradient(to top,rgba(5,5,5,.92) 0%,rgba(5,5,5,.6) 55%,transparent 100%);
}
.card__num{
  font-size:.62rem;letter-spacing:.28em;color:var(--acid);
}
.card__title{
  font-size:clamp(.98rem,1.7vw,1.3rem);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:300;
}
.card__meta{
  font-size:.64rem;letter-spacing:.14em;color:var(--mute);text-transform:uppercase;
}

/* ---------- craft ---------- */

.craft{padding:var(--sec) var(--gut);max-width:var(--maxw);margin-inline:auto;}

.craft__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(255px,1fr));
  gap:1px;
  background:var(--hair-soft);
  border:1px solid var(--hair-soft);
}
.svc{
  background:var(--ink);
  padding:clamp(1.75rem,3.2vw,2.75rem);
  transition:background .45s ease;
}
.svc:hover{background:var(--ink-2);}
.svc__num{
  display:block;
  font-size:.66rem;letter-spacing:.3em;color:var(--acid);
  margin-bottom:1.5rem;
}
.svc__title{
  font-size:clamp(1rem,1.6vw,1.22rem);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:300;
  margin:0 0 1rem;
  line-height:1.35;
}
.svc .body{font-size:.94rem;line-height:1.7;margin:0;}

/* ---------- split ---------- */

.split{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(2rem,5vw,4.5rem);
  align-items:center;
  padding:var(--sec) var(--gut);
  max-width:var(--maxw);
  margin-inline:auto;
}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr;}}

.split__img{margin:0;overflow:hidden;border:1px solid var(--hair-soft);}
.split__img img{width:100%;aspect-ratio:4/5;object-fit:cover;}
.split__title{
  font-size:clamp(1.75rem,4.2vw,3.4rem);
  color:var(--acid);
  margin-bottom:clamp(1.5rem,3vw,2.25rem);
}

/* ---------- process ---------- */

.process{padding:var(--sec) var(--gut);max-width:var(--maxw);margin-inline:auto;}

.steps{
  list-style:none;
  margin:0;padding:0;
  display:grid;
  gap:0;
}
.step{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:clamp(1.25rem,4vw,4rem);
  align-items:start;
  padding:clamp(1.75rem,3.5vw,2.75rem) 0;
  border-top:1px solid var(--hair-soft);
}
.step:last-child{border-bottom:1px solid var(--hair-soft);}
.step__num{
  font-size:clamp(1.6rem,4vw,3rem);
  color:var(--acid);
  opacity:.32;
  line-height:1;
  font-weight:300;
  min-width:2ch;
}
.step__title{
  font-size:clamp(1.05rem,2vw,1.6rem);
  text-transform:uppercase;
  letter-spacing:.15em;
  font-weight:300;
  margin:0 0 .85rem;
}
.step .body{margin:0;}

@media (min-width:900px){
  .step{grid-template-columns:auto 22ch 1fr;align-items:center;}
  .step__title{margin:0;}
}

/* ---------- order ---------- */

.order{
  padding:var(--sec) var(--gut);
  max-width:var(--maxw);
  margin-inline:auto;
  display:grid;
  gap:clamp(2.5rem,6vw,5.5rem);
}
@media (min-width:1000px){
  .order{grid-template-columns:.85fr 1fr;align-items:start;}
}

.order__title{
  font-size:clamp(2.1rem,5.6vw,4.4rem);
  color:var(--acid);
  margin-bottom:clamp(1.5rem,3vw,2.25rem);
}
.order__lede{max-width:40ch;}
.order__note{
  font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--mute);margin:2rem 0 0;
}

.form{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(1.1rem,2.2vw,1.75rem);
}
@media (max-width:640px){.form{grid-template-columns:1fr;}}
.field--full,.form__actions{grid-column:1/-1;}

.field{display:grid;gap:.6rem;}
.field label{
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--mute);
}
.opt{color:rgba(125,125,118,.6);text-transform:none;letter-spacing:.1em;}

.field input,
.field select,
.field textarea{
  width:100%;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--hair-soft);
  padding:.75rem 0;
  color:var(--paper);
  font-family:var(--font-display);
  font-size:1rem;
  font-weight:300;
  letter-spacing:.02em;
  border-radius:0;
  transition:border-color .3s ease;
}
.field textarea{resize:vertical;line-height:1.65;}
.field select{
  appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--acid) 50%),linear-gradient(135deg,var(--acid) 50%,transparent 50%);
  background-position:calc(100% - 12px) center,calc(100% - 6px) center;
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
  padding-right:2rem;
  cursor:pointer;
}
.field select option{background:var(--ink);color:var(--paper);}
.field input::placeholder,
.field textarea::placeholder{color:rgba(125,125,118,.55);}
.field input:focus,
.field select:focus,
.field textarea:focus{
  outline:none;
  border-bottom-color:var(--acid);
}
.field.is-bad input,
.field.is-bad select,
.field.is-bad textarea{border-bottom-color:var(--orange);}

.field__err{
  font-family:var(--font-mono);
  font-size:.64rem;
  letter-spacing:.12em;
  color:var(--orange);
  min-height:1em;
}

/* ship vs pickup */
.choice{border:0;padding:0;margin:0;min-width:0;}
.choice legend{
  padding:0;
  font-family:var(--font-mono);
  font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);
}
.choice__opts{display:flex;gap:clamp(1rem,3vw,2.25rem);flex-wrap:wrap;margin-top:.9rem;}
.radio{display:flex;align-items:center;gap:.65rem;cursor:pointer;font-size:.98rem;font-weight:300;}
.radio input{
  appearance:none;-webkit-appearance:none;
  width:15px;height:15px;margin:0;border-radius:50%;
  border:1px solid var(--hair-soft);
  background:transparent;cursor:pointer;
  transition:border-color .25s ease,box-shadow .25s ease;
  flex:none;
}
.radio input:checked{
  border-color:var(--acid);
  box-shadow:inset 0 0 0 4px var(--acid);
}
.radio input:focus-visible{outline:2px solid var(--acid);outline-offset:3px;}

/* honeypot — off-screen rather than display:none, which some bots skip */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* .field is display:grid, which would otherwise beat the hidden attribute */
.field[hidden]{display:none;}

/* post-submit confirmation, replaces the form in place */
.sent{
  grid-column:1/-1;
  align-self:start;
}
.sent__title{
  font-size:clamp(1.5rem,3.4vw,2.4rem);
  color:var(--acid);
  margin-bottom:1.25rem;
}
.sent .body{margin-bottom:2rem;}
.sent__actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:clamp(2rem,4vw,3rem);}
.sent .btn{display:inline-block;text-decoration:none;}

/* ---------- the work order ---------- */

.sheet{
  border:1px solid var(--hair);
  padding:clamp(1.5rem,4vw,2.75rem);
  background:var(--ink-2);
}
.sheet__head{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:1.5rem;flex-wrap:wrap;
  padding-bottom:1.5rem;border-bottom:1px solid var(--hair);
}
.sheet__logo{width:clamp(120px,16vw,168px);}
.sheet__meta{
  text-align:right;font-size:.66rem;letter-spacing:.14em;
  color:var(--mute);line-height:1.9;text-transform:uppercase;
}
.sheet__meta b{color:var(--paper);font-weight:400;}
.sheet__title{
  font-size:clamp(1.2rem,2.6vw,1.8rem);
  margin:clamp(1.5rem,3vw,2rem) 0 0;
}
.sheet__block{margin-top:clamp(1.75rem,3.5vw,2.5rem);}
.sheet__legend{
  font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--acid);font-weight:400;margin:0 0 1rem;
  padding-bottom:.6rem;border-bottom:1px solid var(--hair);
}
.sheet__grid{margin:0;}
.sheet__row{
  display:grid;
  grid-template-columns:minmax(96px,140px) 1fr;
  gap:.75rem 1.25rem;
  padding:.6rem 0;
  border-bottom:1px solid var(--hair-soft);
}
.sheet__row dt{
  font-family:var(--font-mono);
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);
  padding-top:.15rem;
}
.sheet__row dd{margin:0;font-size:.95rem;line-height:1.6;word-break:break-word;white-space:pre-line;}
.sheet__blank{
  display:block;
  border-bottom:1px solid var(--hair-soft);
  min-height:1.2em;width:100%;
}
.sheet__boxes{display:flex;flex-wrap:wrap;gap:.5rem .9rem;}
.sheet__box{
  font-family:var(--font-mono);
  font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mute);
  border:1px solid var(--hair-soft);
  padding:.3rem .6rem;
}
.sheet__details{
  margin:1.25rem 0 0;
  padding:1rem 1.25rem;
  background:var(--ink);
  border-left:2px solid var(--acid);
  font-size:.95rem;line-height:1.7;white-space:pre-line;
  color:rgba(233,233,228,.82);
}
.sheet__rules{
  display:grid;gap:.4rem;
  margin-top:clamp(2rem,4vw,3rem);
  padding-top:1.25rem;border-top:1px solid var(--hair);
  font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mute);line-height:1.6;
}

/* Print the work order alone, on paper, in ink that a printer can render. */
@media print{
  body{background:#fff;}
  body > *:not(main),
  main > *:not(.order),
  .order__head,
  .sent__actions,
  .sent .eyebrow,
  .sent__title,
  .sent .body,
  .nav,.foot,.scroll-hint,.skip{display:none!important;}
  .order{display:block;padding:0;}
  .sheet{
    border:0;background:#fff;color:#111;padding:0;
  }
  .sheet__logo{filter:invert(1);}
  .sheet__meta,.sheet__row dt,.sheet__box,.sheet__rules{color:#555;}
  .sheet__legend{color:#111;border-bottom-color:#111;}
  .sheet__head,.sheet__rules{border-color:#111;}
  .sheet__row{border-bottom-color:#ccc;break-inside:avoid;}
  .sheet__blank{border-bottom-color:#111;}
  .sheet__box{border-color:#999;}
  .sheet__details{background:#f4f4f2;color:#111;border-left-color:#111;}
  .sheet__block{break-inside:avoid;}
}

.form__actions{
  display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;
  margin-top:.5rem;
}

.btn{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--acid);
  background:transparent;
  border:1px solid var(--acid);
  padding:1.05rem 2.75rem;
  cursor:pointer;
  position:relative;
  overflow:hidden;
  transition:color .35s ease;
}
.btn::before{
  content:"";position:absolute;inset:0;background:var(--acid);
  transform:translateY(101%);
  transition:transform .42s cubic-bezier(.2,.7,.3,1);
  z-index:-1;
}
.btn:hover{color:var(--ink);}
.btn:hover::before{transform:translateY(0);}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.btn:disabled::before{transform:translateY(101%);}

.form__status{
  font-size:.68rem;letter-spacing:.14em;margin:0;color:var(--mute);
}
.form__status.is-ok{color:var(--acid);}
.form__status.is-bad{color:var(--orange);}

/* ---------- footer ---------- */

.foot{
  padding:clamp(2.5rem,5vw,4rem) var(--gut) clamp(2rem,4vw,3rem);
  max-width:var(--maxw);
  margin-inline:auto;
}
.foot__top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:2rem;
  flex-wrap:wrap;
  padding-top:clamp(2rem,4vw,3rem);
}
.foot__logo{width:clamp(150px,17vw,250px);}
.foot__nav{
  display:flex;gap:clamp(1rem,2.4vw,2.25rem);flex-wrap:wrap;
  font-family:var(--font-mono);
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
}
.foot__nav a{color:var(--mute);transition:color .25s ease;}
.foot__nav a:hover{color:var(--acid);}

.foot__lore{
  font-size:clamp(.5rem,.62vw,.64rem);
  line-height:1.75;
  color:rgba(191,242,35,.62);
  margin:clamp(2.25rem,5vw,3.5rem) 0 0;
  max-width:none;
}

.foot__bottom{
  display:flex;justify-content:space-between;gap:1.25rem;flex-wrap:wrap;
  margin-top:clamp(2rem,4vw,3rem);
  padding-top:1.5rem;
  border-top:1px solid var(--hair-soft);
  font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mute);
}