/* MOODS Planet — mobile-first layer over the existing theme.
   Loaded AFTER theme.css so it can correct the legacy desktop-only grid. */

:root{
  --m-bg:#000; --m-surface:#111; --m-line:#2a2a2a;
  --m-text:#fff; --m-muted:#b6b6b6;
  --m-accent:#c8102e; --m-accent-2:#ff2ad0;
  --m-free:#4ade80; --m-err:#ff6b6b;
  --m-radius:10px; --m-gap:16px;
}
*,*::before,*::after{box-sizing:border-box}
body{background:var(--m-bg);color:var(--m-text);font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;margin:0}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.m-wrap{max-width:1200px;margin:0 auto;padding-inline:16px}
.m-wrap--narrow{max-width:860px}
.m-main{padding-block:24px 64px;min-height:60vh}

/* ---------- header ---------- */
/* No backdrop-filter here. It makes this element the containing block for
   the position:fixed drawer below, which collapsed the drawer to the
   height of the bar, and it opens a stacking context that trapped the
   drawer under the legacy theme.css layers (z-index 9998-10001) and
   bootstrap (to 1080). The bar is 94% opaque, so nothing is lost.
   The z-index must stay above those legacy layers. */
.m-header{position:sticky;top:0;z-index:10050;background:rgba(0,0,0,.94);border-bottom:1px solid var(--m-line)}
.m-header__inner{max-width:1200px;margin:0 auto;padding:10px 16px;display:grid;
  grid-template-columns:auto auto 1fr auto;align-items:center;gap:12px}
.m-burger{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;width:40px;height:40px;
  background:none;border:0;cursor:pointer;padding:8px}
.m-burger span{display:block;height:2px;background:#fff;border-radius:2px}
.m-logo img{width:100px;height:auto}
.m-nav{display:none}
/* Sized against the viewport explicitly rather than with inset, so the
   drawer keeps its full height even if an ancestor ever becomes a
   containing block again. dvh follows the mobile browser chrome; the vh
   line above it is the fallback for browsers without dvh. */
.m-nav.is-open{display:flex;flex-direction:column;position:fixed;
  top:56px;left:0;right:0;width:100%;
  height:calc(100vh - 56px);height:calc(100dvh - 56px);
  background:#000;padding:24px 16px;gap:4px;z-index:10060;overflow:auto;overscroll-behavior:contain}
.m-nav a{padding:14px 4px;border-bottom:1px solid var(--m-line);text-decoration:none;font-size:1.05rem}
.m-search{display:none}
.m-search input{background:#161616;border:1px solid var(--m-line);color:#fff;border-radius:999px;padding:8px 14px;min-width:200px}
.m-search button{background:none;border:0;color:#fff;cursor:pointer;padding:6px}
/* The cart link keeps a full tap area even if the icon font fails to load,
   which would otherwise leave it a few pixels wide and unusable. */
.m-cartlink{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  text-decoration:none;padding:8px;min-width:44px;min-height:44px}
/* The cart glyph is supplied by icomoon's own .icon-cart rule (U+EAA2).
   The override that used to sit here pointed at U+E903, which this font
   does not define, so the bar showed the wrong character. */
.m-cartlink .icon-cart{display:inline-block;min-width:22px;min-height:22px}
.m-cartlink__count{min-width:22px;height:22px;border-radius:999px;background:var(--m-accent);color:#fff;
  font-size:.75rem;display:inline-grid;place-items:center;padding:0 6px;font-weight:600}
.m-cartlink__count.is-bump{animation:bump .4s ease}
.m-cartlink__count.is-empty{display:none}
.m-nav__search{display:flex;gap:8px;margin-bottom:18px}
.m-nav__search input{flex:1;min-width:0;background:#161616;border:1px solid var(--m-line);color:#fff;
  border-radius:999px;padding:12px 16px;font-size:1rem;font-family:inherit}
.m-nav__search button{background:#fff;color:#000;border:0;border-radius:999px;padding:0 18px;
  font-weight:600;font-family:inherit;cursor:pointer;min-height:44px}
@media (min-width:900px){.m-nav__search{display:none}}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1)}}
.m-cartlink__value{font-size:.85rem;color:var(--m-muted)}
body.nav-open{overflow:hidden}
@media (min-width:900px){
  .m-burger{display:none}
  .m-header__inner{grid-template-columns:auto 1fr auto auto}
  .m-nav{display:flex;gap:22px}
  /* Rotating a phone with the drawer open used to leave the full-screen
     drawer covering the desktop layout. At this width it is just the bar. */
  .m-nav.is-open{position:static;inset:auto;width:auto;height:auto;
    flex-direction:row;padding:0;background:none;z-index:auto;overflow:visible}
  .m-nav a{padding:6px 0;border:0;font-size:.95rem;text-decoration:none;color:var(--m-muted)}
  .m-nav a:hover{color:#fff}
  .m-search{display:flex;align-items:center}
  .m-logo img{width:120px}
}

/* ---------- toast / flash ---------- */
.m-toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(20px);opacity:0;
  background:#fff;color:#000;padding:12px 20px;border-radius:999px;font-weight:600;z-index:10090;
  transition:opacity .22s ease,transform .22s ease;max-width:92vw;text-align:center;box-shadow:0 8px 30px rgba(0,0,0,.4)}
.m-toast.is-on{opacity:1;transform:translateX(-50%) translateY(0)}
.m-toast.is-err{background:var(--m-err);color:#fff}
.m-flash,.m-warn{background:#2a1416;border:1px solid var(--m-err);color:#ffd9d9;padding:12px 16px;
  border-radius:var(--m-radius);margin:0 0 16px}

/* ---------- page heads / chips ---------- */
.m-pagehead{padding-block:8px 20px}
.m-pagehead h1{font-size:clamp(1.6rem,5vw,2.4rem);margin:0 0 6px;letter-spacing:-.02em}
.m-pagehead__sub{color:var(--m-muted);margin:0;font-size:.95rem}
.m-chips{display:flex;gap:8px;overflow-x:auto;padding-block:4px 16px;-webkit-overflow-scrolling:touch}
.m-chip{flex:0 0 auto;border:1px solid var(--m-line);border-radius:999px;padding:8px 14px;
  text-decoration:none;font-size:.85rem;color:var(--m-muted);white-space:nowrap}
.m-chip.is-on{background:#fff;color:#000;border-color:#fff;font-weight:600}
.m-chip span{opacity:.6;margin-left:4px}
.m-sort{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-bottom:12px;font-size:.85rem;color:var(--m-muted)}
.m-sort select{background:#161616;color:#fff;border:1px solid var(--m-line);border-radius:8px;padding:8px 10px}

/* ---------- product grid: 2-up on phones (was 1-up) ---------- */
.m-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--m-gap)}
@media (min-width:700px){.m-grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1000px){.m-grid{grid-template-columns:repeat(4,1fr);gap:24px}}

.m-card{background:var(--m-surface);border:1px solid var(--m-line);border-radius:var(--m-radius);
  overflow:hidden;display:flex;flex-direction:column}
.m-card__media{position:relative;display:block;background:#fff}
.m-card__media img{aspect-ratio:1/1;object-fit:contain;width:100%}
.m-badge{position:absolute;top:8px;left:8px;background:linear-gradient(90deg,#8115ff,#ff2ad0 52%,#ff8f2a);
  color:#fff;font-size:.68rem;font-weight:600;padding:4px 9px;border-radius:999px;z-index:2}
.m-card__body{padding:12px;display:flex;flex-direction:column;gap:6px;flex:1}
.m-card__name{font-size:.9rem;font-weight:400;margin:0;line-height:1.35}
.m-card__name a{text-decoration:none}
.m-card__price{margin:0;font-size:1.02rem}
.m-card__price del{opacity:.5;font-size:.85em;margin-right:4px}
.m-card__price strong{color:#ff5a7a;font-weight:600}
.m-card__save{margin:0;font-size:.74rem;color:var(--m-free)}
.m-card__out{margin:0;font-size:.8rem;color:var(--m-muted)}
.m-card__actions{margin-top:auto;display:grid;gap:6px}
.m-card__buy{margin:0}
.m-card__buy .m-btn{width:100%}

/* ---------- buttons ---------- */
.m-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;
  padding:11px 18px;font-size:.88rem;font-weight:600;text-decoration:none;cursor:pointer;
  border:1px solid transparent;font-family:inherit;line-height:1.2;transition:transform .12s ease,opacity .12s ease}
.m-btn:active{transform:scale(.98)}
.m-btn[disabled]{opacity:.6;cursor:default}
.m-btn--solid{background:var(--m-accent);color:#fff}
.m-btn--ghost{background:transparent;color:#fff;border-color:#4a4a4a}
.m-btn--lg{padding:15px 26px;font-size:1rem}
.m-btn--block{width:100%}

/* ---------- PDP ---------- */
.m-crumbs{font-size:.8rem;color:var(--m-muted);padding-block:4px 14px}
.m-crumbs a{text-decoration:none}
.m-crumbs span{opacity:.4;margin:0 6px}
.m-pdp{display:grid;gap:24px}
@media (min-width:900px){.m-pdp{grid-template-columns:1fr 1fr;gap:48px;align-items:start}}
.m-pdp__media{position:relative;background:#fff;border-radius:var(--m-radius);overflow:hidden}
.m-pdp__media img{aspect-ratio:1/1;object-fit:contain}
.m-pdp__info h1{font-size:clamp(1.35rem,4vw,2rem);margin:0 0 10px;letter-spacing:-.02em}
.m-pdp__price{margin:0 0 4px;font-size:1.5rem}
.m-pdp__price del{opacity:.5;font-size:.6em;margin-right:8px}
.m-pdp__price strong{color:#ff5a7a}
.m-pdp__save{display:block;font-size:.85rem;color:var(--m-free);margin-top:2px}
.m-pdp__tax{color:var(--m-muted);font-size:.8rem;margin:0 0 18px}
.m-pdp__out{color:var(--m-err);font-weight:600}
.m-packs{border:0;padding:0;margin:0 0 18px}
.m-packs legend{font-size:.8rem;color:var(--m-muted);padding:0 0 8px}
.m-pack{display:inline-flex;flex-direction:column;align-items:center;gap:2px;border:1px solid var(--m-line);
  border-radius:var(--m-radius);padding:10px 16px;margin:0 8px 8px 0;cursor:pointer;min-width:84px}
.m-pack input{position:absolute;opacity:0;pointer-events:none}
.m-pack span{font-weight:600}
.m-pack em{font-style:normal;font-size:.8rem;color:var(--m-muted)}
.m-pack:has(input:checked){border-color:#fff;background:#1c1c1c}
.m-qty{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.m-qty label{font-size:.8rem;color:var(--m-muted);margin-right:4px}
.m-qty button{width:40px;height:40px;border-radius:8px;border:1px solid var(--m-line);background:#161616;color:#fff;font-size:1.1rem;cursor:pointer}
.m-qty input{width:64px;height:40px;text-align:center;border-radius:8px;border:1px solid var(--m-line);background:#161616;color:#fff}
.m-pdp__actions{display:grid;gap:10px}
@media (min-width:560px){.m-pdp__actions{grid-template-columns:1fr 1fr}}
.m-pdp__hint{font-size:.78rem;color:var(--m-muted);margin:10px 0 0}
.m-pdp__desc,.m-pdp__specs{margin-top:28px;border-top:1px solid var(--m-line);padding-top:18px}
.m-pdp__desc h2,.m-pdp__specs h2{font-size:1rem;margin:0 0 10px}
.m-pdp__desc p{color:var(--m-muted);line-height:1.6}
.m-pdp__specs dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:0;font-size:.88rem}
.m-pdp__specs dt{color:var(--m-muted)}
.m-related{margin-top:56px}
.m-related h2{font-size:1.2rem;margin:0 0 16px}

/* ---------- cart ---------- */
.m-cartlist{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:12px}
.m-cartrow{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;
  background:var(--m-surface);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:12px}
.m-cartrow img{width:64px;height:64px;object-fit:contain;background:#fff;border-radius:6px}
.m-cartrow__info{display:flex;flex-direction:column;gap:2px;min-width:0}
.m-cartrow__info a{text-decoration:none;font-size:.9rem}
.m-cartrow__variant,.m-cartrow__unit{font-size:.75rem;color:var(--m-muted)}
.m-cartrow__gone{font-size:.75rem;color:var(--m-err)}
.m-cartrow.is-unavailable{opacity:.55}
.m-cartrow__qty{grid-column:2}
.m-cartrow__qty input{width:64px;padding:7px;text-align:center;border-radius:8px;border:1px solid var(--m-line);background:#161616;color:#fff}
.m-cartrow__total{font-weight:600;white-space:nowrap}
.m-cartrow__remove button{background:none;border:0;color:var(--m-muted);font-size:1.4rem;cursor:pointer;line-height:1;padding:4px 8px}
@media (min-width:640px){
  .m-cartrow{grid-template-columns:72px 1fr 90px 110px 40px}
  .m-cartrow__qty{grid-column:auto}
}
.m-coupon{background:var(--m-surface);border:1px solid var(--m-line);border-radius:var(--m-radius);
  padding:16px;margin-bottom:16px;display:grid;gap:8px}
.m-coupon label{font-size:.8rem;color:var(--m-muted)}
.m-coupon input{padding:11px 14px;border-radius:8px;border:1px solid var(--m-line);background:#161616;color:#fff;text-transform:uppercase}
.m-coupon__err{color:var(--m-err);font-size:.82rem;margin:0}
.m-coupon__ok{color:var(--m-free);font-size:.82rem;margin:0}
@media (min-width:560px){.m-coupon{grid-template-columns:1fr auto;align-items:end}
  .m-coupon label{grid-column:1/-1}.m-coupon__err,.m-coupon__ok{grid-column:1/-1}}

.m-summary{background:var(--m-surface);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:16px}
.m-summary dl{display:grid;grid-template-columns:1fr auto;gap:8px 16px;margin:0 0 10px;font-size:.92rem}
.m-summary dt{color:var(--m-muted)}
.m-summary dd{margin:0;text-align:right}
.m-neg{color:var(--m-free)}
.m-free{color:var(--m-free);font-weight:600}
.m-summary__nudge{font-size:.8rem;color:var(--m-muted);margin:0 0 10px}
.m-summary__total{display:flex;justify-content:space-between;align-items:baseline;
  border-top:1px solid var(--m-line);padding-top:12px;margin:0;font-size:1.05rem}
.m-summary__total strong{font-size:1.3rem}
.m-summary__note{font-size:.75rem;color:var(--m-muted);margin:8px 0 0}
.m-cartcta{display:grid;gap:10px;margin-top:20px}
@media (min-width:560px){.m-cartcta{grid-template-columns:1fr 1fr}}

/* ---------- checkout ---------- */
.m-checkout{display:grid;gap:24px}
@media (min-width:920px){.m-checkout{grid-template-columns:1fr 360px;align-items:start}
  .m-checkout__items{grid-column:1}.m-checkout__address{grid-column:1}
  .m-checkout__summary{grid-column:2;grid-row:1/3;position:sticky;top:88px}}
.m-checkout h2{font-size:1rem;display:flex;align-items:center;gap:10px;margin:0 0 14px}
.m-checkout h2 span{font-size:.7rem;color:var(--m-muted);border:1px solid var(--m-line);
  border-radius:999px;padding:3px 9px}
.m-checkout__items,.m-checkout__address,.m-checkout__summary{
  background:var(--m-surface);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:18px}
.m-minilist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.m-minilist li{display:grid;grid-template-columns:44px 1fr auto auto;gap:10px;align-items:center;font-size:.86rem}
.m-minilist img{width:44px;height:44px;object-fit:contain;background:#fff;border-radius:5px}
.m-minilist__name em{display:block;font-style:normal;font-size:.74rem;color:var(--m-muted)}
.m-minilist__qty{color:var(--m-muted);font-size:.8rem}
.m-minilist__amt{font-weight:600;white-space:nowrap}
.m-link{display:inline-block;margin-top:12px;font-size:.82rem;color:var(--m-muted)}
.m-field{display:grid;gap:5px;margin-bottom:14px}
.m-field label{font-size:.8rem;color:var(--m-muted)}
.m-opt{opacity:.6}
.m-field input,.m-field select{padding:12px 14px;border-radius:8px;border:1px solid var(--m-line);
  background:#161616;color:#fff;font-size:1rem;font-family:inherit;width:100%}
.m-field input:focus,.m-field select:focus{outline:2px solid #fff;outline-offset:1px}
.m-field.is-err input,.m-field.is-err select{border-color:var(--m-err)}
.m-err{color:var(--m-err);font-size:.78rem}
.m-row{display:grid;gap:14px}
@media (min-width:560px){.m-row{grid-template-columns:1fr 1fr}}
.m-pinstatus{font-size:.78rem;color:var(--m-muted);min-height:1.1em}
.m-pinstatus.is-ok{color:var(--m-free)}
.m-pinstatus.is-err{color:var(--m-err)}
.m-checkout__summary dl{display:grid;grid-template-columns:1fr auto;gap:8px 16px;margin:0 0 10px;font-size:.92rem}
.m-checkout__summary dt{color:var(--m-muted)}
.m-checkout__summary dd{margin:0;text-align:right}
.m-secure{font-size:.75rem;color:var(--m-muted);text-align:center;margin:10px 0 0}

/* ---------- confirmation / empty / 404 ---------- */
.m-confirm{background:var(--m-surface);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:28px;text-align:left}
.m-confirm h1{font-size:clamp(1.4rem,4vw,2rem);margin:0 0 8px}
.m-confirm__id{color:var(--m-muted);margin:0 0 16px}
.m-confirm__totals{display:grid;grid-template-columns:1fr auto;gap:8px 16px;margin:20px 0;
  border-top:1px solid var(--m-line);padding-top:16px;font-size:.92rem}
.m-confirm__totals dt{color:var(--m-muted)}
.m-confirm__totals dd{margin:0;text-align:right}
.m-strong{font-weight:700;color:#fff!important;font-size:1.05rem}
.m-confirm__addr{font-size:.88rem;color:var(--m-muted);line-height:1.6}
.m-empty{text-align:center;padding:56px 16px;border:1px dashed var(--m-line);border-radius:var(--m-radius)}
.m-empty h2{margin:0 0 8px}
.m-empty p{color:var(--m-muted);margin:0 0 20px}
.m-redirect{min-height:100vh;display:grid;place-items:center;text-align:center;padding:24px;gap:18px;color:#fff}

/* ---------- footer ---------- */
.m-footer{border-top:1px solid var(--m-line);padding:40px 16px 24px;margin-top:64px}
.m-footer__grid{max-width:1200px;margin:0 auto;display:grid;gap:28px;grid-template-columns:1fr}
@media (min-width:640px){.m-footer__grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:980px){.m-footer__grid{grid-template-columns:repeat(4,1fr)}}
.m-footer h4{font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px;color:#fff}
.m-footer a{display:block;color:var(--m-muted);text-decoration:none;padding:4px 0;font-size:.88rem}
.m-footer a:hover{color:#fff}
.m-footer p{color:var(--m-muted);font-size:.85rem;line-height:1.6;margin:0 0 10px}
.m-footer__bar{max-width:1200px;margin:28px auto 0;padding-top:18px;border-top:1px solid var(--m-line);
  display:flex;justify-content:space-between;gap:12px;font-size:.78rem;color:var(--m-muted);flex-wrap:wrap}

/* ---------- home: hero ---------- */
.m-home .m-main{padding-top:0}
.m-hero{position:relative;min-height:74vh;display:grid;align-items:end;overflow:hidden;isolation:isolate}
@media (min-width:900px){.m-hero{min-height:82vh}}
.m-hero__media{position:absolute;inset:0;z-index:-2;background:#000}
.m-hero__media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,.15) 45%,rgba(0,0,0,.92) 100%)}
.m-hero__video{width:100%;height:100%;object-fit:cover}
.m-hero__video--wide{display:none}
.m-hero__video--tall{display:block}
@media (min-width:768px){.m-hero__video--wide{display:block}.m-hero__video--tall{display:none}}
.m-hero__body{max-width:1200px;margin:0 auto;width:100%;padding:0 16px 44px}
.m-hero__eyebrow{letter-spacing:.22em;text-transform:uppercase;font-size:.72rem;color:#fff;opacity:.8;margin:0 0 10px}
.m-hero__h1{font-size:clamp(2rem,8vw,4rem);line-height:1.02;margin:0 0 12px;letter-spacing:-.03em;text-wrap:balance}
.m-hero__h1 span{display:block;font-size:.52em;font-weight:300;opacity:.86;letter-spacing:0;margin-top:6px}
.m-hero__p{color:#e6e6e6;margin:0 0 20px;max-width:46ch;font-size:.95rem}
.m-hero__cta{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- home: trust strip ---------- */
.m-trust{list-style:none;margin:0;padding:18px 16px;display:grid;gap:14px;grid-template-columns:repeat(2,1fr);
  border-bottom:1px solid var(--m-line);max-width:1200px;margin-inline:auto}
@media (min-width:860px){.m-trust{grid-template-columns:repeat(4,1fr);padding:22px 16px}}
.m-trust li{display:flex;flex-direction:column;gap:2px;font-size:.82rem}
.m-trust strong{font-weight:600}
.m-trust span{color:var(--m-muted);font-size:.76rem}

/* ---------- home: sections ---------- */
.m-section{margin-top:48px}
.m-section__head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 18px}
.m-section__head h2{font-size:clamp(1.25rem,3.4vw,1.8rem);margin:0;letter-spacing:-.02em}
.m-section__more{font-size:.82rem;color:var(--m-muted);text-decoration:none;white-space:nowrap}
.m-section__more:hover{color:#fff}

.m-brands{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--m-gap)}
@media (min-width:700px){.m-brands{grid-template-columns:repeat(5,1fr)}}
.m-brands a{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;
  background:var(--m-surface);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:14px}
.m-brands img{width:100%;height:auto;object-fit:contain}
.m-brands span{font-size:.8rem;color:var(--m-muted)}

.m-range{display:grid;gap:16px;align-items:center;margin-bottom:28px}
@media (min-width:820px){
  .m-range{grid-template-columns:1fr 1fr;gap:40px;margin-bottom:44px}
  .m-range--flip .m-range__media{order:2}
}
.m-range__media{display:block;border-radius:var(--m-radius);overflow:hidden}
.m-range__body h3{font-size:clamp(1.3rem,4vw,2rem);margin:0 0 8px;letter-spacing:-.02em}
.m-range__body p{color:var(--m-muted);margin:0 0 16px;max-width:46ch}

.m-duo{display:grid;gap:16px}
@media (min-width:820px){.m-duo{grid-template-columns:1fr 1fr}}
.m-duo a{display:block;border-radius:var(--m-radius);overflow:hidden}

.m-closing{margin-top:64px;padding:56px 16px;text-align:center;border-top:1px solid var(--m-line);
  display:grid;justify-items:center;gap:16px}
.m-closing img{width:160px}
.m-closing h2{font-size:clamp(1.3rem,4vw,2rem);margin:0;letter-spacing:-.02em}

/* ---------- editorial ---------- */
.m-content .m-article{max-width:820px;margin:0 auto;padding-inline:16px}
.m-article img{border-radius:var(--m-radius);margin:0 auto 24px;max-height:420px;object-fit:cover;width:100%}
.m-article .container,.m-article .container-fluid{width:100%!important;max-width:100%!important;padding:0!important;margin:0!important}
.m-article .row{display:block!important;margin:0!important}
.m-article [class*="col-"]{width:100%!important;max-width:100%!important;padding:0!important;flex:none!important}
.m-article h1{font-size:clamp(1.6rem,5vw,2.5rem);line-height:1.15;margin:0 0 18px;letter-spacing:-.02em;
  color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important;text-wrap:balance}
.m-article h2{font-size:clamp(1.2rem,3.6vw,1.6rem);margin:32px 0 12px;letter-spacing:-.01em}
.m-article h3,.m-article h4,.m-article h5{font-size:1.05rem;margin:24px 0 10px;font-weight:600}
.m-article p{color:#d4d4d4;line-height:1.75;margin:0 0 18px;font-size:1rem}
.m-article li{color:#d4d4d4;line-height:1.75;margin-bottom:8px}
.m-article ul,.m-article ol{padding-left:22px;margin:0 0 18px}
.m-article a{color:#ff7d9c}
.m-article strong{color:#fff}
.m-article br+br{display:none}
.m-article section{padding:0!important;margin:0!important}
.m-article [style*="margin-top: 150px"]{margin-top:0!important}
.m-article table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:.9rem}
.m-article td,.m-article th{border:1px solid var(--m-line);padding:8px 10px;text-align:left}

.m-readgrid{display:grid;gap:var(--m-gap);grid-template-columns:repeat(2,1fr)}
@media (min-width:760px){.m-readgrid{grid-template-columns:repeat(3,1fr)}}
.m-readgrid--index{grid-template-columns:repeat(1,1fr)}
@media (min-width:560px){.m-readgrid--index{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.m-readgrid--index{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1150px){.m-readgrid--index{grid-template-columns:repeat(4,1fr)}}
.m-readcard{display:flex;flex-direction:column;gap:8px;text-decoration:none;background:var(--m-surface);
  border:1px solid var(--m-line);border-radius:var(--m-radius);overflow:hidden;padding-bottom:14px}
.m-readcard img{aspect-ratio:16/10;object-fit:cover;width:100%;margin:0;border-radius:0;max-height:none}
.m-readcard span{padding:0 12px;font-size:.88rem;line-height:1.35}
.m-readcard em{padding:0 12px;font-style:normal;font-size:.76rem;color:var(--m-muted);line-height:1.5}
.m-readcard:hover span{color:#ff7d9c}

.m-contentcta{margin-top:56px;padding:32px 16px;text-align:center;border-top:1px solid var(--m-line)}
.m-contentcta h2{margin:0 0 6px;font-size:1.3rem}
.m-contentcta p{color:var(--m-muted);margin:0 0 16px;font-size:.9rem}

.m-pager{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:32px}
.m-pager__n{min-width:38px;height:38px;display:inline-grid;place-items:center;border:1px solid var(--m-line);
  border-radius:8px;text-decoration:none;font-size:.85rem;color:var(--m-muted)}
.m-pager__n.is-on{background:#fff;color:#000;border-color:#fff;font-weight:600}

.m-pagehead__intro{color:#d4d4d4;margin:0 0 6px;max-width:62ch;line-height:1.6}

/* ---------- contact ---------- */
.m-contact{display:grid;gap:28px}
@media (min-width:900px){.m-contact{grid-template-columns:1fr 340px;align-items:start}}
.m-contact__form,.m-contact__aside{background:var(--m-surface);border:1px solid var(--m-line);
  border-radius:var(--m-radius);padding:22px}
.m-contact__form label{display:block;font-size:.8rem;color:var(--m-muted);margin:14px 0 5px}
.m-contact__form input,.m-contact__form textarea{width:100%;padding:12px 14px;border-radius:8px;
  border:1px solid var(--m-line);background:#161616;color:#fff;font-size:1rem;font-family:inherit}
.m-contact__form input:focus,.m-contact__form textarea:focus{outline:2px solid #fff;outline-offset:1px}
.m-contact__form button{margin-top:18px}
.m-contact__aside h2{font-size:1rem;margin:0 0 10px}
.m-contact__aside h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--m-muted);margin:22px 0 8px}
.m-contact__aside p{color:var(--m-muted);line-height:1.7;font-size:.88rem;margin:0 0 12px}
.m-contact__aside ul{list-style:none;padding:0;margin:0}
.m-contact__aside li a{display:block;padding:5px 0;font-size:.88rem;color:var(--m-muted);text-decoration:none}
.m-contact__aside li a:hover{color:#fff}
.m-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.m-note{border-radius:var(--m-radius);padding:16px 18px;margin-bottom:16px}
.m-note--ok{background:#0f2418;border:1px solid var(--m-free);color:#d7ffe8}
.m-note--ok h2{margin:0 0 6px;font-size:1.1rem}
.m-note--bad{background:#2a1416;border:1px solid var(--m-err);color:#ffd9d9}
.m-note--bad ul{margin:0;padding-left:18px}
.m-note--bad li{margin:2px 0;font-size:.88rem}

/* ---------- 404 ---------- */
.m-empty--404{padding:64px 16px;border-style:solid}
.m-empty--404 .m-hero__cta,.m-empty--404 .m-chips,.m-empty--404 .m-sort{justify-content:center}
.m-empty--404 .m-sort{margin-top:22px}
.m-empty--404 .m-sort input{padding:10px 14px;border-radius:999px;border:1px solid var(--m-line);background:#161616;color:#fff}
.m-404{font-size:clamp(3.5rem,14vw,7rem);line-height:1;margin:0;font-weight:700;
  background:linear-gradient(90deg,#8115ff,#ff2ad0 52%,#ff8f2a);-webkit-background-clip:text;
  background-clip:text;color:transparent}

/* ---------- mobile legibility and tap targets ----------
   Found by tools/browser-check.cjs at 390px: several labels rendered below
   12px, and a number of links and controls were under the 36px minimum that
   makes a target reliably tappable. Corrected here rather than in each
   component so the rule holds for anything added later. */
.m-badge{font-size:.75rem}
.m-card__save{font-size:.78rem}
.m-hero__eyebrow{font-size:.78rem}
.m-summary__note,.m-pdp__hint,.m-secure,.m-readcard em,.cp-help{font-size:.78rem}

@media (max-width:899px){
  /* Every link in a list-like block gets a full-height hit area. */
  .m-footer a{padding:10px 0;min-height:40px;display:flex;align-items:center}
  .m-contact__aside li a{padding:10px 0;min-height:40px;display:flex;align-items:center}
  .m-crumbs a{display:inline-block;padding:9px 0}
  .m-section__more{display:inline-block;padding:10px 0}
  .m-card__name a{display:flex;align-items:center;min-height:38px;padding:4px 0}
  .m-cartrow__info a{display:flex;align-items:center;min-height:38px;padding:4px 0}
  .m-contact__aside p a{display:inline-flex;align-items:center;min-height:44px}
  .m-logo{display:inline-flex;align-items:center;min-height:44px}
  .m-sort select,.m-sort input{min-height:44px}
  .m-sort label{min-height:44px;display:flex;align-items:center}
  .m-chip{min-height:40px;display:inline-flex;align-items:center}
  .m-pager__n{min-height:44px;min-width:44px}
  .m-readcard span{padding-top:4px;padding-bottom:4px}
  .m-trust li{min-height:40px;justify-content:center}
}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}
  .m-hero__video{display:none}}
