/* self-hosted fonts (OFL): Archivo, Big Shoulders Display */
@font-face{font-family:'Archivo';font-style:normal;font-weight:400 600;font-display:swap;src:url('assets/fonts/archivo-variable-latin.woff2') format('woff2-variations'),url('assets/fonts/archivo-variable-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Big Shoulders Display';font-style:normal;font-weight:700 900;font-display:swap;src:url('assets/fonts/big-shoulders-display-variable-latin.woff2') format('woff2-variations'),url('assets/fonts/big-shoulders-display-variable-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* ==========================================================================
   Alignment Private Club — shared stylesheet
   Direction B "Mat Grain". Black and white only. No colour anywhere.
   Extracted from mockups/b-mat-grain.html and generalised for six pages.
   ========================================================================== */

/* ---------- tokens ---------- */
:root{
  --ink:#000;
  --paper:#fff;
  --dim-on-ink:#a6a6a6;          /* 8.6:1 on black */
  --dim-on-paper:#565656;        /* 7.3:1 on white */
  --rule-on-ink:rgba(255,255,255,.26);
  --rule-on-paper:rgba(0,0,0,.22);

  --display:"Big Shoulders Display","Anton",Impact,Haettenschweiler,"Arial Narrow",sans-serif;
  --text:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;

  --gutter:clamp(1rem,5vw,5rem);
  --band-pad:clamp(4.25rem,11vw,8.5rem);
  --maxw:1320px;

  --d-xxl:clamp(4rem,12vw,9rem);
  --d-xl:clamp(2.6rem,7vw,5.25rem);
  --d-lg:clamp(1.9rem,4.6vw,3.4rem);
  --d-md:clamp(1.5rem,4vw,2.5rem);
  --d-sm:clamp(1rem,1.5vw,1.15rem);

  --t-lg:clamp(1.05rem,1.55vw,1.3rem);
  --t-md:1rem;
  --t-sm:.875rem;
  --t-xs:.8125rem;

  --grain:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23g)'/%3E%3C/svg%3E");
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%;color-scheme:dark;scrollbar-color:#4a4a4a var(--ink)}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--text);
  font-size:var(--t-md);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
h1,h2,h3,p,figure{margin:0}
ul{margin:0;padding:0;list-style:none}
a{color:inherit}

::selection{background:#fff;color:#000}
.band--paper ::selection{background:#000;color:#fff}

:where(a,button,summary):focus-visible{
  outline:3px solid currentColor;
  outline-offset:4px;
}

.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ---------- bands + grain ---------- */
.band{position:relative;isolation:isolate}
.band::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--grain);
  background-size:180px 180px;
  pointer-events:none;
  z-index:2;
}
.band > *{position:relative;z-index:1}
.band--ink{background:var(--ink);color:var(--paper)}
.band--ink::after{mix-blend-mode:screen;opacity:.15}
.band--paper{background:var(--paper);color:var(--ink)}
.band--paper::after{mix-blend-mode:multiply;opacity:.12}
.band--heavy::after{opacity:.24}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--band-pad)}

/* ---------- shared type ---------- */
.h1{
  font-family:var(--display);
  text-transform:uppercase;
  font-weight:900;
  font-size:var(--d-xxl);
  line-height:.82;
  letter-spacing:.005em;
  max-width:14ch;
}
.h2{
  font-family:var(--display);
  text-transform:uppercase;
  font-weight:900;
  font-size:var(--d-xl);
  line-height:.84;
  letter-spacing:.005em;
  max-width:16ch;
}
.h3{
  font-family:var(--display);
  text-transform:uppercase;
  font-weight:800;
  font-size:var(--d-lg);
  line-height:.9;
  letter-spacing:.005em;
}
.h2note{margin-top:1.1rem;max-width:46ch;font-size:var(--t-lg);line-height:1.5}
.band--ink .h2note{color:var(--dim-on-ink)}
.band--paper .h2note{color:var(--dim-on-paper)}

.note{font-size:var(--t-sm);line-height:1.6}
.band--ink .note{color:var(--dim-on-ink)}
.band--paper .note{color:var(--dim-on-paper)}
.note--after{margin-top:1.6rem}

.btn{
  display:inline-block;
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:var(--d-sm);
  line-height:1;
  padding:.95rem 1.65rem .8rem;
  border:2px solid;
  text-decoration:none;
  transition:background-color .18s ease,color .18s ease;
}
.band--ink .btn{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.band--ink .btn:hover{background:transparent;color:var(--paper)}
.band--paper .btn{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.band--paper .btn:hover{background:transparent;color:var(--ink)}
.btn--after{margin-top:clamp(2rem,4vw,3rem)}
.band--ink .btn:focus-visible{outline-color:var(--paper)}
.band--paper .btn:focus-visible{outline-color:var(--ink)}

.tlink{text-decoration:underline;text-underline-offset:.28em;text-decoration-thickness:1px}
.tlink:hover{text-decoration-thickness:2px}

/* ---------- nav ---------- */
/* Nav: emblem pinned left, Instagram pinned right, links centred between them.
   Desktop: one row. Tablet: one row, tighter. Phone: two centred rows. */
.nav{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1.15rem calc(var(--gutter) + 3.25rem);
  max-width:var(--maxw);
  margin-inline:auto;
  width:100%;
}
.nav__mark{position:absolute;left:var(--gutter);top:50%;transform:translateY(-50%);display:block;line-height:0}
.nav__mark img{width:30px;height:30px;display:block}
.nav__links{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:.5rem clamp(.85rem,2.2vw,1.9rem);
  margin:0;
  padding:0;
  list-style:none;
  font-family:var(--display);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-size:1.0625rem;
  line-height:1;
}
.nav__links a{text-decoration:none;display:inline-block;padding-block:.2rem}
.nav__links a:hover{text-decoration:underline;text-underline-offset:.3em}
/* current page: white underline, always visible */
.nav__links a[aria-current="page"]{
  text-decoration:underline;
  text-decoration-color:var(--paper);
  text-underline-offset:.3em;
  text-decoration-thickness:2px;
  font-weight:900;
}
/* the Instagram item leaves the flow and pins to the right edge */
.nav__links li:has(> .nav__ig){position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);margin:0}
.nav__ig{display:flex;align-items:center}
.nav__ig svg{width:19px;height:19px;display:block}
.nav__break{display:none}

/* ---------- page head (secondary pages) ---------- */
.pagehead .wrap{padding-block:clamp(2.5rem,7vw,5rem) clamp(2.75rem,8vw,5.5rem)}

/* ---------- hero (index only) ---------- */
.hero{display:flex;flex-direction:column;min-height:100vh;min-height:100svh}
.hero__mid{flex:1 1 auto;display:flex;align-items:center;padding-block:clamp(1.5rem,4vh,3rem)}
.lockup{
  position:relative;
  width:100%;
  aspect-ratio:2.53 / 1;
  overflow:hidden;
}
.lockup img{
  position:absolute;
  width:109.9%;
  height:auto;
  left:-6.04%;
  top:-52.7%;
  max-width:none;
}
.hero__foot{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  gap:2rem;
  padding:0 var(--gutter) clamp(2.25rem,5vh,3.5rem);
  max-width:var(--maxw);
  margin-inline:auto;
  width:100%;
}
.hero__line{font-size:var(--t-lg);line-height:1.45;max-width:30ch}
.hero__line span{display:block;color:var(--dim-on-ink)}

/* ---------- marquee (index only) ---------- */
.marquee{
  overflow:hidden;
  border-block:2px solid var(--ink);
  padding-block:.7rem .55rem;
}
.marquee__track{
  display:flex;
  width:max-content;
  animation:slide 34s linear infinite;
}
.marquee__set{
  display:flex;
  flex:0 0 auto;
  align-items:baseline;
  gap:clamp(1rem,2.5vw,2rem);
  padding-right:clamp(1rem,2.5vw,2rem);
  font-family:var(--display);
  font-weight:900;
  text-transform:uppercase;
  font-size:var(--d-md);
  line-height:1;
  letter-spacing:.01em;
  white-space:nowrap;
}
.marquee__set i{font-style:normal;opacity:.45}
@keyframes slide{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* ---------- landing (index only) ---------- */
/* The hero and the marquee share the first screen; the footer follows. */
.landing{display:flex;flex-direction:column;min-height:100vh;min-height:100svh}
.landing .hero{flex:1 0 auto;min-height:0}

/* bottom-left: the line, the mission, the place */
.hero__copy{display:grid;gap:.9rem;max-width:44ch}
.hero__copy .hero__line{max-width:32ch;font-weight:500;color:var(--paper);text-wrap:balance}
.hero__mission{font-size:var(--t-md);line-height:1.65;color:var(--dim-on-ink);text-wrap:pretty}
.hero__place{
  display:flex;
  align-items:center;
  gap:.8rem;
  margin-top:.3rem;
  font-family:var(--display);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.9rem;
  line-height:1;
}
.hero__place::before{content:"";flex:0 0 2rem;height:2px;background:currentColor}
.hero__copy .notice{margin:0 0 .5rem}

/* short phones: tighten so the marquee still sits on the first screen */
@media (max-width:640px) and (max-height:760px){
  .landing .hero__mid{padding-block:.5rem}
  .landing .hero__emblem{width:52px;margin:.75rem auto 1rem}
  .landing .hero__foot{gap:1rem;padding-bottom:1.25rem}
  .landing .hero__copy{gap:.6rem}
}

/* ---------- ruled list (disciplines, day lists) ---------- */
.disc{margin-top:clamp(2.5rem,5vw,4rem)}
.band--ink .disc{border-bottom:1px solid var(--rule-on-ink)}
.band--paper .disc{border-bottom:1px solid var(--rule-on-paper)}
.disc li{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:.4rem clamp(1.5rem,4vw,3.5rem);
  align-items:baseline;
  padding-block:clamp(1.25rem,2.4vw,1.9rem);
}
.band--ink .disc li{border-top:1px solid var(--rule-on-ink)}
.band--paper .disc li{border-top:1px solid var(--rule-on-paper)}
.disc__name{
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  font-size:var(--d-lg);
  line-height:.9;
  letter-spacing:.005em;
}
.disc__note{font-size:var(--t-md);line-height:1.5;max-width:44ch}
.band--ink .disc__note{color:var(--dim-on-ink)}
.band--paper .disc__note{color:var(--dim-on-paper)}

/* closures / holidays notice — rendered only when set in the admin */
.notice{margin-top:1.4rem;padding:.9rem 1.1rem;border:2px solid currentColor;font-size:var(--t-md);line-height:1.5;max-width:60ch}
.notice__label{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-right:.6em}
.pagehead .notice{margin-top:1.6rem}
.sched__note{margin-top:1.6rem;font-size:var(--t-sm)}
.band--paper .sched__note{color:var(--dim-on-paper)}
.band--ink .sched__note{color:var(--dim-on-ink)}

/* ---------- weekly grid (schedule page) ---------- */
.week{
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  margin-top:clamp(2.5rem,5vw,4rem);
  border:1px solid;
}
.band--paper .week{background:var(--rule-on-paper);border-color:var(--rule-on-paper)}
.band--ink .week{background:var(--rule-on-ink);border-color:var(--rule-on-ink)}
.week__day{padding:clamp(1rem,2vw,1.25rem)}
.band--paper .week__day{background:var(--paper)}
.band--ink .week__day{background:var(--ink)}
.week__name{
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-size:1rem;
  line-height:1;
  margin-bottom:.9rem;
}
.week__slot + .week__slot{margin-top:1rem}
.week__time{
  font-family:var(--display);
  font-weight:900;
  font-size:1.5rem;
  line-height:.9;
  font-variant-numeric:tabular-nums lining-nums;
}
.week__time em{font-style:normal;font-size:.5em;letter-spacing:.1em;padding-left:.35em;vertical-align:.12em}
.week__class{font-size:var(--t-sm);font-weight:500}
.week__coach,.week__empty{font-size:var(--t-xs)}
.band--paper .week__coach,.band--paper .week__empty{color:var(--dim-on-paper)}
.band--ink .week__coach,.band--ink .week__empty{color:var(--dim-on-ink)}
@media (min-width:1024px){
  .week{grid-template-columns:repeat(7,minmax(0,1fr))}
}

/* ---------- rates / oversized figures ---------- */
.rates{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));
  gap:clamp(2.5rem,5vw,4.5rem);
  margin-top:clamp(2.5rem,5vw,4rem);
}
.rate{padding-top:1.4rem;border-top:2px solid}
.band--ink .rate{border-color:var(--paper)}
.band--paper .rate{border-color:var(--ink)}
.rate__fig{font-family:var(--display);font-weight:900;font-size:var(--d-xxl);line-height:.8;letter-spacing:-.01em;padding-top:.14em}
.rate__per{
  font-family:var(--display);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.11em;
  font-size:1rem;
  margin-top:.9rem;
}
.rate__what{margin-top:.85rem;max-width:32ch;line-height:1.55}
.band--ink .rate__what{color:var(--dim-on-ink)}
.band--paper .rate__what{color:var(--dim-on-paper)}

/* ---------- PHOTO stand-in ---------- */
.photo{
  position:relative;
  display:flex;
  align-items:flex-end;
  aspect-ratio:4 / 5;
  overflow:hidden;
  isolation:isolate;
  border:1px solid;
  background-image:linear-gradient(155deg,#303030 0%,#101010 48%,#232323 100%);
}
.photo--wide{aspect-ratio:3 / 2}
.photo--square{aspect-ratio:1 / 1}
.photo::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--grain);
  background-size:180px 180px;
  mix-blend-mode:screen;
  opacity:.26;
  pointer-events:none;
}
.band--ink .photo{border-color:var(--rule-on-ink)}
.band--paper .photo{
  border-color:var(--rule-on-paper);
  background-image:linear-gradient(155deg,#d2d2d2 0%,#f0f0f0 48%,#c9c9c9 100%);
}
.band--paper .photo::after{mix-blend-mode:multiply;opacity:.2}
.photo__label{
  position:relative;
  z-index:1;
  margin:0 0 .85rem .9rem;
  font-family:var(--text);
  font-weight:500;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.22em;
  color:var(--dim-on-ink);
}
.band--paper .photo__label{color:var(--dim-on-paper)}

/* ---------- card grid (merch, coaches) ---------- */
.cards{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1.5rem,3.5vw,2.75rem) clamp(1rem,2.5vw,2rem);
  margin-top:clamp(2.5rem,5vw,4rem);
}
.cards--wide{grid-template-columns:1fr}
.card__name{
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  font-size:clamp(1.35rem,2.6vw,2rem);
  line-height:1;
  letter-spacing:.02em;
  margin-top:1rem;
}
.card__note{margin-top:.4rem;font-size:var(--t-sm);line-height:1.5}
.band--ink .card__note{color:var(--dim-on-ink)}
.band--paper .card__note{color:var(--dim-on-paper)}
@media (min-width:900px){
  .cards{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cards--wide{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---------- where / address ---------- */
.where{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(2.5rem,5vw,4.5rem);
  align-items:end;
  margin-top:clamp(2.5rem,5vw,4rem);
}
.addr{font-style:normal}
.addr b{
  display:block;
  font-family:var(--display);
  font-weight:900;
  text-transform:uppercase;
  font-size:var(--d-lg);
  line-height:.92;
  letter-spacing:.005em;
}
.addr b + b{margin-top:.15rem}
.where__ask{max-width:38ch}
.where__ask p{margin-bottom:1.5rem}
.band--paper .where__ask p{color:var(--dim-on-paper)}
.band--ink .where__ask p{color:var(--dim-on-ink)}

/* ---------- footer ---------- */
.foot{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:1.5rem clamp(1.5rem,4vw,3rem);
  align-items:start;
  padding-block:clamp(3rem,6vw,4.5rem);
}
.foot > img{width:46px;height:46px}
.foot__cols{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));
  gap:1.25rem clamp(1.5rem,4vw,3rem);
  font-size:var(--t-sm);
  line-height:1.65;
}
.foot__name{
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:1.15rem;
  line-height:1.1;
}
.foot__cols p{color:var(--dim-on-ink)}
.foot__cols .foot__name,.foot__cols a{color:var(--paper)}
.foot__nav{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid var(--rule-on-ink)}
.foot__nav a{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.07em;font-size:.95rem;color:var(--dim-on-ink);text-decoration:none}
.foot__nav a:hover,.foot__nav a:focus-visible{color:var(--paper);text-decoration:underline;text-underline-offset:.2em}

/* ---------- responsive ---------- */
@media (max-width:860px){
  .where{grid-template-columns:1fr;align-items:start}
  .disc li{grid-template-columns:1fr}
}

@media (max-width:640px){
  .hero__mid{padding-inline:.85rem}
  .hero__foot{gap:1.5rem}
  .hero__line{max-width:none}


  .foot{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  .marquee__track{animation:none}
  .marquee{overflow-x:auto}
  *{transition-duration:.01ms !important}
}


/* ---------- Instagram section ---------- */

.ig-head{margin-top:clamp(2.5rem,5vw,4rem)}
.ig-head + .note--after{margin-top:.9rem}
.ig-grid{display:grid;gap:1.25rem;margin-top:2.5rem}
.band--paper .ig-post{background:transparent}
.band--paper .instagram-media{border-color:var(--rule-on-paper) !important}
@media (min-width:640px){.ig-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.ig-grid{grid-template-columns:repeat(3,1fr)}}

.ig-post{filter:grayscale(1);background:#000;min-height:24rem}
.ig-post--empty{
  min-height:0;
  aspect-ratio:4 / 5;
  display:grid;
  grid-template-rows:1fr auto;
}
.ig-post--empty .photo{aspect-ratio:auto;height:100%}
.ig-post--empty .card__note{padding:.55rem .1rem 0}

.instagram-media{
  margin:0 !important;
  max-width:100% !important;
  min-width:0 !important;
  width:100% !important;
  border:1px solid var(--rule-on-ink) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}


/* ---------- nav CTA (first class) ---------- */

.nav__links a.nav__cta{
  border:1px solid currentColor;
  padding:.4rem .7rem .34rem;
  text-decoration:none;
}
.nav__links a.nav__cta:hover,
.nav__links a.nav__cta[aria-current="page"]{
  background:var(--paper);
  color:var(--ink);
  text-decoration:none;
}

/* ---------- hero emblem (index only) ---------- */

.hero__mid{flex-direction:column;justify-content:center}
.hero__emblem{
  width:clamp(72px,9vw,120px);
  height:auto;
  margin:1.5rem auto 2rem;
  opacity:.95;
}

/* ---------- numbered steps (first class) ---------- */

.step__num{
  font-family:var(--display);
  font-weight:900;
  font-size:var(--d-xl);
  line-height:.8;
  letter-spacing:-.01em;
}
.steps article{padding-top:1.4rem;border-top:2px solid}
.band--ink .steps article{border-color:var(--paper)}
.band--paper .steps article{border-color:var(--ink)}
.steps .card__name{margin-top:.55rem}

/* one-column ruled list (what to bring) */
.disc--plain li{grid-template-columns:minmax(0,1fr)}
.disc--plain .disc__name{font-size:var(--d-md)}

/* ---------- text beside a photo (kids) ---------- */

.split{
  display:grid;
  gap:clamp(2rem,4vw,3rem);
  margin-top:clamp(2rem,4vw,3rem);
  align-items:start;
}
@media (min-width:900px){
  .split{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
}
.split .h2note{margin-top:0}

.ages{margin-top:1.6rem;font-size:var(--t-sm)}
.ages__label{
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-right:.6em;
}

.deets{margin:1.8rem 0 0}
.band--ink .deets{border-bottom:1px solid var(--rule-on-ink)}
.band--paper .deets{border-bottom:1px solid var(--rule-on-paper)}
.deets__row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,2fr);
  gap:.35rem clamp(1rem,3vw,2.5rem);
  align-items:baseline;
  padding-block:.95rem;
}
.band--ink .deets__row{border-top:1px solid var(--rule-on-ink)}
.band--paper .deets__row{border-top:1px solid var(--rule-on-paper)}
.deets dt{
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:1rem;
  line-height:1.2;
}
.deets dd{margin:0;font-size:var(--t-md);line-height:1.5}
.band--ink .deets dd{color:var(--dim-on-ink)}
.band--paper .deets dd{color:var(--dim-on-paper)}

/* ---------- testimonials ---------- */

.quotes{display:grid;gap:clamp(1.75rem,3.5vw,2.75rem);margin-top:clamp(2.5rem,5vw,4rem)}
.wrap > .quotes:first-child{margin-top:0}
@media (min-width:900px){
  .quotes{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.quote{padding-top:1.2rem;border-top:2px solid}
.band--ink .quote{border-color:var(--paper)}
.band--paper .quote{border-color:var(--ink)}
.quote__mark{
  display:block;
  font-family:var(--display);
  font-weight:900;
  font-size:var(--d-xl);
  line-height:.62;
  height:.42em;
}
.quote__text{margin:.7rem 0 0;font-size:var(--t-lg);line-height:1.5}
.quote__by{margin-top:1.3rem}
.quote__name{
  display:block;
  font-family:var(--display);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:1.05rem;
  line-height:1.1;
}
.quote__detail{display:block;margin-top:.3rem;font-size:var(--t-xs)}
.band--ink .quote__detail{color:var(--dim-on-ink)}
.band--paper .quote__detail{color:var(--dim-on-paper)}

/* tablet: one tighter row */
@media (min-width:641px) and (max-width:900px){
  .nav{padding-inline:calc(var(--gutter) + 2.75rem)}
  .nav__links{gap:.5rem .9rem;font-size:.95rem;letter-spacing:.06em}
  .nav__links a.nav__cta{padding:.3rem .55rem}
}
/* phone: row one = emblem, four links centred, Instagram; row two = four links centred */
@media (max-width:640px){
  .nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.6rem .55rem;padding:1rem var(--gutter) .85rem}
  .nav__mark{position:static;transform:none;order:0;margin-right:auto}
  .nav__mark img{width:24px;height:24px}
  .nav__links{display:contents}
  .nav__links li{order:1}
  .nav__links li:has(> .nav__ig){position:static;transform:none;order:2;margin-left:auto}
  .nav__links li.nav__break{display:block;order:3;flex-basis:100%;height:0;margin:0}
  .nav__links li:nth-child(n+6):nth-child(-n+9){order:4}
  .nav__links a{font-size:.86rem;letter-spacing:.02em}
  .nav__links a.nav__cta{padding:.22rem .45rem}
  .nav__ig svg{width:18px;height:18px}
}
@media (min-width:900px){ .split .photo{aspect-ratio:1 / 1} }

/* desktop: centred nav, lockup capped so the hero fits one screen */
@media (min-width:901px){
  .lockup{width:min(100%,60vw,max(26rem,calc((100svh - 37rem) * 2.53)));margin-inline:auto}
  .hero__mid{padding-block:clamp(1rem,2.5vh,2rem)}
}
/* contact map: Google embed, kept black and white */
.map{margin:2.5rem 0 0}
.map iframe{display:block;width:100%;aspect-ratio:16 / 9;min-height:280px;border:1px solid var(--rule-on-ink);filter:grayscale(1) contrast(1.05);background:#111}
@media (max-width:640px){ .map iframe{aspect-ratio:4 / 3} }
