/* 40 Nights — base layer, loaded first on every page (home, shop, product, checkout).
   Design tokens, reset, typography and the original foundation components.
   Cascade order across pages: base.css → storefront.css → editorial.css → storefront-finish.css (home/shop);
   base.css → editorial.css → product/product.css (product); base.css → checkout/checkout.css (checkout). */

/* ==== Original foundation (formerly style.css) ==== */
:root{--ink:#0b0b0a;--cream:#f1ecdf;--gold:#b69b68;--line:rgba(241,236,223,.22);--sans:"DM Sans",Arial,sans-serif;--serif:"Playfair Display",Georgia,serif;--mono:"DM Mono",monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--cream);font-family:var(--sans);font-size:14px}
.site-shell{overflow:hidden}
.cursor-glow{position:fixed;z-index:9;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(182,155,104,.12),transparent 68%);pointer-events:none;transform:translate(-50%,-50%);mix-blend-mode:screen}
.nav{height:84px;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:3;top:0;width:100%;padding:0 4.5vw;border-bottom:1px solid var(--line)}
.nav-links{display:flex;gap:28px}
.nav a,.bag-button,footer a{color:inherit;text-decoration:none;text-transform:uppercase;letter-spacing:.1em;font:11px var(--mono)}
.bag-button{border:0;background:none;color:var(--cream);cursor:pointer}
.bag-button span{display:inline-grid;place-items:center;border:1px solid var(--line);height:18px;min-width:18px;border-radius:50%;margin-left:6px}
.hero{height:100svh;min-height:670px;position:relative;background:#111;isolation:isolate}
.hero-image,.hero-image:after{position:absolute;inset:0}
.hero-image img{width:100%;height:100%;object-fit:cover;object-position:center 42%;filter:saturate(.68) contrast(1.04);animation:kenburns 16s ease-out both}
.hero-image:after{content:"";background:linear-gradient(90deg,rgba(5,5,5,.79),rgba(5,5,5,.15) 55%,rgba(5,5,5,.32)),linear-gradient(0deg,rgba(5,5,5,.7),transparent 32%)}
.hero-grain{position:absolute;inset:0;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.48'/%3E%3C/svg%3E")}
.hero-topline{position:absolute;top:114px;left:4.5vw;right:4.5vw;display:flex;justify-content:space-between;color:#ded6c7;font:10px var(--mono);letter-spacing:.14em}
.hero-copy{position:absolute;z-index:1;left:9.5vw;top:50%;transform:translateY(-40%)}
.eyebrow,.section-index{font:10px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.hero h1{font:600 clamp(74px,13vw,190px)/.73 var(--serif);letter-spacing:-.075em;margin:24px 0 28px;display:flex;flex-direction:column}
.hero h1 em{padding-left:clamp(38px,9vw,142px);font-weight:500}
.hero-note{font:15px/1.55 var(--serif);color:#e3ddd1}
.text-link{display:inline-flex;gap:14px;align-items:center;color:var(--cream);text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font:10px var(--mono);border-bottom:1px solid var(--cream);padding:0 0 8px;margin-top:36px}
.text-link span{font-size:18px;transition:transform .25s}
.text-link:hover span{transform:translate(4px,4px)}
.hero-foot{position:absolute;bottom:28px;left:4.5vw;right:4.5vw;display:flex;align-items:center;gap:12px;font:10px var(--mono);letter-spacing:.1em;color:#d5cdbc}
.hero-foot i{height:1px;background:#bfb6a6;width:46px}
.hero-foot span:last-child{margin-left:auto;font:19px "Noto Naskh Arabic",serif}
.manifesto{background:var(--cream);color:var(--ink);padding:150px 8.5vw}
.section-index{margin:0}
.manifesto-grid{margin-top:90px;display:grid;grid-template-columns:1.35fr .65fr;gap:12vw;align-items:end}
.manifesto h2,.editorial-type h2,.collection h2{font:500 clamp(47px,6.4vw,100px)/.95 var(--serif);letter-spacing:-.065em;margin:0}
.manifesto h2 em,.editorial-type h2 em{font-weight:500}
.manifesto-copy{font-size:15px;line-height:1.75;max-width:390px}
.manifesto-copy p{margin:0 0 22px}
.manifesto-copy .arabic{font:27px "Noto Naskh Arabic",serif;color:#705d3c}
.editorial-panel{min-height:850px;background:#171512;position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding:100px 8.5vw;overflow:hidden}
.editorial-image{height:610px;overflow:hidden}
.editorial-image img{width:100%;height:100%;object-fit:cover;object-position:center}
.editorial-type{padding:0 5vw}
.editorial-type h2{margin:30px 0}
.editorial-type>p:not(.section-index){font-size:15px;line-height:1.7;color:#cec5b5;max-width:310px}
.editorial-number{position:absolute;font:500 47vw/.7 "Noto Naskh Arabic",serif;color:#211f1b;right:-.08em;bottom:-.04em;z-index:-1}
.collection{background:#cbbca4;color:#111;padding:125px 4.5vw 145px}
.collection-head{display:grid;grid-template-columns:1fr 1.4fr .6fr;align-items:end;border-bottom:1px solid rgba(0,0,0,.3);padding-bottom:33px}
.collection-head .section-index{color:#756244}
.collection-head p:last-child{font:13px var(--mono);text-align:right}
.products{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:45px}
.product-card{min-width:0}
.product-offset{margin-top:120px}
.product-image{width:100%;aspect-ratio:3/4;border:0;padding:0;background:#24211e;display:block;position:relative;overflow:hidden;cursor:pointer}
.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .4s;filter:contrast(1.03) saturate(.8)}
.product-image span{position:absolute;left:18px;bottom:18px;background:var(--cream);padding:10px 13px;text-transform:uppercase;font:10px var(--mono);letter-spacing:.08em;opacity:0;transform:translateY(10px);transition:.3s}
.product-image:hover img{transform:scale(1.06)}
.product-image:hover span{opacity:1;transform:none}
.product-meta{display:flex;justify-content:space-between;padding:16px 2px}
.product-meta h3{font:500 19px var(--serif);margin:0 0 6px}
.product-meta p{font:10px var(--mono);letter-spacing:.05em;margin:0;color:#574c3b}
.add{font:10px var(--mono);border:0;background:none;cursor:pointer;text-transform:uppercase;letter-spacing:.08em}
.add b{font-size:16px;margin-left:7px}
.button{color:var(--ink);background:var(--cream);font:10px var(--mono);text-decoration:none;text-transform:uppercase;letter-spacing:.12em;padding:16px 19px;display:inline-flex;gap:22px;transition:.25s}
.button:hover{background:var(--gold);transform:translateY(-3px)}
footer{background:#11100f;padding:46px 4.5vw;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);color:#aaa091}
footer p{font:10px var(--mono);letter-spacing:.08em}
footer div{display:flex;gap:18px}
.cart{position:fixed;z-index:11;top:0;right:0;height:100%;width:min(460px,100%);background:var(--cream);color:var(--ink);padding:28px;display:flex;flex-direction:column;transform:translateX(102%);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.cart.open{transform:none}
.scrim{position:fixed;z-index:10;inset:0;background:rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:.3s}
.scrim.open{opacity:1;visibility:visible}
.cart-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #bdb4a5;padding-bottom:20px}
.cart-head h2{font:500 29px var(--serif);margin:0}
.cart-head button,.dialog-close{border:0;background:none;font-size:30px;cursor:pointer}
.cart-empty{flex:1;display:grid;place-items:center;font:italic 23px var(--serif);color:#716855}
.cart-items{padding-top:15px}
.cart-item{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid #c5bcad;font-size:13px}
.cart-item b{font:500 18px var(--serif)}
.cart-bottom{margin-top:auto;border-top:1px solid #bdb4a5;padding-top:18px}
.cart-bottom p{font:10px/1.5 var(--mono);color:#716855}
.checkout{width:100%;background:var(--ink);color:var(--cream);border:0;padding:16px;font:10px var(--mono);text-transform:uppercase;letter-spacing:.12em;display:flex;justify-content:space-between;cursor:pointer}
.quick-view{border:0;max-width:900px;width:calc(100% - 32px);padding:0;background:var(--cream);color:var(--ink);grid-template-columns:1fr 1fr}
.quick-view[open]{display:grid}
.quick-view::backdrop{background:rgba(0,0,0,.74);backdrop-filter:blur(6px)}
.quick-view>img{width:100%;height:590px;object-fit:cover}
.quick-view>div{padding:60px 44px}
.quick-view h2{font:500 45px/.95 var(--serif);letter-spacing:-.05em;margin:23px 0 10px}
.quick-view p:not(.eyebrow){font-size:13px;line-height:1.6}
.dialog-close{position:absolute;right:12px;top:8px;z-index:2}
.sizes{display:flex;gap:8px;margin:28px 0}
.sizes button{width:38px;height:35px;background:none;border:1px solid #a99c88;font:11px var(--mono);cursor:pointer}
.sizes button:hover{background:var(--ink);color:var(--cream)}
.dialog-add{border:0;cursor:pointer}
@keyframes kenburns{from{transform:scale(1.12)}to{transform:scale(1.02)}}
.reveal{animation:rise 1s both cubic-bezier(.2,.7,.2,1)}
.hero h1 .reveal:nth-child(2){animation-delay:.13s}
.hero-note{animation-delay:.31s}
.hero-copy .text-link{animation-delay:.42s}
.hero-foot{animation-delay:.55s}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media(max-width:720px){
  .nav{height:70px;padding:0 20px}
  .nav-links{display:none}
  .hero-copy{left:8vw}
  .hero-topline{top:91px;left:8vw;right:8vw}
  .hero h1{font-size:25vw}
  .hero-foot{left:8vw;right:8vw}
  .manifesto{padding:90px 8vw}
  .manifesto-grid{display:block;margin-top:54px}
  .manifesto-copy{margin-top:35px}
  .editorial-panel{display:block;min-height:0;padding:70px 8vw}
  .editorial-image{height:500px}
  .editorial-type{padding:55px 0 20px}
  .collection{padding:85px 5vw}
  .collection-head{display:block}
  .collection-head h2{margin:28px 0}
  .collection-head p:last-child{text-align:left}
  .products{grid-template-columns:1fr 1fr;gap:13px}
  .product-card:nth-child(3){grid-column:1/3;width:50%;margin-left:25%}
  .product-offset{margin-top:55px}
  .product-meta{display:block}
  .add{padding:10px 0}
  footer{display:block;padding:34px 8vw}
  footer p{margin:23px 0}
  .quick-view{grid-template-columns:1fr;overflow:auto;max-height:92vh}
  .quick-view>img{height:340px}
  .quick-view>div{padding:35px 25px}
  .cursor-glow{display:none}
}

/* <picture> wrappers add WebP renditions without becoming layout boxes, so every image keeps its existing size and selectors. */
picture{display:contents}
picture>source{display:none}