/* ==========================================================================
   Avocet Design Build - homepage concept
   Design language: Nordic Minimal (type, spacing, composition, motion only)
   Palette: Avocet's own Wix theme variables + logo mark green
   ========================================================================== */

:root{
  /* --- Avocet brand colors (source: their site's own theme variables) --- */
  --cream:        #f6f2ee;   /* their --color_11, the site background */
  --paper:        #fdfbf9;   /* cream lightened for band alternation */
  --greige:       #b8b7a3;   /* their --color_12 */
  --ochre:        #dca15d;   /* their --color_13 */
  --sage:         #66785f;   /* their --color_14, matches the logo mark green */
  --bronze:       #bb6c25;   /* their --color_15 */

  /* --- deepened / lightened within family for contrast --- */
  --ink:          #1a1f18;   /* their sage deepened to near black for dark bands */
  --ink-2:        #232a20;
  --sage-deep:    #45523f;   /* 7.45:1 on cream */
  --sage-btn:     #4f5c49;   /* 6.37:1 under cream text */
  --bronze-deep:  #8f5119;   /* 5.61:1 on cream */
  --sage-light:   #a8b0a2;   /* 7.50:1 on ink */

  /* --- text --- */
  --text-dark:        #1a1f18;
  --text-body:        #4a5247;
  --text-muted:       #5a6356;
  --text-light:       #f6f2ee;
  --text-light-muted: #c9ccc4;

  /* --- hairlines --- */
  --rule-light:  rgba(26,31,24,0.16);
  --rule-faint:  rgba(26,31,24,0.09);
  --rule-dark:   rgba(246,242,238,0.22);
  --rule-dark-faint: rgba(246,242,238,0.12);

  /* --- type --- */
  --font-display: "Familjen Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Literata", Georgia, "Times New Roman", serif;

  /* --- layout (percentage + cap, never bare px) --- */
  --wrap:        min(92%, 1240px);
  --wrap-mid:    min(92%, 980px);
  --wrap-narrow: min(92%, 720px);
  --gutter:      clamp(1.5rem, 6vw, 6rem);
  --band:        clamp(4.5rem, 9vw, 8rem);
  --nav-h:       76px;

  /* --- motion (Nordic Minimal: subtle, quick, fade only) --- */
  --ease:  cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

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

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--cream);
  color:var(--text-body);
  font-family:var(--font-body);
  font-size:clamp(1rem, 0.96rem + 0.2vw, 1.075rem);
  font-weight:300;
  line-height:1.72;
  letter-spacing:0.002em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:inherit; }

h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--text-dark);
  font-weight:500;
  letter-spacing:-0.021em;
  line-height:1.08;
  margin:0;
  text-wrap:balance;
}

p{ margin:0 0 1.15em; }
p:last-child{ margin-bottom:0; }

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

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

/* --------------------------------------------------------------- helpers */

.wrap{ width:var(--wrap); margin-inline:auto; }
.wrap-mid{ width:var(--wrap-mid); margin-inline:auto; }
.wrap-narrow{ width:var(--wrap-narrow); margin-inline:auto; }

.band{ padding-block:var(--band); position:relative; }
.band--cream{ background:var(--cream); }
.band--paper{ background:var(--paper); }
.band--ink{ background:var(--ink); color:var(--text-light-muted); }
.band--ink h1,.band--ink h2,.band--ink h3,.band--ink h4{ color:var(--text-light); }

.eyebrow{
  font-family:var(--font-display);
  font-size:0.72rem;
  font-weight:500;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--eyebrow-color, var(--bronze-deep));
  margin:0 0 1.4rem;
  display:flex;
  align-items:center;
  gap:0.85rem;
}
.eyebrow::after{
  content:"";
  flex:1 1 auto;
  height:1px;
  background:var(--eyebrow-rule, var(--rule-light));
  max-width:5rem;
}
.band--ink{ --eyebrow-color:var(--ochre); --eyebrow-rule:var(--rule-dark); }

.h-xl{ font-size:clamp(2.45rem, 1.15rem + 4.35vw, 4.5rem); }
.h-lg{ font-size:clamp(1.95rem, 1.2rem + 2.5vw, 3.1rem); }
.h-md{ font-size:clamp(1.5rem, 1.15rem + 1.2vw, 2.05rem); }
.h-sm{ font-size:clamp(1.12rem, 1.02rem + 0.4vw, 1.32rem); letter-spacing:-0.012em; }

.lede{
  font-size:clamp(1.06rem, 1rem + 0.42vw, 1.28rem);
  line-height:1.62;
  color:var(--text-body);
}
.band--ink .lede{ color:var(--text-light-muted); }

.muted{ color:var(--text-muted); }
.band--ink .muted{ color:var(--text-light-muted); }

/* draw-in hairline, the page's recurring structural mark */
.hrule{
  height:1px;
  background:var(--rule-light);
  transform-origin:left center;
  border:0;
  margin:0;
}
.band--ink .hrule{ background:var(--rule-dark); }

/* --------------------------------------------------------------- buttons */

.btn{
  display:inline-flex;
  align-items:center;
  gap:0.7rem;
  font-family:var(--font-display);
  font-size:0.83rem;
  font-weight:500;
  letter-spacing:0.09em;
  text-transform:uppercase;
  text-decoration:none;
  padding:1.05rem 1.6rem;
  min-height:48px;
  border:1px solid transparent;
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn__arrow{ width:16px; height:8px; flex:0 0 auto; display:block; }
.btn__arrow line, .btn__arrow polyline{ transition:transform .3s var(--ease); }
.btn:hover .btn__arrow{ transform:translateX(3px); }

.btn--solid{ background:var(--sage-btn); color:var(--cream); }
.btn--solid:hover{ background:var(--sage-deep); }

.btn--ochre{ background:var(--ochre); color:var(--ink); }
.btn--ochre:hover{ background:#e9b478; }

.btn--line{ border-color:var(--rule-light); color:var(--text-dark); background:transparent; }
.btn--line:hover{ border-color:var(--sage-deep); background:rgba(102,120,95,0.07); }

.band--ink .btn--line,
.hero .btn--line,
.err .btn--line{ border-color:rgba(246,242,238,0.42); color:var(--text-light); }
.band--ink .btn--line:hover,
.hero .btn--line:hover,
.err .btn--line:hover{ border-color:var(--ochre); background:rgba(220,161,93,0.12); }

.btn-row{ display:flex; flex-wrap:wrap; gap:0.85rem; }

.txtlink{
  font-family:var(--font-display);
  font-size:0.83rem;
  font-weight:500;
  letter-spacing:0.09em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--bronze-deep);
  border-bottom:1px solid rgba(143,81,25,0.35);
  padding-bottom:2px;
  transition:border-color .3s var(--ease);
}
.txtlink:hover{ border-color:var(--bronze-deep); }
.band--ink .txtlink{ color:var(--ochre); border-bottom-color:rgba(220,161,93,0.4); }
.band--ink .txtlink:hover{ border-bottom-color:var(--ochre); }

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

.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:120;
  height:var(--nav-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding-inline:var(--gutter);
  background:transparent;
  transition:background .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
/* scrim so nav type stays legible over the hero photograph */
.nav::before{
  content:"";
  position:absolute; inset:0 0 auto 0;
  height:calc(var(--nav-h) + 2.5rem);
  background:linear-gradient(to bottom, rgba(20,24,18,0.66) 0%, rgba(20,24,18,0.28) 55%, rgba(20,24,18,0) 100%);
  pointer-events:none;
  z-index:-1;
  transition:opacity .4s var(--ease);
}
.nav.is-solid::before{ opacity:0; }

.nav.is-solid{
  background:rgba(246,242,238,0.94);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom-color:var(--rule-faint);
}

.brand{ display:flex; align-items:center; gap:0.75rem; text-decoration:none; min-height:44px; padding-block:0.4rem; }
.brand__mark{ width:auto; height:19px; max-width:56px; object-fit:contain; }
.brand__mark--ink{ display:none; }
.nav.is-solid .brand__mark--cream{ display:none; }
.nav.is-solid .brand__mark--ink{ display:block; }
.brand__text{ display:flex; flex-direction:column; line-height:1; }
.brand__name{
  font-family:var(--font-display);
  font-size:1.06rem;
  font-weight:500;
  letter-spacing:0.13em;
  text-transform:lowercase;
  color:var(--cream);
  transition:color .4s var(--ease);
}
.brand__sub{
  font-family:var(--font-display);
  font-size:0.53rem;
  font-weight:500;
  letter-spacing:0.3em;
  text-transform:uppercase;
  color:rgba(246,242,238,0.72);
  margin-top:4px;
  transition:color .4s var(--ease);
}
.nav.is-solid .brand__name{ color:var(--ink); }
.nav.is-solid .brand__sub{ color:var(--text-muted); }

.nav__links{ display:flex; align-items:center; gap:2rem; }
.nav__link{
  font-family:var(--font-display);
  font-size:0.79rem;
  font-weight:500;
  letter-spacing:0.1em;
  text-transform:uppercase;
  text-decoration:none;
  color:rgba(246,242,238,0.88);
  transition:color .3s var(--ease);
}
.nav.is-solid .nav__link{ color:var(--text-body); }
.nav__link:hover{ color:var(--ochre); }
.nav.is-solid .nav__link:hover{ color:var(--bronze-deep); }

.nav__cta{
  font-family:var(--font-display);
  font-size:0.79rem;
  font-weight:500;
  letter-spacing:0.08em;
  text-decoration:none;
  color:var(--cream);
  background:rgba(20,24,18,0.5);
  border:1px solid rgba(246,242,238,0.5);
  padding:0.72rem 1.15rem;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.nav__cta:hover{ background:var(--ochre); border-color:var(--ochre); color:var(--ink); }
.nav.is-solid .nav__cta{ background:var(--sage-btn); border-color:var(--sage-btn); color:var(--cream); }
.nav.is-solid .nav__cta:hover{ background:var(--sage-deep); border-color:var(--sage-deep); }

.burger{
  display:none;
  width:48px; height:48px;
  align-items:center; justify-content:center;
  background:transparent; border:0; padding:0; cursor:pointer;
  position:relative; z-index:130;
}
.burger span{
  display:block; width:22px; height:1px; background:var(--cream);
  position:relative; transition:background .3s var(--ease), transform .3s var(--ease);
}
.burger span::before,.burger span::after{
  content:""; position:absolute; left:0; width:22px; height:1px; background:inherit;
  transition:transform .3s var(--ease), opacity .2s var(--ease);
}
.burger span::before{ top:-7px; }
.burger span::after{ top:7px; }
.nav.is-solid .burger span{ background:var(--ink); }
body.menu-open .burger span{ background:var(--cream); transform:rotate(45deg); }
body.menu-open .burger span::before{ transform:translateY(7px); opacity:0; }
body.menu-open .burger span::after{ transform:translateY(-7px) rotate(-90deg); }

/* ------------------------------------------------------------ mobile menu */

.menu{
  position:fixed; inset:0; z-index:115;
  background:var(--ink);
  display:flex; flex-direction:column; justify-content:center;
  padding:var(--nav-h) var(--gutter) 3rem;
  opacity:0; visibility:hidden;
  transition:opacity .35s var(--ease), visibility .35s var(--ease);
}
body.menu-open .menu{ opacity:1; visibility:visible; }
.menu__link{
  font-family:var(--font-display);
  font-size:clamp(1.7rem, 7vw, 2.4rem);
  font-weight:500;
  letter-spacing:-0.02em;
  color:var(--cream);
  text-decoration:none;
  padding-block:0.5rem;
  display:block;
  transition:color .3s var(--ease);
}
.menu__link:hover{ color:var(--ochre); }
.menu__foot{ margin-top:2.6rem; padding-top:1.6rem; border-top:1px solid var(--rule-dark); }
.menu__meta{ color:var(--text-light-muted); font-size:0.95rem; margin:0 0 0.9rem; }
.menu__meta a{ color:var(--ochre); text-decoration:none; }

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

.hero{
  position:relative;
  min-height:100svh;
  display:grid;
  grid-template-columns:minmax(0,1.03fr) minmax(0,0.97fr);
  background:var(--ink);
  color:var(--text-light-muted);
  isolation:isolate;
}
.hero__text{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:calc(var(--nav-h) + clamp(2.5rem,6vw,4.5rem)) clamp(1.5rem,4vw,4rem) clamp(3rem,6vw,4.5rem) var(--gutter);
}
.hero__loc{
  font-family:var(--font-display);
  font-size:0.71rem; font-weight:500;
  letter-spacing:0.2em; text-transform:uppercase;
  color:var(--ochre);
  display:flex; align-items:center; gap:0.8rem;
  margin:0 0 1.7rem;
}
.hero__loc::before{ content:""; width:2rem; height:1px; background:var(--ochre); flex:0 0 auto; }

.hero h1{
  color:var(--cream);
  font-size:clamp(2.35rem, 0.85rem + 4.05vw, 4.15rem);
  line-height:1.03;
  letter-spacing:-0.028em;
  margin:0 0 1.55rem;
  max-width:15ch;
}
.hero h1 em{ font-style:normal; color:var(--ochre); }

.hero__sub{
  font-size:clamp(1.02rem, 0.96rem + 0.4vw, 1.19rem);
  line-height:1.66;
  color:var(--text-light-muted);
  max-width:44ch;
  margin:0 0 2.2rem;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:0.85rem; margin-bottom:clamp(2.2rem,5vw,3.4rem); }

.hero__disciplines{
  display:flex; flex-wrap:wrap; gap:0 1.6rem;
  padding-top:1.4rem;
  border-top:1px solid var(--rule-dark-faint);
}
.hero__disciplines span{
  font-family:var(--font-display);
  font-size:0.71rem; font-weight:500;
  letter-spacing:0.16em; text-transform:uppercase;
  color:var(--sage-light);
  padding-block:0.35rem;
}

.hero__media{ position:relative; overflow:hidden; min-height:44vh; }
.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:55% 50%; }
.hero__media::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(to right, rgba(26,31,24,0.62) 0%, rgba(26,31,24,0.18) 30%, rgba(26,31,24,0) 52%);
  pointer-events:none;
}
.hero__tag{
  position:absolute; left:0; bottom:0; z-index:2;
  max-width:100%;
  background:rgba(26,31,24,0.86);
  color:var(--text-light-muted);
  font-family:var(--font-display);
  font-size:0.68rem; font-weight:500;
  letter-spacing:0.16em; text-transform:uppercase;
  padding:0.75rem 1.15rem;
}

/* ------------------------------------------------------- section spine */

.spine{
  position:fixed;
  left:1.65rem;
  top:0; bottom:0;
  width:2.6rem;
  z-index:60;
  display:none;
  pointer-events:none;
}
.spine__line{ position:absolute; inset:0 auto 0 0; width:1px; background:var(--rule-light); }
.spine__list{
  position:absolute; top:50%; left:0; transform:translateY(-50%);
  margin:0; padding:0; list-style:none;
  display:flex; flex-direction:column; gap:0.95rem;
}
.spine__item{
  font-family:var(--font-display);
  font-size:0.6rem; font-weight:500;
  letter-spacing:0.1em;
  font-variant-numeric:tabular-nums;
  color:var(--text-muted);
  opacity:0.35;
  padding-left:0.9rem;
  position:relative;
  transition:opacity .4s var(--ease), color .4s var(--ease);
  white-space:nowrap;
}
.spine__item::before{
  content:""; position:absolute; left:0; top:50%;
  width:0.5rem; height:1px; background:currentColor;
  transform:translateY(-50%) scaleX(0.35); transform-origin:left;
  transition:transform .4s var(--ease);
}
.spine__item.is-active{ opacity:1; color:var(--bronze-deep); }
.spine__item.is-active::before{ transform:translateY(-50%) scaleX(1); }
.spine.on-dark .spine__line{ background:var(--rule-dark); }
.spine.on-dark .spine__item{ color:var(--text-light-muted); }
.spine.on-dark .spine__item.is-active{ color:var(--ochre); }

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

.statement__grid{
  display:grid;
  grid-template-columns:minmax(0,0.95fr) minmax(0,1.05fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:start;
}
.statement__body p{ max-width:56ch; }

/* -------------------------------------------------------------- index */

.index__head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:end;
  margin-bottom:clamp(2.5rem,5vw,3.8rem);
}

.index__layout{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,0.92fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:start;
}

.index__list{ margin:0; padding:0; list-style:none; border-top:1px solid var(--rule-light); }
.index__row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:1.25rem;
  align-items:baseline;
  padding-block:1.15rem;
  border-bottom:1px solid var(--rule-light);
}
.index__num{
  font-family:var(--font-display);
  font-size:0.68rem; font-weight:500;
  letter-spacing:0.12em;
  color:var(--bronze-deep);
  font-variant-numeric:tabular-nums;
}
.index__text{
  font-family:var(--font-display);
  font-size:clamp(1.02rem, 0.95rem + 0.42vw, 1.28rem);
  font-weight:400;
  letter-spacing:-0.012em;
  line-height:1.34;
  color:var(--text-dark);
}
.index__aside{ position:sticky; top:calc(var(--nav-h) + 2rem); }
.index__aside img{ width:100%; aspect-ratio:3 / 4; object-fit:cover; }
.index__note{
  margin-top:1.15rem;
  padding-top:1.15rem;
  border-top:1px solid var(--rule-light);
  font-size:0.95rem;
  color:var(--text-muted);
}
.index__pull{
  margin-top:clamp(2.2rem,4vw,3rem);
  font-family:var(--font-display);
  font-size:clamp(1.35rem, 1.05rem + 1.1vw, 1.85rem);
  font-weight:400;
  line-height:1.28;
  letter-spacing:-0.018em;
  color:var(--sage-deep);
  max-width:26ch;
}

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

.work__item{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);
  gap:clamp(1.6rem,4vw,3.5rem);
  align-items:center;
  padding-block:clamp(2rem,4vw,3.2rem);
  border-top:1px solid var(--rule-dark-faint);
}
.work__item:first-of-type{ border-top:0; padding-top:0; }
.work__item:nth-child(even) .work__media{ order:2; }
.work__media{ overflow:hidden; }
.work__media img{ width:100%; aspect-ratio:3 / 2; object-fit:cover; transition:transform 1.1s var(--ease); }
.work__item:hover .work__media img{ transform:scale(1.028); }
.work__num{
  font-family:var(--font-display);
  font-size:0.68rem; font-weight:500; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--ochre);
  margin:0 0 0.9rem;
  font-variant-numeric:tabular-nums;
}
.work__title{ font-size:clamp(1.5rem,1.1rem + 1.35vw,2.1rem); margin:0 0 0.85rem; }
.work__copy{ max-width:42ch; margin:0; }

.gallery{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:clamp(0.5rem,1.2vw,0.9rem);
  margin-top:clamp(2.5rem,5vw,4rem);
}
.gallery img{ width:100%; aspect-ratio:1 / 1; object-fit:cover; }
.gallery figure{ margin:0; overflow:hidden; }
.gallery figure img{ transition:transform 1.1s var(--ease); }
.gallery figure:hover img{ transform:scale(1.035); }

/* ----------------------------------------------------------- approach */

.approach{
  display:grid;
  grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:center;
}
.approach__media figure{ margin:0; }
.approach__media img{ width:100%; object-fit:cover; }
.approach__cap{
  font-family:var(--font-display);
  font-size:0.7rem; font-weight:500;
  letter-spacing:0.14em; text-transform:uppercase;
  color:var(--text-muted);
  margin-top:0.85rem;
}
.approach__renders{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(0.5rem,1.2vw,0.9rem); margin-top:clamp(0.5rem,1.2vw,0.9rem); }
.approach__renders img{ width:100%; aspect-ratio:3 / 2; object-fit:cover; }

.reasons{ margin:clamp(1.8rem,3.5vw,2.6rem) 0 0; padding:0; list-style:none; }
.reasons li{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:0.9rem;
  align-items:start;
  padding-block:0.72rem;
  border-bottom:1px solid var(--rule-light);
  font-size:1rem;
  color:var(--text-body);
}
.reasons li:first-child{ border-top:1px solid var(--rule-light); }
.reasons svg{ width:14px; height:14px; margin-top:0.5rem; flex:0 0 auto; }

/* ---------------------------------------------------------- collection */

.coll__head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:end;
  margin-bottom:clamp(2.5rem,5vw,3.8rem);
}
.steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(1.2rem,2.5vw,2rem);
  margin-bottom:clamp(2.8rem,6vw,4.5rem);
}
.step{ border-top:1px solid var(--rule-dark); padding-top:1.1rem; }
.step__n{
  font-family:var(--font-display);
  font-size:0.68rem; font-weight:500; letter-spacing:0.14em;
  color:var(--ochre); margin:0 0 0.7rem;
  font-variant-numeric:tabular-nums;
}
.step h3{ font-size:1.06rem; letter-spacing:-0.01em; margin:0 0 0.55rem; }
.step p{ font-size:0.95rem; line-height:1.6; color:var(--text-light-muted); }

.colls{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(1.2rem,2.5vw,2rem); }
.coll{ display:flex; flex-direction:column; }
.coll img{ width:100%; aspect-ratio:4 / 5; object-fit:cover; }
.coll h3{ font-size:1.2rem; margin:1.1rem 0 0.55rem; }
.coll p{ font-size:0.96rem; line-height:1.62; color:var(--text-light-muted); }

.includes{
  margin-top:clamp(2.2rem,4vw,3.2rem);
  padding-top:1.4rem;
  border-top:1px solid var(--rule-dark);
  display:flex; flex-wrap:wrap; gap:0.5rem 0.55rem;
  list-style:none; padding-left:0;
}
.includes li{
  font-family:var(--font-display);
  font-size:0.72rem; font-weight:500;
  letter-spacing:0.1em; text-transform:uppercase;
  color:var(--text-light-muted);
  border:1px solid var(--rule-dark);
  padding:0.55rem 0.85rem;
}
.includes__label{
  font-family:var(--font-display);
  font-size:0.72rem; font-weight:500; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--ochre);
  margin:0 0 1rem;
}

/* ------------------------------------------------------------ founders */

.founders{
  display:grid;
  grid-template-columns:minmax(0,0.8fr) minmax(0,1.2fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:start;
}
.founders__media img{ width:100%; aspect-ratio:3 / 4; object-fit:cover; }
.founders__names{ font-size:clamp(1.6rem,1.15rem + 1.5vw,2.3rem); margin:0 0 0.55rem; }
.founders__role{
  font-family:var(--font-display);
  font-size:0.73rem; font-weight:500;
  letter-spacing:0.15em; text-transform:uppercase;
  color:var(--bronze-deep);
  margin:0 0 1.8rem;
}
.founders__body p{ max-width:56ch; }
.founders__split{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1.2rem,3vw,2.4rem);
  margin-top:clamp(1.8rem,3.5vw,2.6rem);
  padding-top:clamp(1.5rem,3vw,2rem);
  border-top:1px solid var(--rule-light);
}
.founders__split h4{
  font-size:0.75rem; font-weight:500;
  letter-spacing:0.14em; text-transform:uppercase;
  color:var(--text-muted); margin:0 0 0.6rem;
}
.founders__split p{ font-size:0.98rem; line-height:1.65; }

/* --------------------------------------------------------- testimonials */

.quotes{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1.6rem,4vw,3.5rem);
}
.quote{ border-top:1px solid var(--rule-dark); padding-top:1.6rem; }
.quote blockquote{
  margin:0 0 1.5rem;
  font-family:var(--font-display);
  font-size:clamp(1.1rem,1rem + 0.55vw,1.4rem);
  font-weight:400;
  line-height:1.42;
  letter-spacing:-0.014em;
  color:var(--cream);
}
.quote figcaption{
  font-family:var(--font-display);
  font-size:0.73rem; font-weight:500;
  letter-spacing:0.15em; text-transform:uppercase;
  color:var(--ochre);
}

/* ---------------------------------------------------------------- cta */

.cta{ text-align:left; }
.cta__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:end;
}
.cta__contact{ margin:0; }
.cta__contact dt{
  font-family:var(--font-display);
  font-size:0.7rem; font-weight:500;
  letter-spacing:0.16em; text-transform:uppercase;
  color:var(--text-muted);
  margin-bottom:0.4rem;
}
.cta__contact dd{
  margin:0 0 1.5rem;
  font-size:1.06rem;
  color:var(--text-dark);
}
.cta__contact dd a{ display:inline-block; text-decoration:none; border-bottom:1px solid var(--rule-light); padding-block:0.6rem; }
.cta__contact dd a:hover{ border-bottom-color:var(--sage-deep); }

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

.footer{ background:var(--ink); color:var(--text-light-muted); padding-block:clamp(3rem,6vw,4.5rem) clamp(2rem,4vw,2.6rem); }
.footer__top{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);
  gap:clamp(1.8rem,4vw,3.5rem);
  padding-bottom:clamp(2rem,4vw,3rem);
  border-bottom:1px solid var(--rule-dark-faint);
}
.footer .brand__name{ color:var(--cream); }
.footer .brand__sub{ color:var(--text-light-muted); }
.footer__blurb{ margin-top:1.3rem; max-width:36ch; font-size:0.98rem; color:var(--text-light-muted); }
.footer h4{
  font-family:var(--font-display);
  font-size:0.7rem; font-weight:500;
  letter-spacing:0.16em; text-transform:uppercase;
  color:var(--ochre); margin:0 0 1rem;
}
.footer ul{ list-style:none; margin:0; padding:0; }
.footer li a, .footer__contact a{
  color:var(--text-light-muted);
  text-decoration:none;
  display:inline-block;
  padding-block:0.65rem;
  transition:color .3s var(--ease);
}
.footer li a:hover, .footer__contact a:hover{ color:var(--ochre); }
.footer__contact p{ margin:0 0 0.4rem; font-size:0.98rem; }
.footer__bottom{
  display:flex; flex-wrap:wrap; gap:0.6rem 1.6rem;
  justify-content:space-between; align-items:center;
  padding-top:1.6rem;
  font-size:0.86rem;
  color:var(--text-light-muted);
}
.footer__lic{ font-family:var(--font-display); font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; }
.footer__lic .sep{ display:inline-block; padding-inline:0.5rem; opacity:0.5; }

/* ---------------------------------------------------------------- 404 */

.err{
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  background:var(--ink);
  padding:calc(var(--nav-h) + 4rem) 0 4rem;
}
.err__code{
  font-family:var(--font-display);
  font-size:clamp(5rem,18vw,12rem);
  font-weight:500; line-height:0.9;
  letter-spacing:-0.04em;
  color:rgba(220,161,93,0.28);
  margin:0 0 1.5rem;
}
.err h1{ color:var(--cream); margin:0 0 1.2rem; }
.err p{ color:var(--text-light-muted); max-width:44ch; margin:0 0 2rem; }

/* ------------------------------------------------------------- motion */
/* Nordic Minimal: fade only, no vertical travel. */

html.js .reveal{ opacity:0; }
html.js .reveal.is-in{ opacity:1; transition:opacity .85s var(--ease); }
html.js .hrule--draw{ transform:scaleX(0); }
html.js .hrule--draw.is-in{ transform:scaleX(1); transition:transform 1s var(--ease); }

@media (prefers-reduced-motion: reduce){
  html.js .reveal{ opacity:1 !important; }
  html.js .hrule--draw{ transform:none !important; }
  *{ transition-duration:0.01ms !important; animation-duration:0.01ms !important; }
}

/* --------------------------------------------------------- responsive */

@media (min-width:1320px){
  .spine{ display:block; }
}

@media (max-width:1080px){
  .steps{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer__top{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
}

@media (max-width:900px){
  .nav__links{ display:none; }
  .burger{ display:flex; }
  .nav__cta{ display:none; }

  .hero{ grid-template-columns:minmax(0,1fr); min-height:auto; }
  .hero__text{
    padding:calc(var(--nav-h) + 3.2rem) var(--gutter) 3rem;
    min-height:auto;
  }
  .hero__media{ min-height:56svh; }
  .hero__media::after{
    background:linear-gradient(to bottom, rgba(26,31,24,0.5) 0%, rgba(26,31,24,0) 42%);
  }

  .statement__grid,
  .index__head,
  .index__layout,
  .approach,
  .coll__head,
  .founders,
  .cta__grid{ grid-template-columns:minmax(0,1fr); }

  .index__aside{ position:static; }
  .index__aside img{ aspect-ratio:16 / 10; }

  .work__item{ grid-template-columns:minmax(0,1fr); gap:1.4rem; }
  .work__item:nth-child(even) .work__media{ order:0; }

  .quotes{ grid-template-columns:minmax(0,1fr); }
  .colls{ grid-template-columns:minmax(0,1fr); }
  .coll img{ aspect-ratio:16 / 10; }
  .founders__media img{ aspect-ratio:4 / 3; }
  .gallery{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:600px){
  .steps{ grid-template-columns:minmax(0,1fr); }
  .footer__top{ grid-template-columns:minmax(0,1fr); }
  .founders__split{ grid-template-columns:minmax(0,1fr); }
  .btn{ width:100%; justify-content:space-between; }
  .btn-row{ flex-direction:column; align-items:stretch; }
  .eyebrow::after{ max-width:2.5rem; }
}

@media (max-width:420px){
  .hero__disciplines{ gap:0 1.1rem; }
  .gallery{ gap:0.4rem; }
}