:root{
  color-scheme:light;
  --bg:#f3efe7;
  --surface:#e8e1d6;
  --surface-2:#ddd4c7;
  --ink:#232522;
  --muted:#696b65;
  --muted-2:#8b8a82;
  --line:#cfc7bb;
  --signal:#b85f42;
  --cool:#dde1df;
  --earth:#dfd2bf;
  --header-bg:rgba(243,239,231,.94);
  --media-bg:#e3ddd3;
  --overlay-bg:rgba(35,37,34,.72);
  --overlay-line:rgba(255,255,255,.62);
  --soft-highlight:rgba(35,37,34,.035);
  --page-x:clamp(22px,5.5vw,96px);
  --section-y:clamp(72px,9vw,132px);
  --radius:0;
  --ease:cubic-bezier(.2,.7,.2,1);
}

html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#111312;
  --surface:#181b1a;
  --surface-2:#202321;
  --ink:#f1f0ea;
  --muted:#a6a7a2;
  --muted-2:#7e817d;
  --line:#323533;
  --signal:#c66a48;
  --cool:#22282a;
  --earth:#28241e;
  --header-bg:rgba(17,19,18,.96);
  --media-bg:#202422;
  --overlay-bg:rgba(17,19,18,.70);
  --overlay-line:rgba(241,240,234,.42);
  --soft-highlight:rgba(255,255,255,.025);
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

a{color:inherit;text-decoration:none}
button,input,select{font:inherit}
img{max-width:100%}

h1,h2,h3,p{margin-top:0}

/* Header */
.top{
  min-height:76px;
  padding:0 var(--page-x);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  border-bottom:1px solid var(--line);
  background:rgba(17,19,18,.96);
  position:relative;
  z-index:20;
}

.brand{
  display:flex;
  align-items:baseline;
  gap:12px;
  white-space:nowrap;
}

.brand strong{
  font-size:1.65rem;
  line-height:1;
  font-weight:800;
  letter-spacing:-.08em;
}

.brand strong span{color:var(--signal)}

.brand small{
  font-size:.63rem;
  line-height:1;
  letter-spacing:.28em;
  font-weight:650;
  color:var(--muted);
}

.primary-nav{
  display:flex;
  align-items:center;
  gap:clamp(20px,3vw,46px);
}

.primary-nav a{
  position:relative;
  padding:28px 0 25px;
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  transition:color .2s var(--ease);
}

.primary-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:20px;
  height:1px;
  background:var(--ink);
  transition:right .25s var(--ease);
}

.primary-nav a:hover,
.primary-nav a:focus-visible{color:var(--ink)}

.primary-nav a:hover::after,
.primary-nav a:focus-visible::after{right:0}

.cart-link{margin-left:8px}

/* Shared labels / actions */
.eyebrow,
.world-index,
.card small{
  font-size:.69rem;
  font-weight:700;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:var(--muted);
}

.button{
  border:0;
  border-radius:var(--radius);
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:46px;
  min-width:210px;
  padding:15px 18px;
  margin-top:26px;
  font-size:.72rem;
  font-weight:750;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s var(--ease),color .2s var(--ease),transform .2s var(--ease);
}

.button-primary{
  background:var(--ink);
  color:var(--bg);
}

.button-primary:hover{
  background:#fff;
  transform:translateY(-1px);
}

.text-link{
  display:inline-flex;
  gap:14px;
  align-items:center;
  color:var(--muted);
  font-size:.74rem;
  font-weight:650;
  letter-spacing:.12em;
  text-transform:uppercase;
  transition:color .2s var(--ease);
}

.text-link:hover{color:var(--ink)}

/* Hero */
.hero{
  min-height:calc(100svh - 76px);
  position:relative;
  display:grid;
  grid-template-columns:repeat(12,1fr);
  align-items:center;
  padding:var(--section-y) var(--page-x);
  overflow:hidden;
  background:
    radial-gradient(circle at 83% 18%,rgba(198,106,72,.12),transparent 28%),
    linear-gradient(145deg,#171a19 0%,var(--bg) 64%);
}

.hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,transparent 0 74%,rgba(255,255,255,.018) 74% 74.08%,transparent 74.08%);
}

.hero-copy{
  grid-column:1 / span 8;
  position:relative;
  z-index:1;
}

.hero h1{
  max-width:1050px;
  margin:26px 0 30px;
  font-size:clamp(4.3rem,9.4vw,9.7rem);
  line-height:.86;
  letter-spacing:-.075em;
  font-weight:720;
}

.hero h1 em{
  font-style:normal;
  color:var(--ink);
}

.hero h1 em::after{
  content:"";
  display:inline-block;
  width:.12em;
  height:.12em;
  margin-left:.08em;
  border-radius:50%;
  background:var(--signal);
  vertical-align:.12em;
}

.hero-intro{
  max-width:560px;
  margin-bottom:0;
  color:var(--muted);
  font-size:clamp(1rem,1.4vw,1.16rem);
}

.hero-meta{
  position:absolute;
  right:var(--page-x);
  bottom:34px;
  display:flex;
  gap:28px;
  color:var(--muted-2);
  font-size:.63rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}

/* Worlds */
.worlds{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.world{
  min-height:620px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(30px,4.8vw,76px);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.world:first-child{border-right:1px solid var(--line)}

.world::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:.72;
  transition:transform .7s var(--ease),opacity .4s var(--ease);
}

.world-two::before{
  background:
    radial-gradient(circle at 18% 16%,rgba(255,255,255,.055),transparent 32%),
    linear-gradient(145deg,#273033,var(--bg) 72%);
}

.world-four::before{
  background:
    radial-gradient(circle at 78% 14%,rgba(188,153,108,.09),transparent 34%),
    linear-gradient(145deg,#30291f,#18201c 72%);
}

.world:hover::before{
  transform:scale(1.025);
  opacity:.94;
}

.world-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.world-arrow{
  font-size:1.5rem;
  color:var(--muted);
  transition:transform .25s var(--ease),color .25s var(--ease);
}

.world:hover .world-arrow{
  transform:translate(4px,-4px);
  color:var(--ink);
}

.world-content h2{
  margin:0 0 14px;
  font-size:clamp(4rem,7vw,7.8rem);
  line-height:.9;
  letter-spacing:-.075em;
  font-weight:720;
}

.world-content>p{
  color:var(--muted);
  max-width:420px;
  margin-bottom:38px;
}

.world-paths{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid rgba(241,240,234,.22);
  max-width:650px;
}

.world-paths span{
  padding:18px 18px 0 0;
  min-height:78px;
}

.world-paths span+span{
  border-left:1px solid rgba(241,240,234,.22);
  padding-left:18px;
}

.world-paths b,
.world-paths small{
  display:block;
}

.world-paths b{
  font-size:.76rem;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.world-paths small{
  margin-top:5px;
  color:var(--muted);
  font-size:.72rem;
}

/* Collection */
.collection{
  padding:var(--section-y) var(--page-x);
  max-width:1720px;
  margin:auto;
  min-height:420px;
}

.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  margin-bottom:56px;
}

.section-head h2,
.cart h1{
  margin-bottom:0;
  font-size:clamp(2.9rem,5.4vw,5.8rem);
  line-height:.95;
  letter-spacing:-.065em;
  font-weight:700;
}

.empty{
  border-top:1px solid var(--line);
  padding:38px 0;
  color:var(--muted);
}

.empty a{text-decoration:underline}

.grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,2vw,30px);
}

.card{
  min-width:0;
}

.card-image{
  aspect-ratio:4/5;
  height:auto;
  background:#202422;
  display:grid;
  place-items:center;
  overflow:hidden;
}

.card-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .55s var(--ease);
}

.card:hover .card-image img{transform:scale(1.018)}

.card-image span,
.image-placeholder{
  font-size:clamp(3.6rem,7vw,7rem);
  letter-spacing:-.12em;
  font-weight:800;
  color:#6e736f;
}

.card-details{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  padding:18px 0 4px;
  border-bottom:1px solid transparent;
  transition:border-color .2s var(--ease);
}

.card:hover .card-details{border-color:var(--line)}

.card-details h3{
  margin:7px 0 0;
  font-size:1rem;
  font-weight:580;
  letter-spacing:-.015em;
}

.card-details strong{
  white-space:nowrap;
  font-size:.9rem;
  font-weight:600;
}

.card small{color:var(--muted-2)}

/* Manifesto */
.manifesto{
  padding:clamp(90px,12vw,180px) var(--page-x);
  background:var(--surface-2);
  border-top:1px solid var(--line);
}

.manifesto p:last-child{
  max-width:1080px;
  margin-bottom:0;
  font-size:clamp(3rem,6.2vw,7rem);
  letter-spacing:-.07em;
  line-height:.98;
  font-weight:520;
}

.manifesto em{
  font-style:normal;
  color:var(--signal);
}

/* Footer */
footer{
  padding:42px var(--page-x);
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:start;
  gap:30px;
  color:var(--muted);
  font-size:.76rem;
}

footer>span:last-child{text-align:right}

.footer-links{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px 20px;
}

.footer-links a{
  text-decoration:none;
  border-bottom:1px solid transparent;
}

.footer-links a:hover{
  color:var(--ink);
  border-color:var(--ink);
}

/* Existing product / cart / checkout support */
.product-layout{display:grid;grid-template-columns:1fr 1fr;min-height:70vh}
.product-media{padding:5vw;background:#202423;display:grid;gap:20px}
.product-media img{display:block;width:100%;height:auto}
.image-placeholder{min-height:450px;display:grid;place-items:center}
.product-info{padding:8vw 6vw;align-self:start;position:sticky;top:0}
.back{display:inline-block;color:var(--muted);margin-bottom:70px}
.back:hover{color:var(--ink)}
.product-info h1{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.07em;line-height:1}
.price{font-size:1.5rem}
.description{color:var(--muted);margin:40px 0}
.note{font-size:.8rem;color:var(--muted);margin-top:25px}

.cart-row{display:flex;align-items:center;gap:30px;border-top:1px solid var(--line);padding:22px 0}
.cart-row>div{flex:1}
.cart-row h2{font-size:1.2rem;margin:0}
.cart-row span{color:var(--muted)}
.cart-row form{display:flex;align-items:center;gap:8px}
.cart-row input{max-width:65px;background:var(--surface);border:1px solid var(--line);color:var(--ink);padding:6px}
.cart-row button{border:1px solid var(--line);padding:7px 10px;background:transparent;color:var(--ink);cursor:pointer}
.cart-row strong{white-space:nowrap}
.cart-total{display:flex;justify-content:flex-end;gap:30px;padding:25px 0;border-top:1px solid var(--line)}

.variant-select{
  display:block;width:100%;max-width:430px;margin:12px 0;padding:14px;
  background:#202423;color:var(--ink);border:1px solid #666;font:inherit
}
.variant-select:focus{outline:2px solid var(--signal)}

.checkout-form{max-width:520px;margin:30px 0}
.checkout-form label{display:block;margin:10px 0}
.checkout-form select{
  display:block;width:100%;margin-top:10px;padding:15px;
  background:#202423;border:1px solid #777;color:var(--ink);font:inherit
}
.checkout-error{padding:16px;border:1px solid var(--signal);color:var(--ink)}

.info-page{max-width:900px}
.info-page h1{font-size:clamp(2.6rem,6vw,5rem);letter-spacing:-.06em}
.info-copy{line-height:1.8;overflow-wrap:anywhere;white-space:normal}
.info-copy a{text-decoration:underline}

/* Responsive */
@media(max-width:900px){
  .hero-copy{grid-column:1 / span 10}
  .world{min-height:540px}
  footer{grid-template-columns:1fr 1fr}
  .footer-links{justify-content:flex-end}
  footer>span:last-child{grid-column:1/-1;text-align:left}
}

@media(max-width:750px){
  :root{--page-x:22px;--section-y:76px}

  .top{
    min-height:auto;
    padding:18px var(--page-x) 16px;
    align-items:flex-start;
    flex-direction:column;
    gap:18px;
  }

  .primary-nav{
    width:100%;
    justify-content:flex-start;
    gap:24px;
    overflow-x:auto;
    scrollbar-width:none;
  }

  .primary-nav::-webkit-scrollbar{display:none}

  .primary-nav a{
    padding:0 0 8px;
    white-space:nowrap;
  }

  .primary-nav a::after{bottom:0}

  .hero{
    min-height:760px;
    display:block;
    padding:92px var(--page-x) 80px;
  }

  .hero h1{
    margin:28px 0 30px;
    font-size:clamp(4.1rem,18vw,7rem);
    line-height:.88;
  }

  .hero-intro{
    max-width:520px;
    font-size:1rem;
  }

  .hero-meta{display:none}

  .worlds{grid-template-columns:1fr}

  .world{
    min-height:500px;
    padding:34px var(--page-x);
  }

  .world:first-child{
    border-right:0;
    border-bottom:1px solid var(--line);
  }

  .world-content h2{
    font-size:clamp(4rem,17vw,6.8rem);
  }

  .world-paths{max-width:none}

  .section-head{
    align-items:flex-start;
    flex-direction:column;
    gap:20px;
    margin-bottom:38px;
  }

  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}

  .product-layout{grid-template-columns:1fr}
  .product-info{position:static;padding:55px 25px}
  .back{margin-bottom:45px}
  .cart-row{flex-wrap:wrap}
  .cart-row>div{flex-basis:100%}

  footer{
    grid-template-columns:1fr;
    gap:24px;
  }

  .footer-links{justify-content:flex-start}
  footer>span:last-child{grid-column:auto}
}

@media(max-width:520px){
  .brand strong{font-size:1.8rem}

  .hero{min-height:690px}

  .button{
    width:100%;
    min-width:0;
  }

  .world{min-height:455px}

  .world-paths{
    grid-template-columns:1fr;
  }

  .world-paths span{
    min-height:auto;
    padding:14px 0;
  }

  .world-paths span+span{
    border-left:0;
    border-top:1px solid rgba(241,240,234,.22);
    padding-left:0;
  }

  .grid{grid-template-columns:1fr}

  .card-image{aspect-ratio:1/1.18}

  .manifesto{
    padding-top:92px;
    padding-bottom:110px;
  }

  .cart-row form{flex-wrap:wrap}
}


/* Phase 2: dedicated world pages */
.section-note{
  color:var(--muted-2);
  font-size:.68rem;
  font-weight:650;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.world-page{
  --world-glow:rgba(255,255,255,.035);
}

.world-page-two{
  --world-glow:rgba(127,151,158,.10);
}

.world-page-four{
  --world-glow:rgba(171,135,88,.11);
}

.world-hero{
  min-height:620px;
  padding:38px var(--page-x) var(--section-y);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:
    radial-gradient(circle at 84% 20%,var(--world-glow),transparent 31%),
    linear-gradient(145deg,#171a19,var(--bg) 68%);
  border-bottom:1px solid var(--line);
}

.world-back{
  width:max-content;
  color:var(--muted);
  font-size:.68rem;
  font-weight:650;
  letter-spacing:.14em;
  text-transform:uppercase;
  transition:color .2s var(--ease);
}

.world-back:hover{color:var(--ink)}

.world-hero-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:24px;
  align-items:end;
}

.world-hero-copy{
  grid-column:1 / span 8;
}

.world-hero-copy h1{
  margin:20px 0 24px;
  font-size:clamp(5rem,10.5vw,11rem);
  line-height:.82;
  letter-spacing:-.085em;
  font-weight:720;
}

.world-hero-copy>p:last-child{
  max-width:600px;
  margin-bottom:0;
  color:var(--muted);
  font-size:clamp(1rem,1.35vw,1.15rem);
}

.world-hero-aside{
  grid-column:10 / -1;
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:flex-end;
  color:var(--muted-2);
  font-size:.63rem;
  font-weight:650;
  letter-spacing:.15em;
  text-transform:uppercase;
  text-align:right;
}

.world-pillars{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-bottom:1px solid var(--line);
}

.pillar{
  min-height:520px;
  padding:clamp(30px,4.8vw,76px);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:var(--surface);
}

.pillar+.pillar{
  border-left:1px solid var(--line);
}

.pillar-studio{
  background:linear-gradient(150deg,#1e211f,var(--surface) 72%);
}

.pillar-performance{
  background:
    linear-gradient(150deg,rgba(255,255,255,.018),transparent 45%),
    var(--bg);
}

.pillar-label{
  display:flex;
  justify-content:space-between;
  gap:24px;
  color:var(--muted-2);
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.pillar-label span:last-child{
  font-size:1.2rem;
}

.pillar-copy{
  max-width:560px;
}

.pillar-copy h2{
  margin:15px 0 18px;
  font-size:clamp(3.8rem,6.5vw,7rem);
  line-height:.9;
  letter-spacing:-.075em;
  font-weight:680;
}

.pillar-copy>p:last-child{
  max-width:480px;
  margin-bottom:0;
  color:var(--muted);
}

.world-collection{
  max-width:1720px;
}

.world-endnote{
  min-height:390px;
  padding:var(--section-y) var(--page-x);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  border-top:1px solid var(--line);
  background:var(--surface-2);
}

.world-endnote>p:nth-child(2){
  max-width:900px;
  margin:20px 0 34px;
  font-size:clamp(2.8rem,5.8vw,6rem);
  line-height:.98;
  letter-spacing:-.065em;
  font-weight:520;
}

@media(max-width:900px){
  .world-hero-copy{grid-column:1 / span 9}
  .world-hero-aside{grid-column:10 / -1}
}

@media(max-width:750px){
  .world-hero{
    min-height:650px;
    padding-top:28px;
  }

  .world-hero-grid{
    display:block;
  }

  .world-hero-copy h1{
    margin-top:26px;
    font-size:clamp(4.7rem,20vw,7.3rem);
  }

  .world-hero-aside{
    margin-top:50px;
    align-items:flex-start;
    text-align:left;
  }

  .world-pillars{
    grid-template-columns:1fr;
  }

  .pillar{
    min-height:430px;
    padding:36px var(--page-x);
  }

  .pillar+.pillar{
    border-left:0;
    border-top:1px solid var(--line);
  }

  .pillar-copy h2{
    font-size:clamp(4rem,17vw,6.8rem);
  }

  .world-endnote{
    min-height:340px;
  }
}


/* Phase 3: Studio / Performance catalogs + multi-image product cards */
.world-jump-nav{
  display:flex;
  gap:10px;
  margin-top:48px;
}

.world-jump-nav a{
  display:inline-flex;
  align-items:center;
  gap:12px;
  min-width:170px;
  padding:13px 16px;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  transition:border-color .2s var(--ease),color .2s var(--ease),background .2s var(--ease);
}

.world-jump-nav a span{
  color:var(--muted-2);
  font-size:.62rem;
}

.world-jump-nav a:hover{
  color:var(--ink);
  border-color:#5a5e5b;
  background:rgba(255,255,255,.025);
}

.pillar{
  color:inherit;
}

.product-section + .product-section{
  border-top:1px solid var(--line);
}

.product-gallery{
  position:relative;
}

.gallery-main-link{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  position:relative;
}

.gallery-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  visibility:hidden;
  transform:scale(1.002);
  transition:opacity .22s var(--ease),transform .5s var(--ease);
}

.gallery-image.is-active{
  opacity:1;
  visibility:visible;
}

.card:hover .gallery-image.is-active{
  transform:scale(1.018);
}

.gallery-placeholder{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
}

.gallery-arrow{
  position:absolute;
  top:50%;
  z-index:3;
  width:38px;
  height:38px;
  padding:0;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:1px solid rgba(241,240,234,.38);
  background:rgba(17,19,18,.58);
  backdrop-filter:blur(8px);
  color:var(--ink);
  cursor:pointer;
  opacity:0;
  transition:opacity .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease);
}

.gallery-prev{left:12px}
.gallery-next{right:12px}

.product-gallery:hover .gallery-arrow,
.product-gallery:focus-within .gallery-arrow{
  opacity:1;
}

.gallery-arrow:hover{
  background:rgba(17,19,18,.86);
  border-color:var(--ink);
}


.card-info-link{
  display:block;
}

.card-type-note{
  display:block;
  margin-top:8px;
  color:var(--muted-2);
  font-size:.7rem;
  letter-spacing:.04em;
}

.card-performance .card-image{
  background:#171a19;
}

.card-performance .card-details{
  position:relative;
}

.card-performance .card-details::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:28px;
  height:1px;
  background:var(--signal);
}

.card-performance .card-details{
  padding-top:22px;
}

.grid-performance .card-image{
  aspect-ratio:1/1;
}

.grid-studio .card-image{
  aspect-ratio:4/5;
}

@media(max-width:750px){
  .world-jump-nav{
    width:100%;
    margin-top:40px;
  }

  .world-jump-nav a{
    flex:1;
    min-width:0;
  }

  .gallery-arrow{
    width:42px;
    height:42px;
    opacity:1;
  }

  .gallery-prev{left:8px}
  .gallery-next{right:8px}

  .gallery-count{
    right:8px;
    bottom:8px;
  }
}

@media(max-width:520px){
  .world-jump-nav{
    flex-direction:column;
  }

  .grid-performance .card-image,
  .grid-studio .card-image{
    aspect-ratio:1/1.18;
  }
}


/* Phase 4: product detail gallery + differentiated PDP */
.product-page{
  display:grid;
  grid-template-columns:minmax(0,1.28fr) minmax(420px,.72fr);
  min-height:calc(100svh - 76px);
  border-bottom:1px solid var(--line);
}

.product-gallery-layout{
  min-width:0;
  display:grid;
  grid-template-columns:112px minmax(0,1fr);
  gap:1px;
  background:var(--line);
  border-right:1px solid var(--line);
}

.product-thumbs{
  background:var(--bg);
  padding:18px 14px;
  display:flex;
  flex-direction:column;
  gap:10px;
  overflow-y:auto;
  max-height:calc(100svh - 76px);
  position:sticky;
  top:0;
}

.product-thumb{
  flex:0 0 auto;
  width:100%;
  aspect-ratio:1/1.18;
  padding:0;
  border:1px solid transparent;
  background:var(--surface);
  overflow:hidden;
  cursor:pointer;
  opacity:.58;
  transition:opacity .2s var(--ease),border-color .2s var(--ease);
}

.product-thumb:hover,
.product-thumb.is-active{
  opacity:1;
}

.product-thumb.is-active{
  border-color:var(--ink);
}

.product-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.product-thumb-placeholder{
  display:grid;
  place-items:center;
  color:var(--muted-2);
  font-weight:750;
}

.product-main-media{
  position:relative;
  min-height:calc(100svh - 76px);
  background:#202422;
  overflow:hidden;
}

.product-main-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  padding:clamp(18px,3vw,46px);
  opacity:0;
  visibility:hidden;
  transition:opacity .24s var(--ease);
}

.product-main-image.is-active{
  opacity:1;
  visibility:visible;
}

.product-page-studio .product-main-media{
  background:#1f2321;
}

.product-page-performance .product-main-media{
  background:#171918;
}

.product-main-placeholder{
  min-height:calc(100svh - 76px);
  background:#202422;
}

.product-media-arrow{
  position:absolute;
  top:50%;
  z-index:4;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:1px solid rgba(241,240,234,.36);
  background:rgba(17,19,18,.58);
  backdrop-filter:blur(9px);
  color:var(--ink);
  cursor:pointer;
  opacity:0;
  transition:opacity .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease);
}

.product-main-media:hover .product-media-arrow,
.product-main-media:focus-within .product-media-arrow{
  opacity:1;
}

.product-media-arrow:hover{
  border-color:var(--ink);
  background:rgba(17,19,18,.88);
}

.product-media-prev{left:20px}
.product-media-next{right:20px}

.product-purchase{
  align-self:start;
  min-height:calc(100svh - 76px);
  padding:clamp(48px,6vw,96px) clamp(28px,5vw,76px);
  position:sticky;
  top:0;
  background:var(--bg);
}

.product-purchase .back{
  margin-bottom:76px;
}

.product-meta{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding-bottom:12px;
  margin-bottom:30px;
  border-bottom:1px solid var(--line);
  color:var(--muted-2);
  font-size:.64rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
}

.product-purchase h1{
  margin:18px 0 18px;
  font-size:clamp(3.5rem,5.4vw,6.8rem);
  line-height:.88;
  letter-spacing:-.075em;
  font-weight:700;
}

.product-purchase .price{
  margin:0;
  font-size:1.1rem;
  font-weight:650;
}

.product-context{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:34px 0;
}

.product-context span{
  padding:7px 9px;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.product-context-performance span:first-child{
  border-color:rgba(198,106,72,.65);
  color:var(--ink);
}

.product-purchase .description{
  max-width:620px;
  margin:0 0 42px;
  color:var(--muted);
  line-height:1.8;
}

.product-buy-form{
  border-top:1px solid var(--line);
  padding-top:26px;
}

.variant-label{
  display:block;
  margin-bottom:10px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.product-purchase .variant-select{
  max-width:none;
  margin:0;
  min-height:52px;
  border-color:var(--line);
  background:var(--surface);
}

.product-add-button{
  width:100%;
  margin-top:16px;
}

@media(max-width:1050px){
  .product-page{
    grid-template-columns:minmax(0,1fr) minmax(360px,.78fr);
  }

  .product-gallery-layout{
    grid-template-columns:92px minmax(0,1fr);
  }
}

@media(max-width:850px){
  .product-page{
    display:block;
  }

  .product-gallery-layout{
    display:flex;
    flex-direction:column-reverse;
    border-right:0;
  }

  .product-main-media{
    min-height:68svh;
  }

  .product-thumbs{
    position:static;
    max-height:none;
    padding:10px var(--page-x) 16px;
    flex-direction:row;
    overflow-x:auto;
    overflow-y:hidden;
    background:var(--bg);
    scrollbar-width:none;
  }

  .product-thumbs::-webkit-scrollbar{
    display:none;
  }

  .product-thumb{
    width:78px;
    aspect-ratio:1/1.18;
  }

  .product-main-image{
    padding:18px;
  }

  .product-main-placeholder{
    min-height:68svh;
  }

  .product-media-arrow{
    opacity:1;
  }

  .product-media-prev{left:12px}
  .product-media-next{right:12px}

  .product-purchase{
    position:static;
    min-height:0;
    padding:64px var(--page-x) 84px;
  }

  .product-purchase .back{
    margin-bottom:54px;
  }
}

@media(max-width:520px){
  .product-main-media,
  .product-main-placeholder{
    min-height:58svh;
  }

  .product-thumb{
    width:68px;
  }

  .product-purchase h1{
    font-size:clamp(3.2rem,16vw,5.4rem);
  }

  .product-context{
    margin:28px 0;
  }
}

/* Phase 5: Mobile world transition + commerce */
@media(max-width:750px){
  .worlds{position:relative;overflow:visible;border-bottom:0}
  .world{overflow:visible}
  .world-two{margin-bottom:82px}
  .world-two::after{
    content:"01   /   TWO WORLDS   /   02";
    position:absolute;left:var(--page-x);right:var(--page-x);bottom:-54px;z-index:5;height:46px;
    display:flex;align-items:center;justify-content:center;
    border-top:1px solid rgba(241,240,234,.18);border-bottom:1px solid rgba(241,240,234,.18);
    background:var(--bg);color:var(--muted-2);font-size:.58rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase
  }
  .world-two .world-content::after,.world-four .world-content::after{
    position:absolute;right:-12px;bottom:-26px;z-index:-1;
    font-size:clamp(8rem,42vw,13rem);line-height:.7;font-weight:800;letter-spacing:-.10em;
    color:rgba(241,240,234,.025);pointer-events:none
  }
  .world-two .world-content::after{content:"02"}
  .world-four .world-content::after{content:"04"}
  .world-four{border-top:0}
  .world-four .world-content{transform:translateY(10px)}
}

.commerce-page{max-width:1720px;margin:0 auto;padding:0 var(--page-x) var(--section-y)}
.commerce-hero{min-height:260px;padding:clamp(64px,8vw,112px) 0 42px;display:flex;align-items:flex-end;justify-content:space-between;gap:32px;border-bottom:1px solid var(--line)}
.commerce-hero h1{margin:14px 0 0;font-size:clamp(4rem,8vw,8.8rem);line-height:.84;letter-spacing:-.08em;font-weight:700}
.commerce-empty{min-height:420px;padding:80px 0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.commerce-empty h2{max-width:720px;margin:14px 0 18px;font-size:clamp(2.8rem,5vw,5.4rem);line-height:.95;letter-spacing:-.06em}
.commerce-empty-compact{min-height:0;padding:34px 0}

.cart-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(330px,.5fr);gap:clamp(42px,6vw,96px);align-items:start;padding-top:54px}
.cart-items{border-top:1px solid var(--line)}
.cart-item{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;padding:24px 0;border-bottom:1px solid var(--line)}
.cart-item-media{aspect-ratio:1/1.12;background:var(--surface);overflow:hidden;display:grid;place-items:center}
.cart-item-media img{width:100%;height:100%;object-fit:cover}
.cart-item-media span{color:var(--muted-2);font-size:2rem;font-weight:800;letter-spacing:-.1em}
.cart-item-main{min-width:0;display:flex;flex-direction:column}
.cart-item-heading{display:flex;justify-content:space-between;gap:24px}
.cart-item-meta{margin:0 0 7px;color:var(--muted-2);font-size:.62rem;font-weight:700;letter-spacing:.15em}
.cart-item-heading h2{margin:0;font-size:clamp(1.35rem,2vw,2rem);letter-spacing:-.035em;font-weight:620}
.cart-variant,.cart-unit-price{margin:8px 0 0;color:var(--muted);font-size:.8rem}
.cart-line-price{flex:0 0 auto;font-size:.95rem;font-weight:650}
.cart-item-actions{margin-top:auto;padding-top:28px;display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
.quantity-form{display:flex;align-items:flex-end;gap:10px}
.quantity-form label{display:flex;flex-direction:column;gap:7px;color:var(--muted);font-size:.66rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.quantity-form input{width:76px;height:42px;padding:0 10px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.quantity-form button,.remove-form button{min-height:42px;padding:0;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:.72rem;border-bottom:1px solid transparent}
.quantity-form button:hover,.remove-form button:hover{color:var(--ink);border-color:var(--ink)}

.cart-summary,.checkout-summary{position:sticky;top:32px;padding:28px;border:1px solid var(--line);background:var(--surface)}
.summary-row,.summary-total{display:flex;justify-content:space-between;gap:28px;padding:12px 0}
.summary-row{font-size:.85rem}
.summary-muted{color:var(--muted);font-size:.76rem}
.summary-rule{height:1px;margin:14px 0;background:var(--line)}
.summary-total{align-items:baseline;font-size:1rem}
.summary-total strong{font-size:1.45rem}
.commerce-primary-action{width:100%;margin-top:26px}

.checkout-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.62fr);gap:clamp(52px,8vw,120px);align-items:start;padding-top:56px}
.checkout-panel{max-width:760px}
.checkout-intro{max-width:650px}
.checkout-intro h2,.checkout-summary h2{margin:14px 0 18px;font-size:clamp(2.4rem,4vw,4.6rem);line-height:.96;letter-spacing:-.055em}
.checkout-intro>p:last-child{color:var(--muted);max-width:620px}
.checkout-form-premium{max-width:none;margin:42px 0 0;padding-top:28px;border-top:1px solid var(--line)}
.checkout-field{display:block;margin:0}
.checkout-field>span{display:block;margin-bottom:10px;color:var(--muted);font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.checkout-form-premium select{min-height:54px;margin:0;border-color:var(--line);background:var(--surface)}
.checkout-facts{display:grid;grid-template-columns:repeat(3,1fr);margin-top:26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.checkout-facts div{padding:18px 16px 18px 0}
.checkout-facts div+div{padding-left:16px;border-left:1px solid var(--line)}
.checkout-facts span,.checkout-facts strong{display:block}
.checkout-facts span{color:var(--muted-2);font-size:.62rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.checkout-facts strong{margin-top:7px;font-size:.85rem}
.checkout-legal-note{max-width:680px;line-height:1.65}
.checkout-summary-items{margin-top:26px}
.checkout-summary-item{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.checkout-summary-media{width:62px;aspect-ratio:1/1.1;overflow:hidden;display:grid;place-items:center;background:var(--bg)}
.checkout-summary-media img{width:100%;height:100%;object-fit:cover}
.checkout-summary-media span{color:var(--muted-2);font-weight:800}
.checkout-summary-item>div strong,.checkout-summary-item>div span{display:block}
.checkout-summary-item>div strong{font-size:.82rem}
.checkout-summary-item>div span{margin-top:3px;color:var(--muted);font-size:.7rem}
.checkout-summary-item>strong{font-size:.76rem}
.checkout-error{margin:28px 0;padding:16px 18px;border:1px solid var(--signal);background:rgba(198,106,72,.055)}

@media(max-width:980px){
  .cart-layout,.checkout-layout{grid-template-columns:1fr}
  .cart-summary,.checkout-summary{position:static}
  .cart-summary{max-width:560px;margin-left:auto}
  .checkout-summary{order:-1}
}
@media(max-width:750px){
  .commerce-hero{min-height:220px;align-items:flex-start;flex-direction:column;justify-content:flex-end;gap:22px}
  .commerce-hero h1{font-size:clamp(4rem,18vw,6.6rem)}
  .cart-layout,.checkout-layout{padding-top:36px;gap:48px}
  .cart-item{grid-template-columns:105px minmax(0,1fr);gap:16px}
  .cart-item-heading{display:block}
  .cart-line-price{display:block;margin-top:12px}
  .cart-item-actions{align-items:flex-start;flex-direction:column;padding-top:20px}
  .quantity-form{flex-wrap:wrap}
  .checkout-facts{grid-template-columns:1fr}
  .checkout-facts div{padding:14px 0}
  .checkout-facts div+div{padding-left:0;border-left:0;border-top:1px solid var(--line)}
}
@media(max-width:520px){
  .cart-item{grid-template-columns:86px minmax(0,1fr)}
  .cart-summary,.checkout-summary{padding:22px}
  .checkout-summary-item{grid-template-columns:54px minmax(0,1fr)}
  .checkout-summary-item>strong{grid-column:2}
  .checkout-summary-media{width:54px}
}


/* Phase 5 revision: warm light mode is default; dark mode remains optional */
body{
  transition:background-color .22s var(--ease),color .22s var(--ease);
}

.top{
  background:var(--header-bg);
  backdrop-filter:blur(14px);
}

.theme-toggle{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-left:2px;
  padding:8px 0 8px 12px;
  border:0;
  border-left:1px solid var(--line);
  background:transparent;
  color:var(--muted);
  cursor:pointer;
  font:inherit;
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:color .2s var(--ease);
}

.theme-toggle:hover,
.theme-toggle:focus-visible{color:var(--ink)}

.theme-toggle-mark{
  width:18px;
  height:18px;
  border:1px solid currentColor;
  border-radius:50%;
  position:relative;
}

.theme-toggle-mark::after{
  content:"";
  position:absolute;
  inset:3px;
  border-radius:50%;
  background:currentColor;
  transform:scale(.35);
  transition:transform .25s var(--ease);
}

html[data-theme="dark"] .theme-toggle-mark::after{
  transform:scale(1);
}

/* Light editorial surfaces */
html[data-theme="light"] .hero{
  background:
    radial-gradient(circle at 82% 16%,rgba(184,95,66,.12),transparent 30%),
    linear-gradient(145deg,#f7f3ec 0%,var(--bg) 66%);
}

html[data-theme="light"] .hero::after{
  background:linear-gradient(90deg,transparent 0 74%,rgba(35,37,34,.045) 74% 74.08%,transparent 74.08%);
}

html[data-theme="light"] .world-two{
  background:
    radial-gradient(circle at 18% 16%,rgba(35,37,34,.055),transparent 34%),
    linear-gradient(145deg,#e5e8e5,var(--cool) 72%);
}

html[data-theme="light"] .world-four{
  background:
    radial-gradient(circle at 78% 14%,rgba(158,116,72,.12),transparent 36%),
    linear-gradient(145deg,#eadfce,var(--earth) 74%);
}

html[data-theme="light"] .world-path,
html[data-theme="light"] .pillar-label{
  border-color:rgba(35,37,34,.18);
}

html[data-theme="light"] .card-image,
html[data-theme="light"] .product-media,
html[data-theme="light"] .product-main-media,
html[data-theme="light"] .product-main-placeholder,
html[data-theme="light"] .card-performance .card-image{
  background:var(--media-bg);
}

html[data-theme="light"] .variant-select,
html[data-theme="light"] .checkout-form-premium select,
html[data-theme="light"] .quantity-form input{
  color:var(--ink);
  border-color:var(--line);
  background:#f8f5ef;
}

html[data-theme="light"] .world-hero{
  background:
    radial-gradient(circle at 84% 20%,var(--world-glow),transparent 31%),
    linear-gradient(145deg,#eee9e0,var(--bg) 70%);
}

html[data-theme="light"] .world-page-two{--world-glow:rgba(104,129,135,.13)}
html[data-theme="light"] .world-page-four{--world-glow:rgba(171,135,88,.15)}

html[data-theme="light"] .pillar-studio{
  background:linear-gradient(150deg,#eee8df,var(--surface) 74%);
}

html[data-theme="light"] .pillar-performance{
  background:
    linear-gradient(150deg,rgba(255,255,255,.25),transparent 45%),
    var(--bg);
}

html[data-theme="light"] .world-jump-nav a:hover{
  border-color:#9c958a;
  background:rgba(35,37,34,.025);
}

html[data-theme="light"] .gallery-arrow,
html[data-theme="light"] .product-media-arrow{
  border-color:var(--overlay-line);
  background:var(--overlay-bg);
  color:#f6f2ea;
}

html[data-theme="light"] .gallery-arrow:hover,
html[data-theme="light"] .product-media-arrow:hover{
  background:rgba(35,37,34,.88);
  border-color:#fff;
}

html[data-theme="light"] .product-page-studio .product-main-media{
  background:#e6e1d8;
}

html[data-theme="light"] .product-page-performance .product-main-media{
  background:#ddd9d0;
}

html[data-theme="light"] .product-context-performance span:first-child{
  border-color:rgba(184,95,66,.62);
}

html[data-theme="light"] .button-primary{
  background:var(--ink);
  color:#f7f3ec;
}

html[data-theme="light"] .button-primary:hover{
  background:#3a3d38;
}

/* Warm commerce surfaces */
html[data-theme="light"] .cart-summary,
html[data-theme="light"] .checkout-summary{
  background:#e9e2d7;
}

html[data-theme="light"] .checkout-error{
  background:rgba(184,95,66,.08);
}

/* Mobile split works in both themes */
@media(max-width:750px){
  html[data-theme="light"] .world-two::after{
    border-color:rgba(35,37,34,.16);
    background:var(--bg);
  }

  html[data-theme="light"] .world-two .world-content::after,
  html[data-theme="light"] .world-four .world-content::after{
    color:rgba(35,37,34,.045);
  }

  .theme-toggle{
    margin-left:auto;
    padding-left:12px;
  }
}

@media(max-width:520px){
  .primary-nav{gap:18px}
  .theme-toggle-label{display:none}
  .theme-toggle{padding-left:10px}
}


/* =========================================================
   Phase 6: final responsive + consistency polish
   ========================================================= */

/* Consistent keyboard focus */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible{
  outline:2px solid var(--signal);
  outline-offset:3px;
}

/* Avoid layout surprises from long names / labels */
.card-details,
.cart-item-main,
.checkout-summary-item,
.product-purchase,
.world-hero-copy{
  min-width:0;
}

.card-details h3,
.cart-item-heading h2,
.checkout-summary-item strong,
.product-purchase h1{
  overflow-wrap:anywhere;
}

/* Header refinement */
.top{
  position:sticky;
  top:0;
}

.primary-nav{
  min-width:0;
}

.theme-toggle{
  flex:0 0 auto;
}

/* Light mode gets a quieter, warmer paper-like rhythm */
html[data-theme="light"] .collection,
html[data-theme="light"] .world-endnote{
  background:var(--bg);
}

html[data-theme="light"] .manifesto{
  background:#e6ded2;
}

html[data-theme="light"] footer{
  background:#e7e0d5;
}

/* Dark mode preserves the stronger graphite contrast */
html[data-theme="dark"] .manifesto,
html[data-theme="dark"] footer{
  background:var(--surface);
}

/* Product cards: consistent hierarchy */
.card{
  min-width:0;
}

.card-details{
  gap:18px;
}

.card-details h3{
  line-height:1.08;
}

.card-details>strong{
  white-space:nowrap;
}

/* Product detail */
.product-thumbs{
  scrollbar-gutter:stable;
}

.product-purchase .note{
  max-width:620px;
}

/* Cart / checkout visual consistency */
.cart-summary,
.checkout-summary{
  box-shadow:none;
}

.checkout-summary-item:last-child,
.cart-item:last-child{
  border-bottom:0;
}

/* Desktop width guard */
@media(min-width:1500px){
  .hero-copy{
    grid-column:1 / span 7;
  }

  .world-content,
  .pillar-copy{
    max-width:690px;
  }

  .product-purchase{
    padding-left:72px;
    padding-right:72px;
  }
}

/* Tablet */
@media(max-width:1050px){
  .top{
    gap:22px;
  }

  .primary-nav{
    gap:22px;
  }

  .world{
    min-height:560px;
  }

  .hero h1{
    font-size:clamp(4.4rem,9vw,7.8rem);
  }

  .product-purchase h1{
    font-size:clamp(3.6rem,5.8vw,5.8rem);
  }
}

/* Mobile: make the header feel intentional rather than compressed */
@media(max-width:750px){
  :root{
    --page-x:20px;
    --section-y:68px;
  }

  .top{
    position:sticky;
    top:0;
    padding:14px var(--page-x) 12px;
    gap:13px;
    background:var(--header-bg);
  }

  .brand{
    width:100%;
    justify-content:space-between;
  }

  .brand strong{
    font-size:1.55rem;
  }

  .brand small{
    margin-left:auto;
  }

  .primary-nav{
    width:100%;
    gap:20px;
    padding-bottom:1px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
  }

  .primary-nav a{
    flex:0 0 auto;
    font-size:.67rem;
    letter-spacing:.13em;
  }

  .theme-toggle{
    flex:0 0 auto;
    margin-left:auto;
  }

  .hero{
    min-height:680px;
    padding-top:72px;
    padding-bottom:68px;
  }

  .hero h1{
    font-size:clamp(3.85rem,17.2vw,6.4rem);
    max-width:11ch;
  }

  .hero-intro{
    max-width:34rem;
  }

  .world{
    min-height:470px;
  }

  .world-content h2{
    font-size:clamp(3.8rem,16vw,6rem);
  }

  .world-paths{
    margin-top:30px;
  }

  .world-two{
    margin-bottom:92px;
  }

  .world-two::after{
    bottom:-61px;
    height:50px;
    font-size:.54rem;
    letter-spacing:.15em;
  }

  .world-four .world-content{
    transform:none;
    padding-top:8px;
  }

  .section-head h2{
    font-size:clamp(2.7rem,12vw,4.6rem);
  }

  .grid{
    gap:36px 14px;
  }

  .card-details{
    padding-top:14px;
  }

  .world-hero{
    min-height:590px;
  }

  .world-hero-copy h1{
    font-size:clamp(4.2rem,18.5vw,6.8rem);
  }

  .pillar{
    min-height:390px;
  }

  .pillar-copy h2{
    font-size:clamp(3.9rem,16vw,6rem);
  }

  .product-main-media,
  .product-main-placeholder{
    min-height:62svh;
  }

  .product-purchase{
    padding-top:54px;
  }

  .product-purchase h1{
    font-size:clamp(3rem,14.5vw,5rem);
  }

  .cart-layout,
  .checkout-layout{
    gap:42px;
  }

  .cart-item{
    padding:20px 0;
  }

  .cart-summary,
  .checkout-summary{
    max-width:none;
    width:100%;
    margin:0;
    box-sizing:border-box;
  }
}

/* Small phones */
@media(max-width:520px){
  :root{
    --page-x:18px;
    --section-y:62px;
  }

  .top{
    padding-left:var(--page-x);
    padding-right:var(--page-x);
  }

  .brand small{
    display:none;
  }

  .primary-nav{
    gap:17px;
  }

  .primary-nav a{
    font-size:.64rem;
    letter-spacing:.11em;
  }

  .theme-toggle{
    padding-left:9px;
  }

  .theme-toggle-mark{
    width:17px;
    height:17px;
  }

  .hero{
    min-height:620px;
    padding-top:58px;
  }

  .hero h1{
    font-size:clamp(3.55rem,17vw,5.5rem);
  }

  .world{
    min-height:430px;
    padding-top:30px;
    padding-bottom:30px;
  }

  .world-content h2{
    font-size:clamp(3.45rem,16vw,5.35rem);
  }

  .world-paths span{
    padding-top:12px;
    padding-bottom:12px;
  }

  .collection{
    min-height:0;
  }

  .grid{
    grid-template-columns:1fr;
    gap:42px;
  }

  .gallery-arrow{
    width:40px;
    height:40px;
  }

  .world-jump-nav{
    gap:8px;
  }

  .world-jump-nav a{
    min-height:46px;
  }

  .product-thumbs{
    padding-left:var(--page-x);
    padding-right:var(--page-x);
  }

  .product-thumb{
    width:64px;
  }

  .product-main-media,
  .product-main-placeholder{
    min-height:54svh;
  }

  .product-media-arrow{
    width:42px;
    height:42px;
  }

  .product-purchase{
    padding-left:var(--page-x);
    padding-right:var(--page-x);
  }

  .cart-item{
    grid-template-columns:78px minmax(0,1fr);
    gap:14px;
  }

  .cart-item-heading h2{
    font-size:1.2rem;
  }

  .quantity-form{
    width:100%;
    justify-content:space-between;
  }

  .quantity-form button{
    align-self:flex-end;
  }

  .checkout-summary-item{
    gap:12px;
  }

  .commerce-hero h1{
    font-size:clamp(3.6rem,17vw,5.4rem);
  }
}

/* Very narrow devices */
@media(max-width:390px){
  .primary-nav{
    gap:14px;
  }

  .primary-nav a{
    font-size:.61rem;
  }

  .theme-toggle{
    padding-left:7px;
  }

  .hero h1{
    font-size:3.45rem;
  }

  .world-content h2,
  .world-hero-copy h1{
    font-size:3.7rem;
  }

  .cart-item{
    grid-template-columns:70px minmax(0,1fr);
  }
}

/* Accessibility: reduce motion where requested */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}

  *,
  *::before,
  *::after{
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}


/* =========================================================
   Phase 6 correction: official logo + icon header + toggle
   ========================================================= */

.top{
  min-height:72px;
}

.brand-image{
  width:136px;
  height:46px;
  display:flex;
  align-items:center;
  overflow:hidden;
}

.brand-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:left center;
  transition:filter .2s var(--ease),opacity .2s var(--ease);
}

html[data-theme="dark"] .brand-image img{
  filter:invert(1);
}

.icon-nav{
  display:flex;
  align-items:center;
  gap:10px;
  overflow:visible;
}

.nav-icon-link{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  border:1px solid transparent;
  color:var(--ink);
  transition:
    background-color .2s var(--ease),
    border-color .2s var(--ease),
    color .2s var(--ease);
}

.nav-icon-link:hover,
.nav-icon-link:focus-visible{
  border-color:var(--line);
  background:var(--surface);
}

.nav-icon-link svg{
  width:25px;
  height:21px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.cart-icon-link{
  width:auto;
  min-width:54px;
  padding:0 8px;
  gap:5px;
}

.cart-icon-link svg{
  width:23px;
}

.cart-count{
  min-width:2.4ch;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.03em;
  font-variant-numeric:tabular-nums;
}

/* Actual Light/Dark toggle */
.theme-toggle-switch{
  margin-left:4px;
  padding:0 4px;
  min-width:92px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px solid transparent;
  background:transparent;
}

.theme-toggle-switch:hover,
.theme-toggle-switch:focus-visible{
  border-color:var(--line);
  background:var(--surface);
}

.theme-icon{
  width:17px;
  height:17px;
  display:grid;
  place-items:center;
  color:var(--muted);
  transition:color .2s var(--ease),opacity .2s var(--ease);
}

.theme-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.theme-switch-track{
  width:32px;
  height:18px;
  padding:2px;
  border:1px solid var(--line);
  border-radius:999px;
  display:block;
  background:var(--surface);
  transition:background-color .2s var(--ease),border-color .2s var(--ease);
}

.theme-switch-knob{
  display:block;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--ink);
  transform:translateX(0);
  transition:transform .22s var(--ease),background-color .2s var(--ease);
}

html[data-theme="dark"] .theme-switch-knob{
  transform:translateX(14px);
}

html[data-theme="light"] .theme-icon-sun,
html[data-theme="dark"] .theme-icon-moon{
  color:var(--ink);
}

html[data-theme="light"] .theme-icon-moon,
html[data-theme="dark"] .theme-icon-sun{
  opacity:.45;
}

/* The former text-based toggle styling must not leak into the new control. */
.theme-toggle-switch .theme-toggle-mark,
.theme-toggle-switch .theme-toggle-label{
  display:none;
}

/* Official logo and icon header on mobile too */
@media(max-width:750px){
  .top{
    min-height:64px;
    padding-top:9px;
    padding-bottom:9px;
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
  }

  .brand-image{
    width:102px;
    height:42px;
    flex:0 0 102px;
  }

  .icon-nav{
    width:auto;
    margin-left:auto;
    gap:4px;
    padding:0;
    overflow:visible;
  }

  .nav-icon-link{
    width:38px;
    height:40px;
  }

  .cart-icon-link{
    width:auto;
    min-width:49px;
    padding-left:5px;
    padding-right:5px;
  }

  .theme-toggle-switch{
    min-width:74px;
    height:40px;
    margin-left:0;
    padding:0 2px;
    gap:4px;
  }

  .theme-icon{
    width:14px;
    height:14px;
  }

  .theme-icon svg{
    width:14px;
    height:14px;
  }

  .theme-switch-track{
    width:29px;
    height:17px;
  }

  .theme-switch-knob{
    width:11px;
    height:11px;
  }

  html[data-theme="dark"] .theme-switch-knob{
    transform:translateX(12px);
  }
}

@media(max-width:520px){
  .top{
    gap:5px;
  }

  .brand-image{
    width:90px;
    height:39px;
    flex-basis:90px;
  }

  .icon-nav{
    gap:1px;
  }

  .nav-icon-link{
    width:35px;
  }

  .cart-icon-link{
    min-width:45px;
  }

  .cart-count{
    font-size:.62rem;
  }

  .theme-toggle-switch{
    min-width:62px;
  }

  .theme-icon{
    display:none;
  }
}

@media(max-width:390px){
  .brand-image{
    width:82px;
    flex-basis:82px;
  }

  .nav-icon-link{
    width:32px;
  }

  .cart-icon-link{
    min-width:43px;
  }

  .theme-toggle-switch{
    min-width:39px;
    width:39px;
  }
}

.collection-title-mobile,.mobile-category-nav,.all-products-button{display:none}
.icon-nav .nav-icon-link::after,.icon-nav .nav-icon-link:hover::after,.icon-nav .nav-icon-link:focus-visible::after{content:none!important;display:none!important}
.manifesto-short small{display:block;max-width:620px;margin-top:22px;color:var(--muted);font-size:.88rem;line-height:1.6}
.shop-hero{min-height:360px;padding:48px var(--page-x) 72px;display:flex;flex-direction:column;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--surface)}
.shop-hero h1{margin:18px 0 0;font-size:clamp(4rem,8vw,8rem);line-height:.86;letter-spacing:-.075em}.shop-collection{padding-top:72px}
@media(max-width:750px){
body.home .top{position:absolute;top:0;left:0;right:0;z-index:50;min-height:64px;padding:10px 18px;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:10px;background:transparent;border-bottom-color:transparent;backdrop-filter:none;transition:transform .28s var(--ease),opacity .22s var(--ease),background-color .22s var(--ease),border-color .22s var(--ease),box-shadow .22s var(--ease)}
body.home .brand-image{flex:0 0 88px;width:88px;height:40px;margin:0}body.home .brand-image img{filter:invert(1)}
body.home .icon-nav{width:auto;margin-left:auto;flex:0 0 auto;justify-content:flex-end;gap:2px}
body.home .nav-icon-link,body.home .theme-toggle-switch,body.home .theme-icon{color:#fff}
body.home .theme-switch-track{border-color:rgba(255,255,255,.62);background:rgba(255,255,255,.12)}body.home .theme-switch-knob{background:#fff}
body.home .top.home-header-hidden{position:fixed;transform:translateY(calc(-100% - 8px));opacity:0;pointer-events:none}
body.home .top.home-header-revealed{position:fixed;transform:translateY(0);opacity:1;pointer-events:auto;background:var(--header-bg);border-bottom-color:var(--line);backdrop-filter:blur(14px);box-shadow:0 8px 28px rgba(0,0,0,.08)}
body.home .top.home-header-revealed .brand-image img{filter:none}html[data-theme="dark"] body.home .top.home-header-revealed .brand-image img{filter:invert(1)}
body.home .top.home-header-revealed .nav-icon-link,body.home .top.home-header-revealed .theme-toggle-switch,body.home .top.home-header-revealed .theme-icon{color:var(--ink)}
body.home .top.home-header-revealed .theme-switch-track{border-color:var(--line);background:var(--surface)}body.home .top.home-header-revealed .theme-switch-knob{background:var(--ink)}
body.home .hero{height:100svh;min-height:100svh;padding:112px 22px 54px;display:flex;align-items:flex-end;color:#fff;background:radial-gradient(circle at 78% 18%,rgba(184,95,66,.42),transparent 32%),linear-gradient(155deg,#494039 0%,#262b28 50%,#151816 100%)!important}
body.home .hero::after{background:linear-gradient(90deg,transparent 0 78%,rgba(255,255,255,.14) 78% 78.2%,transparent 78.2%)}
body.home .hero .eyebrow,body.home .hero-intro,body.home .hero-meta{color:rgba(255,255,255,.74)}body.home .hero h1,body.home .hero h1 em{color:#fff}
body.home .hero h1{max-width:9ch;font-size:clamp(4.1rem,17.5vw,6.5rem)}body.home .hero-shop-clothes{margin-top:30px;min-height:52px;background:#f2efe8;border-color:#f2efe8;color:#20231f}
.mobile-category-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:34px 14px 42px;background:var(--bg);border-bottom:1px solid var(--line)}
.mobile-category-link{min-width:0;display:flex;flex-direction:column;align-items:center;gap:9px;color:var(--ink);text-align:center}
.mobile-category-icon{width:60px;height:60px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent}
.mobile-category-icon svg{width:27px;height:27px;display:block;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.mobile-category-link>span:last-child{font-size:.56rem;font-weight:700;line-height:1.2;letter-spacing:.04em;white-space:nowrap}
body.home .worlds{display:none!important}
body.home .collection{padding:52px 16px 58px}body.home .section-head{margin-bottom:26px}body.home .section-head .eyebrow,body.home .section-note{display:none}
body.home .collection-title-desktop{display:none}body.home .collection-title-mobile{display:inline}body.home .section-head h2{font-size:clamp(2.7rem,12vw,4.2rem)}
body.home .collection .grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px 10px;overflow:visible;margin:0;padding:0}
body.home .collection .card{width:auto;min-width:0;flex:none}body.home .collection .card:nth-child(n+9){display:none!important}body.home .collection .card-image{aspect-ratio:4/5}
body.home .collection .gallery-arrow{width:32px;height:32px}body.home .collection .gallery-prev{left:5px}body.home .collection .gallery-next{right:5px}
body.home .card-details{display:block;padding-top:9px}body.home .card-details small{font-size:.49rem;letter-spacing:.09em}body.home .card-details h3{margin-top:5px;font-size:.86rem;line-height:1.15}body.home .card-details>strong{display:block;margin-top:7px;font-size:.76rem}body.home .card-type-note{display:none}
.all-products-button{display:flex;width:100%;min-height:50px;margin-top:38px;align-items:center;justify-content:center;border:1px solid var(--ink);background:transparent;color:var(--ink);font-size:.68rem;font-weight:750;letter-spacing:.13em}
body.home .manifesto-short{min-height:0;padding:42px 18px;border-top:1px solid var(--line)}body.home .manifesto-short .eyebrow{margin-bottom:14px}body.home .manifesto-short>p{margin:0;font-size:clamp(2rem,9vw,3rem);line-height:.98;letter-spacing:-.055em}body.home .manifesto-short small{margin-top:14px;font-size:.76rem;line-height:1.5}
body.home footer{margin-top:0;padding:25px 18px 28px;gap:16px;border-top:1px solid var(--line);font-size:.66rem;line-height:1.5}body.home .footer-links{gap:10px 16px}
.shop-hero{min-height:280px;padding-top:80px;padding-bottom:46px}.shop-hero h1{font-size:clamp(3.5rem,16vw,5.3rem)}
.shop-collection .grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px 10px;overflow:visible;margin:0;padding:0}.shop-collection .card{width:auto;min-width:0;flex:none}
}
@media(max-width:390px){body.home .brand-image{width:78px;flex-basis:78px}.mobile-category-nav{gap:7px;padding-left:10px;padding-right:10px}.mobile-category-icon{width:54px;height:54px}.mobile-category-icon svg{width:24px;height:24px}.mobile-category-link>span:last-child{font-size:.5rem}}


/* =========================================================
   2&4 mobile header correction v6.1
   Logo left, navigation right, compact transparent header
   ========================================================= */
@media(max-width:750px){
  body.home .top{
    height:64px;
    min-height:64px;
    padding:10px 16px;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
  }

  body.home .brand,
  body.home .brand-image{
    display:flex !important;
    width:82px !important;
    height:38px !important;
    flex:0 0 82px !important;
    margin:0 !important;
    padding:0 !important;
    align-items:center !important;
    justify-content:flex-start !important;
  }

  body.home .brand-image img{
    width:82px !important;
    height:38px !important;
    object-fit:contain !important;
    object-position:left center !important;
  }

  body.home .primary-nav,
  body.home .icon-nav{
    display:flex !important;
    width:auto !important;
    max-width:calc(100% - 94px) !important;
    height:40px !important;
    margin:0 0 0 auto !important;
    padding:0 !important;
    gap:2px !important;
    flex:0 1 auto !important;
    align-items:center !important;
    justify-content:flex-end !important;
    overflow:visible !important;
  }

  body.home .nav-icon-link{
    width:34px !important;
    height:38px !important;
    min-width:34px !important;
    padding:0 !important;
  }

  body.home .nav-icon-link svg{
    width:20px !important;
    height:18px !important;
  }

  body.home .cart-icon-link{
    width:auto !important;
    min-width:45px !important;
    padding:0 3px !important;
    gap:3px !important;
  }

  body.home .cart-count{
    font-size:.58rem !important;
  }

  body.home .theme-toggle-switch{
    width:42px !important;
    min-width:42px !important;
    height:38px !important;
    margin:0 !important;
    padding:0 3px !important;
    gap:0 !important;
    border:0 !important;
    background:transparent !important;
  }

  body.home .theme-toggle-switch .theme-icon{
    display:none !important;
  }

  body.home .theme-switch-track{
    width:30px !important;
    height:17px !important;
    margin:0 auto !important;
  }

  body.home .theme-switch-knob{
    width:11px !important;
    height:11px !important;
  }

  html[data-theme="dark"] body.home .theme-switch-knob{
    transform:translateX(13px) !important;
  }

  /* Philosophy final wording gets a lighter footprint */
  body.home .manifesto-short{
    padding-top:34px !important;
    padding-bottom:34px !important;
  }

  body.home .manifesto-short>p{
    font-size:clamp(2rem,8.5vw,2.8rem) !important;
  }

  body.home .manifesto-short small{
    display:none !important;
  }
}

@media(max-width:390px){
  body.home .brand,
  body.home .brand-image{
    width:74px !important;
    flex-basis:74px !important;
  }

  body.home .brand-image img{
    width:74px !important;
  }

  body.home .primary-nav,
  body.home .icon-nav{
    max-width:calc(100% - 84px) !important;
  }

  body.home .nav-icon-link{
    width:31px !important;
    min-width:31px !important;
  }

  body.home .cart-icon-link{
    min-width:42px !important;
  }

  body.home .theme-toggle-switch{
    width:38px !important;
    min-width:38px !important;
  }
}

/* version marker: 2and4-v6-header-philosophy-fix */


/* =========================================================
   2&4 Studio – Mobile subpage correction v6.2
   Compact global header + simplified world pages
   ========================================================= */

@media(max-width:750px){

  /* -------------------------------------------------------
     Global mobile header
     Home keeps its transparent special state through
     the existing body.home rules further above.
     ------------------------------------------------------- */
  .top{
    min-height:64px !important;
    height:64px !important;
    padding:10px 16px !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
  }

  .brand,
  .brand-image{
    width:82px !important;
    height:38px !important;
    flex:0 0 82px !important;
    margin:0 !important;
    padding:0 !important;
    justify-content:flex-start !important;
  }

  .brand-image img{
    width:82px !important;
    height:38px !important;
    object-fit:contain !important;
    object-position:left center !important;
  }

  .primary-nav,
  .icon-nav{
    width:auto !important;
    max-width:calc(100% - 94px) !important;
    height:40px !important;
    margin:0 0 0 auto !important;
    padding:0 !important;
    display:flex !important;
    flex:0 1 auto !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:2px !important;
    overflow:visible !important;
  }

  .nav-icon-link{
    width:34px !important;
    min-width:34px !important;
    height:38px !important;
    padding:0 !important;
  }

  .nav-icon-link svg{
    width:20px !important;
    height:18px !important;
  }

  .cart-icon-link{
    width:auto !important;
    min-width:45px !important;
    padding:0 3px !important;
    gap:3px !important;
  }

  .cart-count{
    font-size:.58rem !important;
  }

  .theme-toggle-switch{
    width:42px !important;
    min-width:42px !important;
    height:38px !important;
    margin:0 !important;
    padding:0 3px !important;
    gap:0 !important;
  }

  .theme-toggle-switch .theme-icon{
    display:none !important;
  }

  .theme-switch-track{
    width:30px !important;
    height:17px !important;
    margin:0 auto !important;
  }

  .theme-switch-knob{
    width:11px !important;
    height:11px !important;
  }

  html[data-theme="dark"] .theme-switch-knob{
    transform:translateX(13px) !important;
  }

  /* -------------------------------------------------------
     2-Wheels / 4x4 mobile pages:
     editorial desktop presentation becomes a compact
     storefront on phones.
     ------------------------------------------------------- */
  .world-page .world-hero{
    min-height:230px !important;
    padding:34px 18px 36px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    background:var(--bg) !important;
    border-bottom:1px solid var(--line) !important;
  }

  .world-page .world-back{
    position:absolute;
    top:84px;
    left:18px;
    font-size:.58rem;
  }

  .world-page .world-hero-grid{
    display:block !important;
  }

  .world-page .world-hero-copy{
    width:100% !important;
  }

  .world-page .world-hero-copy .eyebrow{
    margin-bottom:10px !important;
    font-size:.58rem !important;
  }

  .world-page .world-hero-copy h1{
    margin:0 !important;
    font-size:clamp(3rem,14vw,4.8rem) !important;
    line-height:.9 !important;
    letter-spacing:-.07em !important;
  }

  .world-page .world-hero-copy>p:last-child,
  .world-page .world-hero-aside,
  .world-page .world-jump-nav{
    display:none !important;
  }

  /* Remove the large Studio / Performance presentation cards */
  .world-page .world-pillars{
    display:none !important;
  }

  /* Product sections become the actual content */
  .world-page .world-collection{
    padding:44px 16px 48px !important;
  }

  .world-page .world-collection + .world-collection{
    border-top:1px solid var(--line) !important;
  }

  .world-page .section-head{
    margin-bottom:24px !important;
  }

  .world-page .section-head .eyebrow{
    margin-bottom:8px !important;
    font-size:.54rem !important;
  }

  .world-page .section-head h2{
    font-size:clamp(2rem,9vw,3.2rem) !important;
    line-height:.96 !important;
  }

  .world-page .section-note{
    display:none !important;
  }

  .world-page .grid,
  .world-page .grid-studio,
  .world-page .grid-performance{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:28px 10px !important;
    overflow:visible !important;
    margin:0 !important;
    padding:0 !important;
  }

  .world-page .card{
    width:auto !important;
    min-width:0 !important;
    flex:none !important;
  }

  .world-page .card-image,
  .world-page .grid-studio .card-image,
  .world-page .grid-performance .card-image{
    aspect-ratio:4/5 !important;
  }

  .world-page .gallery-arrow{
    width:32px !important;
    height:32px !important;
  }

  .world-page .gallery-prev{left:5px !important}
  .world-page .gallery-next{right:5px !important}

  .world-page .card-details{
    display:block !important;
    padding-top:9px !important;
  }

  .world-page .card-details small{
    font-size:.49rem !important;
    letter-spacing:.09em !important;
  }

  .world-page .card-details h3{
    margin-top:5px !important;
    font-size:.86rem !important;
    line-height:1.15 !important;
  }

  .world-page .card-details>strong{
    display:block !important;
    margin-top:7px !important;
    font-size:.76rem !important;
  }

  .world-page .card-type-note{
    display:none !important;
  }

  /* Remove the oversized editorial endnote on mobile */
  .world-page .world-endnote{
    display:none !important;
  }

  /* Footer stays compact on all mobile subpages */
  .world-page + footer,
  body:not(.home) footer{
    padding:25px 18px 28px !important;
    gap:16px !important;
    font-size:.66rem !important;
    line-height:1.5 !important;
  }
}

@media(max-width:390px){
  .brand,
  .brand-image{
    width:74px !important;
    flex-basis:74px !important;
  }

  .brand-image img{
    width:74px !important;
  }

  .primary-nav,
  .icon-nav{
    max-width:calc(100% - 84px) !important;
  }

  .nav-icon-link{
    width:31px !important;
    min-width:31px !important;
  }

  .cart-icon-link{
    min-width:42px !important;
  }

  .theme-toggle-switch{
    width:38px !important;
    min-width:38px !important;
  }
}

/* version marker: 2and4-v6-mobile-subpages-fix */


/* =========================================================
   2&4 Studio – Mobile polish v6.3
   - sun/moon icons around toggle
   - centered narrower hero CTA for future image hero
   - inset / non-continuous divider lines
   ========================================================= */

@media(max-width:750px){

  /* -------------------------------------------------------
     Theme toggle: show subtle sun / moon icons again
     ------------------------------------------------------- */
  body.home .theme-toggle-switch,
  .theme-toggle-switch{
    width:auto !important;
    min-width:auto !important;
    padding:0 2px !important;
    gap:4px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  body.home .theme-toggle-switch .theme-icon,
  .theme-toggle-switch .theme-icon{
    display:inline-flex !important;
    width:12px !important;
    height:12px !important;
    align-items:center !important;
    justify-content:center !important;
    opacity:.7;
    color:currentColor;
  }

  body.home .theme-toggle-switch .theme-icon svg,
  .theme-toggle-switch .theme-icon svg{
    width:12px !important;
    height:12px !important;
  }

  body.home .theme-switch-track,
  .theme-switch-track{
    width:30px !important;
    height:17px !important;
    margin:0 !important;
  }

  body.home .theme-switch-knob,
  .theme-switch-knob{
    width:11px !important;
    height:11px !important;
  }

  html[data-theme="dark"] body.home .theme-toggle-switch .theme-icon:first-child,
  html[data-theme="dark"] .theme-toggle-switch .theme-icon:first-child{
    opacity:.38;
  }

  html[data-theme="dark"] body.home .theme-toggle-switch .theme-icon:last-child,
  html[data-theme="dark"] .theme-toggle-switch .theme-icon:last-child{
    opacity:1;
  }

  html:not([data-theme="dark"]) body.home .theme-toggle-switch .theme-icon:first-child,
  html:not([data-theme="dark"]) .theme-toggle-switch .theme-icon:first-child{
    opacity:1;
  }

  html:not([data-theme="dark"]) body.home .theme-toggle-switch .theme-icon:last-child,
  html:not([data-theme="dark"]) .theme-toggle-switch .theme-icon:last-child{
    opacity:.42;
  }

  body.home .primary-nav,
  body.home .icon-nav,
  .primary-nav,
  .icon-nav{
    gap:4px !important;
  }

  /* -------------------------------------------------------
     Hero CTA prepared for a future image-only hero:
     centered and narrower on mobile
     ------------------------------------------------------- */
  body.home .hero{
    align-items:center !important;
  }

  body.home .hero-copy{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:flex-end !important;
    min-height:100% !important;
  }

  body.home .hero-shop-clothes{
    align-self:center !important;
    width:min(78vw, 290px) !important;
    min-height:48px !important;
    margin-top:32px !important;
    padding-left:18px !important;
    padding-right:18px !important;
  }

  /* -------------------------------------------------------
     Divider system: remove full-bleed lines and replace
     with inset separators
     ------------------------------------------------------- */
  body.home .mobile-category-nav,
  body.home .manifesto-short,
  body.home footer,
  .world-page .world-hero,
  .world-page .world-collection + .world-collection,
  .world-page + footer,
  body:not(.home) footer{
    position:relative;
  }

  /* remove existing full-width borders on major blocks */
  body.home .mobile-category-nav{
    border-bottom:0 !important;
  }

  body.home .manifesto-short{
    border-top:0 !important;
  }

  body.home footer,
  .world-page .world-hero,
  .world-page .world-collection + .world-collection,
  .world-page + footer,
  body:not(.home) footer{
    border-top:0 !important;
    border-bottom:0 !important;
  }

  /* inset separator after category row */
  body.home .mobile-category-nav::after{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    bottom:0;
    height:1px;
    background:var(--line);
  }

  /* inset separator before philosophy */
  body.home .manifesto-short::before{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    top:0;
    height:1px;
    background:var(--line);
  }

  /* inset separator before footer on home */
  body.home footer::before{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    top:0;
    height:1px;
    background:var(--line);
  }

  /* inset separators on world/subpages */
  .world-page .world-hero::after,
  .world-page .world-collection + .world-collection::before,
  .world-page + footer::before,
  body:not(.home) footer::before{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    top:0;
    height:1px;
    background:var(--line);
  }

  /* keep all-products button area cleaner */
  .all-products-button{
    margin-top:34px !important;
  }
}

@media(max-width:390px){
  body.home .hero-shop-clothes{
    width:min(80vw, 270px) !important;
  }

  body.home .mobile-category-nav::after,
  body.home .manifesto-short::before,
  body.home footer::before,
  .world-page .world-hero::after,
  .world-page .world-collection + .world-collection::before,
  .world-page + footer::before,
  body:not(.home) footer::before{
    left:12px;
    right:12px;
  }
}

/* version marker: 2and4-v6-mobile-polish */


/* =========================================================
   2&4 Studio – Final mobile polish v6.4
   Product hierarchy, philosophy, footer, CTA, header,
   and shorter inset separators
   ========================================================= */

@media(max-width:750px){

  /* -------------------------------------------------------
     Header: slightly smaller, calmer, airier
     ------------------------------------------------------- */
  body.home .brand,
  body.home .brand-image,
  .brand,
  .brand-image{
    width:78px !important;
    flex-basis:78px !important;
    height:36px !important;
  }

  body.home .brand-image img,
  .brand-image img{
    width:78px !important;
    height:36px !important;
  }

  body.home .nav-icon-link,
  .nav-icon-link{
    width:32px !important;
    min-width:32px !important;
  }

  body.home .cart-icon-link,
  .cart-icon-link{
    margin-right:4px !important;
  }

  body.home .top.home-header-revealed{
    background:color-mix(in srgb, var(--header-bg) 88%, transparent) !important;
    backdrop-filter:blur(16px) saturate(120%) !important;
  }

  /* -------------------------------------------------------
     Neuheiten: slightly quieter heading + tighter top rhythm
     ------------------------------------------------------- */
  body.home .collection{
    padding-top:46px !important;
  }

  body.home .section-head{
    margin-bottom:20px !important;
  }

  body.home .section-head h2{
    font-size:clamp(2.35rem,10.5vw,3.6rem) !important;
    line-height:.95 !important;
    letter-spacing:-.06em !important;
  }

  /* -------------------------------------------------------
     Product information: tighter and more premium
     ------------------------------------------------------- */
  body.home .card-details,
  .world-page .card-details,
  .shop-collection .card-details{
    padding-top:8px !important;
  }

  body.home .card-details small,
  .world-page .card-details small,
  .shop-collection .card-details small{
    display:block !important;
    margin-bottom:4px !important;
    font-size:.46rem !important;
    letter-spacing:.085em !important;
    line-height:1.25 !important;
    color:var(--muted-2) !important;
  }

  body.home .card-details h3,
  .world-page .card-details h3,
  .shop-collection .card-details h3{
    margin:0 !important;
    font-size:.82rem !important;
    line-height:1.12 !important;
    font-weight:620 !important;
    letter-spacing:-.02em !important;
  }

  body.home .card-details>strong,
  .world-page .card-details>strong,
  .shop-collection .card-details>strong{
    margin-top:5px !important;
    font-size:.72rem !important;
    font-weight:600 !important;
    color:var(--muted) !important;
  }

  body.home .card-type-note,
  .world-page .card-type-note,
  .shop-collection .card-type-note{
    display:none !important;
  }

  /* -------------------------------------------------------
     ALL ITEMS: flatter, cleaner, more fashion-oriented
     ------------------------------------------------------- */
  .all-products-button{
    min-height:44px !important;
    margin-top:32px !important;
    padding:0 22px !important;
    font-size:.64rem !important;
    letter-spacing:.12em !important;
    border-width:1px !important;
  }

  /* -------------------------------------------------------
     Philosophy: small eyebrow, clear statement, less height
     ------------------------------------------------------- */
  body.home .manifesto-short{
    padding:30px 18px 32px !important;
  }

  body.home .manifesto-short .eyebrow{
    margin-bottom:10px !important;
    font-size:.5rem !important;
    letter-spacing:.14em !important;
    color:var(--muted-2) !important;
  }

  body.home .manifesto-short>p{
    max-width:12ch !important;
    font-size:clamp(1.9rem,8vw,2.55rem) !important;
    line-height:.98 !important;
    letter-spacing:-.055em !important;
    font-weight:560 !important;
  }

  body.home .manifesto-short em{
    color:var(--signal) !important;
    font-style:normal !important;
  }

  /* -------------------------------------------------------
     Footer: much tighter, quieter ending
     ------------------------------------------------------- */
  body.home footer,
  .world-page + footer,
  body:not(.home) footer{
    padding:20px 18px 22px !important;
    gap:10px !important;
    font-size:.6rem !important;
    line-height:1.4 !important;
  }

  body.home .footer-links,
  .footer-links{
    gap:8px 14px !important;
  }

  body.home footer>span:last-child,
  footer>span:last-child{
    font-size:.56rem !important;
    line-height:1.4 !important;
    color:var(--muted-2) !important;
  }

  /* -------------------------------------------------------
     Shorter separators everywhere on mobile
     ------------------------------------------------------- */
  body.home .mobile-category-nav::after,
  body.home .manifesto-short::before,
  body.home footer::before,
  .world-page .world-hero::after,
  .world-page .world-collection + .world-collection::before,
  .world-page + footer::before,
  body:not(.home) footer::before{
    left:44px !important;
    right:44px !important;
  }

  /* subtle divider tone */
  body.home .mobile-category-nav::after,
  body.home .manifesto-short::before,
  body.home footer::before,
  .world-page .world-hero::after,
  .world-page .world-collection + .world-collection::before,
  .world-page + footer::before,
  body:not(.home) footer::before{
    opacity:.72;
  }
}

@media(max-width:390px){
  body.home .brand,
  body.home .brand-image,
  .brand,
  .brand-image{
    width:72px !important;
    flex-basis:72px !important;
  }

  body.home .brand-image img,
  .brand-image img{
    width:72px !important;
  }

  body.home .mobile-category-nav::after,
  body.home .manifesto-short::before,
  body.home footer::before,
  .world-page .world-hero::after,
  .world-page .world-collection + .world-collection::before,
  .world-page + footer::before,
  body:not(.home) footer::before{
    left:34px !important;
    right:34px !important;
  }
}

/* version marker: 2and4-v6-mobile-final-polish */


/* =========================================================
   2&4 Studio – complete mobile polish v6.5
   ========================================================= */

@media(max-width:750px){

  /* 1. HEADER */
  body.home .top,
  .top{
    padding-left:18px !important;
    padding-right:18px !important;
  }

  body.home .brand,
  body.home .brand-image,
  .brand,
  .brand-image{
    width:74px !important;
    flex-basis:74px !important;
    height:34px !important;
  }

  body.home .brand-image img,
  .brand-image img{
    width:74px !important;
    height:34px !important;
  }

  body.home .nav-icon-link,
  .nav-icon-link{
    width:30px !important;
    min-width:30px !important;
  }

  body.home .nav-icon-link svg,
  .nav-icon-link svg{
    width:18px !important;
    height:17px !important;
  }

  body.home .cart-icon-link,
  .cart-icon-link{
    margin-right:8px !important;
  }

  body.home .top.home-header-revealed{
    background:color-mix(in srgb, var(--header-bg) 82%, transparent) !important;
    backdrop-filter:blur(18px) saturate(120%) !important;
    box-shadow:0 6px 22px rgba(0,0,0,.055) !important;
  }

  /* 2. HERO */
  body.home .hero-intro{
    max-width:28ch !important;
    font-size:.95rem !important;
    line-height:1.5 !important;
  }

  body.home .hero-shop-clothes{
    width:min(72vw,270px) !important;
    min-height:46px !important;
    align-self:center !important;
  }

  /* 3. CATEGORY BUTTONS */
  .mobile-category-nav{
    padding-top:30px !important;
    padding-bottom:34px !important;
    gap:12px !important;
  }

  .mobile-category-icon{
    width:58px !important;
    height:58px !important;
    border-color:color-mix(in srgb, var(--line) 72%, transparent) !important;
    border-width:1px !important;
  }

  .mobile-category-icon svg{
    width:25px !important;
    height:25px !important;
    stroke-width:1.18 !important;
  }

  .mobile-category-link>span:last-child{
    margin-top:1px !important;
    font-size:.54rem !important;
    letter-spacing:.025em !important;
  }

  /* 4. NEUHEITEN */
  body.home .collection{
    padding-top:40px !important;
    padding-left:13px !important;
    padding-right:13px !important;
  }

  body.home .section-head{
    margin-bottom:15px !important;
  }

  body.home .section-head h2{
    font-size:clamp(2.25rem,9.8vw,3.25rem) !important;
  }

  body.home .collection .grid{
    gap:25px 8px !important;
  }

  /* a few percent more image width by reducing gutters */
  body.home .collection .card-image{
    width:100% !important;
  }

  /* 5. PRODUCT INFO */
  body.home .card-details,
  .world-page .card-details,
  .shop-collection .card-details{
    padding-top:7px !important;
  }

  body.home .card-details small,
  .world-page .card-details small,
  .shop-collection .card-details small{
    margin-bottom:3px !important;
    font-size:.44rem !important;
    line-height:1.2 !important;
  }

  body.home .card-details h3,
  .world-page .card-details h3,
  .shop-collection .card-details h3{
    margin:0 !important;
    font-size:.8rem !important;
    line-height:1.08 !important;
  }

  body.home .card-details>strong,
  .world-page .card-details>strong,
  .shop-collection .card-details>strong{
    margin-top:3px !important;
    font-size:.69rem !important;
    line-height:1 !important;
  }

  /* 6. ALL ITEMS */
  .all-products-button{
    min-height:40px !important;
    margin-top:29px !important;
    padding:0 30px !important;
    font-size:.61rem !important;
    letter-spacing:.115em !important;
  }

  /* 7. PHILOSOPHY */
  body.home .manifesto-short{
    padding:27px 18px 29px !important;
  }

  body.home .manifesto-short .eyebrow{
    margin-bottom:9px !important;
    font-size:.46rem !important;
    letter-spacing:.15em !important;
    font-weight:700 !important;
  }

  body.home .manifesto-short>p{
    max-width:11ch !important;
    font-size:clamp(1.85rem,7.8vw,2.4rem) !important;
    line-height:.96 !important;
    font-weight:540 !important;
  }

  /* 8. FOOTER */
  .site-footer{
    padding:17px 18px 19px !important;
    gap:10px !important;
  }

  .footer-main{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:3px !important;
  }

  .footer-brand,
  .footer-contact,
  .footer-status{
    font-size:.55rem !important;
    line-height:1.35 !important;
  }

  .footer-contact{
    color:var(--muted) !important;
  }

  .footer-status{
    color:var(--muted-2) !important;
  }

  .site-footer .footer-links{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:6px 12px !important;
    margin-top:3px !important;
    font-size:.54rem !important;
  }

  /* SHORTER SEPARATORS */
  body.home .mobile-category-nav::after,
  body.home .manifesto-short::before,
  body.home footer::before,
  .world-page .world-hero::after,
  .world-page .world-collection + .world-collection::before,
  .world-page + footer::before,
  body:not(.home) footer::before{
    left:68px !important;
    right:68px !important;
    opacity:.62 !important;
  }
}

@media(max-width:390px){
  body.home .mobile-category-nav::after,
  body.home .manifesto-short::before,
  body.home footer::before,
  .world-page .world-hero::after,
  .world-page .world-collection + .world-collection::before,
  .world-page + footer::before,
  body:not(.home) footer::before{
    left:54px !important;
    right:54px !important;
  }

  .mobile-category-icon{
    width:54px !important;
    height:54px !important;
  }
}

/* version marker: 2and4-v6-mobile-polish-complete */


/* =========================================================
   2&4 Studio – Custom category icons + cart icon alignment
   ========================================================= */

/* User-provided PNG category icons */
.mobile-category-icon img{
  display:block;
  width:29px;
  height:29px;
  object-fit:contain;
  object-position:center;
}

.mobile-category-link:nth-child(1) .mobile-category-icon img{
  width:31px;
  height:31px;
}

.mobile-category-link:nth-child(2) .mobile-category-icon img{
  width:30px;
  height:30px;
}

.mobile-category-link:nth-child(3) .mobile-category-icon img{
  width:27px;
  height:27px;
}

.mobile-category-link:nth-child(4) .mobile-category-icon img{
  width:26px;
  height:26px;
}

html[data-theme="dark"] .mobile-category-icon img{
  filter:invert(1);
}

/* Cart looked smaller because its SVG had been explicitly reduced
   below the size of the other navigation icons. Match the visual box. */
.cart-icon-link svg{
  width:20px !important;
  height:18px !important;
  stroke-width:1.55 !important;
}

@media(max-width:750px){
  .cart-icon-link svg{
    width:19px !important;
    height:18px !important;
  }

  .mobile-category-icon img{
    max-width:72%;
    max-height:72%;
  }
}

/* version marker: 2and4-v6-category-icons-cart-fix */


/* =========================================================
   2&4 Studio – cart icon visual size correction
   The old cart drawing occupied too little of its viewBox.
   This version uses a tighter 24x24 drawing and scales it
   optically to the motorcycle / 4x4 icons.
   ========================================================= */

.cart-icon-link{
  gap:4px !important;
}

.cart-icon-link .cart-icon-svg{
  width:22px !important;
  height:22px !important;
  flex:0 0 22px !important;
  stroke-width:1.65 !important;
  transform:translateY(-.2px) !important;
}

.cart-count{
  margin-left:0 !important;
  line-height:1 !important;
}

@media(max-width:750px){
  .cart-icon-link .cart-icon-svg{
    width:21px !important;
    height:21px !important;
    flex-basis:21px !important;
  }
}

/* version marker: 2and4-v6-cart-icon-visual-fix */


/* =========================================================
   2&4 Studio – Product Detail Polish v6.6
   ========================================================= */

/* tighter desktop hierarchy without changing product logic */
.product-purchase .product-meta{
  margin-bottom:22px;
}

.product-purchase .eyebrow{
  margin-bottom:10px;
}

.product-purchase h1{
  margin-top:8px;
  margin-bottom:10px;
}

.product-purchase .price{
  margin-bottom:0;
}

.product-context{
  margin:24px 0 28px;
  gap:7px;
}

.product-context span{
  padding:6px 8px;
  font-size:.58rem;
}

/* accordions */
.product-accordion{
  border-top:1px solid var(--line);
}

.product-accordion:last-of-type{
  border-bottom:1px solid var(--line);
}

.product-accordion summary{
  list-style:none;
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  cursor:pointer;
  color:var(--ink);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.product-accordion summary::-webkit-details-marker{
  display:none;
}

.product-accordion summary span{
  color:var(--muted);
  font-size:1rem;
  font-weight:400;
  transition:transform .2s var(--ease);
}

.product-accordion[open] summary span{
  transform:rotate(45deg);
}

.product-accordion-content{
  padding:0 0 22px;
  max-width:620px;
  color:var(--muted);
  font-size:.92rem;
  line-height:1.7;
}

/* apparel size chips */
.variant-chips{
  margin:0;
  padding:0;
  border:0;
}

.variant-chips legend{
  margin-bottom:11px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.variant-chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.variant-chip{
  position:relative;
  min-width:48px;
  min-height:44px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px solid var(--line);
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  transition:border-color .18s var(--ease),background .18s var(--ease),color .18s var(--ease);
}

.variant-chip input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.variant-chip span{
  font-size:.72rem;
  font-weight:650;
}

.variant-chip small{
  color:var(--muted);
  font-size:.62rem;
}

.variant-chip:has(input:checked){
  background:var(--ink);
  border-color:var(--ink);
  color:var(--bg);
}

.variant-chip:has(input:checked) small{
  color:currentColor;
  opacity:.72;
}

.variant-chip.is-sold-out{
  opacity:.35;
  cursor:not-allowed;
  text-decoration:line-through;
}

.product-buy-form{
  margin-top:30px;
}

.product-test-note{
  margin-top:16px !important;
  font-size:.66rem !important;
  color:var(--muted-2) !important;
}

.product-sticky-buy{
  display:none;
}

/* product image area feels more intentional */
.product-main-image{
  padding:clamp(14px,2.2vw,34px);
}

/* Mobile PDP */
@media(max-width:850px){
  .product-page{
    padding-bottom:72px;
  }

  .product-gallery-layout{
    background:var(--bg);
  }

  .product-main-media,
  .product-main-placeholder{
    min-height:74svh !important;
  }

  .product-main-image{
    padding:0 !important;
    object-fit:contain;
  }

  .product-thumbs{
    padding:9px 18px 12px !important;
    gap:7px !important;
  }

  .product-thumb{
    width:58px !important;
    border-color:transparent;
  }

  .product-thumb.is-active{
    border-color:var(--ink);
  }

  .product-purchase{
    padding:38px 18px 54px !important;
  }

  .product-purchase .back{
    margin-bottom:34px !important;
    font-size:.65rem;
  }

  .product-meta{
    margin-bottom:20px !important;
    padding-bottom:9px !important;
  }

  .product-purchase .eyebrow{
    margin-bottom:8px !important;
    font-size:.58rem !important;
  }

  .product-purchase h1{
    margin:5px 0 8px !important;
    font-size:clamp(2.8rem,13vw,4.5rem) !important;
    line-height:.91 !important;
    letter-spacing:-.07em !important;
  }

  .product-purchase .price{
    font-size:1rem !important;
  }

  .product-context{
    margin:20px 0 24px !important;
  }

  .product-context span{
    padding:5px 7px !important;
    font-size:.53rem !important;
  }

  .product-accordion summary{
    min-height:46px;
    font-size:.61rem;
  }

  .product-accordion-content{
    padding-bottom:18px;
    font-size:.86rem;
    line-height:1.62;
  }

  .product-buy-form{
    margin-top:25px !important;
    padding-top:22px !important;
  }

  .variant-chips legend,
  .variant-label{
    font-size:.61rem !important;
  }

  .variant-chip{
    min-width:46px;
    min-height:42px;
    padding-left:11px;
    padding-right:11px;
  }

  .product-add-button{
    min-height:48px !important;
    margin-top:14px !important;
  }

  .product-test-note{
    margin:13px 0 0 !important;
    font-size:.6rem !important;
  }

  /* sticky mobile purchase bar */
  .product-sticky-buy{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:60;
    min-height:64px;
    padding:8px 14px calc(8px + env(safe-area-inset-bottom));
    display:flex;
    align-items:center;
    gap:12px;
    border-top:1px solid var(--line);
    background:color-mix(in srgb, var(--header-bg) 92%, transparent);
    backdrop-filter:blur(16px) saturate(120%);
  }

  .product-sticky-buy>span{
    flex:0 0 auto;
    min-width:72px;
    color:var(--ink);
    font-size:.85rem;
    font-weight:650;
  }

  .product-sticky-buy .button{
    flex:1;
    min-height:45px;
    margin:0 !important;
    padding:0 14px !important;
    font-size:.64rem;
  }

  /* short inset line before footer */
  .product-page + footer{
    position:relative;
    border-top:0 !important;
  }

  .product-page + footer::before{
    content:"";
    position:absolute;
    left:68px;
    right:68px;
    top:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }
}

@media(max-width:390px){
  .product-main-media,
  .product-main-placeholder{
    min-height:68svh !important;
  }

  .product-purchase h1{
    font-size:clamp(2.55rem,12.5vw,3.9rem) !important;
  }

  .product-page + footer::before{
    left:54px;
    right:54px;
  }
}

/* version marker: 2and4-v6-product-detail-polish */


/* =========================================================
   2&4 Studio – Product/Header refinement v6.7
   ========================================================= */

/* Header: vehicle icons left, centered logo, cart/theme right */
.top-centered{
  position:relative;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
}

.header-side{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}

.header-side-left{
  justify-self:start;
}

.header-side-right{
  justify-self:end;
}

.brand-centered{
  justify-self:center;
  margin:0 !important;
}

.header-side .nav-icon-link::after{
  content:none !important;
  display:none !important;
}

/* Cart optical size:
   the cart shape is wider/flatter than the vehicle icons,
   so a slightly smaller box reads as the same visual mass. */
.header-side-right .cart-icon-link{
  gap:4px !important;
}

.header-side-right .cart-icon-svg{
  width:19px !important;
  height:19px !important;
  flex:0 0 19px !important;
  stroke-width:1.55 !important;
}

/* Product gallery arrows: quieter, less button-like */
.product-media-arrow{
  width:34px !important;
  height:34px !important;
  border:0 !important;
  background:color-mix(in srgb, var(--bg) 36%, transparent) !important;
  color:var(--ink) !important;
  opacity:.48 !important;
  backdrop-filter:blur(8px);
  font-size:.9rem !important;
}

.product-main-media:hover .product-media-arrow,
.product-main-media:focus-within .product-media-arrow{
  opacity:.72 !important;
}

.product-media-arrow:hover{
  opacity:1 !important;
  background:color-mix(in srgb, var(--bg) 62%, transparent) !important;
}

@media(max-width:850px){

  /* Header arrangement on mobile */
  .top-centered{
    height:64px !important;
    min-height:64px !important;
    padding:10px 16px !important;
    grid-template-columns:1fr auto 1fr !important;
    gap:8px !important;
  }

  .top-centered .header-side{
    gap:3px !important;
  }

  .top-centered .header-side-left{
    justify-self:start !important;
  }

  .top-centered .header-side-right{
    justify-self:end !important;
  }

  .top-centered .brand-centered{
    position:static !important;
    width:74px !important;
    height:34px !important;
    flex:none !important;
    justify-self:center !important;
  }

  .top-centered .brand-centered img{
    width:74px !important;
    height:34px !important;
  }

  .top-centered .nav-icon-link{
    width:30px !important;
    min-width:30px !important;
    height:36px !important;
    padding:0 !important;
  }

  .top-centered .nav-icon-link svg{
    width:18px !important;
    height:17px !important;
  }

  /* Cart is checked separately to match perceived size */
  .top-centered .cart-icon-link{
    width:auto !important;
    min-width:43px !important;
    padding:0 2px !important;
    gap:3px !important;
  }

  .top-centered .cart-icon-link .cart-icon-svg{
    width:19px !important;
    height:19px !important;
    flex-basis:19px !important;
  }

  .top-centered .cart-count{
    font-size:.56rem !important;
  }

  .top-centered .theme-toggle-switch{
    width:auto !important;
    min-width:auto !important;
    height:36px !important;
    padding:0 !important;
    gap:3px !important;
  }

  .top-centered .theme-icon{
    width:11px !important;
    height:11px !important;
  }

  .top-centered .theme-icon svg{
    width:11px !important;
    height:11px !important;
  }

  /* Arrows on product image: even subtler on touch */
  .product-media-arrow{
    width:31px !important;
    height:31px !important;
    opacity:.5 !important;
    background:color-mix(in srgb, var(--bg) 24%, transparent) !important;
  }

  .product-media-prev{
    left:10px !important;
  }

  .product-media-next{
    right:10px !important;
  }

  /* Size/variant selection immediately after images.
     The whole buy form moves to the top of the purchase block. */
  .product-purchase{
    display:flex !important;
    flex-direction:column !important;
  }

  .product-buy-form{
    order:-20 !important;
    margin:0 0 30px !important;
    padding:20px 0 26px !important;
    border-top:0 !important;
    border-bottom:1px solid var(--line) !important;
  }

  .product-buy-form + .product-test-note{
    order:20;
  }

  /* Keep all normal product information after the size block */
  .product-purchase .back,
  .product-purchase .product-meta,
  .product-purchase>.eyebrow,
  .product-purchase>h1,
  .product-purchase>.price,
  .product-purchase>.product-context,
  .product-purchase>.product-accordion{
    order:0;
  }

  .variant-chips legend,
  .variant-label{
    margin-bottom:10px !important;
  }

  /* Strong visible X for unavailable sizes */
  .variant-chip.is-sold-out{
    position:relative;
    opacity:.42 !important;
    text-decoration:none !important;
    overflow:hidden;
  }

  .variant-chip.is-sold-out::before,
  .variant-chip.is-sold-out::after{
    content:"";
    position:absolute;
    left:8px;
    right:8px;
    top:50%;
    height:1px;
    background:currentColor;
    pointer-events:none;
  }

  .variant-chip.is-sold-out::before{
    transform:rotate(32deg);
  }

  .variant-chip.is-sold-out::after{
    transform:rotate(-32deg);
  }

  .variant-chip.is-sold-out span,
  .variant-chip.is-sold-out small{
    opacity:.55;
  }

  /* If the whole product is unavailable, keep the message compact */
  .product-buy-form .empty{
    margin:14px 0 0 !important;
    font-size:.75rem !important;
    color:var(--muted) !important;
  }
}

@media(max-width:390px){
  .top-centered{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .top-centered .brand-centered,
  .top-centered .brand-centered img{
    width:68px !important;
  }

  .top-centered .nav-icon-link{
    width:28px !important;
    min-width:28px !important;
  }

  .top-centered .cart-icon-link{
    min-width:40px !important;
  }
}

/* version marker: 2and4-v6-product-header-size-fix */


/* =========================================================
   2&4 Studio – Minimal Product Detail v6.8
   ========================================================= */
.product-context,.product-test-note{display:none!important}
.product-series{margin:0 0 7px!important}.product-purchase h1{margin:0 0 6px!important}.product-purchase .price{margin:0!important}
.product-buy-form-minimal{margin-top:26px!important;padding-top:22px!important;border-top:1px solid var(--line)!important}
.product-accordion{margin:0!important}.product-accordion summary{min-height:42px!important;font-size:.61rem!important}.product-accordion-content{padding-bottom:16px!important;font-size:.84rem!important}
@media(max-width:850px){
  .product-gallery-layout{display:block!important}
  .product-main-media,.product-main-placeholder{min-height:70svh!important}
  .product-main-image{object-fit:contain!important;padding:0!important}
  .product-thumbs{position:static!important;max-height:none!important;padding:7px 18px 10px!important;flex-direction:row!important;gap:6px!important;overflow-x:auto!important;background:var(--bg)!important}
  .product-thumb{width:50px!important;aspect-ratio:1/1!important}
  .product-media-arrow{width:28px!important;height:28px!important;border:0!important;background:transparent!important;color:var(--ink)!important;opacity:.42!important;box-shadow:none!important;backdrop-filter:none!important}
  .product-media-arrow:hover,.product-media-arrow:focus-visible{background:transparent!important;opacity:.85!important}
  .product-media-prev{left:10px!important}.product-media-next{right:10px!important}
  .product-purchase{padding:28px 18px 34px!important;display:block!important;min-height:0!important}
  .product-back-minimal{display:inline-block!important;margin:0 0 22px!important;font-size:.56rem!important;color:var(--muted)!important}
  .product-meta-minimal{margin:0 0 10px!important;padding-bottom:7px!important;font-size:.51rem!important}
  .product-series{margin:0 0 5px!important;font-size:.51rem!important}
  .product-purchase h1{margin:0 0 4px!important;font-size:clamp(2.35rem,11vw,3.5rem)!important;line-height:.92!important;letter-spacing:-.068em!important}
  .product-purchase .price{margin:0!important;font-size:.92rem!important}
  .product-buy-form-minimal{margin:20px 0 0!important;padding:17px 0 19px!important;border-top:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}
  .variant-chips legend,.variant-label{margin-bottom:8px!important;font-size:.56rem!important}
  .variant-chip-list{gap:6px!important}.variant-chip{min-width:44px!important;min-height:38px!important;padding:0 10px!important}.variant-chip span{font-size:.67rem!important}.variant-chip small{font-size:.55rem!important}
  .variant-chip.is-sold-out{position:relative;opacity:.4!important;overflow:hidden!important;text-decoration:none!important}
  .variant-chip.is-sold-out::before,.variant-chip.is-sold-out::after{content:"";position:absolute;left:6px;right:6px;top:50%;height:1px;background:currentColor}
  .variant-chip.is-sold-out::before{transform:rotate(32deg)}.variant-chip.is-sold-out::after{transform:rotate(-32deg)}
  .product-add-button-main{display:none!important}.product-unavailable{margin:11px 0 0!important;font-size:.68rem!important;color:var(--muted)!important}
  .product-accordion{border-top:1px solid var(--line)!important}.product-buy-form-minimal + .product-accordion{border-top:0!important}
  .product-accordion summary{min-height:39px!important;font-size:.56rem!important}.product-accordion-content{padding:0 0 13px!important;font-size:.79rem!important;line-height:1.52!important}
  .product-sticky-buy{min-height:56px!important;padding:7px 12px calc(7px + env(safe-area-inset-bottom))!important;gap:10px!important}.product-sticky-buy>span{min-width:76px!important;font-size:.79rem!important}.product-sticky-buy .button{min-height:41px!important;font-size:.6rem!important}
  .product-page{padding-bottom:56px!important}.product-page + footer{margin-top:0!important}
}
@media(max-width:390px){.product-main-media,.product-main-placeholder{min-height:66svh!important}.product-purchase h1{font-size:clamp(2.2rem,10.8vw,3.15rem)!important}}
/* version marker: 2and4-v6-minimal-product-detail */


/* =========================================================
   2&4 Studio – Minimal Cart v6.9
   ========================================================= */

.cart-page-minimal{
  max-width:1500px;
}

.cart-hero-minimal{
  min-height:220px;
  padding:58px 0 30px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  border-bottom:1px solid var(--line);
}

.cart-hero-minimal h1{
  margin:10px 0 0;
  font-size:clamp(3.4rem,7vw,7rem);
  line-height:.88;
  letter-spacing:-.075em;
}

.cart-count-label{
  margin:14px 0 0;
  color:var(--muted);
  font-size:.72rem;
}

.cart-continue{
  padding-bottom:4px;
  color:var(--muted);
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.cart-layout-minimal{
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.5fr);
  gap:clamp(46px,7vw,100px);
  padding-top:38px;
}

.cart-items-minimal{
  border-top:0;
}

.cart-item-minimal{
  grid-template-columns:124px minmax(0,1fr);
  gap:20px;
  padding:18px 0;
}

.cart-item-minimal:first-child{
  padding-top:0;
}

.cart-item-minimal .cart-item-media{
  aspect-ratio:1/1.08;
}

.cart-item-copy{
  min-width:0;
}

.cart-item-minimal .cart-item-meta{
  margin-bottom:5px;
  font-size:.56rem;
}

.cart-product-link{
  display:inline-block;
}

.cart-item-minimal h2{
  margin:0;
  font-size:1.2rem;
  line-height:1.08;
}

.cart-item-minimal .cart-variant{
  margin-top:5px;
  font-size:.72rem;
}

.cart-item-minimal .cart-line-price{
  display:block;
  margin-top:10px;
  font-size:.86rem;
}

.cart-item-controls{
  margin-top:20px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
}

.quantity-form-minimal{
  align-items:flex-end;
}

.quantity-form-minimal label{
  gap:5px;
  font-size:.58rem;
}

.quantity-form-minimal input{
  width:62px;
  height:38px;
  padding:0 9px;
}

.quantity-form-minimal button,
.remove-form-minimal button{
  min-height:38px;
  font-size:.66rem;
}

.cart-summary-minimal{
  padding:0;
  border:0;
  background:transparent;
}

.cart-summary-minimal .eyebrow{
  margin-bottom:16px;
}

.cart-summary-minimal .summary-row{
  padding:9px 0;
}

.cart-summary-minimal .summary-total{
  margin-top:10px;
  padding:18px 0 0;
  border-top:1px solid var(--line);
}

.cart-summary-minimal .summary-total strong{
  font-size:1.35rem;
}

.cart-summary-minimal .commerce-primary-action{
  min-height:46px;
  margin-top:22px;
}

.cart-test-note{
  margin:12px 0 0;
  color:var(--muted-2);
  font-size:.62rem;
  line-height:1.45;
}

@media(max-width:750px){
  .cart-page-minimal{
    padding:0 18px 42px !important;
  }

  .cart-hero-minimal{
    min-height:150px;
    padding:34px 0 22px;
    align-items:flex-start;
    flex-direction:column;
    justify-content:flex-end;
    gap:12px;
    border-bottom:0;
    position:relative;
  }

  .cart-hero-minimal::after{
    content:"";
    position:absolute;
    left:46px;
    right:46px;
    bottom:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }

  .cart-hero-minimal .eyebrow{
    font-size:.5rem;
  }

  .cart-hero-minimal h1{
    margin-top:7px;
    font-size:clamp(2.7rem,12vw,4rem);
  }

  .cart-count-label{
    margin-top:8px;
    font-size:.62rem;
  }

  .cart-continue{
    padding:0;
    font-size:.58rem;
  }

  .cart-layout-minimal{
    display:block;
    padding-top:24px;
  }

  .cart-item-minimal{
    grid-template-columns:92px minmax(0,1fr);
    gap:14px;
    padding:16px 0;
    border-bottom:0;
    position:relative;
  }

  .cart-item-minimal::after{
    content:"";
    position:absolute;
    left:46px;
    right:46px;
    bottom:0;
    height:1px;
    background:var(--line);
    opacity:.56;
  }

  .cart-item-minimal:last-child::after{
    display:none;
  }

  .cart-item-minimal .cart-item-media{
    aspect-ratio:1/1.05;
  }

  .cart-item-minimal .cart-item-meta{
    font-size:.48rem;
    line-height:1.2;
  }

  .cart-item-minimal h2{
    font-size:.96rem;
  }

  .cart-item-minimal .cart-variant{
    margin-top:4px;
    font-size:.64rem;
  }

  .cart-item-minimal .cart-line-price{
    margin-top:7px;
    font-size:.76rem;
  }

  .cart-item-controls{
    margin-top:14px;
    align-items:flex-end;
    gap:10px;
  }

  .quantity-form-minimal{
    width:auto;
    gap:8px;
  }

  .quantity-form-minimal label{
    font-size:.52rem;
  }

  .quantity-form-minimal input{
    width:52px;
    height:34px;
    font-size:.72rem;
  }

  .quantity-form-minimal button,
  .remove-form-minimal button{
    min-height:34px;
    font-size:.58rem;
  }

  .cart-summary-minimal{
    position:static;
    width:100%;
    margin-top:28px;
    padding:22px 0 0;
    border-top:0;
  }

  .cart-summary-minimal::before{
    content:"";
    display:block;
    width:calc(100% - 92px);
    height:1px;
    margin:0 auto 22px;
    background:var(--line);
    opacity:.62;
  }

  .cart-summary-minimal .eyebrow{
    margin-bottom:12px;
    font-size:.5rem;
  }

  .cart-summary-minimal .summary-row{
    padding:7px 0;
    font-size:.74rem;
  }

  .cart-summary-minimal .summary-total{
    margin-top:8px;
    padding-top:14px;
  }

  .cart-summary-minimal .summary-total span{
    font-size:.8rem;
  }

  .cart-summary-minimal .summary-total strong{
    font-size:1.18rem;
  }

  .cart-summary-minimal .commerce-primary-action{
    min-height:42px;
    margin-top:18px;
    font-size:.61rem;
  }

  .cart-test-note{
    margin-top:9px;
    font-size:.56rem;
  }

  .cart-page-minimal + footer{
    margin-top:0 !important;
  }
}

@media(max-width:390px){
  .cart-hero-minimal::after,
  .cart-item-minimal::after{
    left:38px;
    right:38px;
  }

  .cart-summary-minimal::before{
    width:calc(100% - 76px);
  }
}

/* version marker: 2and4-v6-minimal-cart */


/* =========================================================
   2&4 Studio – Minimal Checkout v7.0
   ========================================================= */

.checkout-page-minimal{
  max-width:1500px;
}

.checkout-hero-minimal{
  min-height:220px;
  padding:58px 0 30px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  border-bottom:1px solid var(--line);
}

.checkout-hero-minimal h1{
  margin:10px 0 0;
  font-size:clamp(3.4rem,7vw,7rem);
  line-height:.88;
  letter-spacing:-.075em;
}

.checkout-back{
  padding-bottom:4px;
  color:var(--muted);
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.checkout-layout-minimal{
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.62fr);
  gap:clamp(48px,8vw,110px);
  padding-top:38px;
}

.checkout-panel-minimal,
.checkout-summary-minimal{
  max-width:none;
}

.checkout-summary-minimal{
  padding:0;
  border:0;
  background:transparent;
}

.checkout-section-heading{
  margin-bottom:22px;
}

.checkout-section-heading .eyebrow{
  margin-bottom:7px;
}

.checkout-section-heading h2{
  margin:0;
  font-size:clamp(1.8rem,3vw,3rem);
  line-height:.98;
  letter-spacing:-.045em;
}

.checkout-form-minimal{
  margin:0;
  padding:0;
  border:0;
}

.checkout-field-minimal>span{
  margin-bottom:8px;
  font-size:.58rem;
}

.checkout-form-minimal select{
  min-height:46px;
  padding:0 12px;
  font-size:.84rem;
}

.checkout-facts-minimal{
  margin-top:18px;
  grid-template-columns:repeat(3,1fr);
}

.checkout-facts-minimal div{
  padding:14px 12px 14px 0;
}

.checkout-facts-minimal span{
  font-size:.54rem;
}

.checkout-facts-minimal strong{
  margin-top:5px;
  font-size:.78rem;
}

.checkout-submit-minimal{
  width:100%;
  min-height:46px;
  margin-top:22px;
}

.checkout-test-note{
  margin:11px 0 0;
  color:var(--muted-2);
  font-size:.6rem;
  line-height:1.45;
}

.checkout-error-minimal{
  margin:0 0 18px;
  padding:12px 14px;
  font-size:.75rem;
}

.checkout-summary-items{
  margin-top:0;
}

.checkout-summary-item-minimal{
  grid-template-columns:56px minmax(0,1fr) auto;
  gap:12px;
  padding:10px 0;
}

.checkout-summary-item-minimal .checkout-summary-media{
  width:56px;
  aspect-ratio:1/1.06;
}

.checkout-summary-copy strong{
  font-size:.76rem !important;
  line-height:1.15;
}

.checkout-summary-copy span{
  margin-top:3px !important;
  font-size:.64rem !important;
}

.checkout-summary-price{
  font-size:.7rem !important;
}

.checkout-total-block{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--line);
}

.checkout-total-block .summary-row{
  padding:7px 0;
}

@media(max-width:980px){
  .checkout-layout-minimal{
    display:block;
  }

  .checkout-summary-minimal{
    order:initial;
    margin:0 0 34px;
  }

  .checkout-panel-minimal{
    margin-top:0;
  }
}

@media(max-width:750px){
  .checkout-page-minimal{
    padding:0 18px 42px !important;
  }

  .checkout-hero-minimal{
    min-height:150px;
    padding:34px 0 22px;
    align-items:flex-start;
    flex-direction:column;
    justify-content:flex-end;
    gap:12px;
    border-bottom:0;
    position:relative;
  }

  .checkout-hero-minimal::after{
    content:"";
    position:absolute;
    left:46px;
    right:46px;
    bottom:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }

  .checkout-hero-minimal .eyebrow{
    font-size:.5rem;
  }

  .checkout-hero-minimal h1{
    margin-top:7px;
    font-size:clamp(2.7rem,12vw,4rem);
  }

  .checkout-back{
    padding:0;
    font-size:.58rem;
  }

  .checkout-layout-minimal{
    padding-top:24px;
  }

  .checkout-summary-minimal{
    position:static;
    margin:0 0 28px;
    padding:0;
  }

  .checkout-section-heading{
    margin-bottom:15px;
  }

  .checkout-section-heading .eyebrow{
    font-size:.48rem;
  }

  .checkout-section-heading h2{
    font-size:1.45rem;
  }

  .checkout-summary-item-minimal{
    grid-template-columns:50px minmax(0,1fr) auto;
    gap:10px;
    padding:9px 0;
    border-top:0;
    position:relative;
  }

  .checkout-summary-item-minimal::after{
    content:"";
    position:absolute;
    left:38px;
    right:38px;
    bottom:0;
    height:1px;
    background:var(--line);
    opacity:.52;
  }

  .checkout-summary-item-minimal:last-child::after{
    display:none;
  }

  .checkout-summary-item-minimal .checkout-summary-media{
    width:50px;
  }

  .checkout-summary-copy strong{
    font-size:.72rem !important;
  }

  .checkout-summary-copy span{
    font-size:.6rem !important;
  }

  .checkout-summary-price{
    font-size:.66rem !important;
  }

  .checkout-total-block{
    margin-top:12px;
    padding-top:12px;
    border-top:0;
    position:relative;
  }

  .checkout-total-block::before{
    content:"";
    position:absolute;
    left:46px;
    right:46px;
    top:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }

  .checkout-total-block .summary-row{
    font-size:.72rem;
  }

  .checkout-panel-minimal{
    padding-top:24px;
    position:relative;
  }

  .checkout-panel-minimal::before{
    content:"";
    position:absolute;
    left:46px;
    right:46px;
    top:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }

  .checkout-field-minimal>span{
    font-size:.54rem;
  }

  .checkout-form-minimal select{
    min-height:44px;
    font-size:.78rem;
  }

  .checkout-facts-minimal{
    margin-top:16px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-top:0;
    border-bottom:0;
    position:relative;
  }

  .checkout-facts-minimal::before,
  .checkout-facts-minimal::after{
    content:"";
    position:absolute;
    left:30px;
    right:30px;
    height:1px;
    background:var(--line);
    opacity:.5;
  }

  .checkout-facts-minimal::before{top:0}
  .checkout-facts-minimal::after{bottom:0}

  .checkout-facts-minimal div{
    padding:12px 8px;
    text-align:center;
  }

  .checkout-facts-minimal div+div{
    border-left:0;
    border-top:0;
  }

  .checkout-facts-minimal span{
    font-size:.48rem;
  }

  .checkout-facts-minimal strong{
    font-size:.7rem;
  }

  .checkout-submit-minimal{
    min-height:42px;
    margin-top:18px;
    font-size:.61rem;
  }

  .checkout-test-note{
    margin-top:9px;
    font-size:.55rem;
  }

  .checkout-page-minimal + footer{
    margin-top:0 !important;
  }
}

@media(max-width:390px){
  .checkout-hero-minimal::after,
  .checkout-panel-minimal::before,
  .checkout-total-block::before{
    left:38px;
    right:38px;
  }

  .checkout-facts-minimal::before,
  .checkout-facts-minimal::after{
    left:24px;
    right:24px;
  }
}

/* version marker: 2and4-v7-minimal-checkout */


/* =========================================================
   2&4 Studio – Minimal Cancel Page v7.1
   ========================================================= */

.cancel-page-minimal{
  min-height:calc(100vh - 72px);
  padding:0 var(--page-x);
  display:grid;
  place-items:center;
}

.cancel-panel{
  width:min(100%,760px);
  padding:72px 0 84px;
}

.cancel-back{
  display:inline-block;
  margin-bottom:48px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:650;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.cancel-copy{
  position:relative;
}

.cancel-copy::before{
  content:"";
  display:block;
  width:120px;
  height:1px;
  margin-bottom:28px;
  background:var(--line);
}

.cancel-copy .eyebrow{
  margin-bottom:12px;
}

.cancel-copy h1{
  max-width:8ch;
  margin:0;
  font-size:clamp(3.5rem,7vw,6.4rem);
  line-height:.9;
  letter-spacing:-.075em;
}

.cancel-text{
  max-width:560px;
  margin:28px 0 0;
  color:var(--muted);
  font-size:1rem;
  line-height:1.7;
}

.cancel-form{
  margin-top:28px;
}

.cancel-danger,
.cancel-primary{
  min-height:46px;
  padding:0 24px;
  border:1px solid var(--ink);
}

.cancel-danger{
  background:transparent;
  color:var(--ink);
}

.cancel-danger:hover{
  background:var(--ink);
  color:var(--bg);
}

.cancel-primary{
  margin-top:28px;
}

.cancel-continue{
  display:inline-block;
  margin-top:18px;
  color:var(--muted);
  font-size:.7rem;
}

.cancel-note{
  margin:42px 0 0;
  color:var(--muted-2);
  font-size:.62rem;
}

.cancel-error{
  margin:24px 0 0;
}

@media(max-width:750px){
  .cancel-page-minimal{
    min-height:calc(100svh - 64px);
    padding:0 18px 26px;
    place-items:start stretch;
  }

  .cancel-panel{
    width:100%;
    padding:42px 0 26px;
  }

  .cancel-back{
    margin-bottom:34px;
    font-size:.58rem;
  }

  .cancel-copy::before{
    width:72px;
    margin-bottom:22px;
  }

  .cancel-copy .eyebrow{
    font-size:.48rem;
  }

  .cancel-copy h1{
    font-size:clamp(2.9rem,13vw,4.35rem);
    line-height:.91;
  }

  .cancel-text{
    margin-top:22px;
    max-width:34ch;
    font-size:.86rem;
    line-height:1.62;
  }

  .cancel-form{
    margin-top:24px;
  }

  .cancel-danger,
  .cancel-primary{
    width:100%;
    min-height:42px;
    font-size:.61rem;
  }

  .cancel-continue{
    margin-top:14px;
    font-size:.58rem;
  }

  .cancel-note{
    margin-top:30px;
    font-size:.54rem;
  }

  .cancel-page-minimal + footer{
    margin-top:0 !important;
    position:relative;
  }

  .cancel-page-minimal + footer::before{
    content:"";
    position:absolute;
    left:68px;
    right:68px;
    top:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }
}

@media(max-width:390px){
  .cancel-page-minimal + footer::before{
    left:54px;
    right:54px;
  }
}

/* version marker: 2and4-v7-minimal-cancel */


/* =========================================================
   2&4 Studio – Desktop minimal redesign v7.2
   ========================================================= */

@media(min-width:751px){

  /* -------------------------------------------------------
     Header: lower profile, centered logo, inset divider
     ------------------------------------------------------- */
  .top.top-centered{
    min-height:64px;
    height:64px;
    padding:8px var(--page-x);
    border-bottom:0;
    position:sticky;
    top:0;
  }

  .top.top-centered::after{
    content:"";
    position:absolute;
    left:var(--page-x);
    right:var(--page-x);
    bottom:0;
    height:1px;
    background:var(--line);
    opacity:.66;
  }

  .top-centered .brand-centered{
    width:108px;
    height:42px;
  }

  .top-centered .brand-centered img{
    width:108px;
    height:42px;
  }

  .top-centered .header-side{
    gap:14px;
  }

  .top-centered .nav-icon-link{
    width:34px;
    height:38px;
  }

  .top-centered .nav-icon-link svg{
    width:19px;
    height:18px;
  }

  .top-centered .cart-icon-link{
    min-width:48px;
    margin-right:8px;
  }

  .top-centered .theme-toggle-switch{
    gap:5px;
  }

  /* -------------------------------------------------------
     Hero: editorial, image-ready, calmer text block
     ------------------------------------------------------- */
  body.home .hero{
    min-height:620px;
    padding-top:clamp(90px,10vw,140px);
    padding-bottom:72px;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);
    align-items:end;
    background:
      linear-gradient(90deg,transparent 0 73%,rgba(35,37,34,.035) 73% 73.08%,transparent 73.08%),
      linear-gradient(145deg,#f7f3ec 0%,var(--bg) 66%);
  }

  html[data-theme="dark"] body.home .hero{
    background:
      linear-gradient(90deg,transparent 0 73%,rgba(241,240,234,.06) 73% 73.08%,transparent 73.08%),
      linear-gradient(145deg,var(--surface) 0%,var(--bg) 68%);
  }

  body.home .hero-copy{
    max-width:690px;
  }

  body.home .hero h1{
    max-width:9ch;
    font-size:clamp(5.4rem,8.8vw,9rem);
    line-height:.84;
  }

  body.home .hero-intro{
    max-width:30ch;
    margin-top:26px;
    font-size:1rem;
    line-height:1.6;
  }

  body.home .hero-shop-clothes{
    width:auto;
    min-width:190px;
    max-width:240px;
    min-height:46px;
    margin-top:28px;
  }

  body.home .hero-meta{
    align-self:end;
    justify-self:end;
    gap:18px;
    padding-bottom:6px;
    font-size:.56rem;
    letter-spacing:.14em;
  }

  /* -------------------------------------------------------
     World panels: shorter, lighter, clearer
     ------------------------------------------------------- */
  body.home .worlds{
    min-height:0;
    height:auto;
    grid-template-columns:1fr 1fr;
    border-bottom:0;
  }

  body.home .world{
    min-height:440px;
    padding:34px clamp(34px,4vw,64px);
  }

  body.home .world-content{
    max-width:520px;
  }

  body.home .world-content h2{
    font-size:clamp(3.5rem,5.2vw,5.6rem);
    margin-bottom:14px;
  }

  body.home .world-content>p{
    max-width:30ch;
    font-size:.9rem;
  }

  body.home .world-paths{
    margin-top:34px;
  }

  body.home .world-paths span{
    padding-top:12px;
  }

  body.home .world-paths small{
    margin-top:5px;
    font-size:.58rem;
  }

  /* -------------------------------------------------------
     Product area: 4 across, stronger shop rhythm
     ------------------------------------------------------- */
  body.home .collection{
    padding-top:82px;
    padding-bottom:86px;
  }

  body.home .section-head{
    margin-bottom:36px;
    align-items:end;
  }

  body.home .desktop-collection-kicker{
    margin-bottom:9px;
    font-size:.56rem;
  }

  body.home .section-head h2{
    font-size:clamp(3.2rem,5vw,5.2rem);
    line-height:.92;
  }

  body.home .section-note{
    padding-bottom:7px;
    font-size:.56rem;
  }

  body.home .collection .grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:52px 22px;
  }

  body.home .collection .card{
    min-width:0;
  }

  body.home .collection .card-image{
    aspect-ratio:4/5;
    overflow:hidden;
  }

  body.home .collection .card-image img{
    transition:transform .5s var(--ease);
  }

  body.home .collection .card:hover .card-image img{
    transform:scale(1.018);
  }

  body.home .collection .gallery-arrow{
    opacity:.12;
    transition:opacity .2s var(--ease),background .2s var(--ease);
  }

  body.home .collection .card:hover .gallery-arrow{
    opacity:.72;
  }

  body.home .card-details{
    padding-top:12px;
    gap:0;
  }

  body.home .card-details small{
    margin-bottom:5px;
    font-size:.5rem;
    letter-spacing:.1em;
  }

  body.home .card-details h3{
    margin:0;
    font-size:.95rem;
    line-height:1.12;
  }

  body.home .card-details>strong{
    margin-top:6px;
    font-size:.78rem;
  }

  body.home .card-type-note{
    display:none;
  }

  body.home .all-products-button{
    display:inline-flex;
    width:auto;
    min-width:210px;
    min-height:44px;
    margin-top:46px;
    padding:0 28px;
    align-items:center;
    justify-content:center;
    border:1px solid var(--ink);
    background:transparent;
    color:var(--ink);
    font-size:.63rem;
    font-weight:700;
    letter-spacing:.12em;
  }

  body.home .all-products-button:hover{
    background:var(--ink);
    color:var(--bg);
  }

  /* -------------------------------------------------------
     Philosophy: editorial band, not a giant section
     ------------------------------------------------------- */
  body.home .manifesto-short{
    min-height:0;
    padding:64px var(--page-x) 68px;
    display:grid;
    grid-template-columns:180px minmax(0,1fr);
    gap:clamp(38px,6vw,90px);
    align-items:start;
    position:relative;
  }

  body.home .manifesto-short::before{
    content:"";
    position:absolute;
    left:calc(var(--page-x) + 70px);
    right:calc(var(--page-x) + 70px);
    top:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }

  body.home .manifesto-short .eyebrow{
    margin:8px 0 0;
    font-size:.54rem;
  }

  body.home .manifesto-short>p{
    max-width:none;
    margin:0;
    font-size:clamp(3rem,4.5vw,5rem);
    line-height:.94;
    letter-spacing:-.06em;
  }

  /* -------------------------------------------------------
     Footer: one quiet line / signature
     ------------------------------------------------------- */
  .site-footer{
    min-height:72px;
    padding:20px var(--page-x);
    display:grid;
    grid-template-columns:minmax(180px,.7fr) minmax(0,1.4fr) auto;
    align-items:center;
    gap:30px;
    position:relative;
  }

  .site-footer::before{
    content:"";
    position:absolute;
    left:calc(var(--page-x) + 70px);
    right:calc(var(--page-x) + 70px);
    top:0;
    height:1px;
    background:var(--line);
    opacity:.62;
  }

  .site-footer .footer-main{
    display:contents;
  }

  .site-footer .footer-brand{
    grid-column:1;
    font-size:.58rem;
  }

  .site-footer .footer-contact{
    grid-column:2;
    justify-self:center;
    font-size:.56rem;
    color:var(--muted);
  }

  .site-footer .footer-status{
    display:none;
  }

  .site-footer .footer-links{
    grid-column:3;
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px 16px;
    margin:0;
    font-size:.54rem;
  }

  /* Remove full-bleed borders where the desktop design now uses inset lines */
  body.home .collection,
  body.home .manifesto-short,
  .site-footer{
    border-top:0 !important;
    border-bottom:0 !important;
  }
}

/* version marker: 2and4-v7-desktop-minimal */


/* =========================================================
   2&4 Studio – Floating Editorial Surfaces v7.3
   One consistent virtual light source: upper left.
   Desktop stronger, mobile intentionally restrained.
   ========================================================= */

:root{
  --float-canvas:#e9e3d9;
  --float-panel:#f5f1e9;
  --float-panel-soft:#f0ebe2;
  --float-shadow:
    18px 22px 52px rgba(49,43,36,.075),
    4px 7px 16px rgba(49,43,36,.045);
  --float-shadow-soft:
    12px 16px 34px rgba(49,43,36,.055),
    3px 5px 12px rgba(49,43,36,.032);
  --float-highlight:
    inset 1px 1px 0 rgba(255,255,255,.76),
    inset -1px -1px 0 rgba(82,72,61,.025);
  --float-gap:clamp(18px,2.2vw,34px);
  --float-radius:3px;
}

html[data-theme="dark"]{
  --float-canvas:#0d0f0e;
  --float-panel:#171a18;
  --float-panel-soft:#131614;
  --float-shadow:
    18px 22px 54px rgba(0,0,0,.30),
    4px 7px 18px rgba(0,0,0,.22);
  --float-shadow-soft:
    12px 16px 36px rgba(0,0,0,.23),
    3px 5px 12px rgba(0,0,0,.18);
  --float-highlight:
    inset 1px 1px 0 rgba(255,255,255,.055),
    inset -1px -1px 0 rgba(0,0,0,.18);
}

body{
  background:var(--float-canvas);
}

/* reusable floating surface */
@media(min-width:751px){

  /* Keep the header visually light, not card-like */
  .top{
    background:color-mix(in srgb,var(--header-bg) 90%,transparent);
    backdrop-filter:blur(16px) saturate(115%);
  }

  /* HOME ------------------------------------------------ */
  body.home main{
    padding:var(--float-gap);
  }

  body.home .hero,
  body.home .collection,
  body.home .manifesto-short{
    width:auto;
    margin-left:0;
    margin-right:0;
    border-radius:var(--float-radius);
    box-shadow:var(--float-shadow),var(--float-highlight);
    overflow:hidden;
  }

  body.home .hero{
    background:
      radial-gradient(circle at 12% 8%,rgba(255,255,255,.58),transparent 27%),
      linear-gradient(145deg,var(--float-panel) 0%,var(--bg) 76%) !important;
  }

  html[data-theme="dark"] body.home .hero{
    background:
      radial-gradient(circle at 12% 8%,rgba(255,255,255,.035),transparent 28%),
      linear-gradient(145deg,var(--float-panel) 0%,var(--bg) 76%) !important;
  }

  body.home .worlds{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--float-gap);
    margin:var(--float-gap) 0;
    background:transparent;
    overflow:visible;
  }

  body.home .world{
    border-radius:var(--float-radius);
    box-shadow:var(--float-shadow-soft),var(--float-highlight);
    overflow:hidden;
    transform:translateZ(0);
    transition:
      transform .32s var(--ease),
      box-shadow .32s var(--ease),
      filter .32s var(--ease);
  }

  body.home .world-two{
    background:
      radial-gradient(circle at 12% 8%,rgba(255,255,255,.43),transparent 31%),
      linear-gradient(145deg,#e4e8e6,var(--cool) 78%) !important;
  }

  body.home .world-four{
    background:
      radial-gradient(circle at 12% 8%,rgba(255,255,255,.22),transparent 29%),
      linear-gradient(145deg,#d9d1c3,var(--earth) 79%) !important;
  }

  html[data-theme="dark"] body.home .world-two,
  html[data-theme="dark"] body.home .world-four{
    background:
      radial-gradient(circle at 12% 8%,rgba(255,255,255,.045),transparent 30%),
      linear-gradient(145deg,var(--surface-2),var(--surface)) !important;
  }

  body.home .world:hover{
    transform:translateY(-4px);
    box-shadow:
      20px 28px 58px rgba(49,43,36,.095),
      4px 8px 18px rgba(49,43,36,.05),
      var(--float-highlight);
  }

  html[data-theme="dark"] body.home .world:hover{
    box-shadow:
      20px 28px 58px rgba(0,0,0,.36),
      4px 8px 18px rgba(0,0,0,.25),
      var(--float-highlight);
  }

  body.home .collection{
    margin-top:0;
    background:
      radial-gradient(circle at 9% 5%,rgba(255,255,255,.48),transparent 23%),
      var(--float-panel);
  }

  html[data-theme="dark"] body.home .collection{
    background:
      radial-gradient(circle at 9% 5%,rgba(255,255,255,.028),transparent 23%),
      var(--float-panel);
  }

  body.home .manifesto-short{
    margin-top:var(--float-gap);
    background:
      radial-gradient(circle at 10% 9%,rgba(255,255,255,.42),transparent 25%),
      var(--float-panel-soft);
    box-shadow:var(--float-shadow-soft),var(--float-highlight);
  }

  /* Product cards stay mostly flat inside a floating collection */
  body.home .collection .card{
    transition:transform .3s var(--ease);
  }

  body.home .collection .card:hover{
    transform:translateY(-5px);
  }

  body.home .collection .card-image{
    box-shadow:0 10px 26px rgba(45,40,34,.055);
  }

  html[data-theme="dark"] body.home .collection .card-image{
    box-shadow:0 10px 28px rgba(0,0,0,.22);
  }

  /* WORLD / SHOP PAGES ---------------------------------- */
  .world-page,
  .shop-page{
    padding:var(--float-gap);
  }

  .world-page .world-hero,
  .world-page .world-collection,
  .shop-page .shop-hero,
  .shop-page .shop-collection{
    border-radius:var(--float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.46),transparent 24%),
      var(--float-panel);
    box-shadow:var(--float-shadow-soft),var(--float-highlight);
    overflow:hidden;
  }

  html[data-theme="dark"] .world-page .world-hero,
  html[data-theme="dark"] .world-page .world-collection,
  html[data-theme="dark"] .shop-page .shop-hero,
  html[data-theme="dark"] .shop-page .shop-collection{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.028),transparent 24%),
      var(--float-panel);
  }

  .world-page .world-hero,
  .shop-page .shop-hero{
    margin-bottom:var(--float-gap);
  }

  .world-page .world-collection + .world-collection{
    margin-top:var(--float-gap);
  }

  /* PRODUCT DETAIL -------------------------------------- */
  .product-page{
    padding:var(--float-gap);
    gap:var(--float-gap);
    background:transparent;
  }

  .product-gallery-layout,
  .product-purchase{
    border-radius:var(--float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.48),transparent 24%),
      var(--float-panel);
    box-shadow:var(--float-shadow-soft),var(--float-highlight);
    overflow:hidden;
  }

  html[data-theme="dark"] .product-gallery-layout,
  html[data-theme="dark"] .product-purchase{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.025),transparent 24%),
      var(--float-panel);
  }

  /* CART ------------------------------------------------ */
  .cart-page-minimal{
    padding:var(--float-gap);
  }

  .cart-hero-minimal,
  .cart-items-minimal,
  .cart-summary-minimal{
    border-radius:var(--float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.44),transparent 25%),
      var(--float-panel);
    box-shadow:var(--float-shadow-soft),var(--float-highlight);
  }

  html[data-theme="dark"] .cart-hero-minimal,
  html[data-theme="dark"] .cart-items-minimal,
  html[data-theme="dark"] .cart-summary-minimal{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.025),transparent 25%),
      var(--float-panel);
  }

  .cart-hero-minimal{
    padding-left:clamp(28px,3vw,48px);
    padding-right:clamp(28px,3vw,48px);
    border-bottom:0;
    margin-bottom:var(--float-gap);
  }

  .cart-layout-minimal{
    padding-top:0;
  }

  .cart-items-minimal{
    padding:28px clamp(28px,3vw,48px);
  }

  .cart-summary-minimal{
    padding:28px !important;
    align-self:start;
    position:sticky;
    top:92px;
  }

  /* CHECKOUT -------------------------------------------- */
  .checkout-page-minimal{
    padding:var(--float-gap);
  }

  .checkout-hero-minimal,
  .checkout-panel-minimal,
  .checkout-summary-minimal{
    border-radius:var(--float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.44),transparent 25%),
      var(--float-panel);
    box-shadow:var(--float-shadow-soft),var(--float-highlight);
  }

  html[data-theme="dark"] .checkout-hero-minimal,
  html[data-theme="dark"] .checkout-panel-minimal,
  html[data-theme="dark"] .checkout-summary-minimal{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.025),transparent 25%),
      var(--float-panel);
  }

  .checkout-hero-minimal{
    padding-left:clamp(28px,3vw,48px);
    padding-right:clamp(28px,3vw,48px);
    border-bottom:0;
    margin-bottom:var(--float-gap);
  }

  .checkout-layout-minimal{
    padding-top:0;
  }

  .checkout-panel-minimal,
  .checkout-summary-minimal{
    padding:28px !important;
    align-self:start;
  }

  /* CANCEL ---------------------------------------------- */
  .cancel-page-minimal{
    padding:var(--float-gap);
  }

  .cancel-panel{
    padding:clamp(48px,6vw,86px) clamp(34px,5vw,72px);
    border-radius:var(--float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.46),transparent 24%),
      var(--float-panel);
    box-shadow:var(--float-shadow),var(--float-highlight);
  }

  html[data-theme="dark"] .cancel-panel{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.026),transparent 24%),
      var(--float-panel);
  }

  /* INFORMATION PAGES ----------------------------------- */
  .info-page,
  .commerce-empty,
  .order-page{
    border-radius:var(--float-radius);
  }

  .info-page{
    margin:var(--float-gap);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.42),transparent 24%),
      var(--float-panel);
    box-shadow:var(--float-shadow-soft),var(--float-highlight);
  }

  /* Footer stays grounded, so the floating content has an anchor */
  .site-footer{
    background:transparent !important;
    box-shadow:none !important;
  }
}

/* ---------------------------------------------------------
   Mobile: same material language, only 10% depth.
   No card-stack effect.
   --------------------------------------------------------- */
@media(max-width:750px){
  body{
    background:var(--bg);
  }

  body.home .hero,
  body.home .mobile-category-nav,
  body.home .collection,
  body.home .manifesto-short,
  .product-gallery-layout,
  .product-purchase,
  .cart-summary-minimal,
  .checkout-panel-minimal,
  .checkout-summary-minimal,
  .cancel-panel{
    box-shadow:
      0 8px 22px rgba(45,40,34,.035),
      inset 1px 1px 0 rgba(255,255,255,.30);
  }

  html[data-theme="dark"] body.home .hero,
  html[data-theme="dark"] body.home .mobile-category-nav,
  html[data-theme="dark"] body.home .collection,
  html[data-theme="dark"] body.home .manifesto-short,
  html[data-theme="dark"] .product-gallery-layout,
  html[data-theme="dark"] .product-purchase,
  html[data-theme="dark"] .cart-summary-minimal,
  html[data-theme="dark"] .checkout-panel-minimal,
  html[data-theme="dark"] .checkout-summary-minimal,
  html[data-theme="dark"] .cancel-panel{
    box-shadow:
      0 8px 24px rgba(0,0,0,.14),
      inset 1px 1px 0 rgba(255,255,255,.025);
  }
}

/* version marker: 2and4-v7-floating-editorial */


/* =========================================================
   2&4 Studio – Floating Editorial Mobile v7.4
   Same light direction as desktop, stronger depth on mobile
   without turning the UI into stacked app cards.
   ========================================================= */

@media(max-width:750px){

  :root{
    --mobile-float-gap:12px;
    --mobile-float-radius:3px;
    --mobile-float-shadow:
      8px 12px 26px rgba(49,43,36,.075),
      2px 4px 10px rgba(49,43,36,.045);
    --mobile-float-shadow-soft:
      6px 9px 20px rgba(49,43,36,.055),
      2px 3px 8px rgba(49,43,36,.032);
    --mobile-float-highlight:
      inset 1px 1px 0 rgba(255,255,255,.66),
      inset -1px -1px 0 rgba(82,72,61,.025);
  }

  html[data-theme="dark"]{
    --mobile-float-shadow:
      8px 12px 28px rgba(0,0,0,.26),
      2px 4px 10px rgba(0,0,0,.18);
    --mobile-float-shadow-soft:
      6px 9px 22px rgba(0,0,0,.20),
      2px 3px 8px rgba(0,0,0,.14);
    --mobile-float-highlight:
      inset 1px 1px 0 rgba(255,255,255,.04),
      inset -1px -1px 0 rgba(0,0,0,.18);
  }

  body{
    background:var(--float-canvas) !important;
  }

  /* HOME ------------------------------------------------ */

  body.home main{
    padding:var(--mobile-float-gap);
  }

  body.home .hero{
    width:auto !important;
    margin:0 !important;
    border-radius:var(--mobile-float-radius);
    box-shadow:var(--mobile-float-shadow),var(--mobile-float-highlight) !important;
    overflow:hidden;
  }

  body.home .mobile-category-nav{
    margin-top:var(--mobile-float-gap);
    padding-left:14px !important;
    padding-right:14px !important;
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 8%,rgba(255,255,255,.48),transparent 25%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow-soft),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] body.home .mobile-category-nav{
    background:
      radial-gradient(circle at 10% 8%,rgba(255,255,255,.028),transparent 25%),
      var(--float-panel) !important;
  }

  body.home .mobile-category-icon{
    background:color-mix(in srgb,var(--float-panel) 78%,transparent) !important;
    box-shadow:
      4px 6px 14px rgba(49,43,36,.045),
      inset 1px 1px 0 rgba(255,255,255,.5);
  }

  html[data-theme="dark"] body.home .mobile-category-icon{
    box-shadow:
      4px 6px 14px rgba(0,0,0,.16),
      inset 1px 1px 0 rgba(255,255,255,.025);
  }

  body.home .collection{
    margin-top:var(--mobile-float-gap);
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 9% 5%,rgba(255,255,255,.46),transparent 23%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] body.home .collection{
    background:
      radial-gradient(circle at 9% 5%,rgba(255,255,255,.026),transparent 23%),
      var(--float-panel) !important;
  }

  body.home .collection .card{
    transition:transform .22s var(--ease);
  }

  body.home .collection .card:active{
    transform:translateY(-2px);
  }

  body.home .collection .card-image{
    border-radius:2px;
    box-shadow:
      4px 7px 16px rgba(49,43,36,.05),
      inset 1px 1px 0 rgba(255,255,255,.46);
  }

  html[data-theme="dark"] body.home .collection .card-image{
    box-shadow:
      4px 7px 18px rgba(0,0,0,.18),
      inset 1px 1px 0 rgba(255,255,255,.02);
  }

  body.home .manifesto-short{
    margin-top:var(--mobile-float-gap);
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 8%,rgba(255,255,255,.42),transparent 24%),
      var(--float-panel-soft) !important;
    box-shadow:var(--mobile-float-shadow-soft),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] body.home .manifesto-short{
    background:
      radial-gradient(circle at 10% 8%,rgba(255,255,255,.024),transparent 24%),
      var(--float-panel-soft) !important;
  }

  /* Header remains visually detached, not card-like */
  body.home .top.home-header-revealed,
  .top{
    box-shadow:0 7px 20px rgba(49,43,36,.045) !important;
  }

  html[data-theme="dark"] body.home .top.home-header-revealed,
  html[data-theme="dark"] .top{
    box-shadow:0 7px 22px rgba(0,0,0,.18) !important;
  }

  /* WORLD / SHOP ---------------------------------------- */

  .world-page,
  .shop-page{
    padding:var(--mobile-float-gap) !important;
    background:transparent !important;
  }

  .world-page .world-hero,
  .world-page .world-collection,
  .shop-page .shop-hero,
  .shop-page .shop-collection{
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.43),transparent 24%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow-soft),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] .world-page .world-hero,
  html[data-theme="dark"] .world-page .world-collection,
  html[data-theme="dark"] .shop-page .shop-hero,
  html[data-theme="dark"] .shop-page .shop-collection{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.025),transparent 24%),
      var(--float-panel) !important;
  }

  .world-page .world-hero,
  .shop-page .shop-hero{
    margin-bottom:var(--mobile-float-gap) !important;
  }

  .world-page .world-collection + .world-collection{
    margin-top:var(--mobile-float-gap) !important;
  }

  /* PRODUCT DETAIL -------------------------------------- */

  .product-page{
    padding:var(--mobile-float-gap) !important;
    background:transparent !important;
  }

  .product-gallery-layout,
  .product-purchase{
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.46),transparent 24%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] .product-gallery-layout,
  html[data-theme="dark"] .product-purchase{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.025),transparent 24%),
      var(--float-panel) !important;
  }

  .product-purchase{
    margin-top:var(--mobile-float-gap);
  }

  .product-sticky-buy{
    box-shadow:
      0 -8px 22px rgba(49,43,36,.055),
      inset 0 1px 0 rgba(255,255,255,.5) !important;
  }

  html[data-theme="dark"] .product-sticky-buy{
    box-shadow:
      0 -8px 24px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.025) !important;
  }

  /* CART ------------------------------------------------ */

  .cart-page-minimal{
    padding:var(--mobile-float-gap) !important;
  }

  .cart-hero-minimal,
  .cart-items-minimal,
  .cart-summary-minimal{
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.42),transparent 24%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow-soft),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] .cart-hero-minimal,
  html[data-theme="dark"] .cart-items-minimal,
  html[data-theme="dark"] .cart-summary-minimal{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.024),transparent 24%),
      var(--float-panel) !important;
  }

  .cart-hero-minimal{
    padding:26px 18px 22px !important;
    margin-bottom:var(--mobile-float-gap);
  }

  .cart-items-minimal{
    padding:18px 14px !important;
  }

  .cart-summary-minimal{
    margin-top:var(--mobile-float-gap) !important;
    padding:20px 16px !important;
  }

  /* CHECKOUT -------------------------------------------- */

  .checkout-page-minimal{
    padding:var(--mobile-float-gap) !important;
  }

  .checkout-hero-minimal,
  .checkout-panel-minimal,
  .checkout-summary-minimal{
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.42),transparent 24%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow-soft),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] .checkout-hero-minimal,
  html[data-theme="dark"] .checkout-panel-minimal,
  html[data-theme="dark"] .checkout-summary-minimal{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.024),transparent 24%),
      var(--float-panel) !important;
  }

  .checkout-hero-minimal{
    padding:26px 18px 22px !important;
    margin-bottom:var(--mobile-float-gap);
  }

  .checkout-summary-minimal{
    padding:18px 14px !important;
  }

  .checkout-panel-minimal{
    margin-top:var(--mobile-float-gap);
    padding:20px 14px !important;
  }

  /* CANCEL ---------------------------------------------- */

  .cancel-page-minimal{
    padding:var(--mobile-float-gap) !important;
  }

  .cancel-panel{
    padding:34px 18px 30px !important;
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.44),transparent 24%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] .cancel-panel{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.025),transparent 24%),
      var(--float-panel) !important;
  }

  /* INFORMATION PAGES ----------------------------------- */

  .info-page{
    margin:var(--mobile-float-gap) !important;
    padding:28px 18px !important;
    border-radius:var(--mobile-float-radius);
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.42),transparent 24%),
      var(--float-panel) !important;
    box-shadow:var(--mobile-float-shadow-soft),var(--mobile-float-highlight) !important;
  }

  html[data-theme="dark"] .info-page{
    background:
      radial-gradient(circle at 10% 6%,rgba(255,255,255,.023),transparent 24%),
      var(--float-panel) !important;
  }

  /* Footer remains the grounded endpoint */
  .site-footer,
  body.home footer{
    background:transparent !important;
    box-shadow:none !important;
  }
}

/* version marker: 2and4-v7-floating-mobile */


/* =========================================================
   2&4 Studio – Mobile Hero + Footer correction v7.5
   ========================================================= */

@media(max-width:750px){

  /* -------------------------------------------------------
     HERO
     Remove the old editorial vertical divider completely.
     The floating surface itself now provides the structure.
     ------------------------------------------------------- */
  body.home .hero::after,
  body.home .hero::before{
    display:none !important;
    content:none !important;
    background:none !important;
  }

  /* -------------------------------------------------------
     FOOTER
     Grounded closing surface: visible, calm and distinct
     from the floating sections above it.
     ------------------------------------------------------- */
  .site-footer,
  body.home .site-footer{
    position:relative !important;
    width:auto !important;
    margin:var(--mobile-float-gap) !important;
    padding:26px 18px 24px !important;
    display:block !important;
    border:0 !important;
    border-radius:var(--mobile-float-radius) !important;
    background:
      radial-gradient(circle at 10% 0%,rgba(255,255,255,.34),transparent 30%),
      var(--float-panel-soft) !important;
    box-shadow:
      4px 7px 18px rgba(49,43,36,.04),
      inset 1px 1px 0 rgba(255,255,255,.50) !important;
    color:var(--ink) !important;
  }

  html[data-theme="dark"] .site-footer,
  html[data-theme="dark"] body.home .site-footer{
    background:
      radial-gradient(circle at 10% 0%,rgba(255,255,255,.022),transparent 30%),
      var(--float-panel-soft) !important;
    box-shadow:
      4px 7px 20px rgba(0,0,0,.15),
      inset 1px 1px 0 rgba(255,255,255,.022) !important;
  }

  /* One short light/shadow divider rather than a full-width rule */
  .site-footer::before,
  body.home .site-footer::before{
    display:block !important;
    content:"" !important;
    position:static !important;
    width:72px !important;
    height:1px !important;
    margin:0 0 18px !important;
    background:var(--line) !important;
    opacity:.72 !important;
  }

  .site-footer .footer-main,
  body.home .site-footer .footer-main{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
  }

  .site-footer .footer-brand,
  .site-footer .footer-contact,
  .site-footer .footer-status{
    display:block !important;
    grid-column:auto !important;
    justify-self:start !important;
    margin:0 !important;
    font-size:.57rem !important;
    line-height:1.45 !important;
  }

  .site-footer .footer-brand{
    color:var(--ink) !important;
    font-weight:560 !important;
  }

  .site-footer .footer-contact{
    color:var(--muted) !important;
  }

  .site-footer .footer-status{
    color:var(--muted-2) !important;
  }

  .site-footer .footer-contact a{
    color:inherit !important;
  }

  .site-footer .footer-links,
  body.home .site-footer .footer-links{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:flex-start !important;
    gap:7px 14px !important;
    margin:15px 0 0 !important;
    padding:0 !important;
    font-size:.55rem !important;
  }

  .site-footer .footer-links:empty{
    display:none !important;
  }

  .site-footer .footer-links a{
    color:var(--muted) !important;
  }

  /* Keep the final edge clean and visible */
  body.home main + .site-footer{
    margin-top:var(--mobile-float-gap) !important;
  }
}

@media(max-width:390px){
  .site-footer,
  body.home .site-footer{
    margin:10px !important;
    padding:24px 16px 22px !important;
  }

  .site-footer::before,
  body.home .site-footer::before{
    width:62px !important;
  }
}

/* version marker: 2and4-v7-mobile-hero-footer-fix */