:root{
  --paper:#f2ede1;
  --paper-raised:#e9e1d1;
  --ink:#211a12;
  --ink-soft:#5b5142;
  --denim:#2c3f66;
  --denim-deep:#1c2c4a;
  --copper:#b0552a;
  --copper-soft:#e4a874;
  --thread:#c99a3f;
  --line:#c7bda6;
  --card-bg:#faf7ef;
  --tag-bg:#211a12;
  --tag-fg:#f2ede1;
  --focus:#b0552a;
  --glow:0;              /* 0..1, driven by scroll in script.js */
  --glow-rgb:214,150,74; /* warm copper sheen */
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#161a24;
    --paper-raised:#1d2230;
    --ink:#eee7d6;
    --ink-soft:#a9a08c;
    --denim:#7d97c9;
    --denim-deep:#a8bce3;
    --copper:#e0955c;
    --copper-soft:#7a4a2a;
    --thread:#d9b567;
    --line:#343c50;
    --card-bg:#1c2130;
    --tag-bg:#eee7d6;
    --tag-fg:#161a24;
    --focus:#e0955c;
  }
}
:root[data-theme="dark"]{
  --paper:#161a24;
  --paper-raised:#1d2230;
  --ink:#eee7d6;
  --ink-soft:#a9a08c;
  --denim:#7d97c9;
  --denim-deep:#a8bce3;
  --copper:#e0955c;
  --copper-soft:#7a4a2a;
  --thread:#d9b567;
  --line:#343c50;
  --card-bg:#1c2130;
  --tag-bg:#eee7d6;
  --tag-fg:#161a24;
  --focus:#e0955c;
}

*{box-sizing:border-box;}
html,body{margin:0; padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Archivo',sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
h1,h2,h3{text-wrap:balance; margin:0;}
.mono{font-family:'IBM Plex Mono',monospace;}
:focus-visible{outline:3px solid var(--focus); outline-offset:2px;}
img{max-width:100%; display:block;}

/* ---- page transition ---- */
/* entrance is a one-shot animation (always ends visible, even if throttled while hidden) */
@media (prefers-reduced-motion: no-preference){
  /* opacity-only: a transform on <body> would become the containing block for
     position:fixed overlays (modal, mobile nav) and break them. */
  body{animation:pageIn .38s ease both;}
  @keyframes pageIn{from{opacity:0;} to{opacity:1;}}
  body.pt-out{opacity:0; transition:opacity .22s ease; animation:none;}
}

/* ---- scroll-reveal (JS-driven; no-JS fallback stays fully visible) ---- */
@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0; transform:translateY(22px); transition:opacity .5s ease, transform .5s ease;}
  .reveal.in-view{opacity:1; transform:translateY(0);}
}

/* ---- topbar + nav (shared shell) ---- */
.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px clamp(18px,4vw,48px);
  border-bottom:1px solid var(--line);
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.topbar strong{color:var(--copper);}

/* ---- announcement bar (scrolling) ---- */
.announce{
  overflow:hidden; background:var(--ink); color:var(--paper);
  border-bottom:1px solid var(--line); padding:9px 0;
}
.announce-track{
  display:flex; width:max-content; animation:marquee 34s linear infinite;
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.06em;
}
.announce-track > span{white-space:nowrap; padding:0 26px; display:inline-flex; align-items:center;}
.announce-track > span::after{content:"·"; margin-left:26px; opacity:.5;}
.announce:hover .announce-track{animation-play-state:paused;}
@media (prefers-reduced-motion: reduce){ .announce-track{animation:none; justify-content:center; width:100%;} .announce-track > span:nth-child(n+2){display:none;} .announce-track > span::after{display:none;} }

header.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px clamp(18px,4vw,48px);
  border-bottom:1px solid var(--line);
  position:sticky; top:0; background:var(--paper); z-index:10;
}
.brand{
  font-family:'Anton',sans-serif;
  font-size:30px;
  letter-spacing:.02em;
  display:flex; align-items:baseline; gap:8px;
  text-decoration:none;
  transition:letter-spacing .25s ease;
}
.brand:hover{letter-spacing:.05em;}
.brand span{color:var(--copper);}
nav.links{display:flex; gap:24px; font-size:13.5px; font-weight:600; letter-spacing:.02em; white-space:nowrap;}
nav.links a{text-decoration:none; padding-bottom:4px; border-bottom:2px solid transparent; transition:border-color .2s ease, color .2s ease;}
nav.links a:hover, nav.links a.active{border-color:var(--copper);}
.nav-actions{display:flex; gap:18px; align-items:center; font-size:13px; font-weight:600;}
.nav-actions a{text-decoration:none; position:relative; transition:color .2s ease; display:inline-flex; align-items:center; gap:6px;}
.nav-actions a:hover{color:var(--copper);}
.nav-actions .ni{width:15px; height:15px; flex:none;}
.nav-actions .nav-search .ni{display:none;}
.nav-actions .badge{
  position:absolute; top:-8px; right:-14px;
  background:var(--copper); color:var(--paper);
  font-family:'IBM Plex Mono',monospace; font-size:10px; font-weight:700;
  width:16px; height:16px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}

/* ---- nav search ---- */
.nav-search{
  width:32px; height:32px; flex:none; border:1px solid var(--line); border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; color:var(--ink);
  transition:border-color .2s ease, color .2s ease;
}
.nav-search:hover{border-color:var(--copper); color:var(--copper);}
.nav-search svg{display:block;}
.nav-search .badge{display:none;}

.searchbar{
  border-bottom:1px solid var(--line); background:var(--paper);
  overflow:hidden; max-height:0; transition:max-height .28s ease;
}
.searchbar.open{max-height:96px;}
.searchbar form{display:flex; gap:10px; align-items:center; padding:14px clamp(18px,4vw,48px);}
.searchbar input{
  flex:1; min-width:0; border:1px solid var(--line); background:var(--card-bg); color:var(--ink);
  font-family:'Archivo',sans-serif; font-size:14px; padding:11px 14px;
}
.searchbar input:focus{outline:none; border-color:var(--copper);}
@media (max-width:820px){
  .mm-actions .nav-search{order:-1;}
}

/* ---- breadcrumb ---- */
.crumb{
  padding:14px clamp(18px,4vw,48px) 0;
  font-family:'IBM Plex Mono',monospace;
  font-size:12px; color:var(--ink-soft); letter-spacing:.03em;
}
.crumb a{text-decoration:none;}
.crumb a:hover{color:var(--copper);}

/* ---- buttons ---- */
.btn{
  font-family:'IBM Plex Mono',monospace;
  font-size:13px; letter-spacing:.06em; text-transform:uppercase; font-weight:600;
  padding:15px 28px;
  border:2px solid var(--ink);
  background:var(--ink); color:var(--paper);
  cursor:pointer; text-decoration:none;
  display:inline-flex; align-items:center; gap:8px;
}
.btn.ghost{background:transparent; color:var(--ink); border-color:var(--ink);}
.btn:hover{background:var(--copper); border-color:var(--copper); color:var(--paper);}
.btn.block{width:100%; justify-content:center;}
.btn.sm{padding:10px 18px; font-size:12px;}

/* ---- rivet decoration ---- */
.rivet{
  position:absolute; width:14px; height:14px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, var(--copper-soft), var(--copper) 70%);
  box-shadow:0 1px 3px rgba(0,0,0,.4);
}

/* ---- filter bar ---- */
.filterbar{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:20px clamp(18px,4vw,48px);
  border-bottom:1px solid var(--line);
  background:var(--paper-raised);
}
.filterbar .label{
  font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase;
  letter-spacing:.08em; color:var(--ink-soft); margin-right:4px;
}
.chip{
  font-size:13px; font-weight:600; padding:8px 16px;
  border:1px solid var(--line); border-radius:999px; background:var(--card-bg);
  cursor:pointer; text-decoration:none; color:var(--ink);
}
.chip.active{background:var(--denim); color:var(--paper); border-color:var(--denim);}
.filterbar .count{margin-left:auto; font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink-soft);}

/* ---- product grid + card (listing + home) ---- */
main{padding:clamp(24px,4vw,48px);}
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:28px 22px;
}
.card{
  background:var(--card-bg); border:1px solid var(--line); display:flex; flex-direction:column;
  text-decoration:none; color:var(--ink);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.card:hover{
  transform:translateY(-7px);
  box-shadow:0 18px 30px -14px rgba(20,15,8,.35);
  border-color:var(--copper);
}
.card-media{
  position:relative; aspect-ratio:4/5;
  background:linear-gradient(160deg,var(--denim) 0%, var(--denim-deep) 100%);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.card-media svg{width:62%; height:62%; transition:transform .4s ease;}
.card:hover .card-media svg{transform:scale(1.08) rotate(-2deg);}
.tag{
  position:absolute; top:10px; left:10px; background:var(--tag-bg); color:var(--tag-fg);
  font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600; letter-spacing:.04em;
  padding:5px 9px;
}
.wish{
  position:absolute; top:10px; right:10px; width:30px; height:30px; border-radius:50%;
  background:var(--paper); display:flex; align-items:center; justify-content:center;
  font-size:14px; border:1px solid var(--line);
  transition:transform .2s ease, color .2s ease;
}
.wish:hover{transform:scale(1.15); color:var(--copper);}
.wish.saved{color:var(--copper);}
.card-body{padding:16px 16px 18px; display:flex; flex-direction:column; gap:8px; flex:1;}
.card-body .cat{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft);}
.card-body h3{font-size:16px; font-weight:700; line-height:1.3;}
.fits{font-size:12.5px; color:var(--ink-soft);}
.price-row{display:flex; align-items:baseline; gap:10px; margin-top:auto; padding-top:6px;}
.price-now{font-family:'IBM Plex Mono',monospace; font-size:17px; font-weight:600; color:var(--copper);}
.price-was{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--ink-soft); text-decoration:line-through;}
.swatches{display:flex; gap:6px; margin-top:2px;}
.swatch{width:16px; height:16px; border-radius:50%; border:1px solid var(--line);}

/* ---- section heading (home) ---- */
.section-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  padding:0 clamp(18px,4vw,48px); margin:48px 0 20px;
}
.section-head h2{font-family:'Anton',sans-serif; font-size:clamp(30px,4.2vw,46px);}
.section-head a{font-size:13px; font-weight:600; text-decoration:none; color:var(--copper); transition:letter-spacing .2s ease;}
.section-head a:hover{letter-spacing:.03em;}

/* ---- load more ---- */
.load-more-wrap{display:flex; justify-content:center; padding:38px 0 6px;}

/* ---- footer ---- */
footer{border-top:1px solid var(--line); background:var(--paper-raised);}
.footer-grid{
  display:grid; grid-template-columns:1.4fr repeat(4,1fr); gap:32px;
  padding:44px clamp(18px,4vw,48px) 28px;
}
.footer-grid .fbrand{font-family:'Anton',sans-serif; font-size:22px; color:var(--ink); margin-bottom:10px;}
.footer-grid .flede{font-size:13px; color:var(--ink-soft); max-width:32ch; line-height:1.6;}
.footer-col h5{
  font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase;
  letter-spacing:.08em; color:var(--ink-soft); margin:0 0 12px;
}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px;}
.footer-col a{font-size:13.5px; text-decoration:none; transition:color .2s ease;}
.footer-col a:hover{color:var(--copper);}
.footer-bottom{
  border-top:1px solid var(--line); padding:18px clamp(18px,4vw,48px);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:12px; color:var(--ink-soft); font-family:'IBM Plex Mono',monospace;
}

@media (max-width:900px){
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:820px){
  nav.links{display:none;}
}

/* ---- mobile navigation ---- */
.nav-toggle{
  display:none; width:42px; height:42px; padding:10px; margin:-8px -6px -8px 0;
  background:none; border:none; cursor:pointer; flex-direction:column; justify-content:center; gap:5px;
}
.nav-toggle span{display:block; height:2px; width:100%; background:var(--ink); transition:transform .25s ease, opacity .2s ease;}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-menu{
  position:sticky; top:0; z-index:9; background:var(--paper);
  border-bottom:1px solid var(--line); padding:8px clamp(18px,4vw,48px) 18px;
}
.mobile-menu .mm-links{display:flex; flex-direction:column; gap:2px;}
.mobile-menu .mm-links a{
  text-decoration:none; font-weight:600; font-size:16px; padding:13px 4px;
  border-bottom:1px solid var(--line);
}
.mobile-menu .mm-links a.active{color:var(--copper);}
body.menu-open{overflow:hidden;}

@media (max-width:820px){
  .nav-toggle{display:flex;}
  header.nav{padding:15px clamp(14px,4vw,24px); gap:10px;}
  .brand{font-size:22px; margin-right:auto;}
  /* icon-only action buttons, outside the hamburger, sitting beside it */
  .nav-actions{display:flex; gap:2px; font-size:0;}
  .nav-actions a{padding:8px; gap:0;}
  .nav-actions a span:not(.badge){display:none;}
  .nav-actions .ni{width:20px; height:20px;}
  .nav-actions .nav-search{width:auto; height:auto; border:none; padding:8px;}
  .nav-actions .nav-search svg{width:19px; height:19px;}
  .nav-actions .badge{
    top:0; right:2px; width:14px; height:14px; font-size:9px;
  }
}
@media (max-width:380px){
  header.nav{padding:14px 12px; gap:6px;}
  .brand{font-size:20px;}
  .nav-actions a{padding:6px;}
  .nav-actions .ni,.nav-actions .nav-search svg{width:18px; height:18px;}
  .nav-toggle{width:38px; height:38px;}
}
@media (min-width:821px){
  .mobile-menu{display:none;}
}

/* ---- general mobile polish ---- */
@media (max-width:640px){
  .topbar{flex-direction:column; gap:4px; align-items:flex-start; font-size:10.5px; padding:10px 16px;}
  .home-hero h1{font-size:clamp(46px,14vw,72px);}
  .hero-copy{padding:32px 18px;}
  .hero-cta{width:100%;}
  .hero-cta .btn{flex:1; justify-content:center; padding:14px 16px;}
  .hero-panel{min-height:280px;}
  main{padding:20px 16px;}
  .grid{grid-template-columns:repeat(2,1fr); gap:18px 12px;}
  .card-body{padding:12px 12px 14px; gap:6px;}
  .card-body h3{font-size:14px;}
  .fits, .card-body .cat{font-size:11px;}
  .price-now{font-size:15px;}
  .section-head{margin:34px 0 16px;}
  .section-head h2{font-size:clamp(26px,7vw,34px);}
  .promo-band{flex-direction:column; align-items:flex-start; text-align:left; margin:0 16px;}
  .promo-band .btn{width:100%; justify-content:center;}
  .filterbar{padding:14px 16px; gap:8px;}
  .filterbar .count{width:100%; margin:4px 0 0;}
  .crumb{padding:12px 16px 0;}
  .footer-grid{grid-template-columns:1fr 1fr; gap:22px; padding:32px 16px 22px;}
  .footer-bottom{padding:16px; flex-direction:column; gap:6px;}
  .pdp{gap:24px; padding:16px;}
  .cart-wrap{padding:16px;}
  .line-item{grid-template-columns:72px 1fr; gap:12px;}
  .li-price{grid-column:2; text-align:left; margin-top:2px;}
  .contact-layout{padding:16px;}
  .about-hero{padding:36px 16px 32px;}
  .founder{padding:32px 16px;}
}
@media (max-width:340px){
  .grid{grid-template-columns:1fr;}
}

/* ===== home page sections ===== */

/* ---- marquee ---- */
.marquee{overflow:hidden; border-block:1px solid var(--line); background:var(--ink); color:var(--paper); padding:13px 0;}
.marquee-track{display:flex; width:max-content; animation:marquee 32s linear infinite; will-change:transform;}
.marquee-track > span{
  font-family:'Anton',sans-serif; font-size:19px; letter-spacing:.03em; text-transform:uppercase;
  white-space:nowrap; padding:0 22px; display:inline-flex; align-items:center; gap:22px;
}
.marquee-track > span::after{content:"✦"; color:var(--copper); font-size:13px;}
.marquee:hover .marquee-track{animation-play-state:paused;}
@keyframes marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* ---- category ---- */
.cat-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
  padding:0 clamp(18px,4vw,48px);
}
.cat-card{
  position:relative; aspect-ratio:3/4; overflow:hidden; text-decoration:none; color:var(--paper);
  display:flex; align-items:flex-end; padding:18px; border:1px solid var(--line);
  background:linear-gradient(160deg,var(--denim),var(--denim-deep));
}
.cat-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .45s ease;}
.cat-card::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(8,11,20,.85) 0%, rgba(8,11,20,.2) 55%, rgba(8,11,20,0) 100%);}
.cat-card:hover img{transform:scale(1.06);}
.cat-card span{position:relative; z-index:1; font-family:'Anton',sans-serif; font-size:20px; letter-spacing:.02em; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.6);}
.cat-card .arrow{position:relative; z-index:1; margin-left:auto; font-family:'IBM Plex Mono',monospace; color:var(--copper-soft);}
@media (max-width:820px){ .cat-grid{grid-template-columns:1fr 1fr;} }

/* ---- reel ---- */
.reel-row{
  display:flex; gap:14px; overflow-x:auto; padding:2px clamp(18px,4vw,48px) 10px;
  scroll-snap-type:x mandatory; scrollbar-width:thin;
}
.reel-item{
  position:relative; flex:0 0 clamp(210px,42vw,288px); aspect-ratio:1; overflow:hidden;
  border:1px solid var(--line); scroll-snap-align:start; text-decoration:none;
}
.reel-item img{width:100%; height:100%; object-fit:cover; transition:transform .45s ease;}
.reel-item:hover img{transform:scale(1.05);}
.reel-item::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:52%;
  background:linear-gradient(0deg, rgba(8,11,20,.82) 0%, rgba(8,11,20,0) 100%);
}
.reel-item .rtag{
  position:absolute; left:12px; right:12px; bottom:11px; z-index:1;
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.03em; color:#fff;
  font-weight:600; text-shadow:0 1px 6px rgba(0,0,0,.6);
}

/* ---- trust banner ---- */
.trust-row{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);
  border-block:1px solid var(--line);
}
.trust-cell{background:var(--paper); padding:24px 22px; display:flex; gap:13px; align-items:flex-start;}
.trust-cell svg{width:24px; height:24px; flex:none; color:var(--copper);}
.trust-cell h4{font-size:13.5px; margin:0 0 4px;}
.trust-cell p{margin:0; font-size:12.5px; color:var(--ink-soft); line-height:1.5;}
@media (max-width:820px){ .trust-row{grid-template-columns:1fr 1fr;} }
@media (max-width:460px){ .trust-row{grid-template-columns:1fr;} }

/* ---- series cards (home) — image + text below, always readable ---- */
.series-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
  padding:0 clamp(18px,4vw,48px);
}
.series-card{
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); background:var(--card-bg); text-decoration:none; color:var(--ink);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.series-card:hover{transform:translateY(-5px); box-shadow:0 16px 30px -16px rgba(20,15,8,.4); border-color:var(--copper);}
.series-card img{width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .45s ease;}
.series-card:hover img{transform:scale(1.05);}
.series-body{padding:13px 15px 15px; display:flex; flex-direction:column; gap:3px;}
.series-label{font-family:'Anton',sans-serif; font-size:18px; letter-spacing:.01em; color:var(--ink);}
.series-count{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--ink-soft);}
@media (max-width:820px){ .series-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:520px){ .series-grid{gap:12px;} .series-label{font-size:15px;} }

/* ---- featured.html tiles: stronger overlay so labels stay readable ---- */
.tile{aspect-ratio:4/5;}
.tile::before{background:linear-gradient(0deg, rgba(10,14,24,.78) 0%, rgba(10,14,24,.15) 55%, rgba(10,14,24,0) 100%);}
.tile .tile-label{text-shadow:0 2px 10px rgba(0,0,0,.55);}
.tile .tile-count{text-shadow:0 1px 6px rgba(0,0,0,.6);}
@media (max-width:820px){ .tile{aspect-ratio:3/4;} }

/* ---- light site-wide motion ---- */
@media (prefers-reduced-motion: no-preference){
  .btn{transition:background .2s ease, border-color .2s ease, color .2s ease, transform .16s ease;}
  .btn:hover{transform:translateY(-1px);}
  .btn:active{transform:translateY(0);}
  .chip{transition:background .18s ease, color .18s ease, border-color .18s ease, transform .16s ease;}
  .chip:hover{border-color:var(--copper); transform:translateY(-1px);}
  .crumb a, .footer-col a, .sec-head a, nav.links a{transition:color .2s ease;}
  .stat-tile, .process-card, .trust-cell{transition:background .25s ease;}
  .stat-tile:hover, .process-card:hover, .trust-cell:hover{background:var(--paper-raised);}
  .tl-row{transition:padding-left .2s ease;}
  .tl-row:hover{padding-left:6px;}
  .accordion summary{transition:color .18s ease;}
  .accordion summary:hover{color:var(--copper);}
  .reel-item img, .cat-card img{will-change:transform;}
}
nav.links a.active{border-color:var(--copper); color:var(--copper);}

/* ---- scroll-reactive glow on headlines & highlights ---- */
@media (prefers-reduced-motion: no-preference){
  h1, h2,
  .brand span,
  .marquee-track > span,
  .tile-label, .series-label, .fc-body h2,
  .hero-inner h1 em,
  .stamp .pct,
  .price-now, .save-badge,
  .stat-tile .num, .process-card .n, .tl-row .yr,
  .post-body .drop,
  .eyebrow, .fc-kicker, .listing-head .eyebrow, .section-lede .eyebrow,
  .topbar strong,
  .cat-card span, .shopfor span,
  .tm-card .stars,
  .chip.active, .hero-dots button.active{
    filter:
      drop-shadow(0 0 calc(var(--glow) * 11px) rgba(var(--glow-rgb), calc(var(--glow) * .65)))
      drop-shadow(0 0 calc(var(--glow) * 30px) rgba(var(--glow-rgb), calc(var(--glow) * .38)));
  }
  /* accent underline / bar elements pick up a matching bloom */
  .eyebrow::before, .listing-head .eyebrow::before,
  .sec-head a, .readmore, .fc-go{
    filter: drop-shadow(0 0 calc(var(--glow) * 8px) rgba(var(--glow-rgb), calc(var(--glow) * .5)));
  }
}

/* ---- testimonial marquee ---- */
.tm{overflow:hidden; padding:6px 0;}
.tm-track{display:flex; gap:16px; width:max-content; animation:marquee 46s linear infinite;}
.tm:hover .tm-track{animation-play-state:paused;}
.tm-card{
  flex:0 0 340px; background:var(--card-bg); border:1px solid var(--line); padding:22px 22px 20px;
  display:flex; flex-direction:column; gap:12px;
}
.tm-card .stars{color:var(--thread); font-size:13px; letter-spacing:2px;}
.tm-card p{margin:0; font-size:14px; line-height:1.6; color:var(--ink);}
.tm-card .who{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--ink-soft); letter-spacing:.03em; margin-top:auto;}
@media (max-width:480px){ .tm-card{flex-basis:280px;} }

@media (prefers-reduced-motion: reduce){
  .marquee-track, .tm-track{animation:none;}
}

/* ---- shared components for content pages (about / contact / wishlist) ---- */
.stat-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin:0 clamp(18px,4vw,48px);}
.stat-tile{background:var(--paper); padding:26px 22px; text-align:left;}
.stat-tile .num{font-family:'Anton',sans-serif; font-size:clamp(30px,4vw,42px); color:var(--copper); line-height:1;}
.stat-tile .lbl{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); margin-top:8px;}

.timeline{display:flex; flex-direction:column; gap:0; margin:0 clamp(18px,4vw,48px);}
.tl-row{display:grid; grid-template-columns:100px 1fr; gap:24px; padding:26px 0; border-bottom:1px solid var(--line);}
.tl-row .yr{font-family:'IBM Plex Mono',monospace; font-size:14px; color:var(--copper); font-weight:600;}
.tl-row h4{font-size:18px; margin-bottom:6px;}
.tl-row p{margin:0; font-size:14px; color:var(--ink-soft); line-height:1.6; max-width:60ch;}

.accordion{border-top:1px solid var(--line); margin:0 clamp(18px,4vw,48px);}
.accordion details{border-bottom:1px solid var(--line); padding:16px 2px;}
.accordion summary{font-weight:700; cursor:pointer; font-size:15px; list-style:none; display:flex; justify-content:space-between; align-items:center;}
.accordion summary::-webkit-details-marker{display:none;}
.accordion summary::after{content:"+"; font-family:'IBM Plex Mono',monospace; color:var(--copper); font-size:18px;}
.accordion details[open] summary::after{content:"–";}
.accordion p{margin:12px 0 0; font-size:14px; color:var(--ink-soft); line-height:1.65; max-width:64ch;}

.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.field{display:flex; flex-direction:column; gap:7px;}
.field.full{grid-column:1/-1;}
.field label{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft);}
.field input, .field textarea, .field select{
  border:1px solid var(--line); background:var(--card-bg); color:var(--ink);
  padding:12px 14px; font-family:'Archivo',sans-serif; font-size:14px;
  transition:border-color .2s ease;
}
.field input:focus, .field textarea:focus, .field select:focus{border-color:var(--copper); outline:none;}
.field textarea{resize:vertical; min-height:120px;}

.empty-state{padding:90px clamp(18px,4vw,48px); text-align:center;}
.empty-state .icon{font-size:44px; margin-bottom:14px;}
.empty-state h1{font-family:'Anton',sans-serif; font-size:clamp(28px,4vw,38px);}
.empty-state p{color:var(--ink-soft); margin:10px 0 24px;}

@media (max-width:640px){
  .form-grid{grid-template-columns:1fr;}
  .tl-row{grid-template-columns:1fr;}
}

/* ---- real photography in media slots ---- */
.card-media img.shot,
.li-media img.shot,
.fp-media img.shot,
.founder-media img.shot,
.main-media img.shot,
.thumb img.shot,
.post-hero img.shot{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block; z-index:0;
}
.card-media, .li-media, .fp-media, .founder-media, .main-media, .thumb, .post-hero{position:relative; overflow:hidden;}
.card-media img.shot{transition:transform .5s ease;}
.card:hover .card-media img.shot{transform:scale(1.06);}
.card-media .tag, .card-media .wish, .main-media .tag{z-index:2;}
.post-hero{aspect-ratio:21/8;}

.tile img.shot{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;}
.tile::before{z-index:1;}
.tile .tile-label, .tile .tile-count{z-index:2;}
.tile:hover img.shot{transform:scale(1.05);}
.tile img.shot{transition:transform .4s ease;}

.home-hero .hero-panel img.shot{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
}
.hero-panel .rivet, .hero-panel .stamp{z-index:2;}
.hero-panel::after{content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(160deg, rgba(20,28,48,.34), rgba(20,28,48,.62));}

/* ---- new-arrival tag variant ---- */
.tag.new{background:var(--copper); color:var(--paper);}

/* ---- blog cards ---- */
.blog-card .card-media{aspect-ratio:16/10;}
.blog-card .card-body .date{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--ink-soft); letter-spacing:.04em;}
.blog-card .excerpt{font-size:13.5px; color:var(--ink-soft); line-height:1.55; margin:0;}
.blog-card .readmore{margin-top:auto; padding-top:6px; font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--copper); font-weight:600;}

/* ---- featured collection tiles ---- */
.tile-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding:0 clamp(18px,4vw,48px);}
.tile{
  position:relative; aspect-ratio:3/4; overflow:hidden; text-decoration:none; color:var(--paper);
  display:flex; align-items:flex-end; padding:24px;
  background:linear-gradient(160deg,var(--denim) 0%, var(--denim-deep) 100%);
  transition:transform .3s ease;
}
.tile:hover{transform:translateY(-6px);}
.tile::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 55%);
}
.tile .tile-label{position:relative; font-family:'Anton',sans-serif; font-size:24px; letter-spacing:.01em;}
.tile .tile-count{position:relative; font-family:'IBM Plex Mono',monospace; font-size:11px; opacity:.85; margin-top:4px;}
.tile.wide{grid-column:span 2;}
@media (max-width:820px){
  .tile-grid{grid-template-columns:1fr 1fr;}
  .tile.wide{grid-column:span 2;}
}
@media (max-width:560px){
  .tile-grid{grid-template-columns:1fr;}
  .tile.wide{grid-column:span 1;}
}

/* ================= CONSOLIDATED MOBILE PASS ================= */
html,body{overflow-x:clip;}
img,video,svg{max-width:100%;}
[hidden]{display:none!important;}

@media (max-width:768px){
  header.nav{padding:15px clamp(14px,4vw,22px);}
  .crumb{padding:12px clamp(14px,4vw,22px) 0; font-size:11.5px;}
  .listing-head{padding:22px clamp(14px,4vw,22px) 14px;}
  .listing-head h1{font-size:clamp(34px,10vw,56px); line-height:.95;}
  .listing-head p{font-size:14px;}
  main{padding:20px clamp(14px,4vw,22px);}
  .sec-head{padding:0 clamp(14px,4vw,22px);}
  .filterbar{padding:14px clamp(14px,4vw,22px);}
  .section-lede, .about-hero, .contact-head, .post-head, .wl-head, .post-body, .post-footer-nav, .accordion, .stat-row, .timeline, .process-grid, .fcollections, .aplus, .pdp-tabs{
    padding-left:clamp(14px,4vw,22px); padding-right:clamp(14px,4vw,22px);
  }
  .stat-row, .timeline, .process-grid, .accordion{margin-left:0; margin-right:0;}
}

@media (max-width:600px){
  /* announcement */
  .announce{padding:8px 0;}
  .announce-track{font-size:11px;}
  .announce-track > span{padding:0 18px;}
  .announce-track > span::after{margin-left:18px;}

  /* section rhythm */
  .sec-head{flex-wrap:wrap; gap:4px 12px; margin:38px 0 16px;}
  .sec-head h2{font-size:clamp(24px,7.5vw,32px);}
  .sec-head .lede{font-size:12.5px;}
  .picks-head{margin:38px 0 14px;}
  .why{margin-top:40px;}

  /* product grid cards */
  .grid{grid-template-columns:repeat(2,1fr); gap:16px 12px;}
  .card-body{padding:11px 11px 13px; gap:5px;}
  .card-body h3{font-size:13.5px; line-height:1.3;}
  .card-body .cat, .fits{font-size:10.5px;}
  .price-now{font-size:14px;} .price-was{font-size:11.5px;}
  .swatches .swatch{width:14px; height:14px;}

  /* "why buy direct" — compact 2-up with inline number */
  .why-grid{grid-template-columns:1fr 1fr;}
  .why-item{padding:18px 14px;}
  .why-item .why-n{font-size:12px;}
  .why-item h4{font-size:13.5px; margin:8px 0 5px;}
  .why-item p{font-size:12px;}

  /* trust rows */
  .trust-row{grid-template-columns:1fr 1fr;}
  .trust-cell{padding:18px 14px; gap:10px;}
  .trust-cell h4{font-size:13px;}
  .trust-cell p{font-size:11.5px;}

  /* testimonial cards */
  .tm-card{flex-basis:260px; padding:18px;}
  .tm-card p{font-size:13px;}

  /* footer */
  .footer-grid{grid-template-columns:1fr 1fr; gap:20px 18px; padding:30px clamp(14px,4vw,22px) 22px;}
  .footer-grid .fbrand{font-size:20px;}
  .footer-bottom{padding:16px clamp(14px,4vw,22px); flex-direction:column; gap:6px; align-items:flex-start;}

  /* touch targets */
  .chip, .fit-tab{padding:9px 15px; font-size:12px;}
  .btn{padding:14px 22px;}
  .btn.sm{padding:11px 16px;}

  /* content pages */
  .stat-tile{padding:20px 16px;}
  .stat-tile .num{font-size:clamp(26px,8vw,36px);}
  .tl-row{padding:20px 0; gap:6px;}
  .process-card{padding:22px 16px;}
  .about-hero h1{font-size:clamp(40px,12vw,60px);}
  .contact-head h1, .post-head h1{font-size:clamp(34px,10vw,52px);}
  .accordion summary{font-size:14px;}
  .accordion p{font-size:13px;}
  .form-grid{grid-template-columns:1fr; gap:14px;}
  .info-card{padding:20px;}

  /* blog */
  .featured-post{grid-template-columns:1fr; margin:24px clamp(14px,4vw,22px) 0;}
  .featured-post .fp-media{min-height:0; aspect-ratio:16/10;}
  .featured-post .fp-body{padding:22px;}
}

@media (max-width:340px){
  .grid, .why-grid, .trust-row, .footer-grid{grid-template-columns:1fr;}
}