:root{
  --ink:#121212; --paper:#FAF8F3; --paper-2:#EFEAE0;
  --dark:#0A0D12; --dark-2:#141a22; --dark-3:#1b232e;
  --neon:#25C8FF; --neon-soft:#8fe3ff; --neon-ink:#077DAA; --ink-blue:#0B4A85;
  --red:#D6382A; --red-dark:#a92c20;
  --white:#ffffff; --grey:#9a9a94;
  --line-dark: rgba(255,255,255,0.12);
  --line-light: rgba(18,18,18,0.14);
  --font-display: 'Barlow Semi Condensed', Arial, sans-serif;
  --font-body: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body.snowtogs-2026{
  font-family:var(--font-body); color:var(--ink); line-height:1.5; -webkit-font-smoothing:antialiased;
  background:var(--dark) url(../img/texture-timber.jpg) center center / cover no-repeat fixed;
}
/* full-bleed like a normal site up to 1920px — the wood canvas only starts
   showing once the browser is wider than that, not at ordinary desktop
   widths. .page itself is transparent — the wood is the fixed page-canvas
   set on body above, and it shows through any section below that doesn't
   paint its own opaque background (brand strip, shop, footer). */
.page{width:100%; max-width:1920px; margin:0 auto; box-shadow:0 0 60px rgba(0,0,0,.35);}
@media (min-width:1200px){
  .page{width:calc(100% - 120px); max-width:1760px; box-shadow:0 0 50px rgba(0,0,0,.55);}
}
.multiply-tint{position:absolute; inset:0; background:var(--dark); mix-blend-mode:multiply; opacity:.6; pointer-events:none;}
.snowtogs-2026 h1, .snowtogs-2026 h2, .snowtogs-2026 h3, .snowtogs-2026 h4{font-family:var(--font-display); font-weight:800; line-height:0.95; margin:0; text-wrap:balance;}
.snowtogs-2026 p{margin:0;}
.snowtogs-2026 img{max-width:100%; display:block;}
.snowtogs-2026 a{color:inherit; text-decoration:none;}
.snowtogs-2026 button{font-family:inherit; cursor:pointer;}
.eyebrow{font-family:var(--font-body); font-weight:700; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.14em; color:var(--neon);}
/* cyan text on light backgrounds needs the darker ink variant for AA contrast;
   cyan stays as-is on dark backgrounds (shop-section's eyebrow, etc.) */
.what-we-do .eyebrow,
.products .eyebrow,
.advice .eyebrow,
.search-popular .eyebrow{color:var(--neon-ink);}
.eyebrow.on-dark{color:var(--neon);}
.placeholder-text{color:rgba(18,18,18,.55); font-style:italic; font-weight:500;}
.on-dark .placeholder-text, .hero-banner .placeholder-text{color:rgba(18,18,18,.55);}

/* ---------- layout helpers ---------- */
.wrap{max-width:1280px; margin:0 auto; padding-inline:clamp(1.25rem, 4vw, 2.5rem);}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2.5vw,1.75rem);}
.grid-6{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2vw,1.5rem);}
.grid-2{display:grid; grid-template-columns:1.1fr 0.9fr; gap:clamp(1rem,2.5vw,2rem);}
@media (max-width:900px){
  .grid-3{grid-template-columns:1fr; }
  .grid-6{grid-template-columns:repeat(2,1fr);}
  .grid-2{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .grid-6{grid-template-columns:1fr;}
}
.snowtogs-2026 section{position:relative;}

/* ---------- buttons: one solid family (client mock), plus grey filter pills ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.45rem; border-radius:0; border:none; font-weight:700; text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease;}
.btn svg{width:1em; height:1em;}
.btn.btn-solid{background:var(--ink); color:var(--white); padding:.95rem 2rem; font-size:.85rem;}
.btn.btn-solid:hover{background:#000; transform:translateY(-2px); box-shadow:0 8px 18px rgba(0,0,0,.28);}
.btn.btn-solid:active{transform:translateY(0);}
.btn.btn-solid--sm{padding:.6rem 1.3rem; font-size:.72rem;}
.btn.btn-solid--white{background:var(--white); color:var(--ink);}
.btn.btn-solid--white:hover{background:var(--paper-2);}
.btn.btn-solid--navy{background:var(--dark-2); color:var(--neon);}
.btn.btn-solid--navy:hover{background:var(--dark);}
.product-body .btn.btn-solid--navy{background:var(--neon); color:var(--white);}
.product-body .btn.btn-solid--navy:hover{background:#12B3EA; color:var(--white);}
/* NB: white on #25C8FF is ~1.9:1 contrast (below WCAG AA). Client chose white; ink #121212 would be ~10:1. */

.filter-pill{border:none; background:var(--paper-2); color:var(--ink); padding:.5rem 1.1rem; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; transition:all .2s ease;}
.filter-pill:hover{background:#d8d2c4;}
.filter-pill.is-active{background:var(--dark-2); color:var(--white);}

/* ---------- header ---------- */
.topbar{background:var(--dark); color:rgba(255,255,255,0.72); font-size:.76rem;}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; padding-block:.5rem;}
.topbar a{color:rgba(255,255,255,0.92); font-weight:600;}
.topbar a:hover{color:var(--neon);}
.topbar .tb-links{display:flex; align-items:center; gap:.6rem;}
.topbar .tb-sep{color:rgba(255,255,255,.35);}
@media (max-width:700px){ .topbar .tagline{display:none;} }

/* Header = the shop's timber wall: dark wood behind a glowing white logo,
   neon tube rules framing the menu, links light up like the sign. */
.header-sticky{
  position:sticky; top:0; z-index:100; color:var(--white);
  background:
    linear-gradient(180deg, rgba(10,13,18,.55), rgba(10,13,18,.8)),
    var(--dark) url(../img/texture-timber.jpg) center / cover no-repeat;
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}

.header-main{background:transparent;}
.header-main .wrap{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding-block:1.1rem .55rem; gap:1rem;}
.header-main .side{display:flex; align-items:center; gap:1rem;}
.header-main .side.right{justify-content:flex-end;}
.icon-btn{background:none; border:none; color:var(--ink); width:2rem; height:2rem; display:flex; align-items:center; justify-content:center; transition:color .2s ease;}
.icon-btn:hover{color:var(--ink-blue);}
.header-sticky .icon-btn{color:var(--white);}
.header-sticky .icon-btn:hover{color:var(--neon);}

.site-logo{display:flex; align-items:center;}
.site-logo img{width:clamp(9rem,16vw,12.5rem); height:auto; filter:drop-shadow(0 0 6px rgba(37,200,255,.55)) drop-shadow(0 0 22px rgba(37,200,255,.35));}

.btn.btn-book{
  background:var(--white); color:var(--ink); padding:.75rem 1.4rem; font-size:.74rem;
  transition:background-color .25s ease, box-shadow .25s ease, transform .2s ease;
}
.btn.btn-book svg{width:1.15em; height:1.15em;}
.btn.btn-book:hover,
.btn.btn-book:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 0 6px rgba(37,200,255,.65), 0 0 16px rgba(37,200,255,.4), 0 0 32px rgba(37,200,255,.2);
}

.hamburger{display:none;}
@media (max-width:900px){
  .header-main .side.right .btn-book{display:none;}
  .hamburger{display:flex;}
  .header-main .wrap{padding-block:.9rem;}
}

.header-nav{background:transparent;}
.header-nav .wrap{display:flex; align-items:center; justify-content:center; gap:clamp(1rem,2vw,1.6rem); padding-bottom:.85rem; position:relative;}
.nav-tube{flex:1 1 0; min-width:1.5rem; height:2px; background:rgba(255,255,255,.6);}
.main-nav{display:flex; align-items:center; gap:clamp(1.1rem,2.2vw,2.1rem); padding-block:.3rem; flex:0 0 auto;}
.main-nav a{
  font-family:var(--font-display); font-size:1rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em;
  color:rgba(255,255,255,.86); position:relative; padding-block:.25rem; white-space:nowrap;
  transition:color .2s ease, text-shadow .2s ease;
}
.main-nav a:hover,
.main-nav a:focus-visible,
.main-nav a[aria-current="page"],
.nav-item.is-open > .nav-dropdown-toggle{
  color:var(--white);
  text-shadow:0 0 4px #fff, 0 0 12px var(--neon), 0 0 26px rgba(37,200,255,.8);
}
/* current page: small glowing dot under the link */
.main-nav a::after{
  content:''; position:absolute; left:50%; bottom:-5px; width:5px; height:5px; border-radius:50%;
  background:var(--white); transform:translateX(-50%); opacity:0; transition:opacity .2s ease;
  box-shadow:0 0 6px var(--neon), 0 0 14px var(--neon);
}
.main-nav a[aria-current="page"]::after{opacity:1;}

.nav-item{position:static;}
.nav-dropdown-toggle{display:inline-flex; align-items:center; gap:.4rem;}
.nav-dropdown-caret{width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:5px solid currentColor; transition:transform .2s ease;}
.nav-item.is-open .nav-dropdown-caret{transform:rotate(180deg);}
/* dark panel with a neon top edge; sits just below the header */
.nav-dropdown{
  position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(6px);
  display:grid; grid-template-columns:minmax(180px,auto) minmax(200px,auto) 220px; gap:0;
  background:var(--dark-2); border-top:2px solid var(--neon); box-shadow:0 24px 40px rgba(0,0,0,.45);
  padding:0; margin-top:1.15rem;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
  z-index:60;
}
/* invisible bridge over the gap so hover isn't lost between link and panel */
.nav-dropdown::before{content:''; position:absolute; left:0; right:0; bottom:100%; height:1.4rem;}
.nav-item.is-open .nav-dropdown{opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0);}
.nav-dropdown-col{display:flex; flex-direction:column; gap:.6rem; padding:1.4rem 1.5rem;}
.nav-dropdown-col + .nav-dropdown-col{border-left:1px solid var(--line-dark);}
.nav-dropdown-heading{font-family:var(--font-display); font-weight:800; font-size:.8rem; text-transform:uppercase; letter-spacing:.12em; color:var(--neon); margin-bottom:.2rem; white-space:nowrap;}
.nav-dropdown-col a{font-family:var(--font-body); font-size:.86rem; font-weight:600; text-transform:none; letter-spacing:0; white-space:nowrap; color:var(--white); padding:0;}
.nav-dropdown-col a::after{display:none;}
.nav-dropdown-col a:hover,
.nav-dropdown-col a:focus-visible{color:var(--neon); text-shadow:none;}
.main-nav a.nav-dropdown-promo{
  position:relative; display:flex; flex-direction:column; justify-content:flex-end; gap:.35rem;
  padding:1rem 1.1rem; min-height:12rem; background-size:cover; background-position:center;
  letter-spacing:0; white-space:normal; overflow:hidden;
}
.nav-dropdown-promo::before{content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 30%, rgba(10,13,18,.92)); transition:background .3s ease;}
.main-nav a.nav-dropdown-promo::after{display:none;}
.main-nav a.nav-dropdown-promo:hover{text-shadow:none;}
.nav-dropdown-promo:hover::before{background:linear-gradient(180deg, rgba(0,80,217,.15) 20%, rgba(10,13,18,.92));}
.nav-dropdown-promo__title{position:relative; font-family:var(--font-display); font-weight:800; font-size:1.15rem; line-height:1; color:var(--white);}
.nav-dropdown-promo__cta{position:relative; font-family:var(--font-body); font-weight:700; font-size:.68rem; letter-spacing:.12em; color:var(--neon);}

/* ---------- shop dropdown: full-width mega menu ---------- */
.nav-dropdown.mega{
  left:clamp(1.25rem,4vw,2.5rem); right:clamp(1.25rem,4vw,2.5rem);
  margin-top:0; transform:translateY(6px);
  grid-template-columns:1fr 1fr 1fr 290px; grid-template-rows:1fr auto;
}
.nav-item.is-open .nav-dropdown.mega{transform:translateY(0);}
.nav-dropdown.mega::before{height:.9rem;}
.mega .mcol{padding:1.6rem 1.5rem 1.4rem; display:flex; flex-direction:column; gap:1.3rem; border-left:1px solid rgba(255,255,255,.1);}
.mega .mcol:first-child{border-left:0;}
.mega .mgroup{display:flex; flex-direction:column; gap:.5rem;}
.mega .nav-dropdown-heading{margin-bottom:.15rem;}
.mega .mrow{display:flex; align-items:baseline; gap:.55rem; white-space:nowrap;}
.main-nav .mega a.mlink{font-family:var(--font-body); font-size:.88rem; font-weight:600; letter-spacing:0; text-transform:none; color:var(--white); padding:0;}
.main-nav .mega a.mlink:hover,
.main-nav .mega a.mlink:focus-visible{color:var(--neon); text-shadow:none;}
.main-nav .mega a::after{display:none;}
.mega .msub{display:inline-flex; gap:.45rem;}
.main-nav .mega .msub a{font-family:var(--font-body); font-size:.74rem; font-weight:500; letter-spacing:0; text-transform:none; color:rgba(255,255,255,.55); padding:0;}
.main-nav .mega .msub a:hover{color:var(--neon); text-shadow:none;}
.mega .msub a + a::before{content:'·'; margin-right:.45rem; color:rgba(255,255,255,.3);}
.mega .nav-dropdown-promo{grid-column:4; grid-row:1 / span 2; min-height:100%;}
.mega .mfoot{grid-column:1 / span 3; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.85rem 1.5rem; background:rgba(255,255,255,.04); border-top:1px solid rgba(255,255,255,.1); font-size:.78rem; color:rgba(255,255,255,.65);}
.mega .mfoot strong{color:var(--white); font-weight:600;}
.main-nav .mega .mfoot a{font-family:var(--font-body); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--white); padding:.55rem 1rem; border:1.5px solid rgba(255,255,255,.5); white-space:nowrap;}
.main-nav .mega .mfoot a:hover{border-color:var(--white); background:rgba(255,255,255,.08); text-shadow:none;}
@media (max-width:900px){ .header-nav{display:none;} }

.nav-panel{position:fixed; inset:0 0 0 auto; width:min(86vw,360px); height:100vh; background:var(--dark); z-index:200; transform:translateX(100%); transition:transform .32s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; padding:1.5rem; gap:1.75rem; box-shadow:-12px 0 30px rgba(0,0,0,.4);}
.nav-panel.is-open{transform:translateX(0);}
.nav-panel-head{display:flex; justify-content:space-between; align-items:center;}
.nav-panel a{display:block; padding:.85rem 0; font-family:var(--font-display); font-weight:700; font-size:1.3rem; text-transform:uppercase; color:var(--white); border-bottom:1px solid var(--line-dark);}
.nav-panel a:hover{color:var(--neon);}
.nav-scrim{position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:190; opacity:0; pointer-events:none; transition:opacity .3s ease;}
.nav-scrim.is-open{opacity:1; pointer-events:auto;}

/* ---------- opening times / availability (header, left) ---------- */
.appt{position:relative;}
.appt-btn{
  display:flex; align-items:center; gap:.55rem; padding:.6rem 1rem;
  border:1.5px solid rgba(255,255,255,.55); background:rgba(10,13,18,.25); color:var(--white);
  font-family:var(--font-body); font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; line-height:1;
  cursor:pointer; white-space:nowrap; transition:border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
}
.appt-btn svg{width:1.15em; height:1.15em; flex:0 0 auto;}
.appt-btn:hover,
.appt-btn:focus-visible,
.appt-btn[aria-expanded="true"]{
  border-color:var(--white); background:rgba(10,13,18,.45);
  box-shadow:0 0 6px rgba(37,200,255,.55), 0 0 16px rgba(37,200,255,.3);
}
.appt-btn__sep{width:1px; height:1rem; background:rgba(255,255,255,.3);}
.appt-btn__free{display:flex; align-items:center; gap:.4rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:rgba(255,255,255,.75);}
.appt-swap{position:relative; display:inline-block; height:1.1em; overflow:hidden; vertical-align:middle; text-align:center;}
.appt-swap__item{
  position:absolute; left:0; right:0; top:0; line-height:1.1em; white-space:nowrap;
  transform:translateY(-115%); opacity:0;
  transition:transform .5s cubic-bezier(.65,0,.35,1), opacity .5s ease;
}
.appt-swap__item.is-in{transform:translateY(0); opacity:1;}
.appt-swap__item.is-out{transform:translateY(115%); opacity:0;}
.appt-swap__item.no-anim{transition:none;}
@media (prefers-reduced-motion:reduce){ .appt-swap__item{transition:none;} }
.appt-dot{width:6px; height:6px; border-radius:50%; background:#3ddc84; box-shadow:0 0 0 3px rgba(61,220,132,.2);}
.appt-dot.is-low{background:#f5a524; box-shadow:0 0 0 3px rgba(245,165,36,.22);}
.appt-caret{border:4px solid transparent; border-top:5px solid currentColor; margin:4px 0 0 .1rem; transition:transform .2s ease;}
.appt-btn[aria-expanded="true"] .appt-caret{transform:rotate(180deg); margin-top:-4px;}

.appt-panel{
  position:absolute; left:0; top:calc(100% + 1.15rem); width:360px; z-index:130;
  background:var(--paper); color:var(--ink); box-shadow:0 22px 40px rgba(0,0,0,.4);
  padding:1.4rem 1.5rem 1.25rem; text-align:left;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
  max-height:calc(100vh - 6rem); overflow:auto;
}
.appt-panel.is-open{opacity:1; visibility:visible; transform:none;}
.appt-panel::before{content:''; position:absolute; left:1.3rem; bottom:100%; border:8px solid transparent; border-bottom-color:var(--paper);}
.appt-panel h3{font-family:var(--font-display); font-weight:800; font-size:1.4rem; text-transform:uppercase; letter-spacing:.02em; line-height:1; margin:0;}
.appt-hours{list-style:none; margin:.75rem 0 0; padding:0;}
.appt-hours li{display:flex; justify-content:space-between; gap:1rem; padding:.4rem 0; border-top:1px solid rgba(18,18,18,.1); font-size:.82rem;}
.appt-hours__days{font-weight:700;}
.appt-hours__value{color:rgba(18,18,18,.7);}
.appt-intro{font-size:.82rem; line-height:1.45; color:rgba(18,18,18,.75); margin:.9rem 0 1rem;}
.appt-intro strong{color:var(--ink);}
.appt-weeks{background:rgba(18,18,18,.04); padding:.9rem 1rem; margin:0 0 .5rem;}
.appt-service-tabs{display:flex; gap:.35rem; margin-bottom:.8rem; flex-wrap:wrap;}
.appt-service-tab{flex:1 1 auto; background:var(--white); border:1.5px solid rgba(18,18,18,.2); padding:.4rem .5rem; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.02em; cursor:pointer; color:rgba(18,18,18,.65); transition:background-color .15s,border-color .15s,color .15s;}
.appt-service-tab.is-active{background:var(--neon); border-color:var(--neon); color:var(--ink);}
.appt-weeks__nav{display:flex; align-items:center; justify-content:space-between; gap:.5rem;}
.appt-weeks__label{font-family:var(--font-display); font-weight:800; font-size:.95rem; text-transform:uppercase; letter-spacing:.01em; flex:1; text-align:center;}
.appt-weeks__arrow{background:none; border:1.5px solid rgba(18,18,18,.25); width:1.8rem; height:1.8rem; line-height:1; cursor:pointer; color:var(--ink); transition:border-color .15s, background-color .15s;}
.appt-weeks__arrow:hover{border-color:var(--ink); background:rgba(18,18,18,.06);}
.appt-weeks__count{font-size:.82rem; margin:.6rem 0 0; text-align:center; color:rgba(18,18,18,.75);}
.appt-weeks__count strong{color:var(--ink); font-weight:800;}
.appt-weeks .btn{display:block; width:100%; margin-top:.7rem; text-align:center; padding:.6rem 1rem; border:none; cursor:pointer;}
.appt-weeks [data-week-toggle]{background:var(--neon); color:var(--ink); font-size:.8rem; padding:.75rem 1rem;}
.appt-weeks [data-week-toggle]:hover{background:var(--neon-soft);}
.appt-week-detail{margin-top:.8rem; max-height:260px; overflow-y:auto;}
.appt-day{padding:.5rem 0; border-top:1px solid rgba(18,18,18,.1);}
.appt-day__name{display:block; font-weight:700; font-size:.78rem; margin-bottom:.35rem;}
.appt-closed,.appt-full{font-size:.76rem; font-weight:600; color:rgba(18,18,18,.45);}
.appt-slots{display:flex; gap:.3rem; flex-wrap:wrap;}
.appt-slot{
  min-width:3.2rem; text-align:center; font-size:.72rem; font-weight:700; padding:.32rem .2rem;
  border:1.5px solid var(--ink); background:var(--white); color:var(--ink); text-decoration:none; transition:background-color .15s, color .15s;
}
.appt-slot:hover,.appt-slot:focus-visible{background:var(--neon); border-color:var(--neon); color:var(--ink);}
.appt-panel .btn{width:100%; margin-top:.9rem; padding:.85rem 1rem;}
.appt-parking{display:flex; gap:.45rem; align-items:flex-start; margin-top:.75rem; font-size:.72rem; color:rgba(18,18,18,.55);}
@media (max-width:1100px){ .appt-btn__sep, .appt-btn__free{display:none;} }
@media (max-width:900px){
  .appt-btn__label, .appt-caret{display:none;}
  .appt-btn{padding:.55rem;}
  .appt-panel{position:fixed; left:1rem; right:1rem; width:auto; top:4.5rem; max-height:calc(100vh - 6rem); overflow:auto;}
  .appt-panel::before{display:none;}
}

/* ---------- search panel (header) ---------- */
.visually-hidden{position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
.search-panel{
  position:absolute; left:0; right:0; top:100%; z-index:120;
  background:var(--paper); color:var(--ink); box-shadow:0 22px 40px rgba(0,0,0,.35); padding:1.75rem 0 1.5rem;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .22s ease, transform .22s ease, visibility .22s;
}
.search-panel.is-open{opacity:1; visibility:visible; transform:none;}
.search-panel .wrap{position:relative;}
.search-form{display:flex; align-items:center; gap:.9rem; border-bottom:2px solid var(--ink); padding-bottom:.6rem; margin-right:3.25rem;}
.search-form svg{width:26px; height:26px; flex:0 0 auto;}
.search-form input{flex:1; min-width:0; border:0; background:transparent; outline:none; padding:.2rem 0; font-family:var(--font-display); font-weight:700; font-size:clamp(1.4rem,2.6vw,2rem); color:var(--ink);}
.search-form input::placeholder{color:rgba(18,18,18,.38);}
.search-form .btn{padding:.8rem 1.6rem;}
.search-popular{display:flex; align-items:center; flex-wrap:wrap; gap:.5rem; margin-top:1.1rem;}
.search-popular .eyebrow{margin-right:.5rem;}
.search-popular .filter-pill{display:inline-block;}
.search-close{position:absolute; right:clamp(1.25rem,4vw,2.5rem); top:-.2rem; width:2.5rem; height:2.5rem; border:0; background:var(--ink); color:var(--white); display:flex; align-items:center; justify-content:center; cursor:pointer;}
.search-close:hover{background:#000;}
.search-close svg{width:18px; height:18px;}
.search-scrim{position:fixed; inset:0; z-index:90; background:rgba(10,13,18,.55); opacity:0; pointer-events:none; transition:opacity .22s ease;}
.search-scrim.is-open{opacity:1; pointer-events:auto;}

/* ---------- hero (4-slide carousel) ---------- */
.hero-banner{position:relative; overflow:hidden; color:var(--ink); height:clamp(460px,calc(100svh - 17rem),720px);}
.hero-track{display:flex; height:100%; transition:transform .7s cubic-bezier(.65,0,.35,1);}
.hero-slide{flex:0 0 100%; position:relative; height:100%; overflow:hidden; background:var(--neon);}
.hero-slide--black{background:var(--dark);}
.hero-slide--blue{background:#0050D9;}
.hero-slide--ice{background:#8FE3FF;}
.hero-slide.hero-slide--black .h,
.hero-slide.hero-slide--blue .h{color:var(--white);}
.hero-slide.hero-slide--black .sub{color:rgba(255,255,255,.78);}
.hero-slide.hero-slide--blue .sub{color:rgba(255,255,255,.82);}

.hero-slide__media{position:absolute; top:0; right:0; bottom:0; width:64%; clip-path:polygon(14% 0,100% 0,100% 100%,0 100%);}
.hero-slide__media img{width:100%; height:100%; object-fit:cover;}
.hero-slide--flip .hero-slide__media{right:auto; left:0; clip-path:polygon(0 0,86% 0,100% 100%,0 100%);}

.hero-banner .hero-slide__inner{position:relative; height:100%; display:flex; align-items:center; justify-content:flex-start;}
.hero-banner .hero-slide--flip .hero-slide__inner{justify-content:flex-end;}
.hero-slide .copy{display:flex; flex-direction:column; gap:1.1rem; max-width:min(440px,31vw);}
.hero-slide--flip .copy{text-align:right; align-items:flex-end;}
.hero-slide .h{font-family:var(--font-display); font-weight:800; line-height:.95; margin:0; font-size:clamp(2.2rem,4.6vw,3.6rem); color:var(--ink);}
.hero-slide .sub{font-size:clamp(.95rem,1.4vw,1.05rem); color:rgba(18,18,18,.78); max-width:36ch; font-weight:500;}
.hero-slide .actions{margin-top:1.6rem;}

.hero-controls{position:absolute; left:0; right:0; bottom:1.1rem; display:flex; justify-content:center; pointer-events:none;}
.hero-controls__pill{pointer-events:auto; display:flex; align-items:center; gap:.75rem; padding:.35rem; border-radius:999px; background:rgba(10,13,18,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);}
.hero-arrow{width:2.1rem; height:2.1rem; border:0; border-radius:50%; background:transparent; color:var(--white); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background-color .2s ease;}
.hero-arrow:hover, .hero-arrow:focus-visible{background:rgba(255,255,255,.15);}
.hero-arrow svg{width:18px; height:18px;}
.hero-dots{display:flex; gap:.4rem;}
.hero-dot{width:28px; height:3px; border:0; padding:0; background:rgba(255,255,255,.35); cursor:pointer; transition:background-color .2s ease, width .2s ease;}
.hero-dot[aria-current="true"]{background:var(--white); width:44px;}

@media (max-width:900px){
  .hero-banner{height:auto;}
  .hero-slide{height:auto; display:flex; flex-direction:column;}
  .hero-slide__media, .hero-slide--flip .hero-slide__media{position:relative; width:100%; height:240px; clip-path:none;}
  .hero-banner .hero-slide__inner{padding-block:2rem 5rem;}
  .hero-banner .hero-slide--flip .hero-slide__inner{justify-content:flex-start;}
  .hero-slide .copy{max-width:none;}
  .hero-slide--flip .copy{text-align:left; align-items:flex-start;}
}
@media (prefers-reduced-motion:reduce){ .hero-track{transition:none;} }

/* ---------- brand strip: neon-tube treatment, echoing the shop's own sign.
   Logos are real outline artwork (hollow tube shapes, not solid fills), so
   the glow is a direct drop-shadow stack — no synthetic outline filter
   needed. Static row, each logo a real link, soft flicker. ---------- */
.brand-strip{position:relative; padding-block:1.6rem;}
.brand-row{display:flex; justify-content:space-between; align-items:center; gap:clamp(1.5rem,4vw,3rem); flex-wrap:wrap;}
.brand-slot{display:flex; align-items:center; justify-content:center; width:clamp(84px,11vw,148px); height:clamp(2rem,3.6vw,2.9rem);}
.brand-logo{
  max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; opacity:1;
  filter:brightness(0) invert(1)
    drop-shadow(0 0 8px var(--neon))
    drop-shadow(0 0 20px rgba(37,200,255,.75))
    drop-shadow(0 0 42px rgba(37,200,255,.55))
    drop-shadow(0 0 70px rgba(37,200,255,.3));
  transition:filter .3s ease, opacity .3s ease;
  animation:neon-flicker 5s ease-in-out infinite;
}
.brand-slot:nth-child(2n) .brand-logo{animation-duration:6.2s; animation-delay:.6s;}
.brand-slot:nth-child(3n) .brand-logo{animation-duration:4.6s; animation-delay:1.4s;}
.brand-slot:hover .brand-logo{
  filter:brightness(0) invert(1)
    drop-shadow(0 0 10px var(--neon))
    drop-shadow(0 0 26px rgba(37,200,255,.9))
    drop-shadow(0 0 54px rgba(37,200,255,.7))
    drop-shadow(0 0 90px rgba(37,200,255,.4));
}
@keyframes neon-flicker{
  0%,100%{opacity:1;} 92%{opacity:1;} 93%{opacity:.6;} 94%{opacity:1;} 96%{opacity:.78;} 97%{opacity:1;}
}
@media (prefers-reduced-motion:reduce){.brand-logo{animation:none;}}

/* ============ NEON OUTLINE TEXT (reusable — headings, flashes) ============ */
.neon-text{
  font-family:var(--font-display); text-transform:uppercase; letter-spacing:.08em;
  color:rgba(0,80,217,.55) !important; -webkit-text-stroke:1.75px #fff;
  text-shadow:0 0 3px #fff, 0 0 9px var(--neon), 0 0 24px rgba(37,200,255,.8), 0 0 48px rgba(37,200,255,.55), 0 0 80px rgba(37,200,255,.3);
  animation:neon-flicker 5s ease-in-out infinite;
}
@media (prefers-reduced-motion:reduce){.neon-text{animation:none;}}

/* ---------- what we do ---------- */
.what-we-do{padding-block:clamp(3rem,7vw,5rem); background:var(--white);}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; margin-bottom:clamp(1.75rem,4vw,2.75rem); flex-wrap:wrap;}
.section-head h2{font-size:clamp(1.9rem,4.2vw,2.75rem);}
.service-card{height:100%; display:flex; flex-direction:column; overflow:hidden; transition:transform .3s ease, box-shadow .3s ease;}
.service-card:hover{transform:translateY(-6px); box-shadow:0 18px 34px rgba(0,0,0,.22);}
.service-card__photo{aspect-ratio:4/3; overflow:hidden;}
.service-card__photo img{width:100%; height:100%; object-fit:cover; transition:transform .45s ease;}
.service-card:hover .service-card__photo img{transform:scale(1.05);}
.service-card__panel{background:#14263d; color:var(--white); flex:1; padding:clamp(1.6rem,3vw,2.25rem); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:1rem;}
.service-card:nth-child(2) .service-card__panel{background:var(--dark);}
.service-card h3{font-size:1.35rem; color:var(--white); text-transform:uppercase; letter-spacing:.06em;}
.service-card p{color:rgba(255,255,255,.68); font-size:.88rem;}


/* ---------- cta banner ---------- */
/* self-contained background stack — Safari won't blend mix-blend-mode layers
   against the body's background-attachment:fixed timber, so the old
   ::before/::after approach rendered flat orange-red there. */
.cta-banner{
  color:var(--white); padding-block:clamp(2.75rem,5.5vw,4rem); position:relative; overflow:hidden;
  background-color:var(--red);
  background-image:
    radial-gradient(ellipse 70% 120% at 22% 45%, rgba(255,80,55,.75), rgba(214,56,42,.45) 45%, rgba(150,28,18,.35) 100%),
    linear-gradient(var(--red), var(--red)),
    url(../img/texture-timber.jpg);
  background-size:100% 100%, 100% 100%, cover;
  background-position:center;
  background-repeat:no-repeat;
  background-blend-mode:screen, color, normal;
}
.cta-banner .wrap{position:relative; z-index:1; display:flex; align-items:flex-start; justify-content:space-between; gap:clamp(2rem,5vw,4rem); flex-wrap:wrap;}
.cta-copy{max-width:420px;}
.cta-copy h2{font-size:clamp(2rem,4.5vw,2.75rem); text-transform:uppercase;}
/* title: red neon instead of blue */
.cta-banner h2.neon-text{
  color:rgba(255,95,70,.38) !important;
  -webkit-text-stroke:1.75px #fff3ef;
  text-shadow:0 0 3px #fff, 0 0 10px #ff6a50, 0 0 24px rgba(255,80,55,.85), 0 0 48px rgba(230,50,30,.6), 0 0 80px rgba(200,30,15,.4);
}
.cta-copy p{color:rgba(255,255,255,.88); margin-top:.6rem; font-size:.92rem;}
.cta-copy .btn-solid{background:var(--white); color:var(--ink); margin-top:1.75rem;}
.cta-copy .btn-solid:hover{background:var(--dark); color:var(--white);}
.cta-steps{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,3vw,2.75rem); flex:1; align-self:center;}
.cta-step{position:relative; padding-top:4.6rem; text-align:left;}
.cta-step .step-num{
  position:absolute; top:-1.1rem; left:-.35rem;
  font-family:var(--font-display); font-weight:800; font-size:7.5rem; line-height:1; letter-spacing:-.02em;
  color:transparent; -webkit-text-stroke:2px rgba(255,255,255,.5);
}
.cta-step .step-num::before{content:'0';}
.cta-step h4{position:relative; font-family:var(--font-display); font-weight:800; font-size:1.25rem; text-transform:uppercase; letter-spacing:.04em; color:var(--white); margin:0 0 .35rem;}
.cta-step p{position:relative; color:rgba(255,255,255,.8); font-size:.88rem; margin:0;}
/* dashed arrow between steps */
.cta-step:not(:last-child)::after{content:''; position:absolute; top:2.6rem; left:6.3rem; right:-1.6rem; height:2px; background:repeating-linear-gradient(90deg, rgba(255,255,255,.55) 0 8px, transparent 8px 14px);}
.cta-step:not(:last-child)::before{content:''; position:absolute; top:calc(2.6rem - 4px); right:-1.65rem; width:10px; height:10px; border-top:2px solid rgba(255,255,255,.75); border-right:2px solid rgba(255,255,255,.75); transform:rotate(45deg);}
@media (max-width:900px){
  .cta-steps{grid-template-columns:1fr;}
  .cta-step::after, .cta-step::before{display:none;}
}

/* ---------- product grid ---------- */
.products{padding-block:clamp(3rem,7vw,5rem); background:var(--paper);}
.filters{display:flex; gap:.55rem; flex-wrap:wrap;}
.product-card{position:relative; display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line-light); border-radius:0; overflow:hidden; transition:box-shadow .3s ease, transform .3s ease;}
.product-card:hover{box-shadow:0 16px 28px rgba(18,18,18,.1); transform:translateY(-3px);}
.product-media{position:relative; aspect-ratio:4/5; background:var(--white); overflow:hidden; border-bottom:3px solid var(--neon);}
.product-media img{width:100%; height:100%; object-fit:contain; padding:1.25rem; transition:transform .45s ease;}
.product-card:hover .product-media img{transform:scale(1.05);}
/* neon "flash" badges — glowing outline instead of a flat fill, same tube
   language as the brand strip and the shop's own sign */
.product-badge{position:absolute; top:.6rem; left:.6rem; z-index:2; padding:.35rem .75rem; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; background:rgba(10,13,18,.88); border:1.5px solid var(--neon); color:var(--neon); text-shadow:0 0 4px var(--neon), 0 0 10px rgba(37,200,255,.8); box-shadow:0 0 6px rgba(37,200,255,.5), 0 0 16px rgba(37,200,255,.3), inset 0 0 6px rgba(37,200,255,.25);}
.product-card .product-media .product-badge{
  animation:none; filter:none; box-shadow:none; border:0; outline:0; border-radius:0;
  -webkit-text-stroke:0; text-shadow:none;
  font-family:var(--font-body); font-size:.66rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; line-height:1;
  padding:.4rem .65rem;
}
.product-card .product-media .product-badge::before,
.product-card .product-media .product-badge::after{display:none;}
.product-card .product-media .product-badge--new{background:var(--red); color:var(--white);}
.product-card .product-media .product-badge--sale{background:#FFC93C; color:var(--ink);}
.product-body{padding:1rem 1.15rem 1.25rem; display:flex; flex-direction:column; gap:.2rem;}
.product-body h4{font-family:var(--font-body); font-weight:700; font-size:.88rem; text-transform:uppercase; letter-spacing:.01em;}
.product-body .meta{font-size:.78rem; color:rgba(18,18,18,.6);}
.product-body .specs{font-size:.74rem; color:rgba(18,18,18,.5); margin-top:.15rem;}
.product-body .price{font-family:var(--font-display); font-weight:800; font-size:1.3rem; margin-top:.35rem;}
.product-body .price-was{font-family:var(--font-body); font-weight:600; font-size:.85rem; color:rgba(18,18,18,.4); text-decoration:line-through; margin-right:.4rem;}
.product-body .price-now{color:var(--red);}
.product-body .btn-solid{margin-top:.65rem; align-self:flex-start;}
.view-more{display:flex; justify-content:center; margin-top:clamp(1.75rem,3.5vw,2.5rem);}
.collapsible{
  display:grid; grid-template-rows:0fr; opacity:0; margin-top:0;
  transition:grid-template-rows .5s ease, opacity .4s ease, margin-top .5s ease;
}
.collapsible > *{min-height:0; overflow:hidden;}
.collapsible.is-open{grid-template-rows:1fr; opacity:1; margin-top:clamp(1rem,2vw,1.5rem);}
@media (prefers-reduced-motion:reduce){.collapsible{transition:none;}}

/* ---------- shop (one 3-col grid: the big Skis tile spans 2, SKMOJO spans 1,
   then Protection/Accessories/Vision each span 1 — same grid, same gutters) ---------- */
.shop-section{padding-block:clamp(3rem,7vw,5rem); color:var(--white); position:relative;}
.shop-section h2{color:var(--white);}
.shop-section .shop-strap{color:rgba(255,255,255,.75); font-size:.98rem; margin-top:.6rem; max-width:44ch;}
.shop-section .section-head{align-items:flex-end;}
.shop-section .section-head .btn{flex:0 0 auto;}
.shop-section .wrap{position:relative;}

.shop-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; margin-top:clamp(1.75rem,4vw,2.75rem);}
@media (max-width:800px){.shop-grid{grid-template-columns:1fr;}}

.shop-tile{position:relative; overflow:hidden;}
.shop-tile img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .45s ease;}
.shop-tile:hover img{transform:scale(1.05);}

.shop-tile--hero{grid-column:span 2; min-height:400px;}
@media (max-width:800px){.shop-tile--hero{grid-column:span 1;}}
.shop-tile--hero img{position:absolute; inset:0;}
.shop-tile--hero .label{position:absolute; top:0; left:0; padding:clamp(1.25rem,2.5vw,2rem); display:flex; flex-direction:column; gap:.3rem;}
.shop-tile--hero .label h3{color:var(--ink); font-size:clamp(1.6rem,2.6vw,2.2rem);}
.shop-tile--hero .label p{color:var(--ink); font-weight:600; font-size:.9rem;}

.shop-tile--skmojo{background:var(--dark-3); min-height:400px;}
.shop-tile--skmojo img{position:absolute; inset:0;}
.shop-tile--skmojo .fade{position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.95), rgba(0,0,0,0) 65%); mix-blend-mode:multiply;}
.shop-tile--skmojo .info{position:absolute; left:0; right:0; bottom:0; z-index:1; padding:clamp(1.1rem,2vw,1.5rem); display:flex; flex-direction:column; gap:.4rem;}
.shop-tile--skmojo h3{font-size:1.5rem; color:var(--white);}
.shop-tile--skmojo p{color:rgba(255,255,255,.8); font-size:.85rem;}

.shop-tile--category{background:var(--white); aspect-ratio:4/3;}
.shop-tile--category img{object-fit:contain; padding:1rem;}
.shop-tile--category .label{position:absolute; left:0; bottom:0; padding:.9rem 1.1rem; font-family:var(--font-display); font-weight:800; font-size:1.15rem; text-transform:uppercase; letter-spacing:.02em; color:var(--ink);}

/* ---------- fit advice (replaces "our story") ---------- */
.advice{background:var(--white); padding-block:clamp(3.5rem,7vw,5.5rem);}
.advice .section-head p{max-width:46ch; color:rgba(18,18,18,.68); font-size:.98rem; margin-top:.6rem;}
.advice-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.25rem,2.5vw,2rem);}
/* the cards are a WP Query Loop (ul.wp-block-post-template.is-layout-flow);
   WP's flow layout adds a 24px top margin to every item but the first. */
.advice-grid.wp-block-post-template > *{margin-block:0;}

/* "Jump to a problem" row */
.advice-topics{display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin:-.5rem 0 clamp(1.5rem,2.5vw,2rem);}
.advice-topics__label{font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(18,18,18,.5); margin-right:.4rem;}
.advice-topic{font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); border:1.5px solid var(--ink); padding:.5rem .85rem; transition:background-color .15s, color .15s, border-color .15s;}
.advice-topic:hover,
.advice-topic:focus-visible{background:var(--neon); border-color:var(--neon); color:var(--ink);}
.advice-card{display:flex; flex-direction:column; background:var(--white); border:1px solid rgba(18,18,18,.1); transition:transform .3s ease, box-shadow .3s ease; position:relative;}
.advice-card:hover{transform:translateY(-4px); box-shadow:0 18px 34px rgba(0,0,0,.12);}
.advice-card__img{position:relative; aspect-ratio:4/3; overflow:hidden;}
.advice-card__img figure{margin:0; width:100%; height:100%;}
.advice-card__img img{width:100%; height:100%; object-fit:cover; transition:transform .45s ease;}
.advice-card:hover .advice-card__img img{transform:scale(1.04);}
.advice-card__tag{position:absolute; left:1rem; top:1rem; background:var(--ink); color:var(--white); font-size:.64rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; padding:.4rem .6rem;}
.advice-card__body{padding:1.4rem 1.4rem 1.5rem; display:flex; flex-direction:column; gap:.7rem; flex:1;}
.advice-card__meta{font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--neon-ink);}
.advice-card h3{font-family:var(--font-display); font-weight:800; font-size:1.45rem; line-height:1.05; margin:0; color:var(--ink);}
.advice-card p{font-size:.9rem; line-height:1.55; color:rgba(18,18,18,.7); margin:0;}
.advice-card__more{margin-top:auto; padding-top:.4rem; font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--ink);}
.advice-card:hover .advice-card__more{color:var(--neon-ink);}
/* whole-card click target via the real post-title link */
.advice-card h3 a{color:inherit; text-decoration:none;}
.advice-card h3 a::after{content:''; position:absolute; inset:0;}
/* "Boots hurting?" strip */
.advice-strip{margin-top:clamp(1.75rem,3vw,2.5rem); background:var(--ink); padding:1.6rem 1.8rem; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1.25rem 2rem;}
.advice-strip .advice-strip__title{font-family:var(--font-display); font-weight:800; font-size:1.7rem; line-height:1; text-transform:uppercase; letter-spacing:.01em; color:var(--white); white-space:nowrap;}
.advice-strip .advice-strip__text{font-size:.92rem; line-height:1.5; color:rgba(255,255,255,.72); max-width:52ch;}
.advice-strip .btn{background:var(--neon); color:var(--ink);}
.advice-strip .btn:hover{background:#12B3EA; color:var(--ink);}
@media (max-width:900px){
  .advice-grid{grid-template-columns:1fr;}
  .advice-strip{grid-template-columns:1fr;}
  .advice-strip .advice-strip__title{white-space:normal;}
}

/* ---------- footer (transparent — the page wood shows through, darkened) ---------- */
.site-footer{color:rgba(255,255,255,.75); position:relative; overflow:hidden;}
.footer-inner{position:relative; padding-block:clamp(2.75rem,5.5vw,4rem) 0;}

.footer-newsletter{padding-bottom:clamp(2.25rem,5vw,3.25rem); margin-bottom:clamp(2.25rem,5vw,3.25rem); border-bottom:1px solid var(--line-dark);}
.footer-newsletter-inner{display:flex; justify-content:space-between; align-items:center; gap:clamp(1.5rem,4vw,3rem); flex-wrap:wrap;}
.footer-newsletter h3{font-size:clamp(1.5rem,2.8vw,2.1rem); color:var(--white);}
.footer-newsletter p{color:rgba(255,255,255,.7); font-size:.88rem; max-width:38ch; margin-top:.4rem;}
.newsletter-form{display:flex; gap:.75rem; flex-wrap:wrap; flex:1 1 420px; max-width:480px;}
.newsletter-form input{flex:1 1 220px; min-width:200px; background:rgba(255,255,255,.07); border:1.5px solid rgba(255,255,255,.32); color:var(--white); padding:.95rem 1.1rem; font-size:.88rem; font-family:var(--font-body);}
.newsletter-form input::placeholder{color:rgba(255,255,255,.5);}
.newsletter-form input:focus{outline:2px solid var(--neon); outline-offset:2px; border-color:var(--neon);}
.newsletter-confirm{font-family:var(--font-display); font-weight:800; font-size:1.2rem; color:var(--neon); flex:1 1 420px; display:none;}

.footer-cols{display:grid; grid-template-columns:1.25fr .9fr .9fr .8fr 300px; gap:clamp(1.5rem,2.6vw,2.75rem); align-items:start;}
.footer-cols .fcol{display:flex; flex-direction:column; gap:.6rem; min-width:0;}
.footer-cols .fcol h5{margin:0 0 .5rem;}
.footer-cols .fcol > a,
.footer-cols .fcol > address,
.footer-cols .fcol > p{margin:0; padding:0; line-height:1.35;}
.footer-cols .fcol > a{color:rgba(255,255,255,.78); font-size:.86rem; transition:color .2s ease;}
.footer-cols .fcol > a:hover{color:var(--neon);}
@media (max-width:1100px){
  .footer-cols{grid-template-columns:1.2fr 1fr 1fr 1fr;}
  .fcol--wx{grid-column:1 / -1; max-width:360px;}
}
@media (max-width:700px){
  .footer-cols{grid-template-columns:1fr 1fr;}
  .fcol--brand{grid-column:1 / -1;}
}
.footer-cols h5{font-family:var(--font-body); font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.12em; color:var(--neon); margin-bottom:.9rem;}
.footer-cols a, .footer-cols p{display:block; font-size:.84rem; color:rgba(255,255,255,.75); margin-bottom:.5rem;}
.footer-cols a:hover{color:var(--white);}
.footer-logo-col{width:clamp(130px,15vw,180px); height:auto; margin-bottom:1.1rem; mix-blend-mode:screen; opacity:.96;
  -webkit-mask-image:radial-gradient(ellipse 62% 62% at 50% 50%, #000 40%, transparent 80%);
  mask-image:radial-gradient(ellipse 62% 62% at 50% 50%, #000 40%, transparent 80%);}
/* brand column — new transparent logo: no mask/fade, no blend */
.fcol--brand .footer-logo-col{width:210px; height:auto; margin:-.4rem 0 .9rem -.2rem; mix-blend-mode:normal; opacity:1; -webkit-mask-image:none; mask-image:none; filter:none;}
.f-addr{font-style:normal; font-size:.86rem; line-height:1.5; color:rgba(255,255,255,.78); margin-bottom:.35rem;}
.footer-cols .fcol .f-contact{color:var(--white); font-weight:600; margin-top:.1rem;}
.footer-cols .f-hours{font-size:.76rem; color:rgba(255,255,255,.55); margin:.15rem 0 0; white-space:nowrap;}

/* Snow Report card */
.wx{
  background:rgba(10,13,18,.62); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid rgba(37,200,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 10px 28px rgba(0,0,0,.35);
  padding:.9rem 1rem .75rem; font-size:.8rem;
}
.wx-head{display:flex; justify-content:space-between; align-items:center; padding-bottom:.6rem; border-bottom:1px solid rgba(255,255,255,.1);}
.wx-title{display:flex; align-items:center; gap:.5rem; font-family:var(--font-display); font-weight:800; font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--neon);}
.wx-live{width:6px; height:6px; border-radius:50%; background:#3ddc84; animation:wxpulse 2s infinite;}
@keyframes wxpulse{
  0%{box-shadow:0 0 0 0 rgba(61,220,132,.55);}
  70%{box-shadow:0 0 0 7px rgba(61,220,132,0);}
  100%{box-shadow:0 0 0 0 rgba(61,220,132,0);}
}
@media (prefers-reduced-motion:reduce){ .wx-live{animation:none;} }
.wx-edit, .wx-done{background:none; border:1px solid rgba(255,255,255,.3); color:rgba(255,255,255,.8); font-size:.64rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:.3rem .55rem; cursor:pointer;}
.wx-edit:hover, .wx-done:hover, .wx-edit[aria-expanded="true"]{border-color:var(--neon); color:var(--neon);}
.wx-list{list-style:none; margin:0; padding:0;}
.wx .wx-row{display:grid; grid-template-columns:1fr 22px 3rem; align-items:center; gap:.55rem; padding:.5rem 0; border-bottom:1px dashed rgba(255,255,255,.1);}
.wx .wx-row:last-child{border-bottom:0;}
.wx .wx-row--loading{display:block; color:rgba(255,255,255,.5);}
.wx .wx-name{color:var(--white); font-weight:600; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:0;}
.wx .wx-name small{display:block; font-weight:500; font-size:.68rem; color:rgba(255,255,255,.5);}
.wx .wx-row svg{width:22px; height:22px; fill:none; stroke:rgba(255,255,255,.8); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}
.wx-temp{font-family:var(--font-display); font-weight:800; font-size:1.3rem; line-height:1; color:var(--neon); text-align:right;}
.wx-pick{padding:.6rem 0 .2rem;}
.wx-pick__hint{font-size:.7rem; color:rgba(255,255,255,.55); margin:0 0 .45rem;}
.wx-pick__list{display:grid; grid-template-columns:1fr 1fr; gap:.25rem .6rem; max-height:190px; overflow:auto; padding-right:.3rem; margin-bottom:.6rem;}
.wx-pick__list label{display:flex; align-items:center; gap:.4rem; font-size:.74rem; color:rgba(255,255,255,.8); cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.wx-pick__list input{accent-color:var(--neon); margin:0;}
.wx-pick__list input:disabled + span{opacity:.35;}
.wx-foot{display:flex; justify-content:space-between; align-items:center; padding-top:.6rem; border-top:1px solid rgba(255,255,255,.1); font-size:.68rem;}
.wx-upd{color:rgba(255,255,255,.4);}
.wx-foot a{color:var(--white); font-weight:700;}
.wx-foot a:hover{color:var(--neon);}
.footer-bottom{position:relative; border-top:1px solid var(--line-dark); padding-block:1.1rem; margin-top:clamp(1.5rem,3vw,2.25rem);}
.footer-bottom .wrap{display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; font-size:.72rem; color:rgba(255,255,255,.5);}
.footer-legal{display:flex; gap:1.25rem; flex-wrap:wrap;}
.footer-legal a{color:rgba(255,255,255,.5); transition:color .2s ease;}
.footer-legal a:hover{color:var(--white);}

/* ---------- Fit Advice cards: no photos — coloured title block with
   ski-map texture, cycling cyan / sign blue / red every 3 ---------- */
.advice-card .advice-card__img{
  aspect-ratio:auto; min-height:190px; position:relative; overflow:hidden;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:1.1rem 1.3rem 1.25rem;
  background-color:var(--neon); color:var(--ink);
  background-repeat:no-repeat; background-size:cover; background-position:right top;
}
.advice-card .advice-card__img > *{position:relative; z-index:1;}
.advice-card .advice-card__img .wp-block-post-featured-image{display:none;}

.advice-card .advice-card__img .advice-card__tag{position:static; align-self:flex-start; background:rgba(18,18,18,.88); color:var(--white);}

.advice-grid .advice-card .advice-card__img h3.wp-block-post-title{
  margin:2.2rem 0 0; font-family:var(--font-display); font-weight:800;
  font-size:clamp(1.9rem,2.6vw,2.4rem); line-height:.95; text-transform:uppercase; letter-spacing:.01em;
}
.advice-grid .advice-card .advice-card__img h3.wp-block-post-title,
.advice-grid .advice-card .advice-card__img h3.wp-block-post-title a{color:var(--ink); text-decoration:none;}

.advice-grid > *:nth-child(3n+1) .advice-card__img{background-image:url(../img/fit-topo-1.svg);}
.advice-grid > *:nth-child(3n+2) .advice-card__img{background-color:#0050D9; color:var(--white); background-image:url(../img/fit-topo-2.svg);}
.advice-grid > *:nth-child(3n+3) .advice-card__img{background-color:var(--red); color:var(--white); background-image:url(../img/fit-topo-3.svg);}
.advice-grid > *:nth-child(3n+2) .advice-card .advice-card__img h3.wp-block-post-title,
.advice-grid > *:nth-child(3n+2) .advice-card .advice-card__img h3.wp-block-post-title a,
.advice-grid > *:nth-child(3n+3) .advice-card .advice-card__img h3.wp-block-post-title,
.advice-grid > *:nth-child(3n+3) .advice-card .advice-card__img h3.wp-block-post-title a{color:var(--white);}
.advice-grid > *:nth-child(3n+2) .advice-card__tag,
.advice-grid > *:nth-child(3n+3) .advice-card__tag{background:rgba(255,255,255,.95); color:var(--ink);}

.advice-card .advice-card__img::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:46px; pointer-events:none;
  background:url(../img/fit-ridge.svg) bottom / 100% 100% no-repeat; opacity:.14;
}
.advice-grid > *:nth-child(3n+2) .advice-card__img::after,
.advice-grid > *:nth-child(3n+3) .advice-card__img::after{filter:invert(1); opacity:.12;}

.advice-card .advice-card__body{padding:1.1rem 1.3rem 1.4rem; gap:.9rem;}
.advice-card .wp-block-post-excerpt__excerpt{font-size:.92rem; line-height:1.6; color:rgba(18,18,18,.75); margin:0;}
.advice-card .advice-card__more{color:var(--ink);}
.advice-card:hover .advice-card__img{filter:brightness(1.05);}

/* equal-height cards now that titles run 2-3 lines */
.advice-grid.wp-block-post-template{align-items:stretch;}
.advice-grid > *{display:flex;}
.advice-grid > * > .advice-card{flex:1; display:flex; flex-direction:column;}
.advice-card .advice-card__img{min-height:225px;}
.advice-card .advice-card__body{flex:1; display:flex; flex-direction:column;}
.advice-card .advice-card__more{margin-top:auto;}

/* ---------- shop mega menu: five image tiles ---------- */
.nav-dropdown.mega .mtiles{grid-column:1 / span 3; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; align-self:stretch;}
.mtile{position:relative; display:flex; align-items:flex-end; min-height:150px; padding:.9rem 1rem; overflow:hidden; isolation:isolate; text-decoration:none; background:#1b232e var(--img) center / cover no-repeat; color:#fff; transition:transform .25s ease, box-shadow .25s ease;}
.mtile::before{content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(10,13,18,0) 35%,rgba(10,13,18,.85));}
.mtile span{font-family:var(--font-display); font-weight:800; font-size:1.25rem; line-height:1; text-transform:uppercase; letter-spacing:.03em;}
.mtile span::after{content:' →'; color:var(--neon); opacity:0; transition:opacity .2s;}
.mtile:hover{transform:translateY(-3px); box-shadow:0 12px 24px rgba(0,0,0,.35);}
.mtile:hover span::after{opacity:1;}
.nav-dropdown.mega .mtile--cyan{background:var(--neon) url(../img/fit-topo-1.svg) center / cover; color:var(--ink);}
.nav-dropdown.mega .mtile--blue{background:#0050D9 url(../img/fit-topo-2.svg) center / cover; color:#fff;}
.nav-dropdown.mega .mtile--cut{background:#F3F1EC var(--img) center 30% / auto 62% no-repeat; background-blend-mode:multiply; color:var(--ink);}
.nav-dropdown.mega .mtile--cut::before{display:none;}
@media (max-width:1000px){ .nav-dropdown.mega .mtiles{grid-template-columns:1fr 1fr;} .mtile{min-height:90px;} }

/* ---------- top bar / footer: Facebook ---------- */
.tb-fb,.f-social a{display:inline-flex; align-items:center; gap:.4rem;}
.tb-fb svg{width:14px; height:14px; fill:currentColor;}
.f-social{display:flex; gap:.6rem; margin-top:1rem;}
.f-social a{width:38px; height:38px; justify-content:center; border:1.5px solid rgba(255,255,255,.35); color:#fff; transition:all .2s;}
.f-social a:hover{border-color:var(--neon); color:var(--neon);}
.f-social svg{width:18px; height:18px; fill:currentColor;}

.bf-link{margin:.6rem 0 0; font-size:.95rem;}
.bf-link a{font-weight:800; color:var(--neon-ink);}
.mfoot-find{font-weight:800; color:var(--neon-ink); white-space:nowrap;}

.skip-link{position:absolute; left:-9999px; top:0; z-index:100; padding:.6rem 1rem; background:var(--neon); color:var(--ink); font-weight:800;}
.skip-link:focus{left:1rem; top:1rem;}

/* desktop: brand + snow report span both rows; strip sits under the 3 link columns */
@media (min-width:1101px){
  .footer-cols{grid-template-rows:auto auto; row-gap:0;}
  .footer-cols .fcol--brand{grid-row:1 / 3; align-self:stretch;}
  .footer-cols .fcol--brand .f-addr{margin-top:auto;}
  .footer-cols .fcol--wx{grid-column:5; grid-row:1 / 3; align-self:end;}
  .footer-cols .f-strip{grid-column:2 / 5; grid-row:2; align-self:end;}
}
.footer-cols .f-strip{display:flex; align-items:center; gap:.9rem; padding-top:1.4rem; margin-top:1.6rem; border-top:1px solid rgba(255,255,255,.12);}
.footer-cols .f-strip .f-social,.footer-cols .f-strip .f-hours{margin:0;}
.footer-cols .f-strip .f-hours{white-space:nowrap;}
/* tablet / mobile: the strip runs full width under the link columns */
@media (max-width:1100px){ .footer-cols .f-strip{grid-column:1 / -1; margin-top:.4rem;} }
@media (max-width:700px){ .footer-cols .f-strip .f-hours{white-space:normal;} }

.site-footer .f-credit{margin-left:1.4rem; padding-left:1.4rem; border-left:1px solid rgba(255,255,255,.18);}
.site-footer .f-credit a{color:inherit; text-decoration:none; font-weight:700; transition:color .2s;}
.site-footer .f-credit a:hover{color:#fff;}
@media (max-width:700px){
  .site-footer .f-copy{display:flex; flex-direction:column; gap:.35rem;}
  .site-footer .f-credit{margin:0; padding:0; border:0;}
}