/* ============================================================
   LIKHA LOKAL: site styles (components/bundle.css)
   Slow, ethical, upcycled. Made by women in Batangas, PH.
   Loads after tokens.css; every colour, radius and shadow is a token.
   ============================================================ */

/* fonts: linked from Google Fonts in the page head */

/* Token values live in tokens.json (compiled to tokens.css, loaded first).
   What stays here: the fluid gutter (a clamp() the token grammar cannot hold)
   and aliases so older markup that names the retired variables keeps working. */
:root{
  --gut: clamp(20px, 5vw, 64px);

  /* font stacks: short names used by the site markup */
  --serif: var(--font-serif);
  --sans:  var(--font-sans);
  --stamp: var(--font-stamp);

  /* retired colour names (2025 palette) -> current tokens; do not use in new work */
  --paper:   var(--surface);
  --paper-2: var(--peach);
  --card:    var(--surface);
  --coral:   var(--orange);
  --coral-2: var(--orange-text);
  --mustard: var(--butter);
  --teal:    var(--green);
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--surface);
  color:var(--ink);
  font-family:var(--font-sans);
  font-size:17px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; font-weight:400; }
p{ margin:0; }

/* ---------- type helpers ---------- */
.display{
  font-family:var(--font-serif);
  font-weight:400;
  line-height:.98;
  letter-spacing:-.01em;
  text-wrap:balance;
}
.display em{ font-style:italic; }
.stamp{
  font-family:var(--font-stamp);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-weight:600;
  font-size:.72rem;
}
.serif-it{ font-family:var(--font-serif); font-style:italic; }

/* ---------- layout ---------- */
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gut); }
.section{ padding-block:clamp(64px,9vw,128px); }
.eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  color:var(--orange-text);
}
.eyebrow::before{
  content:""; width:26px; height:1px; background:currentColor; opacity:.7;
}
.center{ text-align:center; }
.muted{ color:var(--ink-2); }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.6em;
  padding:.92em 1.5em;
  font-weight:600; font-size:.95rem;
  border-radius:var(--r-sm);
  transition:transform .25s, background .25s, color .25s, box-shadow .25s;
  white-space:nowrap;
}
.btn--solid{ background:var(--ink); color:var(--surface); }
.btn--solid:hover{ background:var(--navy); transform:translateY(-2px); }
.btn--coral{ background:var(--orange); color:var(--ink); }
.btn--coral:hover{ background:var(--butter); transform:translateY(-2px); }
.btn--ghost{ border:1px solid var(--line); color:var(--ink); }
.btn--ghost:hover{ border-color:var(--ink); background:var(--ink); color:var(--surface); }
.btn .ar{ transition:transform .25s; }
.btn:hover .ar{ transform:translateX(3px); }

.link{
  display:inline-flex; align-items:center; gap:.5em;
  font-weight:600; color:var(--ink);
  border-bottom:1.5px solid var(--orange);
  padding:10px 0 2px; min-height:44px; transition:gap .25s,color .25s;
}
.link:hover{ gap:.85em; color:var(--orange-text); }

/* ---------- announcement ---------- */
.announce{
  background:var(--mint); color:var(--ink);
  font-family:var(--font-stamp); text-transform:uppercase;
  letter-spacing:.2em; font-size:.74rem; font-weight:600;
  text-align:center; padding:9px 16px;
}
.announce span{ opacity:.78; padding-inline:.5em; }

/* ---------- header ---------- */
.head{
  position:sticky; top:env(safe-area-inset-top, 0px); z-index:60;
  background:color-mix(in srgb, var(--surface) 86%, transparent);
  backdrop-filter:blur(12px) saturate(1.2);
  border-bottom:1px solid var(--line-2);
}
.head__in{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; height:82px;
}
.brand{ display:flex; align-items:center; line-height:1; }
.brand__mark{ height:54px; width:auto; display:block; }
@media (max-width:620px){ .brand__mark{ height:42px; } }
.brand b{
  font-family:var(--font-serif); font-weight:400;
  font-size:1.7rem; letter-spacing:.005em;
}
.brand .dot{ color:var(--orange); font-family:var(--font-serif); }
/* the logo has black lettering: on the dark footer it sits on a white tile */
.foot__mark{ height:96px; width:auto; display:block; margin-bottom:6px; padding:10px 14px; background:var(--surface); border-radius:var(--r); }
.nav{ display:flex; gap:30px; }
.nav a{
  font-size:.93rem; font-weight:500; color:var(--ink-2);
  position:relative; padding:12px 0; transition:color .2s; display:inline-block;
}
.nav a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:1.5px; width:0;
  background:var(--orange); transition:width .25s;
}
.nav a:hover{ color:var(--ink); }
.nav a:hover::after{ width:100%; }
.head__act{ display:flex; align-items:center; gap:6px; }
.iconbtn{
  width:44px; height:44px; display:grid; place-items:center;
  border-radius:50%; color:var(--ink); transition:background .2s;
  position:relative;
}
.iconbtn:hover{ background:var(--peach); }
.iconbtn svg{ width:21px; height:21px; }
.cart-count{
  position:absolute; top:4px; right:3px;
  min-width:17px; height:17px; padding:0 4px;
  background:var(--orange); color:var(--ink); border-radius:var(--r-pill);
  font-size:.64rem; font-weight:700; font-family:var(--font-sans);
  display:grid; place-items:center; line-height:1;
  transform:scale(0); transition:transform .2s;
}
.cart-count.on{ transform:scale(1); }
.burger{ display:none; }

/* ---------- hero ---------- */
.hero{ background:var(--surface); border-bottom:1px solid var(--line-2); }
.hero__grid{
  display:grid; grid-template-columns:1.02fr 1fr; align-items:stretch;
  min-height:min(86vh,760px);
}
.hero__copy{
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(40px,6vw,84px) var(--gut);
  padding-right:clamp(28px,4vw,64px);
}
.hero__copy .eyebrow{ margin-bottom:26px; }
.hero h1{ font-size:clamp(3.2rem,7vw,6rem); }
.hero h1 .coral{ color:var(--green); }
.hero__sub{
  margin-top:26px; max-width:46ch; font-size:1.1rem; color:var(--ink-2);
}
.hero__cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.hero__pillars{
  display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:44px;
  padding-top:26px; border-top:1px solid var(--line-2);
}
.hero__pillars li{ display:flex; align-items:center; gap:.55em; color:var(--ink); }
.hero__pillars li b{ font-weight:600; font-size:.92rem; }
.hero__pillars .pd{ width:6px; height:6px; border-radius:50%; background:var(--orange); }
.hero__media{ position:relative; overflow:hidden; }
.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:50% 38%; }
.hero__seal{
  position:absolute; left:24px; bottom:24px;
  width:124px; height:124px; border-radius:50%; padding:10px;
  background:var(--ink); color:var(--surface);
  display:grid; place-items:center; text-align:center;
  box-shadow:var(--shadow-lg);
}
.hero__seal .sp{ font-family:var(--font-stamp); text-transform:uppercase; font-size:.58rem; letter-spacing:.1em; line-height:1.3; display:block; }
.hero__seal .num{ font-family:var(--font-serif); font-size:2rem; line-height:1; margin:3px 0; }

/* ---------- marquee ---------- */
.marquee{
  background:var(--navy); color:var(--surface);
  overflow:hidden; white-space:nowrap; border-block:1px solid rgba(0,0,0,.2);
}
.marquee__track{ display:inline-flex; gap:0; animation:slide 38s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__track span{
  font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.18em;
  font-weight:600; font-size:.92rem; padding:13px 28px; display:inline-flex; align-items:center;
}
.marquee__track span::after{ content:"✺"; margin-left:28px; color:var(--butter); opacity:.9; }
@keyframes slide{ to{ transform:translateX(-50%); } }

/* ---------- manifesto ---------- */
.manifesto{ background:var(--surface); }
.manifesto .wrap{ display:grid; grid-template-columns:.7fr 1.3fr; gap:clamp(28px,5vw,72px); align-items:start; }
.manifesto h2{ font-size:clamp(1.9rem,3vw,2.7rem); line-height:1.04; }
.manifesto .lede{ font-size:clamp(1.3rem,2.1vw,1.7rem); line-height:1.4; color:var(--ink); }
.manifesto .lede b{ font-family:var(--font-serif); font-style:italic; font-weight:400; color:var(--green); }
.manifesto .body{ margin-top:22px; max-width:60ch; color:var(--ink-2); }

/* ---------- value props ---------- */
.values{ background:var(--surface); }
.values__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,40px); margin-top:50px; }
.vcard{ }
.vcard__img{ aspect-ratio:4/3; border-radius:var(--r); overflow:hidden; background:var(--peach); border:1px solid var(--line-2); }
.vcard__img img{ width:100%; height:100%; object-fit:cover; transition:transform .8s ease; }
.vcard:hover .vcard__img img{ transform:scale(1.05); }
.vcard h3{ font-family:var(--font-serif); font-size:1.7rem; margin-top:20px; }
.vcard .n{ color:var(--orange-text); margin-bottom:8px; }
.vcard p{ margin-top:8px; color:var(--ink-2); font-size:.98rem; }

/* ---------- section heading ---------- */
.shead{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.shead h2{ font-family:var(--font-serif); font-size:clamp(2.1rem,4vw,3.4rem); line-height:1; }
.shead p{ color:var(--ink-2); max-width:40ch; margin-top:10px; }

/* ---------- shop / products ---------- */
.showcase{ background:var(--surface); }
.head__cta{ padding:.8em 1.1em; font-size:.85rem; min-height:44px; }
@media (max-width:860px){ .head__cta{ display:none; } }
.filters{ display:flex; flex-wrap:wrap; gap:10px; margin:36px 0 30px; }
.chip{
  font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.14em; font-weight:600;
  font-size:.76rem; padding:.9em 1.2em; min-height:44px; border-radius:var(--r-pill);
  border:1px solid var(--line); color:var(--ink-2); transition:all .2s;
}
.chip:hover{ border-color:var(--ink); color:var(--ink); }
.chip.active{ background:var(--ink); color:var(--surface); border-color:var(--ink); }

.grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2vw,26px); }
.pcard{ display:flex; flex-direction:column; }
.pcard__media{
  position:relative; aspect-ratio:1/1; border-radius:var(--r); overflow:hidden;
  background:var(--surface); border:1px solid var(--line-2);
}
.pcard__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.pcard:hover .pcard__media img{ transform:scale(1.045); }
.pcard__tag{
  position:absolute; top:12px; left:12px;
  font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.14em;
  font-size:.62rem; font-weight:600; padding:.4em .7em; border-radius:3px;
  background:color-mix(in srgb, var(--surface) 88%, transparent); color:var(--ink);
  backdrop-filter:blur(4px);
}
.pcard__tag.ooak{ background:var(--orange); color:var(--ink); }
.pcard__meta{ padding-top:14px; }
.pcard__cat{ color:var(--ink-3); font-size:.72rem; font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.16em; font-weight:600; }
.pcard__name{ font-family:var(--font-serif); font-size:1.28rem; line-height:1.1; margin:5px 0 2px; }
.showcase__note{ margin-top:40px; text-align:center; color:var(--ink-2); display:flex; gap:.55em; justify-content:center; flex-wrap:wrap; align-items:center; }

/* ---------- carry-all spotlight ---------- */
.carryall{ background:var(--surface); }
.carryall__in{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(30px,5vw,76px); align-items:center; }
.carryall__media{ position:relative; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow); aspect-ratio:4/5; background:var(--peach); }
.carryall__media img{ width:100%; height:100%; object-fit:cover; }
.carryall__chip{ position:absolute; left:16px; top:16px; background:var(--orange); color:var(--ink); padding:.5em .85em; border-radius:3px; }
.carryall .eyebrow{ margin-bottom:16px; }
.carryall h2{ font-size:clamp(2.4rem,5vw,4.1rem); }
.carryall__lede{ margin-top:22px; font-size:1.12rem; color:var(--ink-2); max-width:48ch; }
.spec{ margin-top:30px; border-top:1px solid var(--line); }
.spec li{ display:grid; grid-template-columns:minmax(140px,auto) 1fr; gap:6px 22px; padding:14px 0; border-bottom:1px solid var(--line-2); align-items:baseline; }
.spec li b{ font-family:var(--font-serif); font-weight:400; font-size:1.24rem; line-height:1.1; }
.spec li span{ color:var(--ink-2); font-size:.95rem; }
.carryall__cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }

/* ---------- editorial split ---------- */
.editorial{ background:var(--peach); overflow:hidden; }
.editorial .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,80px); align-items:center; }
.editorial__img{ position:relative; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow); aspect-ratio:4/5; }
.editorial__img img{ width:100%; height:100%; object-fit:cover; }
.editorial h2{ font-family:var(--font-serif); font-size:clamp(2.1rem,4vw,3.4rem); line-height:1.02; margin:18px 0 0; }
.editorial p{ margin-top:20px; color:var(--ink); max-width:48ch; }
.editorial p + p{ margin-top:14px; color:var(--ink-2); }
.editorial .stats{ display:flex; gap:38px; margin-top:34px; padding-top:26px; border-top:1px solid var(--line); }
.editorial .stats b{ font-family:var(--font-serif); font-size:2.3rem; display:block; line-height:1; color:var(--green-text); }
.editorial .stats span{ font-size:.86rem; color:var(--ink-2); }
.quote-badge{
  position:absolute; right:-14px; bottom:24px; max-width:230px;
  background:var(--surface); padding:20px 22px; border-radius:var(--r);
  box-shadow:var(--shadow-lg); font-family:var(--font-serif); font-style:italic; font-size:1.12rem; line-height:1.3;
}
.quote-badge cite{ display:block; margin-top:10px; font-family:var(--font-stamp); font-style:normal; text-transform:uppercase; letter-spacing:.14em; font-size:.66rem; color:var(--ink-3); }

/* ---------- material band ---------- */
.material{ background:var(--navy); color:var(--surface); position:relative; overflow:hidden; }
.material .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,80px); align-items:center; }
.material__img{ border-radius:var(--r-lg); overflow:hidden; aspect-ratio:1/1; }
.material__img img{ width:100%; height:100%; object-fit:cover; }
.material .eyebrow{ color:var(--butter); }
.material h2{ font-family:var(--font-serif); font-size:clamp(2.2rem,4.4vw,3.7rem); line-height:1.0; margin:16px 0 0; }
.material h2 em{ color:var(--butter); }
.material p{ margin-top:20px; color:color-mix(in srgb, var(--surface) 80%, transparent); max-width:46ch; }
.sack{ display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }
.sack span{
  font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.12em; font-weight:600; font-size:.74rem;
  padding:.5em .9em; border:1px solid rgba(255,255,255,.28); border-radius:3px; color:var(--surface);
}

/* ---------- lookbook ---------- */
.look{ background:var(--surface); }
.look__grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:200px; gap:14px; margin-top:44px; }
.look__grid figure{ margin:0; border-radius:var(--r); overflow:hidden; position:relative; }
.look__grid img{ width:100%; height:100%; object-fit:cover; transition:transform .8s ease; }
.look__grid figure:hover img{ transform:scale(1.06); }
.look__grid .tall{ grid-row:span 2; }
.look__grid .wide{ grid-column:span 2; }
.look__cap{ position:absolute; left:0; bottom:0; right:0; padding:14px; background:linear-gradient(transparent,rgba(42,37,33,.6)); color:var(--surface); font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.14em; font-size:.68rem; font-weight:600; opacity:0; transition:opacity .3s; }
.look__grid figure:hover .look__cap{ opacity:1; }

/* ---------- press ---------- */
.press{ background:var(--surface); border-top:1px solid var(--line-2); }
.press .lab{ text-align:center; color:var(--ink-3); margin-bottom:30px; }
.press__row{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px 12px; }
.press__row a{
  font-family:var(--font-serif); font-size:clamp(1.15rem,2vw,1.7rem); color:var(--ink-2);
  padding:8px 20px; border:1px solid var(--line-2); border-radius:var(--r-pill); transition:all .25s;
  display:inline-flex; align-items:center; gap:.5em;
}
.press__row a:hover{ color:var(--ink); border-color:var(--ink); }
.press__row a small{ font-family:var(--font-sans); font-size:.72rem; color:var(--ink-3); }

/* ---------- press features ---------- */
.press__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2vw,26px); margin-top:40px; }
.feat{ display:flex; flex-direction:column; gap:10px; color:var(--ink); border-radius:var(--r); transition:transform .3s; }
a.feat:hover{ transform:translateY(-3px); }
a.feat:hover .feat__head{ color:var(--green-text); }
a.feat:focus-visible{ outline:2px solid var(--ink); outline-offset:4px; }
.feat__media{ display:block; aspect-ratio:4/3; border-radius:var(--r); overflow:hidden; background:var(--surface-warm); border:1px solid var(--line-2); }
.feat__media img{ width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .7s ease; }
a.feat:hover .feat__media img{ transform:scale(1.04); }
.feat__meta{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-top:4px; }
.feat__outlet{ color:var(--orange-text); letter-spacing:.16em; font-size:.68rem; }
.feat__when{ font-size:.78rem; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap; }
.feat__head{ font-family:var(--font-serif); font-size:1.22rem; line-height:1.18; text-wrap:balance; transition:color .2s; }
.feat__cta{ margin-top:auto; padding-top:6px; font-size:.86rem; font-weight:600; display:inline-flex; gap:.4em; align-items:center; }
.feat__cta .ar{ transition:transform .25s; }
a.feat:hover .feat__cta .ar{ transform:translateX(3px); }
.feat__cta--muted{ color:var(--ink-3); font-weight:500; }
@media (max-width:1040px){ .press__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:860px){ .press__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){
  .press__grid{ grid-template-columns:1fr; gap:22px; }
  .feat{ display:grid; grid-template-columns:36% 1fr; column-gap:14px; row-gap:6px; align-items:start; }
  .feat__media{ grid-row:1 / span 4; aspect-ratio:1; }
  .feat__meta{ margin-top:0; flex-wrap:wrap; }
  .feat__head{ font-size:1.1rem; }
  .feat__cta{ padding-top:2px; }
}

/* ---------- stockists ---------- */
.stockists{ background:var(--peach); }
.stk__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:46px; }
.stk{
  background:var(--surface); border:1px solid var(--line-2); border-radius:var(--r-lg);
  padding:28px; display:flex; flex-direction:column; transition:transform .3s, box-shadow .3s;
}
.stk:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.stk__logo{ height:70px; width:70px; border-radius:12px; overflow:hidden; background:var(--surface); border:1px solid var(--line-2); margin-bottom:18px; }
.stk__logo img{ width:100%; height:100%; object-fit:cover; }
.stk h3{ font-family:var(--font-serif); font-size:1.5rem; }
.stk p{ margin-top:8px; color:var(--ink-2); font-size:.94rem; flex:1; }
.stk .stk__loc{ margin-top:14px; color:var(--ink-3); font-size:.82rem; }
.stk .link{ margin-top:18px; align-self:flex-start; font-size:.9rem; }
.stk__also{ margin-top:40px; display:flex; align-items:center; gap:26px; flex-wrap:wrap; justify-content:center; }
.stk__also .lab{ color:var(--ink-3); font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.18em; font-size:.72rem; font-weight:600; }
.stk__also img{ height:48px; width:48px; border-radius:8px; object-fit:cover; filter:grayscale(1); opacity:.7; transition:all .3s; }
.stk__also img:hover{ filter:none; opacity:1; }

/* ---------- faq ---------- */
.faq{ background:var(--surface); border-top:1px solid var(--line-2); }
.faq__in{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(28px,5vw,72px); align-items:start; }
.faq__list{ border-top:1px solid var(--line); }
.faq__item{ border-bottom:1px solid var(--line-2); }
.faq__item summary{ list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:20px 0; min-height:44px; }
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary h3{ font-family:var(--font-serif); font-weight:400; font-size:1.35rem; line-height:1.2; }
.faq__ico{ flex:none; width:28px; height:28px; border-radius:50%; border:1px solid var(--line); position:relative; transition:transform .25s, background .25s; }
.faq__ico::before,.faq__ico::after{ content:""; position:absolute; left:50%; top:50%; width:12px; height:1.5px; background:var(--ink); transform:translate(-50%,-50%); }
.faq__ico::after{ transform:translate(-50%,-50%) rotate(90deg); }
.faq__item[open] .faq__ico{ background:var(--butter); border-color:var(--butter); }
.faq__item[open] .faq__ico::after{ transform:translate(-50%,-50%) rotate(0); }
.faq__item summary:hover h3{ color:var(--green-text); }
.faq__item summary:focus-visible{ outline:2px solid var(--ink); outline-offset:3px; border-radius:var(--r-sm); }
.faq__item p{ padding:0 48px 22px 0; color:var(--ink-2); max-width:62ch; }
@media (max-width:860px){ .faq__in{ grid-template-columns:1fr; } .faq__item p{ padding-right:0; } }

/* ---------- newsletter ---------- */
.signup{ background:var(--mint); color:var(--ink); }
.signup .wrap{ display:grid; grid-template-columns:1.1fr 1fr; gap:40px; align-items:center; }
.signup h2{ font-family:var(--font-serif); font-size:clamp(2rem,3.6vw,3.1rem); line-height:1.02; }
.signup p{ margin-top:14px; color:var(--ink-2); max-width:42ch; }
.signup form{ display:flex; gap:10px; flex-wrap:wrap; }
.signup input{
  flex:1; min-width:200px; padding:.95em 1.1em; border-radius:var(--r-sm); border:1px solid var(--ink-2);
  background:var(--surface); color:var(--ink); font-family:inherit; font-size:1rem;
}
.signup input::placeholder{ color:var(--ink-3); }
.signup input:focus{ outline:2px solid var(--ink); outline-offset:1px; border-color:var(--ink); }
.signup button{ background:var(--ink); color:var(--surface); padding:.95em 1.6em; border-radius:var(--r-sm); font-weight:600; transition:transform .2s,background .2s; }
.signup button:hover{ transform:translateY(-2px); background:var(--navy); }
.signup .fine{ font-size:.78rem; color:var(--ink-2); margin-top:12px; }

/* ---------- footer ---------- */
.foot{ background:var(--ink); color:var(--surface); }
.foot__top{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-block:clamp(54px,7vw,88px); }
.foot__brand b{ font-family:var(--font-serif); font-size:2rem; }
.foot__brand p{ margin-top:14px; color:rgba(251,246,236,.6); max-width:34ch; font-size:.95rem; }
.foot__social{ display:flex; gap:10px; margin-top:22px; }
.foot__social a{ width:44px; height:44px; border-radius:50%; border:1px solid rgba(251,246,236,.22); display:grid; place-items:center; transition:all .2s; }
.foot__social a:hover{ background:var(--butter); border-color:var(--butter); color:var(--ink); }
.foot__social svg{ width:18px; height:18px; }
.foot h4{ font-family:var(--font-stamp); text-transform:uppercase; letter-spacing:.18em; font-size:.74rem; color:rgba(251,246,236,.55); margin-bottom:16px; }
.foot li{ margin-bottom:2px; }
.foot a.fl{ display:inline-block; padding:10px 0; }
.foot a.fl{ color:rgba(251,246,236,.82); font-size:.95rem; transition:color .2s; }
.foot a.fl:hover{ color:var(--surface); }
.foot__bar{ border-top:1px solid rgba(251,246,236,.14); padding-block:20px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; color:rgba(251,246,236,.5); font-size:.82rem; }
.foot__credit{ flex-basis:100%; }
.foot__credit a.fl{ padding:4px 0; color:rgba(251,246,236,.82); border-bottom:1px solid rgba(251,246,236,.3); }
.foot__credit a.fl:hover{ color:var(--surface); border-color:var(--butter); }

/* ---------- focus ---------- */
.btn:focus-visible,.link:focus-visible,.chip:focus-visible,.iconbtn:focus-visible,.nav a:focus-visible,.press__row a:focus-visible{
  outline:2px solid var(--ink); outline-offset:3px;
}
.foot a:focus-visible,.material a:focus-visible,.marquee a:focus-visible{ outline-color:var(--surface); }

/* ---------- reveal ---------- */
/* sections are always visible; .in only adds a small settle as they scroll in */
.reveal{ transition:transform .7s ease; }
@media (prefers-reduced-motion: no-preference){
  .reveal:not(.in){ transform:translateY(10px); }
}
.reveal.in{ transform:none; }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .marquee__track{ animation:none; }
  *,*::before,*::after{ transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ---------- responsive ---------- */
@media (max-width:1040px){
  .grid{ grid-template-columns:repeat(3,1fr); }
  .hero h1{ font-size:clamp(3rem,6vw,4.6rem); }
  .nav{ gap:20px; }
  .look__grid{ grid-template-columns:repeat(3,1fr); grid-auto-rows:180px; }
  .foot__top{ grid-template-columns:1fr 1fr; gap:36px; }
}
@media (max-width:860px){
  .nav{ display:none; }
  .burger{ display:grid; }
  .hero__grid{ grid-template-columns:1fr; }
  .hero__media{ min-height:54vh; order:-1; }
  .manifesto .wrap,
  .editorial .wrap,
  .material .wrap,
  .signup .wrap{ grid-template-columns:1fr; }
  .values__grid{ grid-template-columns:1fr; gap:28px; }
  .vcard{ display:grid; grid-template-columns:minmax(200px,38%) 1fr; column-gap:24px; align-items:center; }
  .vcard__img{ grid-row:1 / span 3; aspect-ratio:4/3; }
  .vcard h3{ margin-top:0; }
  .carryall__in{ grid-template-columns:1fr; }
  .carryall__media{ aspect-ratio:4/3; max-height:60vh; }
  .stk__grid{ grid-template-columns:1fr; gap:16px; }
  .stk{ display:grid; grid-template-columns:70px 1fr; column-gap:20px; padding:22px; }
  .stk__logo{ grid-row:1 / span 5; margin-bottom:0; }
  .stk .link{ justify-self:start; }
  .stk p{ flex:initial; }
  .quote-badge{ right:14px; }
  .editorial__img{ aspect-ratio:4/3; }
  .look__grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:160px; }
}
@media (max-width:620px){
  body{ font-size:16px; }
  .vcard{ display:block; }
  .vcard__img{ aspect-ratio:4/3; }
  .vcard h3{ margin-top:20px; }
  .stk{ display:flex; padding:24px; }
  .stk__logo{ margin-bottom:18px; }
  .hero__seal{ width:112px; height:112px; left:16px; bottom:16px; padding:8px; }
  .hero__seal .sp{ font-size:.52rem; letter-spacing:.08em; }
  .hero__seal .num{ font-size:1.7rem; }
  .announce{ font-size:.68rem; letter-spacing:.12em; }
  .grid{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .foot__top{ grid-template-columns:1fr; }
  .look__grid .wide{ grid-column:span 2; }
  .press__row a{ font-size:1.1rem; }
}
