/* Darwin Designs — landing page styles
   Edit this file, save, and redeploy to Cloudflare Pages.
   The Squarespace Code Block does not need to change. */
/* Scope everything under #dw to avoid clashing with Squarespace theme */
#dw *{box-sizing:border-box;margin:0;padding:0}
/* ---- Fonts: Yapari (display) + IBM Plex Mono (utility) ----
   Yapari is a licensed font — upload your .woff2 files to Squarespace as
   Site Assets and replace the four YOUR-ASSET-PATH urls below. Until then it
   falls back to Helvetica Neue/Arial (font-display:swap keeps text visible). */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&display=swap');
@font-face{
  font-family:'Yapari Ultra';
  src:url('YOUR-ASSET-PATH/Yapari-Ultra.woff2') format('woff2'),
      url('YOUR-ASSET-PATH/Yapari-Ultra.woff') format('woff');
  font-weight:900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Yapari';
  src:url('YOUR-ASSET-PATH/Yapari-Regular.woff2') format('woff2'),
      url('YOUR-ASSET-PATH/Yapari-Regular.woff') format('woff');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Yapari';
  src:url('YOUR-ASSET-PATH/Yapari-Light.woff2') format('woff2'),
      url('YOUR-ASSET-PATH/Yapari-Light.woff') format('woff');
  font-weight:300;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Yapari';
  src:url('YOUR-ASSET-PATH/Yapari-Medium.woff2') format('woff2'),
      url('YOUR-ASSET-PATH/Yapari-Medium.woff') format('woff');
  font-weight:500;font-style:normal;font-display:swap;
}

#dw{
  /* storyboard palette */
  --black:#0B0B0A;
  --void:#0B0B0A;
  --offwhite:#F2F0E8;
  --alpine:#F2F0E8;
  --gray-1:#8C8C86;   /* light titanium */
  --gray-2:#5B5B56;   /* mid titanium */
  --gray-3:#3A3A37;   /* dark titanium */
  --moss:#4A4F45;     /* single accent, used sparingly */
  --ink:#0B0B0A;

  /* anodized blues retained ONLY for the frame-derived section fill */
  --indigo:#11395D;
  --azure:#2C6692;
  --vivid:#719BC1;
  --cyan:#97C1D0;

  --display:'Yapari','Helvetica Neue',Arial,sans-serif;
  --ultra:'Yapari Ultra','Yapari','Helvetica Neue',Arial,sans-serif;
  --body:'Yapari','Helvetica Neue',Arial,sans-serif;
  --mono:'IBM Plex Mono','Courier New',monospace;

  position:relative;
  width:100%;
  background:var(--black);
  color:var(--offwhite);
  font-family:var(--display);
  font-weight:300;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
#dw img{display:block;max-width:100%}
#dw a{color:inherit;text-decoration:none}

/* ============ WELD SEAM (scroll progress signature) ============ */
#dw .weld-seam{
  position:fixed;top:0;left:24px;width:1px;height:100%;z-index:40;
  background:rgba(242,240,232,.12);pointer-events:none;
}
#dw .weld-seam::before{
  content:'';position:absolute;top:0;left:0;width:100%;
  height:var(--progress,0%);background:var(--gray-1);transition:height .05s linear;
}
@media(max-width:780px){#dw .weld-seam{display:none}}

/* ============ HERO ============ */
#dw .hero{
  position:relative;
  height:100svh;
  min-height:600px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  perspective:1400px;      /* enables the 3D tilt */
  background:var(--void);
}
#dw .hero__stage{
  position:relative;
  width:min(86vw,560px);
  aspect-ratio:4/5;
  transform-style:preserve-3d;
  will-change:transform;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 40px 120px -30px rgba(0,0,0,.9),
             0 0 0 1px rgba(242,240,232,.1);
  /* smooth morph from portrait video to landscape photo */
  transition:width 1.1s cubic-bezier(.7,0,.2,1),
             aspect-ratio 1.1s cubic-bezier(.7,0,.2,1),
             max-width 1.1s cubic-bezier(.7,0,.2,1);
}
/* once the video has played ~one loop, the stage widens to landscape */
#dw .hero__stage.show-still{
  width:min(92vw,880px);
  aspect-ratio:5/4;
}
#dw .hero__stage iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
  z-index:1;opacity:1;transition:opacity 1s ease;
}
/* the closing still — fades in over the video */
#dw .hero__still{
  position:absolute;inset:0;z-index:2;
  background-size:cover;background-position:center;
  opacity:0;transition:opacity 1.1s ease;pointer-events:none;
}
#dw .hero__stage.show-still iframe{opacity:0}
#dw .hero__stage.show-still .hero__still{opacity:1}
/* subtle rim light that reacts with the tilt */
#dw .hero__glow{
  position:absolute;inset:-2px;pointer-events:none;
  background:radial-gradient(120% 120% at 50% 0%,rgba(151,193,208,.18),transparent 60%);
  mix-blend-mode:screen;
}
#dw .hero__title{
  position:absolute;left:0;right:0;bottom:8%;
  text-align:center;z-index:3;pointer-events:none;
}
#dw .hero__title::before{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(92vw,900px);height:220%;z-index:-1;
  background:radial-gradient(60% 100% at 50% 55%,rgba(11,11,10,.55),transparent 70%);
  pointer-events:none;
}
#dw .hero__title span{
  display:block;font-family:var(--ultra);font-weight:900;
  letter-spacing:.02em;text-transform:uppercase;
  font-size:clamp(2.6rem,9vw,6rem);line-height:.9;
  color:var(--offwhite);
  text-shadow:0 2px 40px rgba(0,0,0,.8);
}
#dw .hero__title small{
  display:block;margin-top:1.1rem;font-family:var(--mono);
  font-weight:400;letter-spacing:.1em;font-size:clamp(.62rem,1.3vw,.78rem);
  color:var(--gray-1);text-transform:uppercase;
}
#dw .hero__scroll{
  position:absolute;bottom:22px;left:50%;transform:translateX(-50%);
  z-index:3;font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--gray-1);opacity:.85;
  animation:dwbob 2.4s ease-in-out infinite;
}
@keyframes dwbob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}

/* ============ VIDEO WALL SECTION ============ */
/* Background matches the storyboard: near-black with a faint diagonal
   titanium weave, no anodized fill. */
#dw .anodized{
  position:relative;
  padding:clamp(90px,14vh,190px) 0 clamp(120px,18vh,240px);
  background-color:var(--black);
  background-image:repeating-linear-gradient(115deg,#111110 0px,#111110 2px,#171716 2px,#171716 4px);
  isolation:isolate;
}
#dw .anodized::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 0%,rgba(242,240,232,.03),transparent 55%);
}
#dw .anodized::after{content:none}

/* storyboard-style hairline section dividers */
#dw .anodized{border-top:1px solid rgba(242,240,232,.08);border-bottom:1px solid rgba(242,240,232,.08)}

#dw .wall__head{
  text-align:center;max-width:720px;margin:0 auto clamp(38px,6vh,70px);
  padding:0 24px;position:relative;z-index:3;
}
#dw .wall__eyebrow{
  font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;
  font-size:.72rem;color:var(--offwhite);margin-bottom:18px;
}
#dw .wall__title{
  font-family:var(--display);font-weight:300;
  letter-spacing:0;font-size:clamp(2rem,5vw,3.6rem);line-height:1.06;
  color:var(--offwhite);
}

/* ---- horizontal video wall ---- */
#dw .wall__scroll{
  position:relative;z-index:3;
  display:flex;gap:26px;
  overflow-x:auto;overflow-y:visible;
  padding:60px clamp(24px,6vw,90px) 80px;
  scroll-snap-type:x mandatory;
  perspective:1200px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:var(--gray-1) transparent;
}
#dw .wall__scroll::-webkit-scrollbar{height:6px}
#dw .wall__scroll::-webkit-scrollbar-thumb{background:var(--gray-1);border-radius:3px}
#dw .card{
  position:relative;flex:0 0 auto;
  width:clamp(210px,26vw,300px);
  aspect-ratio:4/5;
  scroll-snap-align:center;
  border-radius:8px;overflow:hidden;cursor:pointer;
  transform-style:preserve-3d;
  transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s,z-index 0s;
  box-shadow:0 18px 50px -20px rgba(0,0,0,.75),0 0 0 1px rgba(242,240,232,.12);
  background:#06121d;
}
#dw .card[data-ratio="9x16"]{aspect-ratio:9/16;width:clamp(170px,20vw,235px)}
#dw .card__media,#dw .card iframe,#dw .card video{
  position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;
}
#dw .card__poster{
  position:absolute;inset:0;
  background-color:#06121d;
  background-image:linear-gradient(160deg,#0d2a44,#061019);
  background-size:cover;background-position:center;background-repeat:no-repeat;
  transition:opacity .4s;z-index:2;
}
/* subtle darkening so the centered play button stays visible over the still */
#dw .card__poster::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 50%,rgba(11,11,10,.35),rgba(11,11,10,.15) 60%,transparent);
}
#dw .card__label{
  position:relative;z-index:3;width:100%;padding:16px 18px;
  font-family:var(--display);font-weight:500;letter-spacing:0;
  font-size:1.02rem;color:var(--offwhite);
  background:linear-gradient(to top,rgba(11,11,10,.85),transparent);
  pointer-events:none;transition:opacity .4s;
}
#dw .card__play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:3;width:52px;height:52px;border-radius:50%;
  background:rgba(11,11,10,.4);backdrop-filter:blur(4px);
  border:1px solid rgba(242,240,232,.5);
  display:flex;align-items:center;justify-content:center;
  transition:opacity .4s,transform .4s;pointer-events:none;
}
#dw .card__play svg{width:18px;height:18px;margin-left:2px;fill:var(--offwhite)}
/* hover / active: pop toward viewer in 3D and play */
#dw .wall__scroll:hover .card{opacity:.55;filter:saturate(.7)}
#dw .card.is-active{
  opacity:1 !important;filter:none !important;
  transform:translateZ(90px) scale(1.06);
  box-shadow:0 50px 120px -30px rgba(0,0,0,.9),0 0 0 1px rgba(242,240,232,.55);
  z-index:20;
}
#dw .card.is-active .card__poster{opacity:0}
#dw .card.is-active .card__play{opacity:0}
#dw .card.is-active .card__label{opacity:0}

/* ============ THE CO-OP ============ */
#dw .coop{
  position:relative;background:var(--black);
  padding:clamp(80px,12vh,150px) 0 clamp(80px,12vh,150px);
  border-bottom:1px solid rgba(242,240,232,.08);
}
#dw .coop__head{text-align:center;max-width:760px;margin:0 auto clamp(38px,6vh,64px);padding:0 24px}
#dw .coop__eyebrow{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;font-size:.72rem;color:var(--gray-1);margin-bottom:16px}
#dw .coop__title{font-family:var(--display);font-weight:300;font-size:clamp(2rem,5vw,3.6rem);line-height:1.06;color:var(--offwhite)}
#dw .coop__sub{margin-top:18px;color:var(--gray-1);font-size:16px;line-height:1.7;font-weight:300}

/* the row of vertical tiles */
#dw .coop__rack{
  display:flex;gap:10px;
  width:min(94vw,1400px);margin:0 auto;
  height:clamp(380px,58vh,560px);
}
#dw .coop__tile{
  position:relative;flex:1 1 0;min-width:0;
  border-radius:4px;overflow:hidden;cursor:pointer;
  background:#121211;
  border:1px solid rgba(242,240,232,.1);
  transition:flex-grow .55s cubic-bezier(.2,.7,.2,1), border-color .4s;
  display:block;
}
/* hover expands the tile, siblings compress */
#dw .coop__rack:hover .coop__tile{flex-grow:.7}
#dw .coop__rack .coop__tile:hover,
#dw .coop__rack .coop__tile:focus-visible{flex-grow:2.6;border-color:rgba(242,240,232,.3)}

#dw .coop__img{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  filter:grayscale(1) contrast(1.05);
  transition:filter .55s ease, transform .8s cubic-bezier(.2,.7,.2,1);
  transform:scale(1.02);
}
#dw .coop__tile:hover .coop__img{filter:grayscale(0);transform:scale(1)}
/* placeholder when no image supplied */
#dw .coop__img--empty{
  background-image:repeating-linear-gradient(115deg,#141413 0px,#141413 3px,#1a1a18 3px,#1a1a18 6px);
}
/* legibility scrim */
#dw .coop__tile::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(11,11,10,.92) 0%,rgba(11,11,10,.35) 45%,rgba(11,11,10,.15) 100%);
  pointer-events:none;transition:opacity .5s;
}
#dw .coop__tile:hover::after{opacity:.8}

#dw .coop__body{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:20px 18px;display:flex;flex-direction:column;gap:6px;
  pointer-events:none;
}
#dw .coop__num{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;color:var(--gray-1);
}
#dw .coop__name{
  font-family:var(--display);font-weight:300;font-size:clamp(1.1rem,1.6vw,1.5rem);
  color:var(--offwhite);line-height:1.1;white-space:nowrap;
}
#dw .coop__line{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--gray-2);white-space:nowrap;
  opacity:0;transform:translateY(6px);
  transition:opacity .45s ease .1s, transform .45s ease .1s;
}
#dw .coop__tile:hover .coop__line{opacity:1;transform:translateY(0)}
/* "enter" cue appears on hover for live tiles */
#dw .coop__enter{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--offwhite);margin-top:8px;
  opacity:0;transform:translateY(6px);
  transition:opacity .45s ease .16s, transform .45s ease .16s;
}
#dw .coop__tile:hover .coop__enter{opacity:1;transform:translateY(0)}

/* coming soon state */
#dw .coop__tile--soon{cursor:default}
#dw .coop__tile--soon .coop__img{filter:grayscale(1) brightness(.5)}
#dw .coop__tile--soon:hover .coop__img{filter:grayscale(1) brightness(.55);transform:scale(1.02)}
#dw .coop__soon{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gray-2);
}
#dw .coop__rack .coop__tile--soon:hover{flex-grow:1.2;border-color:rgba(242,240,232,.16)}

/* mobile: stack into a scrollable row of fixed-width tiles */
@media(max-width:860px){
  #dw .coop__rack{
    height:auto;overflow-x:auto;gap:12px;
    padding:0 20px;scroll-snap-type:x mandatory;
  }
  #dw .coop__tile{flex:0 0 auto;width:66vw;height:64vh;scroll-snap-align:center}
  #dw .coop__rack:hover .coop__tile{flex-grow:0}
  #dw .coop__rack .coop__tile:hover{flex-grow:0}
  #dw .coop__line,#dw .coop__enter{opacity:1;transform:none}
  #dw .coop__img{filter:grayscale(0)}
}

/* ============ MAP / SITE SELECTOR ============ */
#dw .map{
  position:relative;background:var(--void);
  padding:clamp(80px,12vh,160px) 0 clamp(70px,10vh,130px);
}
#dw .map__head{text-align:center;max-width:760px;margin:0 auto clamp(34px,5vh,60px);padding:0 24px}
#dw .map__eyebrow{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;font-size:.72rem;color:var(--gray-1);margin-bottom:16px}
#dw .map__title{font-family:var(--display);font-weight:300;letter-spacing:0;font-size:clamp(2rem,5vw,3.6rem);line-height:1.06;color:var(--offwhite)}
#dw .map__sub{margin-top:18px;color:var(--gray-1);font-size:16px;line-height:1.7;font-weight:300}
#dw .map__frame{
  position:relative;width:min(94vw,1400px);margin:0 auto;
  border-radius:10px;overflow:hidden;
  box-shadow:0 40px 120px -40px rgba(0,0,0,.9),0 0 0 1px rgba(242,240,232,.1);
}
#dw .map__img{width:100%;height:auto;display:block}
#dw .map__placeholder{
  width:100%;aspect-ratio:1977/1105;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:40px;
  background:
    radial-gradient(80% 60% at 50% 12%,#5a86b3,transparent 60%),
    linear-gradient(180deg,#7fa0c4 0%,#8a9a6f 46%,#6f7d4e 70%,#5a4632 100%);
  color:#1a2330;font-family:var(--display);
}
#dw .map__placeholder div{max-width:480px}
#dw .map__placeholder strong{display:block;font-family:var(--display);font-weight:300;font-size:1.4rem;letter-spacing:0;margin-bottom:12px}
#dw .map__placeholder span{font-family:var(--mono);font-weight:400;font-size:.8rem;line-height:1.6;letter-spacing:.02em;opacity:.85}

/* hotspots layer */
#dw .hotspots{position:absolute;inset:0;z-index:4}
#dw .hot{
  position:absolute;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;gap:8px;
  cursor:pointer;text-align:center;
}
#dw .hot__dot{
  width:16px;height:16px;border-radius:50%;
  background:var(--moss);
  box-shadow:0 0 0 0 rgba(74,79,69,.7);
  animation:dwpulse 2.6s ease-out infinite;
  transition:transform .3s;
  border:1px solid rgba(242,240,232,.55);
}
#dw .hot__ring{position:absolute;top:0;width:16px;height:16px;border-radius:50%;border:1px solid rgba(242,240,232,.4);opacity:.5}
@keyframes dwpulse{
  0%{box-shadow:0 0 0 0 rgba(74,79,69,.6)}
  70%{box-shadow:0 0 0 16px rgba(74,79,69,0)}
  100%{box-shadow:0 0 0 0 rgba(74,79,69,0)}
}
#dw .hot__label{
  font-family:var(--mono);font-weight:400;font-size:.72rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--offwhite);white-space:nowrap;
  padding:6px 12px;border-radius:2px;
  background:rgba(11,11,10,.78);backdrop-filter:blur(6px);
  border:1px solid rgba(242,240,232,.28);
  opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s;
}
#dw .hot__kind{display:block;font-family:var(--mono);font-weight:400;font-size:.6rem;letter-spacing:.08em;color:var(--gray-1);margin-top:3px}
#dw .hot:hover .hot__dot,#dw .hot:focus-visible .hot__dot{transform:scale(1.35)}
#dw .hot:hover .hot__label,#dw .hot:focus-visible .hot__label{opacity:1;transform:translateY(0)}
#dw .hot--village .hot__dot{background:var(--offwhite);border-color:rgba(74,79,69,.6);box-shadow:0 0 0 0 rgba(242,240,232,.6);animation-name:dwpulseW}
@keyframes dwpulseW{0%{box-shadow:0 0 0 0 rgba(242,240,232,.5)}70%{box-shadow:0 0 0 14px rgba(242,240,232,0)}100%{box-shadow:0 0 0 0 rgba(242,240,232,0)}}

/* map legend for mobile (hotspots become a list under the map) */
#dw .map__legend{display:none;flex-wrap:wrap;gap:10px;justify-content:center;margin:26px auto 0;max-width:900px;padding:0 24px}
#dw .map__legend a{font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;padding:11px 16px;border-radius:2px;border:1px solid rgba(242,240,232,.28);color:var(--offwhite);background:transparent}
#dw .map__legend a:hover{border-color:var(--moss);background:rgba(74,79,69,.25)}

/* ============ FOOTER ============ */
#dw .foot{
  position:relative;background:var(--black);color:var(--offwhite);
  padding:clamp(70px,10vh,120px) clamp(24px,8vw,90px) 60px;
  border-top:1px solid rgba(242,240,232,.08);
}
#dw .foot__grid{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:start;
}
#dw .foot__brand{font-family:var(--display);font-weight:300;letter-spacing:0;font-size:1.6rem;margin-bottom:20px;color:var(--offwhite)}
#dw .foot__brand small{display:block;font-family:var(--mono);font-weight:400;letter-spacing:.08em;text-transform:uppercase;font-size:.66rem;color:var(--gray-1);margin-top:10px}
#dw .foot__join p{color:var(--gray-1);font-size:16px;line-height:1.7;font-weight:300;margin-bottom:22px;max-width:440px}
#dw .foot__form{display:flex;gap:10px;max-width:460px}
#dw .foot__form input{
  flex:1;background:transparent;border:1px solid rgba(242,240,232,.28);
  color:var(--offwhite);padding:14px 16px;border-radius:2px;font-family:var(--mono);font-size:.86rem;
}
#dw .foot__form input::placeholder{color:var(--gray-2);text-transform:uppercase;letter-spacing:.05em;font-size:.78rem}
#dw .foot__form input:focus{outline:none;border-color:var(--moss)}
#dw .foot__form button{
  background:transparent;color:var(--offwhite);border:1px solid rgba(242,240,232,.35);
  padding:0 24px;border-radius:2px;
  font-family:var(--mono);font-weight:400;letter-spacing:.05em;text-transform:uppercase;
  font-size:.78rem;cursor:pointer;transition:border-color .25s,background .25s;
}
#dw .foot__form button:hover{border-color:var(--moss);background:rgba(74,79,69,.25)}
#dw .foot__msg{font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;color:var(--gray-1);margin-top:12px;min-height:1em}
#dw .foot__links{display:flex;flex-direction:column;gap:16px}
#dw .foot__links h4{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;font-size:.68rem;color:var(--gray-2);margin-bottom:6px}
#dw .foot__social{display:flex;gap:12px;flex-wrap:wrap}
#dw .foot__social a{
  display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--offwhite);
  padding:11px 14px;border:1px solid rgba(242,240,232,.2);border-radius:2px;transition:.25s;
}
#dw .foot__social a:hover{border-color:var(--moss);background:rgba(74,79,69,.25)}
#dw .foot__social svg{width:16px;height:16px;fill:currentColor}
#dw .foot__partners{margin-top:30px}
#dw .foot__partners a{font-family:var(--mono);color:var(--gray-1);font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid rgba(74,79,69,.6);padding-bottom:3px;transition:color .25s}
#dw .foot__partners a:hover{color:var(--offwhite)}
/* giant wordmark echoing the storyboard footer */
#dw .foot__word{max-width:1200px;margin:60px auto 0;font-family:var(--ultra);font-weight:900;font-size:clamp(40px,11.5vw,150px);letter-spacing:.02em;line-height:.9;color:var(--offwhite);white-space:nowrap;overflow:hidden}
#dw .foot__base{max-width:1200px;margin:36px auto 0;padding-top:26px;border-top:1px solid rgba(242,240,232,.08);display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;color:var(--gray-2);font-family:var(--mono);font-size:.7rem;letter-spacing:.05em;text-transform:uppercase}

/* ============ RESPONSIVE ============ */
@media(max-width:820px){
  #dw .foot__grid{grid-template-columns:1fr;gap:44px}
  #dw .hotspots{display:none}
  #dw .map__legend{display:flex}
}
@media(prefers-reduced-motion:reduce){
  #dw *{animation:none !important;transition:none !important}
  #dw .hero__stage{transform:none !important}
}