[hidden]{display:none!important}
:root{--border:var(--line);--bg:#f7f7fb;--bg-soft:#eef1f8;--panel:#ffffff;--text:#171b2b;--muted:#5c6478;--line:#d8deec;--pink:#d63384;--blue:#2563eb;--purple:#7c3aed;--green:#16a34a;--warning:#f59e0b;--danger:#dc2626;--shadow:0 18px 50px rgba(17,24,39,.10)}
body[data-theme="dark"]{--bg:#0a0b14;--bg-soft:#121425;--panel:#171a2c;--text:#f6f7fb;--muted:#a3abc2;--line:#2b2f47;--pink:#f72585;--blue:#4cc9f0;--purple:#8b5cf6;--green:#22c55e;--warning:#fbc16e;--danger:#ff8484;--shadow:0 20px 60px rgba(0,0,0,.35)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:radial-gradient(circle at top right,color-mix(in srgb,var(--blue) 12%,transparent),transparent 30%),radial-gradient(circle at top left,color-mix(in srgb,var(--pink) 10%,transparent),transparent 25%),var(--bg);color:var(--text);transition:background .25s ease,color .25s ease}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}code{background:var(--bg-soft);padding:.15rem .35rem;border-radius:.35rem}.container{width:min(1640px,calc(100% - 3rem));margin-inline:auto}.section{padding:4rem 0}.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid color-mix(in srgb,var(--line) 80%,transparent);backdrop-filter:none;background:color-mix(in srgb,var(--bg) 84%,transparent)}.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0}.nav-actions{display:flex;align-items:center;gap:.75rem}.brand{display:flex;align-items:center;gap:.85rem}.brand img{width:44px;height:44px;border-radius:12px;box-shadow:var(--shadow)}.brand strong{display:block}.brand span{display:block;color:var(--muted);font-size:.85rem}nav{display:flex;align-items:center;gap:1rem}nav a{padding:.65rem .85rem;border-radius:999px;color:var(--muted)}nav a.active,nav a:hover{background:color-mix(in srgb,var(--panel) 80%,var(--blue) 8%);color:var(--text)}.menu-toggle,.theme-toggle{background:var(--panel);border:1px solid var(--line);color:var(--text);padding:.55rem .8rem;border-radius:.8rem;cursor:pointer}.menu-toggle{display:none}.hero{padding:5rem 0 3rem}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center}.hero h1,.section h1,.section h2{font-size:clamp(2rem,5vw,4rem);line-height:1.05;margin:.25rem 0 1rem}.section h2{font-size:clamp(1.55rem,4vw,2.35rem)}h3{margin:.2rem 0 1rem}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--blue);font-size:.78rem;margin:0 0 .6rem}.hero-copy,.panel p,.assistant-reply,.contact-form input,.contact-form textarea,select,textarea,input{color:var(--muted)}.hero-actions,.hero-points,.section-head,.toolbar,.checkout-totals{display:flex;gap:1rem}.hero-actions{margin:1.5rem 0;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:1rem;padding:.95rem 1.2rem;font-weight:700;cursor:pointer;transition:transform .2s ease,opacity .2s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff;box-shadow:var(--shadow)}.btn-secondary{background:var(--panel);border:1px solid var(--line);color:var(--text)}.btn-link{background:none;border:none;padding:0;color:var(--blue);cursor:pointer}.wide{width:100%}.hero-points{padding:0;list-style:none;flex-wrap:wrap}.hero-points li,.stat-card,.panel,.category-card,.product-card,.assistant-panel,.toolbar,.checkout-card,.arrival-chip,.side-panel{background:color-mix(in srgb,var(--panel) 98%,transparent);border:1px solid color-mix(in srgb,var(--line) 90%,transparent);box-shadow:var(--shadow)}.hero-points li{padding:.7rem 1rem;border-radius:999px}.hero-card{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.stat-card{padding:1.2rem;border-radius:1.2rem}.stat-card strong{display:block;font-size:2rem}.stat-card span{color:var(--muted)}.glass-panel{grid-column:1/-1;padding:1.2rem;border-radius:1.2rem;background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 90%,white 8%),color-mix(in srgb,var(--panel) 100%,transparent));border:1px solid var(--line)}.section-head{justify-content:space-between;align-items:end;flex-wrap:wrap;margin-bottom:1.5rem}.section-head.compact{margin-bottom:1rem}.text-link{color:var(--blue)}.category-grid,.product-grid,.two-col,.checkout-grid{display:grid;gap:1.2rem}.category-grid{grid-template-columns:repeat(4,1fr)}.category-card,.panel,.product-card,.checkout-card{padding:1.2rem;border-radius:1.5rem}.category-card span{display:block;font-size:1.1rem;font-weight:700;margin-bottom:.3rem}.category-card small{color:var(--muted)}.two-col,.checkout-grid{grid-template-columns:repeat(2,1fr)}.toolbar{padding:1rem;border-radius:1.2rem;margin-bottom:1.3rem;flex-wrap:wrap}.toolbar input,.toolbar select,select,textarea,.contact-form input,.contact-form textarea,.checkout-form input,.checkout-form textarea{width:100%;background:var(--bg-soft);border:1px solid var(--line);border-radius:1rem;padding:.9rem 1rem;color:var(--text)}.toolbar input{flex:1 1 220px}.toolbar select{width:auto;min-width:180px}.product-grid{grid-template-columns:repeat(3,1fr)}.product-card{display:flex;flex-direction:column;gap:.85rem}.product-media{position:relative;overflow:hidden;border-radius:1rem;background:var(--bg-soft);aspect-ratio:4/5}.product-media img{width:100%;height:100%;object-fit:cover}.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:none;border-radius:50%;background:color-mix(in srgb,var(--bg) 82%,transparent);color:var(--text);cursor:pointer}.carousel-btn.prev{left:.7rem}.carousel-btn.next{right:.7rem}.badge-row{display:flex;gap:.5rem;flex-wrap:wrap}.badge{padding:.35rem .7rem;border-radius:999px;font-size:.78rem;background:var(--bg-soft);border:1px solid var(--line);color:var(--muted)}.badge.stock-ok{color:var(--green)}.badge.stock-low{color:var(--warning)}.badge.stock-out{color:var(--danger)}.price-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}.price-row strong{font-size:1.25rem}.price-row del{color:var(--muted)}.meta{display:grid;gap:.45rem;color:var(--muted);font-size:.93rem}.product-actions{display:flex;gap:.7rem;align-items:center;justify-content:space-between}.qty-pill{padding:.55rem .8rem;border-radius:999px;background:var(--bg-soft);border:1px solid var(--line)}.arrivals-wrap{overflow:hidden;position:relative;padding-block:.4rem}.arrivals-track{display:flex;gap:1rem;width:max-content;animation:marquee 34s linear infinite}.arrivals-wrap:hover .arrivals-track{animation-play-state:paused}.arrival-chip{min-width:220px;padding:.7rem;border-radius:1rem;display:flex;align-items:center;gap:.8rem}.arrival-chip img{width:58px;height:72px;border-radius:.8rem;object-fit:cover}.arrival-chip strong{display:block}.arrival-chip span{display:block;color:var(--muted);font-size:.9rem}@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}.cart-list{display:grid;gap:1rem}.cart-item{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;padding:1rem;border:1px solid var(--line);border-radius:1.25rem;background:var(--panel)}.cart-item img{width:82px;height:100px;border-radius:1rem;object-fit:cover;background:var(--bg-soft)}.cart-item .line-total{font-weight:800}.cart-controls{display:flex;gap:.45rem;align-items:center;flex-wrap:wrap}.qty-control{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden}.qty-control button{background:var(--bg-soft);border:none;width:34px;height:34px;color:var(--text);cursor:pointer}.qty-control span{min-width:34px;text-align:center}.checkout-form{display:grid;gap:.85rem}.summary-box{background:var(--bg-soft);border:1px dashed var(--line);padding:1rem;border-radius:1rem}.notice{padding:1rem;border-radius:1rem;background:color-mix(in srgb,var(--blue) 10%,var(--panel));border:1px solid color-mix(in srgb,var(--blue) 25%,var(--line))}.assistant-toggle,.arrival-float{position:fixed;right:1.2rem;width:64px;height:64px;border:none;border-radius:50%;color:#fff;font-weight:800;box-shadow:var(--shadow);cursor:pointer;z-index:60}.assistant-toggle{bottom:1.2rem;background:linear-gradient(135deg,var(--blue),var(--pink))}.arrival-float{bottom:6.2rem;background:linear-gradient(135deg,var(--purple),var(--pink));display:flex;align-items:center;justify-content:center}.assistant-panel,.side-panel{position:fixed;right:1.2rem;bottom:5.8rem;width:min(380px,calc(100vw - 1.4rem));padding:0;border-radius:1.5rem;overflow:hidden;display:none;z-index:60;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}.side-panel{bottom:11rem}.assistant-panel.open,.side-panel.open{display:block}.assistant-head{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom:1px solid var(--line)}.assistant-head button{background:none;border:none;color:var(--text);font-size:1.5rem;cursor:pointer}.assistant-body{padding:1rem;display:grid;gap:.9rem}.assistant-reply{min-height:110px;background:var(--bg-soft);border:1px solid var(--line);border-radius:1rem;padding:1rem;white-space:pre-wrap}.assistant-reply.large{min-height:320px}.assistant-contact{color:var(--muted);font-size:.84rem}.contact-form{display:grid;gap:.8rem}.empty-state{text-align:center;padding:2.5rem}.small-muted{font-size:.88rem;color:var(--muted)}
@media (max-width:980px){.hero-grid,.two-col,.category-grid,.product-grid,.checkout-grid{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.menu-toggle{display:block}nav{position:absolute;left:1rem;right:1rem;top:76px;display:none;flex-direction:column;align-items:stretch;padding:1rem;background:var(--panel);border:1px solid var(--line);border-radius:1.2rem}nav.open{display:flex}.hero-grid,.two-col,.category-grid,.product-grid,.hero-card,.checkout-grid,.cart-item{grid-template-columns:1fr}.toolbar select{width:100%}.cart-item img{width:100%;height:220px}}
.nav-item{position:relative}.submenu{position:absolute;top:calc(100% + .45rem);left:0;display:none;min-width:220px;padding:.55rem;background:var(--panel);border:1px solid var(--line);border-radius:1rem;box-shadow:var(--shadow);z-index:70}.submenu a{display:block;padding:.6rem .8rem;border-radius:.8rem;color:var(--muted)}.submenu a:hover{background:var(--bg-soft);color:var(--text)}.nav-item:hover .submenu{display:block}.branch-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-top:1.2rem}.branch-card{border:1px solid var(--line);border-radius:1.2rem;overflow:hidden;background:var(--panel);box-shadow:var(--shadow)}.branch-card img{width:100%;height:170px;object-fit:cover}.branch-card span{display:block;padding:.85rem;font-weight:700}.about-copy{max-width:860px}
@media (max-width:980px){.branch-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.submenu{position:static;display:block;box-shadow:none;border:none;padding:0;background:transparent}.branch-grid{grid-template-columns:1fr}}


.top-social-bar{background:var(--panel);border-bottom:1px solid var(--border)}
.top-social-bar .container{display:flex;justify-content:flex-end;gap:12px;padding:8px 20px}
.social-link{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.8);border:1px solid var(--border);transition:.2s transform}
.social-link:hover{transform:translateY(-2px)}
.social-link img{width:18px;height:18px}
.site-footer{margin-top:60px;background:var(--panel);border-top:1px solid var(--border)}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:24px;padding:36px 20px}
.footer-brand p,.footer-contact p{margin:10px 0;color:var(--muted)}
.footer-title{font-size:1rem;margin:0 0 12px}
.footer-category-links,.footer-social-links{display:grid;gap:10px}
.footer-category-links a,.footer-social-links a,.footer-contact a{color:var(--text);text-decoration:none}
.footer-social-links a{display:flex;align-items:center;gap:10px}
.footer-social-links img{width:18px;height:18px}
.footer-bottom{padding:0 20px 28px;color:var(--muted);font-size:.92rem}
.category-card{display:grid;grid-template-columns:90px 1fr;gap:14px;align-items:center}
.category-card img{width:90px;height:90px;object-fit:cover;border-radius:18px}
.product-grid.four-col{grid-template-columns:repeat(4,minmax(0,1fr))}
.top-picks-wrap{display:grid;gap:22px}
.top-pick-row{display:grid;gap:12px}
.section-head.compact{margin-bottom:0}
@media (max-width:1000px){.footer-grid{grid-template-columns:1fr 1fr}.product-grid.four-col{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.footer-grid{grid-template-columns:1fr}.product-grid.four-col{grid-template-columns:1fr}.top-social-bar .container{justify-content:center}}


.product-media .discount-badge{position:absolute;top:.8rem;left:.8rem;z-index:2;background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff;padding:.45rem .7rem;border-radius:999px;font-size:.78rem;font-weight:800;box-shadow:var(--shadow)}
.price-row .old-price{color:var(--muted);text-decoration-thickness:2px}
.discount-inline{display:inline-flex;align-items:center;padding:.28rem .55rem;border-radius:999px;background:color-mix(in srgb,var(--pink) 12%,var(--panel));border:1px solid color-mix(in srgb,var(--pink) 25%,var(--line));font-size:.78rem;font-weight:700;color:var(--text)}


html{scroll-behavior:smooth}
img{max-width:100%;display:block}
.hero-slider-section{padding:1.25rem 0 0}
.hero-slider{position:relative;min-height:clamp(360px,62vw,640px);border-radius:2rem;overflow:hidden;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s ease,transform .8s ease;transform:scale(1.02)}
.hero-slide.active{opacity:1;visibility:visible;transform:scale(1)}
.hero-slide img{width:100%;height:100%;object-fit:cover}
.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,18,24,.62) 0%,rgba(16,18,24,.34) 35%,rgba(16,18,24,.08) 62%,rgba(16,18,24,.06) 100%)}
.hero-slide-content{position:absolute;left:clamp(1rem,4vw,3rem);bottom:clamp(1rem,4vw,2.2rem);z-index:2;max-width:min(560px,92%);color:#fff}
.hero-slide-content h1{font-size:clamp(2rem,4vw,3.5rem);line-height:1.02;margin:0 0 .8rem}
.hero-slide-content p{font-size:clamp(1rem,1.4vw,1.15rem);color:rgba(255,255,255,.88);max-width:52ch;margin-bottom:1rem}
.hero-slide-content .eyebrow{color:#fff;background:rgba(255,255,255,.14);display:inline-flex;padding:.42rem .8rem;border-radius:999px;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px)}
.hero-slider-nav{position:absolute;left:1rem;right:1rem;bottom:1rem;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.hero-nav{width:52px;height:52px;border:none;border-radius:50%;background:rgba(255,255,255,.18);backdrop-filter:blur(8px);color:#fff;font-size:2rem;line-height:1;display:grid;place-items:center;cursor:pointer}
.hero-dots{display:flex;gap:.6rem;align-items:center;justify-content:center;flex:1}
.hero-dot{width:12px;height:12px;border-radius:999px;border:none;background:rgba(255,255,255,.45);cursor:pointer}
.hero-dot.active{width:34px;background:#fff}
.hero-slider-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1rem}
.hero-slider-stats .glass-panel{display:flex;align-items:center}
@media (max-width:980px){.hero-slider-stats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){
  .hero-slider{min-height:420px;border-radius:1.5rem}
  .hero-slide::after{background:linear-gradient(180deg,rgba(16,18,24,.12) 0%,rgba(16,18,24,.22) 28%,rgba(16,18,24,.68) 100%)}
  .hero-slider-nav{left:.7rem;right:.7rem;bottom:.7rem}
  .hero-nav{width:44px;height:44px;font-size:1.7rem}
  .hero-slider-stats{grid-template-columns:1fr}
}


/* Desktop/laptop full-width hero slider while keeping mobile/tablet unchanged */
@media (min-width: 981px){
  .hero-slider-section{padding-top:0}
  .hero-slider-shell{
    width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
  .hero-slider{
    min-height:min(72vh,760px);
    border-radius:0;
    border-left:none;
    border-right:none;
  }
  .hero-slide-content{left:clamp(2rem,6vw,6rem);bottom:clamp(2rem,5vw,4rem);max-width:min(640px,48vw)}
  .hero-slider-nav{left:clamp(1rem,3vw,2.5rem);right:clamp(1rem,3vw,2.5rem);bottom:clamp(1rem,2.5vw,2rem)}
}
@media (min-width: 761px) and (max-width: 980px){
  .hero-slider-shell{width:auto;margin:0}
}


.product-card,.category-card,.checkout-card,.panel,.branch-card{transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
.product-card:hover,.category-card:hover,.branch-card:hover{
  transform:translateY(-4px);
  border-color:color-mix(in srgb,var(--pink) 38%,var(--line));
  box-shadow:0 18px 44px color-mix(in srgb,var(--pink) 14%, transparent),0 0 0 1px color-mix(in srgb,var(--blue) 18%, transparent),var(--shadow);
}
.product-card:hover .product-media,.category-card:hover img{box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 16%, transparent)}
.payment-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}
.payment-option{position:relative;display:block;cursor:pointer}
.payment-option input{position:absolute;opacity:0;pointer-events:none}
.payment-card{height:100%;padding:1rem;border:1px solid var(--line);border-radius:1.1rem;background:var(--panel);display:grid;gap:.35rem;transition:.2s ease}
.payment-card strong{font-size:1rem}
.payment-card span{color:var(--muted);font-size:.92rem}
.payment-option input:checked + .payment-card{border-color:color-mix(in srgb,var(--pink) 45%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--pink) 12%,transparent),var(--shadow);background:color-mix(in srgb,var(--panel) 88%,var(--pink) 4%)}
.payment-extra{display:none;gap:.8rem;margin-top:.6rem}
.payment-extra.show{display:grid}
.form-two{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.file-row{display:grid;gap:.45rem}
.file-help{font-size:.86rem;color:var(--muted)}
.method-note{font-size:.9rem;color:var(--muted);margin-top:.2rem}
.payment-summary{display:grid;gap:.65rem}
.payment-method-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .8rem;border-radius:999px;background:color-mix(in srgb,var(--purple) 12%,var(--panel));border:1px solid color-mix(in srgb,var(--purple) 25%,var(--line));font-weight:700}
.instruction-list{display:grid;gap:.7rem;margin-top:.75rem}
.instruction-item{padding:.9rem 1rem;border:1px solid var(--line);border-radius:1rem;background:var(--bg-soft)}
.kv{display:grid;grid-template-columns:180px 1fr;gap:.5rem;margin:.2rem 0}
.kv strong{color:var(--muted)}
.upload-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--green) 12%,var(--panel));border:1px solid color-mix(in srgb,var(--green) 25%,var(--line));font-size:.85rem}
.order-result-card{display:grid;gap:1rem}
@media (max-width:760px){.payment-methods,.form-two{grid-template-columns:1fr}.kv{grid-template-columns:1fr}}

.float-stack{position:fixed;right:1.1rem;bottom:6.1rem;z-index:61;display:flex;align-items:center;gap:.45rem}
.float-close-btn{width:30px;height:30px;border:none;border-radius:999px;background:var(--panel);color:var(--text);border:1px solid var(--line);box-shadow:var(--shadow);cursor:pointer}
.float-close-btn.hidden,.arrival-float.hidden{display:none}
.assistant-toggle img{width:26px;height:26px;display:block}
.assistant-title-icon{width:20px;height:20px;display:block}
.assistant-head strong{display:inline-flex;align-items:center;gap:.55rem}
.glow-target,.arrival-chip,.arrival-float,.assistant-toggle{transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
.glow-target:hover,.arrival-chip:hover,.arrival-float:hover,.assistant-toggle:hover{box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 16%, transparent),0 18px 44px color-mix(in srgb,var(--pink) 14%, transparent),var(--shadow);border-color:color-mix(in srgb,var(--pink) 40%,var(--line));transform:translateY(-2px)}
.arrival-float,.assistant-toggle{border:1px solid transparent}
@media (max-width:760px){.float-stack{right:1rem;bottom:6rem}.float-close-btn{width:28px;height:28px}}

.open-glow{box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 16%, transparent),0 18px 44px color-mix(in srgb,var(--pink) 14%, transparent),var(--shadow)!important;border-color:color-mix(in srgb,var(--pink) 40%,var(--line))!important}


/* v15 layout updates */
.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.product-media{aspect-ratio:2/3}
.product-slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .35s ease}
.product-slide.active{opacity:1;pointer-events:auto}
.product-media .slide-btn{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:none;border-radius:999px;background:color-mix(in srgb,var(--bg) 82%,transparent);color:var(--text);cursor:pointer;z-index:3;display:grid;place-items:center;font-size:1.3rem;box-shadow:var(--shadow)}
.product-media .slide-btn.prev{left:.6rem}
.product-media .slide-btn.next{right:.6rem}
.product-info{display:grid;gap:.8rem}
.product-specs{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:.2rem;margin-bottom:.85rem;flex-wrap:wrap}
.spec-boxes{display:flex;gap:.45rem;flex-wrap:wrap;align-items:center}
.spec-chip{display:inline-flex;align-items:center;justify-content:center;min-height:2.1rem;padding:.48rem .72rem;border-radius:.75rem;border:1px solid var(--line);background:var(--bg-soft);font-size:.88rem;color:var(--text)}
.arrival-panel-scroll{max-height:320px;overflow:auto;padding-right:.2rem}
.arrival-panel-grid{display:grid;gap:.75rem}
.arrival-chip.glow-target{min-width:0}
.arrival-float.open-glow{box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 16%, transparent),0 18px 44px color-mix(in srgb,var(--pink) 14%, transparent),var(--shadow)!important}
.home-promo-slider{position:relative;overflow:hidden;border-radius:1.5rem;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}
.home-promo-track{display:flex;transition:transform .65s ease}
.home-promo-slide{min-width:100%;position:relative;aspect-ratio:27/5}
.home-promo-slide img{width:100%;height:100%;object-fit:cover}
.home-promo-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,14,22,.50),rgba(10,14,22,.10) 58%,rgba(10,14,22,.12))}
.home-promo-copy{position:absolute;left:clamp(1rem,4vw,2.4rem);bottom:clamp(.8rem,2.6vw,1.8rem);z-index:2;color:#fff;max-width:min(520px,70%)}
.home-promo-copy h3{margin:0 0 .45rem;font-size:clamp(1.3rem,2.3vw,2.1rem)}
.home-promo-copy p{margin:0;color:rgba(255,255,255,.88)}
.home-promo-dots{position:absolute;right:1rem;bottom:1rem;display:flex;gap:.45rem;z-index:3}
.home-promo-dot{width:10px;height:10px;border:none;border-radius:999px;background:rgba(255,255,255,.5)}
.home-promo-dot.active{width:28px;background:#fff}
.page-banner{margin-bottom:1.6rem;border-radius:1.5rem;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.page-banner img{width:100%;aspect-ratio:27/5;object-fit:cover}
.partners-section{margin-top:2rem}
.partner-marquee{overflow:hidden;padding:.25rem 0}
.partner-track{display:flex;gap:1rem;width:max-content;animation:marquee 24s linear infinite}
.partner-chip{display:flex;align-items:center;justify-content:center;min-width:180px;padding:.55rem;border-radius:1rem;background:color-mix(in srgb,var(--panel) 98%,transparent);border:1px solid var(--line);box-shadow:var(--shadow)}
.partner-chip img{width:140px;height:70px;object-fit:contain;border-radius:.8rem}
@media (max-width:980px){.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.product-grid{grid-template-columns:1fr}.product-specs{gap:.7rem}.home-promo-slide{aspect-ratio:27/5}.home-promo-copy{max-width:88%}.page-banner img{aspect-ratio:27/5}}


/* v16 product redesign + policies */
.product-grid{grid-template-columns:repeat(4,1fr)}
.product-card-minimal{padding:0;background:transparent;border:none;box-shadow:none}
.product-card-minimal:hover{transform:none}
.product-card-minimal .product-media{aspect-ratio:2/3;border-radius:0;background:transparent}
.product-card-minimal .product-media img{border-radius:0}
.product-card-minimal .product-info.minimal{padding:.95rem 0 0}
.product-card-minimal h3{font-size:1rem;font-weight:400;line-height:1.35;margin:0 0 .4rem}
.product-card-minimal .listing-price strong{font-size:1.05rem;font-weight:500}
.product-card-minimal .listing-price del{display:block;font-size:.95rem}
.media-link{display:block;position:relative}
.slide-btn{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border:none;border-radius:50%;background:rgba(255,255,255,.84);color:#222;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3}
.slide-btn.prev{left:.65rem}.slide-btn.next{right:.65rem}
.product-slide{position:absolute;inset:0;opacity:0;transition:opacity .25s ease}
.product-slide.active{opacity:1}
.discount-badge{position:absolute;top:.75rem;left:.75rem;background:rgba(20,20,20,.78);color:#fff;padding:.38rem .58rem;border-radius:999px;font-size:.74rem;z-index:3}
.image-cart-btn{position:absolute;right:.75rem;bottom:.75rem;width:42px;height:42px;border:none;border-radius:50%;background:rgba(255,255,255,.92);cursor:pointer;z-index:3;box-shadow:0 8px 18px rgba(0,0,0,.15)}
.product-title-link{display:block}
.product-title-link:hover{text-decoration:none}
.arrival-panel-scroll{max-height:430px;overflow:auto;padding-right:.2rem}
.arrival-panel-grid{grid-template-columns:1fr}
.arrival-panel-grid .arrival-chip:nth-child(n+4){opacity:.98}
.arrival-float-close{position:fixed;right:1.2rem;bottom:10.75rem;width:28px;height:28px;border:none;border-radius:50%;background:var(--panel);color:var(--text);box-shadow:var(--shadow);z-index:61;cursor:pointer}
.arrival-float.hidden,.arrival-float-close.hidden{display:none!important}
.product-detail-layout{display:grid;grid-template-columns:1.03fr .97fr;gap:2rem;align-items:start}
.product-gallery.panel,.product-summary.panel{padding:1.4rem}
.detail-main-image-wrap{aspect-ratio:2/3;background:var(--bg-soft);overflow:hidden}
.detail-main-image{width:100%;height:100%;object-fit:cover}
.detail-thumb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem;margin-top:1rem}
.detail-thumb{border:1px solid var(--line);background:var(--panel);padding:0;cursor:pointer}
.detail-thumb.active{box-shadow:0 0 0 2px color-mix(in srgb,var(--blue) 28%, transparent)}
.detail-thumb img{aspect-ratio:2/3;object-fit:cover;width:100%;height:100%}
.product-detail-title{font-size:clamp(2rem,4vw,3.2rem);line-height:1.05;margin:.1rem 0 1rem}
.detail-price{margin:0 0 .85rem}
.detail-note{color:var(--muted);font-size:1rem}
.detail-meta-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem 1.2rem;padding:1rem 0 1.15rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:1rem 0}
.detail-field{display:grid;gap:.45rem;margin:0 0 1rem}
.detail-field label{font-weight:600}
.detail-qty{width:max-content}
.detail-description{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}
.customer-reviews-cta{text-align:center;padding:3.2rem 0 1rem}
.customer-reviews-cta p{letter-spacing:.2em;color:#d4b45a;margin:.8rem 0 .25rem}
.customer-reviews-cta span{color:var(--muted)}
.review-btn{min-width:220px}
.policy-stack{display:grid;gap:1rem;margin-top:2rem}
.policy-item{border:1px solid var(--line);border-radius:1rem;background:var(--panel);overflow:hidden}
.policy-head{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.1rem}
.policy-head h3{margin:0;font-size:1rem}
.policy-toggle{border:none;background:none;color:var(--text);cursor:pointer;font-size:1.4rem}
.policy-body{display:none;padding:0 1.1rem 1.1rem;color:var(--muted);line-height:1.7}
.policy-body.open{display:block}
.page-banner img{width:100%;aspect-ratio:27/5;object-fit:cover}
/* Product (add-to-cart / checkout) page rendered 30% smaller, centered, on desktop.
   zoom scales the whole block uniformly; max-width caps it to the container so the
   0.7 factor is a true 30% reduction. Phones/tablets keep full size for tap targets.
   max-width raised 40% (1180 * 1.4 = 1652) so the page reads larger on wide monitors -
   zoom stays at .7 (unrelated, pre-existing), so this is a genuine 40% increase in the
   on-screen rendered width (1180px * .7 = 826px screen px -> 1652px * .7 = 1156px). The
   product image itself must not stretch up with the extra room, so the gallery column
   (image + thumbnails) is pinned to a fixed width below instead of the fluid fr-share
   .product-detail-layout uses by default, and 100% of the extra width goes to the
   summary/description column next to it. 591px here is 826px screen-px (today's actual
   rendered gallery width) converted back into this zoomed coordinate space (591 * .7 =
   413.8, matching the gallery's current on-screen width to the pixel). */
@media (min-width: 992px){
  #productDetail{ zoom:.7; max-width:1652px; margin-inline:auto; }
  .product-detail-layout{grid-template-columns:591px minmax(0,1fr)}
}
@media (max-width: 991px){
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .product-detail-layout{grid-template-columns:1fr}
  .detail-thumb-grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width: 640px){
  .product-grid{grid-template-columns:repeat(2,1fr)}
}


/* v17 reference styling */
:root{--bg:#ffffff;--bg-soft:#f5f3ee;--panel:#ffffff;--text:#141414;--muted:#6b6b6b;--line:#e7e0d5;--pink:#b89a57;--blue:#111111;--purple:#b89a57;--shadow:0 16px 45px rgba(10,10,10,.08)}
body[data-theme="dark"]{--bg:#0f0f12;--bg-soft:#161619;--panel:#131316;--text:#f6f2ea;--muted:#c0b7a7;--line:#2b2a28;--pink:#d4b66c;--blue:#f6f2ea;--purple:#d4b66c;--shadow:0 20px 55px rgba(0,0,0,.45)}
body{background:var(--bg)}
.site-header{backdrop-filter:none;background:var(--panel)}
.home-page .site-header.home-hero-header{position:fixed;top:0;left:0;right:0;border-bottom:none;background:transparent;transition:background .25s ease, box-shadow .25s ease, transform .25s ease}
.promo-bar{background:#171717;color:#f5efe5;font-size:.92rem;letter-spacing:.01em}
.promo-inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:40px}.promo-center{justify-self:center}.promo-right{justify-self:end;font-size:.95rem}
.saya-nav-wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:1.55rem 0;color:#fff;gap:1rem}
.saya-nav{display:flex;gap:2.2rem;align-items:center}.saya-nav a{font-size:1rem;letter-spacing:.03em}.saya-brand{justify-self:center}.saya-brand img{width:150px;height:auto;border-radius:0;box-shadow:none}.saya-actions{justify-self:end}.icon-link{font-size:1.55rem;line-height:1}.home-page .theme-toggle{border:1px solid rgba(255,255,255,.55);background:transparent;color:inherit}
.home-page .menu-toggle{display:none;color:inherit;border-color:rgba(255,255,255,.45)}
.home-page.header-scrolled .site-header.home-hero-header{background:#fff;box-shadow:0 8px 28px rgba(0,0,0,.08)}
.home-page.header-scrolled .saya-nav-wrap{color:#141414;padding:1.1rem 0}.home-page.header-scrolled .theme-toggle{border-color:var(--line);color:var(--text)}
.home-page.header-scrolled .promo-bar{display:none}.home-page.header-scrolled .site-header.home-hero-header{top:0}
.hero-slider-shell.full-bleed{width:100vw;max-width:none;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.saya-home-hero{padding:0}.hero-slider-reference{position:relative;height:min(50vw,920px);min-height:560px;max-height:980px;background:#ece7df}.hero-slider-reference .hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .45s ease}.hero-slider-reference .hero-slide.active{opacity:1}.hero-slider-reference .hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center center}.hero-dots-overlay{position:absolute;left:50%;bottom:2.1rem;transform:translateX(-50%);display:flex;gap:.8rem;z-index:3}.hero-slider-reference .hero-dot{width:13px;height:13px;border-radius:50%;background:rgba(255,255,255,.72);border:none}.hero-slider-reference .hero-dot.active{background:#fff}
.home-page main{padding-top:0}.home-page .section:first-of-type{padding-top:3.5rem}
.about-page .page-banner img,.cart-page .page-banner img,.contact-page .page-banner img,.shop-page .page-banner img{object-fit:cover}
.our-values-section{padding:3.5rem 0 0}.values-showcase{position:relative;aspect-ratio:16/9;border:1px solid var(--line);background:var(--panel);overflow:hidden;border-radius:0}.values-slide{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;opacity:0;transition:opacity .45s ease}.values-slide.active{opacity:1;z-index:1}.values-copy{padding:3.2rem 3rem 2.5rem;display:flex;flex-direction:column;justify-content:center}.values-copy h4{font-size:2rem;margin:.2rem 0 1rem;letter-spacing:.02em}.values-copy p{line-height:1.75;color:var(--muted);margin:0 0 1rem}.values-visual img{width:100%;height:100%;object-fit:cover}.values-dots{position:absolute;left:3rem;bottom:1.5rem;display:flex;gap:.55rem;z-index:2}.value-dot{width:11px;height:11px;border:none;border-radius:50%;background:rgba(184,154,87,.35)}.value-dot.active{background:#b89a57}
.section-head .eyebrow,.eyebrow{color:#b89a57;letter-spacing:.18em;font-size:.74rem}
.site-footer{background:#171717;color:#f5efe5}.site-footer a{color:#f5efe5}.footer-bottom{border-top:1px solid rgba(255,255,255,.12)}
.category-card,.panel,.policy-item,.cart-item{border-radius:0}.product-card-minimal .listing-price strong{font-size:1.12rem;font-weight:400}.product-card-minimal h3{font-size:1.02rem;font-weight:400;color:#4d4d4d}
@media (max-width: 991px){
  .promo-inner{grid-template-columns:1fr;gap:.2rem;padding:.45rem 0;text-align:center}.promo-right,.promo-center{justify-self:center}
  .home-page .menu-toggle{display:inline-flex}
  .home-page .site-header.home-hero-header .nav-wrap{grid-template-columns:auto 1fr auto auto}
  .home-page .saya-brand{justify-self:start}.home-page .saya-brand img{width:108px}
  .home-page .saya-nav{position:absolute;left:1rem;right:1rem;top:100%;background:#fff;color:#141414;padding:1rem;display:none;flex-direction:column;gap:1rem;box-shadow:0 10px 30px rgba(0,0,0,.12)}
  .home-page #mainNav.open{display:flex}
  .hero-slider-reference{height:52vw;min-height:0;aspect-ratio:2/1}
  .values-showcase{aspect-ratio:auto}.values-slide{position:relative;grid-template-columns:1fr;display:none}.values-slide.active{display:grid}.values-copy{padding:1.5rem}.values-dots{left:1.5rem}
}

/* v18 reference cleanup */
:root{
  --brand-cream:#ece7df;
  --brand-cream-2:#f4efe7;
  --brand-brown:#7b6242;
  --brand-brown-dark:#3d3429;
  --panel:#ffffff;
  --text:#1f1b17;
  --muted:#75695a;
  --line:#ddd4c8;
  --bg:#ffffff;
  --bg-soft:#f6f1e8;
}
body{background:#fff;color:var(--text)}
.site-header{background:#fff;border-bottom:1px solid #ece3d7;backdrop-filter:none}
.promo-bar{background:#171717;color:#f7f2ea;font-size:.92rem;letter-spacing:.01em}
.promo-inner{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0}
.inner-nav-wrap,.saya-nav-wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:1.15rem 0;color:var(--brand-brown-dark);gap:1rem}
.compact-brand img,.saya-brand img{width:96px;height:auto;border-radius:0;box-shadow:none}
.saya-nav{justify-self:start;display:flex;gap:2.2rem;align-items:center}
.saya-nav a,.nav-item>a{padding:0;background:none;border-radius:0;color:inherit;font-size:1rem;letter-spacing:.03em}
.saya-nav a.active,.saya-nav a:hover,.nav-item>a:hover{background:none;color:var(--brand-brown);text-decoration:none}
.saya-actions{justify-self:end;display:flex;align-items:center;gap:1.2rem}
.icon-link{font-size:0;color:inherit}
.icon-svg-link img{width:28px;height:28px;display:block;filter: sepia(1) saturate(0.5) hue-rotate(350deg) brightness(.72)}
.theme-toggle{border:1px solid var(--line);background:#fff;color:var(--brand-brown-dark);padding:.5rem .8rem;border-radius:999px}
.menu-toggle{display:none}
.home-page .site-header{position:fixed;left:0;right:0;top:0;background:transparent;border-bottom:none}
.home-page .saya-nav-wrap{color:#fff;padding:1rem 0}
.home-page .compact-brand img{width:96px}
.home-page .theme-toggle{border-color:rgba(255,255,255,.55);background:transparent;color:#fff}
.home-page .icon-svg-link img{filter:brightness(0) invert(1)}
.home-page .promo-bar{background:rgba(17,17,17,.86)}
.home-page.header-scrolled .site-header{background:#fff;border-bottom:1px solid #ece3d7}
.home-page.header-scrolled .saya-nav-wrap{color:var(--brand-brown-dark);padding:1.15rem 0}
.home-page.header-scrolled .theme-toggle{background:#fff;color:var(--brand-brown-dark);border-color:var(--line)}
.home-page.header-scrolled .icon-svg-link img{filter: sepia(1) saturate(0.5) hue-rotate(350deg) brightness(.72)}
.home-page.header-scrolled .promo-bar{display:none}
.hero-slider-reference{height:min(50vw,900px);min-height:0;aspect-ratio:2/1;background:var(--brand-cream)}
.hero-slider-reference .hero-slide img{object-fit:cover}
.hero-dots-overlay{bottom:1.2rem}
.page-banner{margin-bottom:1.6rem;border-radius:0;box-shadow:none;border:none}
.page-banner img{width:100%;aspect-ratio:27/5;object-fit:cover}
.home-promo-slider{border-radius:0;box-shadow:none;border:none;background:transparent}
.home-promo-slide{aspect-ratio:27/5}
.home-promo-slide::after,.home-promo-copy{display:none!important}
.home-promo-dots{position:absolute;left:50%;transform:translateX(-50%);right:auto;bottom:1rem;display:flex;gap:.45rem;z-index:3}
.home-promo-dot{width:10px;height:10px;border:none;border-radius:999px;background:rgba(255,255,255,.55)}
.home-promo-dot.active{width:28px;background:#fff}
.site-footer{background:var(--brand-cream);color:var(--brand-brown-dark);border-top:none}
.site-footer a{color:var(--brand-brown-dark)}
.footer-bottom{border-top:1px solid rgba(61,52,41,.14);color:#75695a}
.footer-grid{padding:42px 20px}
.brand img{box-shadow:none}
.feature-strip{background:var(--brand-cream-2);border-top:1px solid rgba(61,52,41,.08);border-bottom:1px solid rgba(61,52,41,.08)}
.feature-strip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:28px 20px}
.feature-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.85rem;color:var(--brand-brown-dark);min-height:118px;text-align:center}
.feature-item img{width:34px;height:34px;filter: sepia(1) saturate(0.5) hue-rotate(350deg) brightness(.72)}
.feature-item span{font-size:1.05rem}
.policy-page-content{padding:2rem;background:#fff;border-radius:0;box-shadow:none}
.policy-page-content h2{font-size:1.2rem;margin:1.6rem 0 .6rem}
.policy-page-content ul{padding-left:1.2rem}
.policy-link-head{display:flex;align-items:center;justify-content:space-between}
.policy-page-link{color:var(--brand-brown);font-weight:600}
.policy-link-item .policy-body{display:block}
.saya-nav .submenu,.nav-item .submenu{background:#fff;border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.08)}
.values-showcase{aspect-ratio:16/9;background:var(--brand-cream)}
.values-slide{grid-template-columns:1fr 1.15fr}
.values-visual img{width:100%;height:100%;object-fit:cover}
.product-media .slide-btn,.slide-btn{background:rgba(255,255,255,.88);color:var(--brand-brown-dark);border:1px solid rgba(123,98,66,.18)}
.slide-btn:hover{background:#fff}
.image-cart-btn{background:rgba(255,255,255,.92);color:var(--brand-brown-dark)}
.product-card-minimal h3{font-size:1.02rem;font-weight:400;color:#4d4d4d}
.product-card-minimal .listing-price strong{font-size:1.12rem;font-weight:400}
.arrival-chip,.partner-chip,.category-card,.panel,.cart-item,.policy-item{border-radius:0}
@media (max-width:1000px){.footer-grid{grid-template-columns:1fr 1fr}.product-grid.four-col{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-strip-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){
  .feature-strip-grid{grid-template-columns:1fr 1fr}
  .promo-bar{font-size:.8rem}
  .inner-nav-wrap,.saya-nav-wrap{grid-template-columns:auto 1fr auto;gap:.8rem;padding:1rem 0}
  .compact-brand img,.saya-brand img,.home-page .compact-brand img{width:88px}
  .home-page .site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid #ece3d7}
  .home-page .saya-nav-wrap{color:var(--brand-brown-dark)}
  .home-page .theme-toggle{color:var(--brand-brown-dark);border-color:var(--line)}
  .home-page .icon-svg-link img{filter: sepia(1) saturate(0.5) hue-rotate(350deg) brightness(.72)}
}


/* === V19 header, footer, dark mode refresh === */
:root{
  --brand-cream:#f5f1ea;
  --brand-cream-light:#fbf8f3;
  --brand-cream-deep:#ece4d8;
  --brand-brown:#6f5843;
  --brand-brown-dark:#4f3d2c;
}
body{
  background:var(--bg);
}
body[data-theme="dark"]{
  --bg:#171310;
  --bg-soft:#231d19;
  --panel:#201915;
  --text:#f7f0e8;
  --muted:#c7b6a4;
  --line:#3a2f27;
  --blue:#d6c0a8;
  --pink:#b89267;
  --purple:#8b6b4d;
  --shadow:0 22px 60px rgba(0,0,0,.42);
}
body[data-theme="dark"] .site-header,
body[data-theme="dark"] .site-footer,
body[data-theme="dark"] .feature-strip-grid,
body[data-theme="dark"] .panel,
body[data-theme="dark"] .product-card,
body[data-theme="dark"] .category-card,
body[data-theme="dark"] .assistant-panel,
body[data-theme="dark"] .side-panel,
body[data-theme="dark"] .toolbar,
body[data-theme="dark"] .checkout-card,
body[data-theme="dark"] .page-banner,
body[data-theme="dark"] .summary-box{
  background:var(--panel);
  color:var(--text);
  border-color:var(--line);
}
body[data-theme="dark"] .theme-toggle,
body[data-theme="dark"] .menu-toggle,
body[data-theme="dark"] .icon-link,
body[data-theme="dark"] .feature-item{
  background:color-mix(in srgb,var(--panel) 96%, transparent);
  color:var(--text);
  border-color:var(--line);
}
body[data-theme="dark"] .feature-strip{
  background:transparent;
}
.promo-bar{display:none !important;}
.site-header{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(111,88,67,.12);
  backdrop-filter:none;
}
.home-page .site-header{
  position:fixed;
  left:0; right:0; top:0;
  background:transparent;
  border-bottom:none;
}
.home-page.header-scrolled .site-header{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(111,88,67,.12);
}
.home-page .saya-nav-wrap,
.home-page .nav-wrap,
.inner-page-header .saya-nav-wrap,
.inner-page-header .nav-wrap{
  width:min(1240px, calc(100% - 2rem));
  margin-inline:auto;
  padding:.95rem 0;
  display:flex;
  align-items:center;
  gap:1rem;
}
.brand img,
.saya-brand img,
.compact-brand img{
  width:38px !important;
  height:38px !important;
  border-radius:10px;
  box-shadow:none;
}
.saya-brand{display:flex;align-items:center;gap:.7rem;order:1;}
#mainNav{
  display:flex;
  align-items:center;
  gap:.35rem;
  flex:1;
  justify-content:center;
  order:2;
}
#mainNav a{
  color:var(--brand-brown-dark);
  padding:.55rem .82rem;
  border-radius:999px;
  font-size:.95rem;
  letter-spacing:.01em;
}
#mainNav a.active,
#mainNav a:hover{
  background:rgba(111,88,67,.09);
  color:var(--brand-brown-dark);
}
.nav-actions{
  order:3;
  display:flex;
  align-items:center;
  gap:.6rem;
}
.icon-link,
.theme-toggle,
.menu-toggle{
  border:1px solid rgba(111,88,67,.14);
  background:rgba(255,255,255,.92);
  color:var(--brand-brown-dark);
}
.icon-svg-link img,
.feature-item img,
.footer-social-links img{
  filter:brightness(0) saturate(100%) invert(26%) sepia(15%) saturate(727%) hue-rotate(349deg) brightness(91%) contrast(84%);
}
body[data-theme="dark"] .icon-svg-link img,
body[data-theme="dark"] .feature-item img,
body[data-theme="dark"] .footer-social-links img{
  filter:brightness(0) saturate(100%) invert(91%) sepia(20%) saturate(305%) hue-rotate(338deg) brightness(105%) contrast(92%);
}
.home-page:not(.header-scrolled) #mainNav a,
.home-page:not(.header-scrolled) .theme-toggle{
  color:#fff;
}
.home-page:not(.header-scrolled) #mainNav a.active,
.home-page:not(.header-scrolled) #mainNav a:hover{
  background:rgba(255,255,255,.14);
  color:#fff;
}
.home-page:not(.header-scrolled) .theme-toggle,
.home-page:not(.header-scrolled) .icon-link{
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.18);
}
.home-page:not(.header-scrolled) .icon-svg-link img{
  filter:brightness(0) saturate(100%) invert(100%);
}
.home-page:not(.header-scrolled) .menu-toggle{color:#fff;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);}
.home-page .hero-slider-section{padding-top:0}
.home-page .hero-slider-reference,
.home-page .hero-slider{
  border:none;
  box-shadow:none;
}
.hero-slide::after{
  background:linear-gradient(90deg,rgba(10,10,10,.34) 0%,rgba(10,10,10,.16) 35%,rgba(10,10,10,.06) 100%);
}
.site-footer{
  margin-top:0;
  background:var(--brand-cream-deep);
  border-top:1px solid rgba(111,88,67,.12);
}
body[data-theme="dark"] .site-footer{background:#1b1512;}
.feature-strip{
  background:transparent;
  margin-top:0;
  padding:0;
  position:relative;
  z-index:1;
}
.feature-strip-grid{
  width:min(70%, 1120px);
  background:var(--brand-cream-light);
  border:1px solid rgba(111,88,67,.10);
  border-bottom:none;
  border-radius:24px 24px 0 0;
  margin:0 auto -1px auto;
  padding:1rem 1.1rem;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.5rem;
}
.feature-item{
  min-height:auto;
  padding:.55rem .9rem;
  border:none;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.65rem;
  color:var(--brand-brown-dark);
  font-weight:500;
}
.feature-item span{white-space:nowrap;}
.feature-item img{width:28px;height:28px;}
.footer-grid{padding-top:2.1rem;}
@media (max-width:980px){
  .feature-strip-grid{width:min(92%,1120px);grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .feature-strip-grid{width:100%;border-radius:0;grid-template-columns:1fr 1fr;padding:.75rem}
  #mainNav{display:none}
  #mainNav.open{display:flex;position:absolute;left:1rem;right:1rem;top:100%;background:var(--panel);border:1px solid var(--line);border-radius:1rem;padding:.8rem;flex-direction:column;box-shadow:var(--shadow)}
  .menu-toggle{display:inline-flex}
}


/* v20 requested updates */
.feature-strip-grid{
  width:100%;
  max-width:none;
}
@media (max-width:980px){
  .feature-strip-grid{width:100%;}
}
@media (max-width:760px){
  .feature-strip-grid{
    width:100%;
    border-radius:18px 18px 0 0;
    grid-template-columns:repeat(2,1fr);
    padding:.85rem .7rem;
  }
  .feature-item{
    justify-content:flex-start;
    padding:.55rem .35rem;
  }
  .feature-item span{
    white-space:normal;
    line-height:1.2;
    font-size:.92rem;
  }
}
.assistant-toggle{
  background:linear-gradient(135deg,#8a6a52,#d4c1ac);
  border:1px solid rgba(111,88,67,.18);
}
.assistant-toggle img{
  width:28px;
  height:28px;
}
.assistant-title-icon{
  width:20px;
  height:20px;
  display:inline-block;
  vertical-align:middle;
  margin-right:.35rem;
}
.assistant-quick-faq{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.assistant-chip{
  border:1px solid var(--line);
  background:var(--bg-soft);
  color:var(--text);
  border-radius:999px;
  padding:.45rem .75rem;
  cursor:pointer;
}
.scroll-top-btn{
  position:fixed;
  right:1.2rem;
  bottom:10.9rem;
  width:48px;
  height:48px;
  border:none;
  border-radius:50%;
  background:var(--brand-brown-dark, #6f5843);
  color:#fff;
  box-shadow:var(--shadow);
  z-index:60;
  display:none;
  cursor:pointer;
  font-size:1.5rem;
  line-height:1;
}
.scroll-top-btn.show{display:block;}
body[data-theme="dark"] .scroll-top-btn{
  background:#d4c1ac;
  color:#1b1512;
}


/* v21 header footer includes + menu cleanup */
.topbar-brand{display:flex;align-items:center;gap:.75rem;justify-self:center}
.topbar-brand img{width:44px;height:44px;border-radius:12px;box-shadow:none}
.topbar-brand strong{display:block;font-size:1rem;line-height:1.05;font-weight:700}
.topbar-brand span{display:block;font-size:.82rem;color:var(--muted)}
.saya-nav{flex-wrap:wrap;justify-content:flex-start;gap:1.25rem}
.saya-nav a{position:relative;padding:.35rem .1rem;border-radius:0;text-transform:none}
.saya-nav a::after,.arrival-chip::after,.product-card-minimal .product-media::after,.category-card::after{content:'';position:absolute;inset:-2px;border-radius:inherit;box-shadow:0 0 0 0 rgba(184,154,87,0);transition:box-shadow .22s ease;pointer-events:none}
.saya-nav a:hover::after,.arrival-chip:hover::after,.product-card-minimal:hover .product-media::after,.category-card:hover::after{box-shadow:0 0 0 1px rgba(184,154,87,.52),0 0 22px rgba(184,154,87,.32)}
.arrival-chip{position:relative}.category-card{position:relative;overflow:hidden}.product-card-minimal .product-media{position:relative;overflow:hidden}
.nav-actions{gap:.85rem}
.icon-svg-link,.cart-link{display:inline-flex;align-items:center;justify-content:center}
.icon-svg-link img,.cart-link img{width:27px;height:27px;object-fit:contain;filter:none}
.home-page:not(.header-scrolled) .icon-svg-link img,.home-page:not(.header-scrolled) .cart-link img{filter:brightness(0) invert(1)}
.home-page.header-scrolled .icon-svg-link img,.cart-page .icon-svg-link img,.about-page .icon-svg-link img,.contact-page .icon-svg-link img,.shop-page .icon-svg-link img,.product-page .icon-svg-link img,.policy-page .icon-svg-link img{filter:none}
.feature-strip{padding:0}.feature-strip .container{width:min(1180px,calc(100% - 2rem));max-width:100%}.feature-strip-grid{width:100%;max-width:none;margin:0;padding:0;border-radius:0;border-left:none;border-right:none}
@media (max-width: 991px){
  .saya-nav-wrap,.inner-nav-wrap{grid-template-columns:auto 1fr auto auto;align-items:center}
  .topbar-brand{order:2;justify-self:center;margin-inline:auto}
  .saya-nav{display:none}
  .saya-nav.open{display:flex;position:absolute;left:1rem;right:1rem;top:calc(100% + .35rem);padding:1rem;background:var(--panel);border:1px solid var(--line);z-index:60;flex-direction:column;align-items:flex-start;gap:.8rem}
  .menu-toggle{display:inline-flex;order:4}
  .nav-actions{order:3}
  .feature-strip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* Create account / Favourite / Login move out of the header icon row on narrower screens
     (extra icons plus the hamburger no longer fit in one row) and into the hamburger's own
     dropdown instead - see .mobile-nav-icons below, built by buildTopMenu() in js/app.js. */
  .nav-actions .header-optional-icon{display:none}
}
/* Create account / Favourite / Login, as rows inside the hamburger's dropdown - hidden on
   desktop (where the icon-row versions above already cover them), shown only in the mobile
   menu once it's open. Reuses the same [data-feature-icon] hook, so renderHeaderIcons()/
   wireHeaderIcons() in js/app.js show/hide + click-wire these automatically, no extra JS. */
.mobile-nav-icons{display:none}
.mobile-nav-icon-link{display:flex;align-items:center;gap:.65rem;width:100%;padding:.55rem 0;background:none;border:0;font:inherit;font-size:1rem;color:inherit;cursor:pointer;text-align:left}
.mobile-nav-icon-link img{width:20px;height:20px;flex:0 0 20px;filter:brightness(0) saturate(100%) invert(26%) sepia(15%) saturate(727%) hue-rotate(349deg) brightness(91%) contrast(84%)}
body[data-theme="dark"] .mobile-nav-icon-link img{filter:brightness(0) saturate(100%) invert(91%) sepia(20%) saturate(305%) hue-rotate(338deg) brightness(105%) contrast(92%)}
@media (max-width: 991px){
  .mobile-nav-icons{display:flex;flex-direction:column;gap:0;width:100%;margin-top:.6rem;padding-top:.6rem;border-top:1px solid var(--line)}
}

/* v22 requested updates */
.nav-item.has-submenu{position:relative;display:flex;align-items:center}.nav-item.has-submenu>a{display:flex;align-items:center;gap:.35rem}.nav-arrow{font-size:.82em;line-height:1}.shop-submenu{position:absolute;top:calc(100% + .35rem);left:0;min-width:240px;padding:.8rem;background:rgba(255,252,247,.98);border:1px solid rgba(107,84,69,.14);box-shadow:0 20px 40px rgba(70,52,37,.12);display:none;flex-direction:column;gap:.2rem;z-index:80}.nav-item.has-submenu:hover .shop-submenu,.nav-item.has-submenu:focus-within .shop-submenu{display:flex}.shop-submenu a{border-radius:999px;padding:.55rem .8rem}
.product-status-badge{position:absolute;left:.8rem;bottom:.8rem;z-index:3;padding:.36rem .72rem;border-radius:999px;font-size:.77rem;font-weight:600;background:rgba(255,250,243,.94);color:#4f3f33;box-shadow:0 10px 24px rgba(62,44,30,.12)}.product-status-badge.status-hot{background:rgba(121,81,51,.9);color:#fff}.product-status-badge.status-low{background:rgba(255,244,218,.96);color:#8b5b16}.product-status-badge.status-out{background:rgba(65,54,48,.92);color:#fff}.product-card-minimal.is-sold-out .product-media img{filter:grayscale(.18) brightness(.9)}.image-cart-btn[disabled]{opacity:.45;cursor:not-allowed}
.feature-strip{background:#f4efe8}.feature-strip-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;justify-items:center;text-align:center;width:100%;padding:1.35rem 1rem;margin:0}.feature-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;color:var(--brand-brown-dark);min-height:126px}.feature-item img{width:40px;height:40px}.feature-item span{display:block}
.footer-contact p{display:grid;gap:.7rem}.footer-contact-line{display:flex;align-items:center;gap:.6rem}.footer-contact-line img{width:18px;height:18px;flex:0 0 18px}
#mainNav>a,#mainNav .nav-item>a{position:relative}
.arrival-chip,.category-card,.product-card-minimal .product-media,#mainNav>a,#mainNav .nav-item>a{transition:box-shadow .22s ease,transform .22s ease,border-color .22s ease}
.arrival-chip:hover,.category-card:hover,.product-card-minimal:hover .product-media,#mainNav>a:hover,#mainNav .nav-item>a:hover{box-shadow:0 0 0 1px rgba(184,154,87,.52),0 0 22px rgba(184,154,87,.32)}
@media (max-width: 900px){.feature-strip-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:1rem .35rem}.feature-item{min-height:96px}.shop-submenu{position:static;display:flex;background:transparent;border:none;box-shadow:none;padding:.35rem 0 0}.nav-item.has-submenu{flex-direction:column;align-items:flex-start;width:100%}.nav-item.has-submenu>a{width:100%}}
body[data-theme="dark"] .feature-strip{background:#241c18}.feature-strip .container{width:min(1180px,calc(100% - 2rem));max-width:100%}
body[data-theme="dark"] .shop-submenu{background:rgba(28,20,17,.98);border-color:rgba(255,255,255,.08)}
body[data-theme="dark"] .product-status-badge{background:rgba(37,28,22,.95);color:#f5eadf}body[data-theme="dark"] .product-status-badge.status-hot{background:#805a35}body[data-theme="dark"] .product-status-badge.status-low{background:#5d4721;color:#fff3dc}body[data-theme="dark"] .product-status-badge.status-out{background:#4d4037}

/* v23 banner text removal */
.page-banner .banner-copy, .hero-slide-content, .home-promo-copy, .banner-caption, .hero-caption {display:none !important;}


/* v24 targeted fixes */
.shop-submenu .submenu-link{color:var(--brand-brown-dark)!important;opacity:1!important}
.home-page:not(.header-scrolled) .shop-submenu .submenu-link{color:var(--brand-brown-dark)!important}
.shop-submenu .submenu-link:hover{background:rgba(184,154,87,.12);color:var(--brand-brown-dark)!important}
.feature-strip{background:#f7f3ed}
.feature-strip .container{width:min(1180px,calc(100% - 2rem));max-width:100%}
.feature-strip-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;justify-items:center;justify-content:center;text-align:center;width:100%;max-width:100%;margin:0 auto;padding:.9rem 1rem}
.feature-item{min-height:86px;justify-self:center;text-align:center}
.feature-item span{display:block;text-align:center}
.category-card,.arrival-chip,.product-card-minimal .product-media{border-radius:10px!important}
.category-card img,.arrival-chip img,.product-card-minimal .product-media img{border-radius:inherit}
.product-status-badge.status-right{left:auto;right:.8rem;top:.8rem;bottom:auto}
.product-card-minimal .product-media::after,.category-card::after,.arrival-chip::after{border-radius:10px}
@media (max-width: 900px){
  .feature-strip-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:.75rem .35rem}
  .feature-item{min-height:78px}
}


/* v25 targeted updates */
.home-page:not(.header-scrolled) #mainNav .shop-submenu,
.home-page:not(.header-scrolled) #mainNav .shop-submenu a,
.home-page:not(.header-scrolled) #mainNav .shop-submenu .submenu-link{
  color: var(--brand-brown-dark) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
.home-page:not(.header-scrolled) #mainNav .shop-submenu{
  background: rgba(255,252,247,.98) !important;
  border-color: rgba(107,84,69,.16) !important;
}
.home-page:not(.header-scrolled) #mainNav .shop-submenu a:hover,
.home-page:not(.header-scrolled) #mainNav .shop-submenu .submenu-link:hover{
  background: rgba(184,154,87,.12) !important;
  color: var(--brand-brown-dark) !important;
}
.feature-strip{
  background:#f7f3ed;
  padding:0;
}
.feature-strip .container{
  width:min(1180px,calc(100% - 2rem));
  max-width:100%;
  margin-inline:auto;
  display:flex;
  justify-content:center;
}
.feature-strip-grid{
  width:100%;
  max-width:100%;
  margin:0 auto;
  padding:.62rem .9rem;
  gap:.15rem;
  align-items:center;
  justify-items:center;
  text-align:center;
}
.feature-item{
  width:100%;
  min-height:60px;
  justify-content:center;
  text-align:center;
  gap:.35rem;
}
.feature-item img{
  width:32px;
  height:32px;
}
.feature-item span{
  text-align:center;
  line-height:1.15;
}
@media (max-width:900px){
  .feature-strip-grid{padding:.55rem .45rem;}
  .feature-item{min-height:56px;}
  .feature-item img{width:28px;height:28px;}
}
@media (max-width:760px){
  .feature-strip .container{width:100%;}
  .feature-strip-grid{padding:.55rem .4rem;grid-template-columns:repeat(2,minmax(0,1fr));}
  .feature-item{min-height:52px;}
}


/* v28 home shop submenu visibility fix */
.home-page:not(.header-scrolled) #mainNav .nav-item.has-submenu{position:relative}
.home-page:not(.header-scrolled) #mainNav .shop-submenu{
  display:none;
  background:rgba(255,252,247,.98)!important;
  border:1px solid rgba(107,84,69,.16)!important;
  box-shadow:0 20px 40px rgba(70,52,37,.12)!important;
}
.home-page:not(.header-scrolled) #mainNav .nav-item.has-submenu:hover .shop-submenu,
.home-page:not(.header-scrolled) #mainNav .nav-item.has-submenu:focus-within .shop-submenu{
  display:flex!important;
}
.home-page:not(.header-scrolled) #mainNav .shop-submenu a,
.home-page:not(.header-scrolled) #mainNav .shop-submenu .submenu-link{
  color:var(--brand-brown-dark)!important;
  opacity:1!important;
  -webkit-text-fill-color:var(--brand-brown-dark)!important;
  text-shadow:none!important;
  font-weight:500;
}
.home-page:not(.header-scrolled) #mainNav .shop-submenu a:hover,
.home-page:not(.header-scrolled) #mainNav .shop-submenu .submenu-link:hover{
  color:var(--brand-brown-dark)!important;
  background:rgba(184,154,87,.12)!important;
}


/* v29 minimal tweaks */
.product-card-minimal .product-info.minimal{padding:.62rem 0 0}
.product-card-minimal h3{margin:0 0 .12rem}
.product-card-minimal .listing-price{gap:.45rem;margin-top:0}
.product-card-minimal .listing-price strong,.product-card-minimal .listing-price del{line-height:1.1}
.detail-description h3{margin:0 0 .55rem}
.detail-description{margin-bottom:1rem}
.detail-checkout-btn{margin-top:.25rem}
.assistant-toggle{display:flex;align-items:center;justify-content:center}
.assistant-style-text{font-size:.92rem;font-weight:800;letter-spacing:.01em;color:#fff}


/* v30 toggles, counts, spacing, announcement */
.cart-link{position:relative;display:inline-flex;align-items:center;justify-content:center}
.cart-link img{width:28px;height:28px}
.cart-count-badge{position:absolute;top:-6px;right:-9px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--brand-brown);color:#fff;font-size:.72rem;line-height:18px;text-align:center;font-weight:700;display:none}
.cart-count-badge.show{display:inline-block}
.product-card-minimal .product-info.minimal{padding:.6rem 0 0;display:grid;gap:0}
.product-card-minimal h3{margin:0;line-height:1.25}
.product-card-minimal .listing-price{margin-top:0;padding-top:0}
.product-card-minimal .listing-price strong,.product-card-minimal .listing-price del{margin:0;line-height:1.15}
.float-stack{position:fixed;right:1.2rem;bottom:1.2rem;display:flex;flex-direction:column;align-items:center;gap:.7rem;z-index:60}
.arrival-float{position:static;order:1}
.assistant-toggle{position:static;order:2}
.float-close-btn{position:absolute;top:-.15rem;right:-.15rem;width:24px;height:24px;border:none;border-radius:50%;background:var(--panel);color:var(--text);box-shadow:var(--shadow);cursor:pointer;z-index:2}
.assistant-toggle,.arrival-float{width:64px;height:64px;border:1px solid transparent}
.section-cta-btn{min-width:180px;border-radius:999px;padding:.85rem 1.35rem}
.sale-timer-bar{background:#111;color:#fff;border:none;border-radius:1rem;padding:.85rem 1.2rem;margin:0 0 1.5rem}
.sale-timer-inner{display:flex;align-items:center;justify-content:center;gap:1.75rem;flex-wrap:wrap;text-align:center}
.sale-timer-title{font-size:1.5rem;font-weight:800;letter-spacing:.01em}
.sale-timer-countdown{display:flex;gap:2rem;align-items:center;justify-content:center}
.sale-timer-countdown span{display:flex;flex-direction:column;align-items:center;line-height:1}
.sale-timer-countdown b{font-size:2rem;font-weight:800}
.sale-timer-countdown small{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.82)}
@media (max-width: 900px){.sale-timer-inner{gap:.8rem}.sale-timer-title{font-size:1.05rem}.sale-timer-countdown{gap:1rem}.sale-timer-countdown b{font-size:1.35rem}.float-stack{right:.8rem;bottom:.8rem}}


/* v31 floating + announcements */
.page-announcement{margin:0 0 1rem}
.feature-strip-grid{justify-content:center!important}
.feature-item{justify-items:center;align-content:center}
.feature-item-inner{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.assistant-toggle{display:flex!important;align-items:center;justify-content:center;bottom:1.2rem;z-index:62;background:linear-gradient(135deg,var(--brand-brown-dark),var(--brand-brown));color:#fff;border:1px solid rgba(255,255,255,.28)}
.assistant-style-text{font-size:.92rem;font-weight:800;letter-spacing:.01em}
.arrival-float{bottom:6rem;z-index:63}
.float-stack{position:fixed;right:1.2rem;bottom:1.2rem;display:flex;flex-direction:column;gap:.85rem;z-index:63}
.product-card-minimal .product-info.minimal{padding:.48rem 0 0;display:grid;gap:0}
.product-card-minimal h3{margin:0;line-height:1.08}.product-card-minimal .listing-price{margin-top:0;gap:.35rem}
#mainNav > a:hover,#mainNav .nav-item > a:hover,#mainNav > a:focus-visible,#mainNav .nav-item > a:focus-visible{background:rgba(184,154,87,.16);border-radius:999px;padding-inline:1rem}
.shop-submenu a,.shop-submenu .submenu-link{display:block}
.shop-submenu a:hover,.shop-submenu .submenu-link:hover{background:rgba(184,154,87,.14);border-radius:999px}
.category-card:hover,.arrival-chip:hover,.product-card-minimal:hover .product-media{box-shadow:0 0 0 1px rgba(184,154,87,.6),0 0 28px rgba(184,154,87,.38),0 18px 44px rgba(70,52,37,.12)}
.product-card-minimal:active .product-media,.product-card-minimal:focus-within .product-media{box-shadow:0 0 0 2px rgba(184,154,87,.75),0 0 34px rgba(184,154,87,.45),0 18px 50px rgba(70,52,37,.16)}
.home-page:not(.header-scrolled) #mainNav .shop-submenu{min-width:260px}
.home-page:not(.header-scrolled) #mainNav .shop-submenu a,.home-page:not(.header-scrolled) #mainNav .shop-submenu .submenu-link{display:block;color:var(--brand-brown-dark)!important;background:transparent!important}
.home-page:not(.header-scrolled) #mainNav .shop-submenu a:hover,.home-page:not(.header-scrolled) #mainNav .shop-submenu .submenu-link:hover{background:rgba(184,154,87,.16)!important;border-radius:999px}
@media (max-width:900px){.float-stack{right:1rem;bottom:1rem;gap:.7rem}}

.float-stack{position:fixed;right:1.2rem;bottom:1.2rem;display:flex;flex-direction:column;gap:.8rem;z-index:60;align-items:flex-end}
.arrival-float,.assistant-toggle{position:static}
.assistant-toggle{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--blue),var(--pink));color:#fff;font-weight:800}
.assistant-style-text{font-size:.95rem;line-height:1}
.product-card-minimal{transition:transform .22s ease}
.product-card-minimal:hover{transform:translateY(-6px)}
.image-cart-btn{position:absolute;right:.8rem;bottom:.8rem;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:visible}
.image-cart-btn .inline-cart-count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;border-radius:999px;background:var(--brand-brown);color:#fff;font-size:.72rem;line-height:20px;text-align:center;font-weight:700;display:none;padding:0 4px}
.image-cart-btn .inline-cart-count.show{display:block}
.image-cart-btn .image-checkout-pill,.image-cart-btn .image-clear-pill{position:absolute;left:50%;transform:translateX(-50%);background:rgba(255,250,243,.98);color:var(--brand-brown);border:1px solid rgba(184,154,87,.5);padding:.28rem .7rem;border-radius:999px;font-size:.72rem;font-weight:700;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .18s ease, transform .18s ease;box-shadow:0 8px 18px rgba(62,44,30,.10)}
.image-cart-btn .image-checkout-pill{bottom:calc(100% + 8px)}
.image-cart-btn .image-clear-pill{bottom:calc(100% + 40px)}
.image-cart-btn .image-checkout-pill.show,.image-cart-btn .image-clear-pill.show{opacity:1;pointer-events:auto}
.image-cart-btn .image-checkout-pill.show{transform:translateX(-50%) translateY(-2px)}
.image-cart-btn .image-clear-pill.show{transform:translateX(-50%) translateY(-2px)}
.image-cart-btn .cart-icon-glyph{font-size:1.05rem}
.checkout-top-link{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .85rem;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-weight:600}
.checkout-count-badge{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--brand-brown);color:#fff;font-size:.72rem;line-height:18px;text-align:center;font-weight:700;display:none}
.checkout-count-badge.show{display:inline-block}
.cart-toast{position:fixed;left:50%;bottom:1.4rem;transform:translateX(-50%) translateY(20px);background:rgba(44,34,26,.94);color:#fff;padding:.8rem 1rem;border-radius:999px;box-shadow:0 18px 40px rgba(0,0,0,.18);z-index:80;opacity:0;pointer-events:none;transition:opacity .2s ease, transform .2s ease}
.cart-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media (max-width:760px){.float-stack{right:.9rem;bottom:.9rem}.checkout-top-link{padding:.5rem .72rem;font-size:.92rem}}


/* v33 checkout/logo header + floating order */
.float-stack{align-items:flex-end}
.arrival-float{order:1}
.assistant-toggle{order:2}
.checkout-page-header{padding:1.2rem 2rem .8rem;border-bottom:1px solid var(--line);background:var(--panel)}
.checkout-logo{display:inline-flex;align-items:center;gap:.8rem;color:var(--brand-brown-dark);font-weight:800;font-size:2rem}
.checkout-logo img{width:56px;height:56px;object-fit:contain}
.checkout-shell{max-width:1400px;margin:0 auto;padding:1.2rem}
.checkout-page-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.9fr);gap:1.2rem;align-items:start}
.checkout-page-main,.checkout-page-side{background:var(--panel);border:1px solid var(--line)}
.checkout-page-main{padding:1.4rem 1.4rem 2rem}
.checkout-page-side{padding:1.2rem;position:sticky;top:1rem}
.checkout-section-head{font-size:1.05rem;margin:.5rem 0 .8rem;color:var(--text)}
.inline-check{display:flex;align-items:center;gap:.55rem;font-size:.95rem;color:var(--text);margin:.4rem 0 .8rem}
.shipping-method-card{display:flex;justify-content:space-between;align-items:center;border:1px solid rgba(184,154,87,.55);background:rgba(255,250,243,.7);padding:1rem 1rem;border-radius:.75rem;margin:.2rem 0 1.2rem;font-weight:700}
.modern-checkout-form{gap:.75rem}
.modern-payment-methods{display:grid;gap:0;border:1px solid var(--line);border-radius:.8rem;overflow:hidden}
.modern-payment-methods .payment-option{margin:0;border-bottom:1px solid var(--line)}
.modern-payment-methods .payment-option:last-child{border-bottom:none}
.modern-payment-methods .payment-card{border:none;border-radius:0;padding:1rem 1rem;background:transparent}
.note-box{border:1px solid var(--line);background:var(--bg-soft);border-radius:.8rem;padding:1rem}
.shipping-note-box{margin-top:.2rem}
.checkout-pay-btn{margin-top:.3rem;background:var(--brand-brown)!important}
.checkout-offer-box{border:1px solid var(--line);background:var(--bg-soft);border-radius:.8rem;padding:1rem;margin-bottom:1rem}
.checkout-offer-box ul{margin:.6rem 0 0 1rem;padding:0}
.compact-checkout-cart .cart-item{grid-template-columns:54px 1fr auto;padding:.75rem;border-radius:.8rem}
.compact-checkout-cart .cart-item img{width:54px;height:68px;border-radius:.5rem}
.discount-row{display:flex;gap:.65rem;margin:1rem 0}
.discount-row input{flex:1;background:var(--bg-soft);border:1px solid var(--line);border-radius:.7rem;padding:.85rem .9rem}
.discount-row .btn{border-radius:.7rem;padding:.85rem 1rem}
.checkout-summary-card{display:grid;gap:.7rem}
.checkout-summary-card .total-line{padding-top:.6rem;border-top:1px solid var(--line);font-size:1.15rem}
@media (max-width: 980px){.checkout-page-grid{grid-template-columns:1fr}.checkout-page-side{position:static}.checkout-logo{font-size:1.55rem}.checkout-logo img{width:46px;height:46px}}


/* v34 targeted checkout updates */
body[data-page="cart"] .float-stack,
body[data-page="cart"] #assistantPanel,
body[data-page="cart"] #arrivalPanel{display:none!important}
body[data-page="cart"] .checkout-page-main{padding:1.6rem 1.6rem 2rem}
body[data-page="cart"] .inline-check{display:flex;align-items:center;justify-content:flex-start;gap:.7rem;margin:.35rem 0 1rem}
body[data-page="cart"] .inline-check input{width:22px;height:22px;margin:0;flex:0 0 auto}
body[data-page="cart"] .inline-check span{display:block;line-height:1.35;color:var(--text);margin:0}
body[data-page="cart"] .modern-payment-methods{border:1px solid var(--line);border-radius:1.1rem;overflow:hidden;background:var(--panel);display:block}
body[data-page="cart"] .modern-payment-methods .payment-option{display:block;padding:0;border:none;border-top:1px solid var(--line);background:var(--panel);cursor:pointer}
body[data-page="cart"] .modern-payment-methods .payment-option:first-of-type{border-top:none}
body[data-page="cart"] .modern-payment-methods .payment-option input{position:absolute;opacity:0;pointer-events:none}
body[data-page="cart"] .payment-card-row{display:flex;align-items:center;gap:1rem;padding:1.15rem 1.25rem;min-height:78px}
body[data-page="cart"] .payment-radio{width:18px;height:18px;border-radius:50%;border:2px solid #c9c9c9;display:inline-block;position:relative;flex:0 0 auto}
body[data-page="cart"] .payment-option.selected .payment-radio{border-color:#2f63d8}
body[data-page="cart"] .payment-option.selected .payment-radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:#2f63d8}
body[data-page="cart"] .payment-card-row strong{font-size:1rem;font-weight:600;color:#171717;flex:1}
body[data-page="cart"] .payment-brands{display:flex;gap:.5rem;align-items:center;margin-left:auto}
body[data-page="cart"] .brand-chip{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:34px;padding:0 .6rem;border-radius:.4rem;border:1px solid #dedede;background:#fff;font-weight:700;color:#1a3d8f;font-size:1rem}
body[data-page="cart"] .brand-chip.circles{position:relative;min-width:58px;color:transparent}
body[data-page="cart"] .brand-chip.circles::before,body[data-page="cart"] .brand-chip.circles::after{content:"";position:absolute;top:7px;width:20px;height:20px;border-radius:50%}
body[data-page="cart"] .brand-chip.circles::before{left:14px;background:#d92f27}
body[data-page="cart"] .brand-chip.circles::after{left:26px;background:#f2a53a;opacity:.95}
body[data-page="cart"] .payment-method-note{padding:1.35rem 1.5rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#f6f6f8;color:#171717;text-align:center;font-size:1rem;line-height:1.45}
body[data-page="cart"] .payment-window-note{font-size:1rem;line-height:1.55}
body[data-page="cart"] .checkout-offer-box{border:1px solid var(--line);background:var(--bg-soft);border-radius:.8rem;padding:1rem;margin-bottom:1rem;display:block}
body[data-page="cart"] .checkout-offer-box strong{display:block;margin-bottom:.55rem}
body[data-page="cart"] .checkout-offer-box ul{margin:.4rem 0 0 1rem;padding:0;display:grid;gap:.35rem}


/* v35 checkout targeted fixes */
.modern-checkout-form .inline-check{display:grid;grid-template-columns:24px 1fr;align-items:center;gap:12px;justify-content:flex-start;margin:12px 0 18px;}
.modern-checkout-form .inline-check input{margin:0;justify-self:start;}
.modern-checkout-form .inline-check span{display:block;text-align:left;}
.checkout-pay-btn{margin-top:12px;}
.checkout-policy-links{display:flex;flex-wrap:wrap;gap:18px;padding-top:16px;border-top:1px solid #d8d0c6;margin-top:18px;justify-content:center;align-items:center;text-align:center;width:100%;margin-inline:auto;}
.checkout-policy-links .policy-popup-link{
  border:1px solid var(--line,#d8d0c6);
  background:var(--bg-soft,#faf6f0);
  color:var(--text,#3a2f26);
  border-radius:999px;
  padding:.45rem .95rem;
  font:inherit;
  font-size:.82rem;
  text-decoration:none;
  cursor:pointer;
  transition:border-color .15s ease,transform .15s ease,background .15s ease;
}
.checkout-policy-links .policy-popup-link:hover{border-color:color-mix(in srgb,var(--pink,#c98) 40%,var(--line,#d8d0c6));background:color-mix(in srgb,var(--pink,#c98) 8%,var(--bg-soft,#faf6f0));transform:translateY(-1px);}
.policy-popup{position:fixed;inset:0;display:none;z-index:1500;}
.policy-popup.open{display:block;}
.policy-popup-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45);}
.policy-popup-dialog{position:relative;max-width:880px;max-height:80vh;overflow:auto;margin:6vh auto;background:#fff;border-radius:18px;padding:28px 28px 22px;box-shadow:0 20px 60px rgba(0,0,0,.25);}
body[data-theme="dark"] .policy-popup-dialog{background:#171717;color:#f4ede2;}
.policy-popup-close{position:absolute;top:12px;right:14px;border:0;background:none;font-size:28px;line-height:1;cursor:pointer;color:inherit;}
.policy-popup-content h3{margin:0 0 14px;font-size:2rem;}
.policy-popup-content p{margin:0 0 14px;line-height:1.6;}
.checkout-announcement-box{background:#f2eee7;border:1px solid #d8d0c6;border-radius:16px;padding:18px 18px 10px;margin-bottom:16px;}
.checkout-announcement-box strong{display:block;margin-bottom:10px;font-size:1.1rem;}
.checkout-announcement-box p{margin:0 0 8px;}
.modern-payment-methods .payment-option{display:block;cursor:pointer;}
.modern-payment-methods .payment-option input{position:absolute;opacity:0;pointer-events:none;}
.modern-payment-methods .payment-option.selected{border-color:#2a62d6;background:#f6f7ff;}
.payment-method-note{border:1px solid #d8d0c6;border-top:0;border-radius:0 0 18px 18px;padding:18px 22px;margin-top:-8px;margin-bottom:12px;background:#fff;}
body[data-theme="dark"] .payment-method-note{background:#171717;border-color:#3a342f;}

/* v39 mobile-only display refinements */
@media (max-width: 760px){
  .home-page .hero-slider-shell.full-bleed{
    width:100vw;
    max-width:none;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
  .home-page .hero-slider-reference,
  .home-page .hero-slider{
    width:100%;
    border-radius:0;
    margin:0;
  }

  .product-media .slide-btn,
  .slide-btn{
    width:28px;
    height:28px;
    font-size:.82rem;
  }
  .product-media .slide-btn.prev,
  .slide-btn.prev{left:.4rem}
  .product-media .slide-btn.next,
  .slide-btn.next{right:.4rem}

  .product-media .discount-badge{
    top:.5rem;
    left:.5rem;
    padding:.28rem .48rem;
    font-size:.64rem;
  }

  .product-status-badge,
  .product-status-badge.status-right{
    top:.5rem;
    right:.5rem;
    left:auto;
    bottom:auto;
    padding:.26rem .5rem;
    font-size:.62rem;
    border-radius:999px;
  }

  .image-cart-btn{
    right:.5rem;
    bottom:.5rem;
    width:40px;
    height:40px;
  }
  .image-cart-btn .cart-icon-glyph{font-size:.84rem}
  .image-cart-btn .inline-cart-count{
    top:-4px;
    right:-4px;
    min-width:16px;
    height:16px;
    line-height:16px;
    font-size:.58rem;
    padding:0 3px;
  }
  .image-cart-btn .image-checkout-pill,
  .image-cart-btn .image-clear-pill{
    font-size:.62rem;
    padding:.22rem .52rem;
  }

  .float-stack{
    right:.72rem;
    bottom:.72rem;
    gap:.5rem;
  }
  .arrival-float,
  .assistant-toggle{
    width:50px;
    height:50px;
  }
  .assistant-style-text{
    font-size:.72rem;
  }
}

/* v40 mobile screen fixes */
@media (max-width: 768px){
  .home-page .hero-slider-section,
  .home-page .saya-home-hero,
  .home-page .hero-slider-shell,
  .home-page .hero-slider-shell.full-bleed{
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .home-page .hero-slider-reference,
  .home-page .hero-slider,
  .home-page .hero-slide,
  .home-page .hero-slide img{
    width:100vw !important;
    max-width:100vw !important;
    border-radius:0 !important;
  }

  .product-media .slide-btn,
  .slide-btn,
  .product-media .carousel-btn,
  .carousel-btn{
    width:24px !important;
    height:24px !important;
    font-size:.72rem !important;
    line-height:24px !important;
  }
  .product-media .slide-btn.prev,
  .slide-btn.prev,
  .product-media .carousel-btn.prev,
  .carousel-btn.prev{left:.28rem !important}
  .product-media .slide-btn.next,
  .slide-btn.next,
  .product-media .carousel-btn.next,
  .carousel-btn.next{right:.28rem !important}

  .product-media .discount-badge,
  .discount-badge{
    top:.38rem !important;
    left:.38rem !important;
    padding:.2rem .4rem !important;
    font-size:.56rem !important;
    line-height:1.1 !important;
  }

  .product-status-badge,
  .product-status-badge.status-right{
    top:.38rem !important;
    right:.38rem !important;
    left:auto !important;
    bottom:auto !important;
    padding:.2rem .42rem !important;
    font-size:.56rem !important;
    line-height:1.1 !important;
  }

  .image-cart-btn{
    right:.42rem !important;
    bottom:.42rem !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
  }
  .image-cart-btn .cart-icon-glyph{
    font-size:.72rem !important;
  }
  .image-cart-btn .inline-cart-count{
    top:-3px !important;
    right:-3px !important;
    min-width:14px !important;
    height:14px !important;
    line-height:14px !important;
    font-size:.5rem !important;
    padding:0 2px !important;
  }

  .float-stack{
    right:.6rem !important;
    bottom:.6rem !important;
    gap:.42rem !important;
  }
  .arrival-float,
  .assistant-toggle{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;
  }
  .assistant-style-text{
    font-size:.62rem !important;
    line-height:1 !important;
  }
}


/* v41 stronger mobile overrides */
@media screen and (max-width: 768px){
  .home-page .container,
  .home-page main,
  .home-page .hero-slider-section,
  .home-page .saya-home-hero,
  .home-page .hero-slider-shell,
  .home-page .hero-slider-shell.full-bleed{
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .home-page .hero-slider-reference,
  .home-page .hero-slider,
  .home-page .hero-slide,
  .home-page .hero-slide img{
    width:100vw !important;
    max-width:100vw !important;
    min-width:100vw !important;
    border-radius:0 !important;
  }

  .product-card-minimal .product-media .carousel-btn,
  .product-card-minimal .product-media .slide-btn,
  .carousel-btn,
  .slide-btn{
    width:22px !important;
    height:22px !important;
    min-width:22px !important;
    min-height:22px !important;
    padding:0 !important;
    font-size:11px !important;
    line-height:22px !important;
  }
  .product-card-minimal .product-media .carousel-btn.prev,
  .product-card-minimal .product-media .slide-btn.prev,
  .carousel-btn.prev,
  .slide-btn.prev{left:4px !important;}
  .product-card-minimal .product-media .carousel-btn.next,
  .product-card-minimal .product-media .slide-btn.next,
  .carousel-btn.next,
  .slide-btn.next{right:4px !important;}

  .product-card-minimal .product-media .discount-badge,
  .product-media .discount-badge,
  .discount-badge{
    top:6px !important;
    left:6px !important;
    padding:3px 6px !important;
    font-size:10px !important;
    line-height:1 !important;
    letter-spacing:0 !important;
  }

  .product-card-minimal .product-media .product-status-badge,
  .product-status-badge,
  .product-status-badge.status-right{
    top:6px !important;
    right:6px !important;
    left:auto !important;
    bottom:auto !important;
    padding:3px 6px !important;
    font-size:10px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  .product-card-minimal .product-media .image-cart-btn,
  .image-cart-btn{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    min-height:28px !important;
    right:6px !important;
    bottom:6px !important;
  }
  .product-card-minimal .product-media .image-cart-btn .cart-icon-glyph,
  .image-cart-btn .cart-icon-glyph{
    font-size:12px !important;
    line-height:1 !important;
  }
  .product-card-minimal .product-media .image-cart-btn .inline-cart-count,
  .image-cart-btn .inline-cart-count{
    min-width:13px !important;
    height:13px !important;
    line-height:13px !important;
    font-size:9px !important;
    top:-3px !important;
    right:-3px !important;
    padding:0 2px !important;
  }

  .float-stack{
    right:10px !important;
    bottom:10px !important;
    gap:6px !important;
  }
  .float-stack .arrival-float,
  .float-stack .assistant-toggle{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    border-radius:999px !important;
  }
  .float-stack .assistant-style-text,
  .float-stack .arrival-float span,
  .float-stack .assistant-toggle span{
    font-size:10px !important;
    line-height:1 !important;
  }
}

/* v42 mobile home menu visibility fix */
@media screen and (max-width: 760px){
  .home-page:not(.header-scrolled) .saya-nav.open,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open{
    background:#fff !important;
    border:1px solid #ece3d7 !important;
    box-shadow:0 18px 36px rgba(45,33,24,.12) !important;
  }
  .home-page:not(.header-scrolled) .saya-nav.open > a,
  .home-page:not(.header-scrolled) .saya-nav.open .nav-item > a,
  .home-page:not(.header-scrolled) .saya-nav.open .nav-link-with-arrow,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open > a,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open .nav-item > a,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open .nav-link-with-arrow{
    color:var(--brand-brown-dark) !important;
    -webkit-text-fill-color:var(--brand-brown-dark) !important;
    opacity:1 !important;
    text-shadow:none !important;
    background:transparent !important;
  }
  .home-page:not(.header-scrolled) .saya-nav.open > a:hover,
  .home-page:not(.header-scrolled) .saya-nav.open .nav-item > a:hover,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open > a:hover,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open .nav-item > a:hover{
    color:var(--brand-brown-dark) !important;
    background:rgba(184,154,87,.14) !important;
  }
  .home-page:not(.header-scrolled) .saya-nav.open .shop-submenu,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open .shop-submenu{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
  }
  .home-page:not(.header-scrolled) .saya-nav.open .shop-submenu a,
  .home-page:not(.header-scrolled) .saya-nav.open .shop-submenu .submenu-link,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open .shop-submenu a,
  .home-page:not(.header-scrolled) #mainNav.saya-nav.open .shop-submenu .submenu-link{
    color:var(--brand-brown-dark) !important;
    -webkit-text-fill-color:var(--brand-brown-dark) !important;
    opacity:1 !important;
  }
}

/* ============================================================================
   Header action buttons — unified aesthetic (theme toggle, cart, menu)
   Appended last so it wins the cascade over the older, scattered rules above
   without having to hunt every one of them down in this legacy stylesheet.
   ========================================================================== */
.nav-actions{gap:.55rem}

.theme-toggle,
.menu-toggle,
.icon-svg-link{
  --hdr-btn-size:42px;
  width:var(--hdr-btn-size);
  height:var(--hdr-btn-size);
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:1px solid rgba(111,88,67,.16);
  background:rgba(255,255,255,.92);
  color:var(--brand-brown-dark,#4f3d2c);
  cursor:pointer;
  position:relative;
  box-shadow:0 1px 2px rgba(17,17,17,.05);
  transition:transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.icon-svg-link{display:inline-flex}
.theme-toggle:hover,
.menu-toggle:hover,
.icon-svg-link:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 20px rgba(17,17,17,.12);
}
.theme-toggle:active,
.menu-toggle:active,
.icon-svg-link:active{transform:translateY(0) scale(.95);}
.theme-toggle:focus-visible,
.menu-toggle:focus-visible,
.icon-svg-link:focus-visible{outline:2px solid var(--brand-brown,#6f5843);outline-offset:2px;}

.icon-svg-link img{width:19px;height:19px}
.cart-count-badge{
  position:absolute;
  top:-4px;
  right:-4px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  border-radius:999px;
  background:var(--brand-brown,#6f5843);
  color:#fff;
  font-size:.68rem;
  font-weight:700;
  line-height:18px;
  text-align:center;
  box-shadow:0 0 0 2px rgba(255,255,255,.92);
}

/* --- Theme toggle: crossfading sun / moon icon --- */
.theme-toggle{overflow:hidden}
.theme-icon{
  position:absolute;
  width:20px;
  height:20px;
  transition:opacity .3s ease, transform .45s cubic-bezier(.34,1.56,.64,1);
}
.theme-icon-sun{opacity:1;transform:rotate(0deg) scale(1);}
.theme-icon-moon{opacity:0;transform:rotate(-90deg) scale(.5);}
body[data-theme="dark"] .theme-icon-sun{opacity:0;transform:rotate(90deg) scale(.5);}
body[data-theme="dark"] .theme-icon-moon{opacity:1;transform:rotate(0deg) scale(1);}

/* --- Menu toggle: animated hamburger --- */
.menu-toggle-bars{position:relative;width:18px;height:13px;display:inline-block}
.menu-toggle-bars span{
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transition:transform .25s ease, opacity .2s ease, top .25s ease;
}
.menu-toggle-bars span:nth-child(1){top:0}
.menu-toggle-bars span:nth-child(2){top:5.5px}
.menu-toggle-bars span:nth-child(3){top:11px}
.menu-toggle.open .menu-toggle-bars span:nth-child(1){top:5.5px;transform:rotate(45deg)}
.menu-toggle.open .menu-toggle-bars span:nth-child(2){opacity:0}
.menu-toggle.open .menu-toggle-bars span:nth-child(3){top:5.5px;transform:rotate(-45deg)}

/* --- Transparent home-hero header: glassy, white icons --- */
.home-page:not(.header-scrolled) .theme-toggle,
.home-page:not(.header-scrolled) .menu-toggle,
.home-page:not(.header-scrolled) .icon-svg-link{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.4);
  color:#fff;
  box-shadow:none;
}
.home-page:not(.header-scrolled) .theme-toggle:hover,
.home-page:not(.header-scrolled) .menu-toggle:hover,
.home-page:not(.header-scrolled) .icon-svg-link:hover{
  background:rgba(255,255,255,.26);
  box-shadow:0 10px 22px rgba(0,0,0,.18);
}
.home-page:not(.header-scrolled) .icon-svg-link img{filter:brightness(0) invert(1);}
.home-page:not(.header-scrolled) .cart-count-badge{box-shadow:0 0 0 2px rgba(0,0,0,.35);}

/* --- Scrolled home header / inner pages: solid brand style --- */
.home-page.header-scrolled .theme-toggle,
.home-page.header-scrolled .menu-toggle,
.home-page.header-scrolled .icon-svg-link,
.inner-page-header .theme-toggle,
.inner-page-header .menu-toggle,
.inner-page-header .icon-svg-link{
  background:#fff;
  border-color:var(--line,#e7e0d5);
  color:var(--brand-brown-dark,#4f3d2c);
}
.home-page.header-scrolled .icon-svg-link img,
.inner-page-header .icon-svg-link img{
  filter:brightness(0) saturate(100%) invert(26%) sepia(15%) saturate(727%) hue-rotate(349deg) brightness(91%) contrast(84%);
}

/* --- Dark mode --- */
body[data-theme="dark"] .theme-toggle,
body[data-theme="dark"] .menu-toggle,
body[data-theme="dark"] .icon-svg-link{
  background:color-mix(in srgb, var(--panel) 92%, white 4%);
  border-color:var(--line);
  color:var(--text);
  box-shadow:0 1px 2px rgba(0,0,0,.35);
}
body[data-theme="dark"] .theme-toggle:hover,
body[data-theme="dark"] .menu-toggle:hover,
body[data-theme="dark"] .icon-svg-link:hover{
  box-shadow:0 10px 24px rgba(0,0,0,.45);
}
body[data-theme="dark"] .icon-svg-link img{
  filter:brightness(0) saturate(100%) invert(91%) sepia(20%) saturate(305%) hue-rotate(338deg) brightness(105%) contrast(92%);
}
body[data-theme="dark"].home-page:not(.header-scrolled) .theme-toggle,
body[data-theme="dark"].home-page:not(.header-scrolled) .menu-toggle,
body[data-theme="dark"].home-page:not(.header-scrolled) .icon-svg-link{
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.28);
  color:#fff;
  box-shadow:none;
}
body[data-theme="dark"].home-page:not(.header-scrolled) .icon-svg-link img{
  filter:brightness(0) invert(1);
}

/* --- Mobile --- */
@media (max-width:760px){
  .theme-toggle,
  .menu-toggle,
  .icon-svg-link{--hdr-btn-size:38px;}
  .theme-icon{width:18px;height:18px;}
  .nav-actions{gap:.45rem}
}

/* =========================================================
   V55 — Desktop layout density pass
   The site was reading oversized on wide desktop monitors: a
   1180px content cap left large empty margins on the sides
   (visible as the green-highlighted gaps the client flagged),
   while cards/sections carried generous spacing tuned for a
   narrower layout. This block only takes effect at wide
   viewports and modestly trims card/section spacing everywhere
   else, so the existing mobile/tablet breakpoints above are
   left untouched. Appended at the end so it wins the cascade
   by source order (this file's established pattern) without
   needing !important.
   ========================================================= */

/* Reclaim the empty side margins: widen the content column on
   wide screens. min() keeps this safe on any narrower viewport
   since it can never exceed the 100% - gutter bound. */
.container,
.feature-strip .container{
  width:min(1640px,calc(100% - 3rem));
}

/* The header's own nav row has a separate, higher-specificity
   width rule (.home-page .nav-wrap / .inner-page-header .nav-wrap)
   that isn't controlled by .container above. Match it to the same
   1400px cap so the header stays aligned with the wider content
   below it instead of appearing narrower than the sections it sits
   above. */
.home-page .saya-nav-wrap,
.home-page .nav-wrap,
.inner-page-header .saya-nav-wrap,
.inner-page-header .nav-wrap{
  width:min(1640px, calc(100% - 3rem));
}

/* Slightly tighter card chrome and section rhythm site-wide —
   this is the "20% denser" ask; still generous, just less
   oversized than the original 1.2rem/1.5rem/4rem values. */
.product-card,
.category-card{
  padding:1rem;
  border-radius:1.15rem;
}
.section{
  padding:3.2rem 0;
}

/* On genuinely wide desktop viewports, use the reclaimed width
   for more columns instead of just bigger cards — this mirrors
   the denser grids used by Amazon/Junaid Jamshed at this size.
   Scoped to min-width:1200px so the 980px/760px breakpoints
   above (tablet/mobile) are completely unaffected. Deliberately
   excludes .product-grid.four-col: the homepage "Top Selling /
   Extra Discount / New Arrival Picks" rows always render exactly
   4 curated items, so bumping that grid to 5 columns would leave
   an empty gap on the right instead of filling the row — keeping
   it at 4 columns is correct there. */
@media (min-width:1200px){
  .product-grid:not(.four-col){
    grid-template-columns:repeat(5,minmax(0,1fr));
  }
  .category-grid{
    grid-template-columns:repeat(6,minmax(0,1fr));
  }
}

/* =========================================================
   V57 — Online payment result states (pay-return.php)
   Reuses the existing .notice block (same border/background
   system as everywhere else) with a colored left accent so
   success/pending/error are distinguishable at a glance,
   without introducing a whole new component.
   ========================================================= */
.gw-result-ok{border-left:4px solid var(--green)}
.gw-result-pending{border-left:4px solid var(--warning)}
.gw-result-error{border-left:4px solid var(--danger)}

/* ---- Product card hover: 2nd image, quick-cart, click-anywhere (pehnawa-style) ---- */
.product-card-minimal{cursor:pointer}
.product-card-minimal .product-media img{transition:opacity .35s ease,transform .5s ease}
/* Reveal the second image while hovering the card (only when a 2nd image exists) */
.media-link.has-second:hover .product-slide[data-index="0"]{opacity:0}
.media-link.has-second:hover .product-slide[data-index="1"]{opacity:1}
/* Gentle zoom on hover for a premium feel */
.product-card-minimal:hover .product-media img{transform:scale(1.04)}
/* Quick add-to-cart icon fades in on hover (pointer devices); stays visible once items are in the cart.
   Also covers .product-photo-card (the Shop "Photo grid" view) with the exact same behavior - it was
   previously missing the cart icon entirely; see photoCard() in js/app.js. */
@media (hover:hover){
  .product-card-minimal .image-cart-btn,
  .product-photo-card .image-cart-btn{opacity:0;transform:translateY(8px);transition:opacity .25s ease,transform .25s ease}
  .product-card-minimal:hover .image-cart-btn,
  .product-card-minimal .image-cart-btn.has-items,
  .product-card-minimal .image-cart-btn:focus-visible,
  .product-photo-card:hover .image-cart-btn,
  .product-photo-card .image-cart-btn.has-items,
  .product-photo-card .image-cart-btn:focus-visible{opacity:1;transform:none}
}

/* ============ Shop results bar: count · view switch · sort (V69) ============ */
.shop-searchrow{display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:1rem}
.shop-searchrow input{flex:1 1 240px;background:var(--bg-soft);border:1px solid var(--line);border-radius:.9rem;padding:.8rem 1rem;color:var(--text)}
.shop-searchrow select{min-width:190px;background:var(--bg-soft);border:1px solid var(--line);border-radius:.9rem;padding:.8rem 1rem;color:var(--text)}

.results-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:.65rem 0 .8rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:1.4rem}
.rb-count{color:var(--muted);font-size:.92rem;white-space:nowrap}
.rb-views{display:flex;gap:.1rem}
.rb-views button{all:unset;cursor:pointer;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:.6rem;color:color-mix(in srgb,var(--muted) 55%,transparent);transition:background .15s ease,color .15s ease}
.rb-views button svg{width:20px;height:20px}
.rb-views button:hover{background:var(--bg-soft);color:var(--text)}
.rb-views button.active{color:var(--text)}

.rb-sort{position:relative;display:flex;align-items:center;gap:.5rem}
.rb-sort-label{color:var(--muted);font-size:.92rem;white-space:nowrap}
.rb-sort-toggle{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;font-size:.95rem;color:var(--text)}
.rb-sort-toggle b{font-weight:700}
.rb-chev{width:16px;height:16px;transition:transform .2s ease}
.rb-sort-toggle[aria-expanded="true"] .rb-chev{transform:rotate(180deg)}
.rb-sort-menu{position:absolute;top:calc(100% + .55rem);right:0;min-width:236px;list-style:none;margin:0;padding:.4rem;background:var(--panel);border:1px solid var(--line);border-radius:.9rem;box-shadow:0 20px 45px rgba(30,20,10,.16);z-index:45;display:none}
.rb-sort-menu.open{display:block}
.rb-sort-menu li{padding:.62rem .85rem;border-radius:.6rem;color:var(--muted);cursor:pointer;font-size:.92rem;transition:background .12s ease,color .12s ease}
.rb-sort-menu li:hover{background:var(--bg-soft);color:var(--text)}
.rb-sort-menu li.selected{color:var(--text);font-weight:600;background:color-mix(in srgb,var(--brand-brown,#7b6242) 12%,transparent)}

/* View density (tablet/desktop). Mobile keeps its responsive default. */
@media (min-width:768px){
  .product-grid.view-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .product-grid.view-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .product-grid.view-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  /* "Photo grid" view: 4-across on tablet (6 would be too cramped), full 6-across once there's
     genuinely enough width for it - see the min-width:1200px tier below. */
  .product-grid.view-grid6{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:.5rem!important}
}
@media (min-width:1200px){
  .product-grid.view-grid6{grid-template-columns:repeat(6,minmax(0,1fr))!important}
}
/* Photo grid cards: just the image, no name/price/badges - a tight photo mosaic like a
   social feed's grid view, rather than a normal shoppable product card. */
.product-photo-card{display:block;position:relative;overflow:hidden;background:var(--bg-soft);aspect-ratio:3/4}
.product-photo-card img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.product-photo-card:hover img{transform:scale(1.04)}
/* ============ Shop LIST view — rich horizontal card (image + arranged details) ============
   Sized ~30% larger than the other views for a spacious, catalogue-style row. */
.product-grid.view-list{grid-template-columns:1fr!important;gap:1.6rem!important;max-width:1050px;margin-inline:auto}
.product-grid.view-list .list-card{display:grid;grid-template-columns:300px 1fr;gap:2.2rem;align-items:stretch;
  padding:1.5rem;border:1px solid var(--line);border-radius:0;background:var(--panel);box-shadow:var(--shadow);transition:box-shadow .18s ease,transform .18s ease}
.product-grid.view-list .list-card:hover{box-shadow:0 22px 55px rgba(10,10,10,.12);transform:translateY(-2px)}
.list-card .ls-media{position:relative;display:block;width:300px;aspect-ratio:2/3;overflow:hidden;background:var(--bg-soft);border-radius:0}
.list-card .ls-media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.list-card:hover .ls-media img{transform:scale(1.03)}
.list-card .ls-body{display:flex;flex-direction:column;gap:.7rem;padding:.35rem .2rem;min-width:0}
.list-card .ls-eyebrow{margin:0;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#b89a57;font-weight:600}
.list-card .ls-title{margin:0;font-size:1.5rem;line-height:1.25;font-weight:500;color:var(--text)}
.list-card .product-title-link:hover .ls-title{color:#b89a57}
.list-card .ls-price{margin:.1rem 0 .1rem}
.list-card .ls-price strong{font-size:1.5rem;font-weight:600;color:var(--text)}
.list-card .ls-price .old-price{font-size:1.05rem}
.list-card .ls-status{align-self:flex-start;font-size:.74rem;font-weight:700;letter-spacing:.02em;padding:.28rem .6rem;border-radius:0;border:1px solid var(--line);color:var(--muted)}
.list-card .ls-status.status-out{color:#b0322b;border-color:color-mix(in srgb,#b0322b 35%,var(--line))}
.list-card .ls-status.status-low{color:#b9702a;border-color:color-mix(in srgb,#b9702a 35%,var(--line))}
.list-card .ls-status.status-hot{color:#9a7b32;border-color:color-mix(in srgb,#b89a57 45%,var(--line))}
.list-card .ls-desc{margin:.1rem 0;color:var(--muted);font-size:.95rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.list-card .ls-specs{display:flex;flex-wrap:wrap;gap:.4rem .5rem;margin:.1rem 0}
.list-card .ls-spec{display:inline-flex;align-items:baseline;gap:.35rem;font-size:.82rem;color:var(--text);background:var(--bg-soft);border:1px solid var(--line);border-radius:999px;padding:.28rem .7rem}
.list-card .ls-spec i{font-style:normal;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.list-card .ls-type-badge{align-self:flex-start;margin-top:.25rem;background:var(--text);color:var(--panel);font-size:.82rem;font-weight:700;letter-spacing:.03em;padding:.5rem .9rem;border-radius:0}
.list-card .ls-size-row{display:flex;flex-wrap:wrap;gap:.55rem;margin:.15rem 0 .2rem}
.list-card .ls-size-chip{min-width:46px;padding:.5rem .8rem;border:1px solid var(--text);background:var(--panel);color:var(--text);font-size:.9rem;font-weight:600;cursor:pointer;border-radius:0;transition:background .15s,color .15s}
.list-card .ls-size-chip:hover{background:var(--bg-soft)}
.list-card .ls-size-chip.active{background:var(--text);color:var(--panel)}
.list-card .ls-add-btn{align-self:flex-start;margin-top:.5rem;min-width:230px;border:none;cursor:pointer;background:var(--brand-brown-dark,#3d3429);color:#e9c877;
  font-size:.98rem;font-weight:700;letter-spacing:.05em;padding:1rem 2.2rem;border-radius:999px;transition:filter .15s,transform .15s;box-shadow:var(--shadow)}
.list-card .ls-add-btn:hover{filter:brightness(1.12);transform:translateY(-1px)}
.list-card .ls-add-btn:disabled{background:var(--bg-soft);color:var(--muted);cursor:not-allowed;box-shadow:none}
.list-card.is-sold-out .ls-media img{filter:grayscale(.4) opacity(.85)}
.list-card .ls-media .discount-badge{top:.6rem;left:.6rem}
@media (max-width:820px){
  .product-grid.view-list .list-card{grid-template-columns:200px 1fr;gap:1.4rem;padding:1.1rem}
  .list-card .ls-media{width:200px}
  .list-card .ls-title{font-size:1.25rem}
  .list-card .ls-price strong{font-size:1.3rem}
  .list-card .ls-add-btn{min-width:0;width:100%}
}
@media (max-width:520px){
  .product-grid.view-list .list-card{grid-template-columns:1fr;gap:1rem}
  .list-card .ls-media{width:100%;max-width:320px;margin-inline:auto}
}

/* ============ Subcategories: shop chip bar + nested nav dropdown (V70) ============ */
/* Admin controls > Category navigation > "Shop page subcategory row". .subcat-bar is the
   overflow-clipping outer strip; .subcat-track is the actual flex row inside it - centered and
   wrapping at rest ("central aligned aesthetically"), switched to a single-line, seamlessly
   looping left-to-right marquee by wireSubcatMarquee() in app.js only once its content is
   wider than the visible row ("upon completion of the window/row... auto motion"). Both the
   simple chip style and the dynamic tile style share this same outer/track structure. */
.subcat-bar{overflow:hidden;position:relative;margin:0 0 1.1rem}
.subcat-track{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:.5rem;width:100%}
.subcat-bar-dynamic .subcat-track{gap:1.2rem}
.subcat-track.subcat-marquee{flex-wrap:nowrap;justify-content:flex-start;width:max-content;animation:subcatMarquee 26s linear infinite}
.subcat-bar:hover .subcat-track.subcat-marquee{animation-play-state:paused}
@keyframes subcatMarquee{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.subcat-chip{all:unset;cursor:pointer;flex:0 0 auto;padding:.45rem .95rem;border:1px solid var(--line);border-radius:999px;font-size:.88rem;color:var(--muted);background:var(--bg-soft);transition:background .15s ease,color .15s ease,border-color .15s ease}
.subcat-chip:hover{color:var(--text);border-color:color-mix(in srgb,var(--brand-brown,#7b6242) 40%,var(--line))}
.subcat-chip.active{background:var(--brand-brown,#7b6242);border-color:var(--brand-brown,#7b6242);color:#fff}
.subcat-tile{all:unset;cursor:pointer;flex:0 0 auto;width:150px;display:flex;flex-direction:column;align-items:center;text-align:center}
.subcat-tile-media{display:block;width:100%;aspect-ratio:3/4;border-radius:10px;overflow:hidden;background:var(--bg-soft)}
.subcat-tile-media img{width:100%;height:100%;object-fit:cover;transition:transform .22s ease}
.subcat-tile:hover .subcat-tile-media img,.subcat-tile.active .subcat-tile-media img{transform:scale(1.06)}
.subcat-tile-name{display:block;margin-top:.6rem;font-size:.85rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);transition:color .15s ease}
.subcat-tile:hover .subcat-tile-name{color:var(--text)}
.subcat-tile.active .subcat-tile-name{color:var(--text)}

.submenu-group{display:flex;flex-direction:column}
.submenu-subs{display:flex;flex-direction:column;margin:.05rem 0 .35rem .5rem;padding-left:.55rem;border-left:1px solid color-mix(in srgb,var(--brand-brown,#7b6242) 22%,transparent)}
.shop-submenu .submenu-sublink{font-size:.84rem;padding:.38rem .7rem;border-radius:999px;color:var(--muted)}
.shop-submenu .submenu-sublink:hover{background:rgba(184,154,87,.14);color:var(--brand-brown-dark,#4f3d2c)}

/* Cart line variant chips (V71) */
.cart-variant{display:flex;gap:.4rem;flex-wrap:wrap;margin:.25rem 0 .15rem}
.cart-variant-chip{font-size:.78rem;background:var(--bg-soft);border:1px solid var(--line);border-radius:999px;padding:.15rem .6rem;color:var(--text)}

/* ===== Brand logo (wordmark) — light/dark theme swap =====
   Uses !important + high specificity to beat the legacy 38px !important icon rule. */
.brand img.brand-logo,.checkout-logo img.brand-logo,.footer-brand img.brand-logo,
.saya-brand img.brand-logo,.compact-brand img.brand-logo,.topbar-brand img.brand-logo,
.home-page .saya-brand img.brand-logo{width:auto !important;height:58px !important;border-radius:0 !important;box-shadow:none !important;flex:0 0 auto;}
.checkout-logo{gap:0;}
.brand-logo-light{display:block !important;}
.brand-logo-dark{display:none !important;}
body[data-theme="dark"] .brand-logo-light{display:none !important;}
body[data-theme="dark"] .brand-logo-dark{display:block !important;}
.footer-brand img.brand-logo{height:66px !important;}
@media (max-width:760px){
  .brand img.brand-logo,.checkout-logo img.brand-logo,.saya-brand img.brand-logo,.compact-brand img.brand-logo,.home-page .saya-brand img.brand-logo{height:48px !important;}
  .footer-brand img.brand-logo{height:56px !important;}
}

/* ============ A: inner-page banners sit tight under the header (remove top gap) ============ */
main.container.section{padding-top:1.25rem}
.page-banner{margin-top:0}

/* ============ C/D/E: shop grid views (2/3/4-column toggles) ============
   Previously showed a different card treatment here (wishlist heart + a sliding "ADD TO CART"
   bar, hiding the round cart-icon button) than the Home page's card. Per explicit request, the
   round cart-icon button (.image-cart-btn, styled below) is now the single consistent icon
   across every product grid - Home, Shop/category, and any future grid - so the wishlist heart
   and slide-up bar were removed rather than just hidden. Only the carousel-arrow hover
   treatment from that era is still wanted here, so it's the only piece kept. */
.product-card-minimal .product-media{position:relative}
.product-grid[class*="view-cols"] .slide-btn{opacity:0;transition:opacity .2s ease}
.product-grid[class*="view-cols"] .product-card:hover .slide-btn{opacity:1}
@media (hover:none){
  .product-grid[class*="view-cols"] .slide-btn{opacity:1}
}

/* ==========================================================================
   Customer Reviews (product page popup) + shared feature-popup shell used
   by the header icon "coming soon" popups. Reuses .policy-popup/.notice
   already defined above; the rules below cover what's specific to these.
   ========================================================================== */
.customer-reviews-cta{text-align:center;padding:2.4rem 1.5rem;margin-top:2.2rem;border:1px solid var(--line);border-radius:1.4rem;background:var(--panel);box-shadow:var(--shadow);transition:border-color .2s ease}
.customer-reviews-cta:hover{border-color:color-mix(in srgb,var(--pink) 35%,var(--line))}
.customer-reviews-cta .reviews-cta-summary{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
.customer-reviews-cta .review-stars-glyphs{letter-spacing:.2em;color:#d4b45a;font-size:1.15rem}
.customer-reviews-cta .reviews-cta-summary span:not(.review-stars-glyphs){color:var(--muted)}
.notice-success{background:color-mix(in srgb,var(--green) 12%,var(--panel));border-color:color-mix(in srgb,var(--green) 30%,var(--line))}
.feature-modal-dialog{text-align:left}
.reviews-modal-dialog{max-width:960px}
.reviews-modal-summary{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.8rem;font-size:1.05rem}
.reviews-modal-summary strong{font-size:1.3rem}
.reviews-modal-summary span{color:var(--muted)}
.reviews-modal-intro{color:var(--muted)}
.review-stars-glyphs{color:#d6a437;letter-spacing:2px;font-size:1.05rem}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;margin:1rem 0 1.6rem}
.review-card{border:1px solid var(--line);border-radius:1rem;padding:1rem;background:var(--bg-soft);display:grid;gap:.5rem;align-content:start}
.review-card-photo{width:100%;height:140px;object-fit:cover;border-radius:.7rem}
.review-card-comment{margin:0;color:var(--text);font-size:.94rem;line-height:1.45}
.review-card-name{color:var(--muted);font-size:.85rem}
.review-submit-form{border-top:1px solid var(--line);padding-top:1.2rem;display:grid;gap:.75rem}
.review-submit-form h4{margin:0 0 .2rem}
.review-submit-form input[type="text"],
.review-submit-form textarea{width:100%;background:var(--bg-soft);border:1px solid var(--line);border-radius:1rem;padding:.9rem 1rem;color:var(--text)}
.review-submit-form input[type="file"]{color:var(--text)}
.review-star-picker{display:flex;align-items:center;gap:.3rem}
.review-star-btn{background:none;border:none;font-size:1.6rem;line-height:1;color:var(--line);cursor:pointer;padding:0}
.review-star-btn.active{color:#d6a437}
@media (max-width:900px){
  .reviews-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .reviews-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   My Account (account.html) - login gate, order tracking, profile, password.
   Reuses .panel/.two-col/.checkout-form/.badge/.small-muted/.empty-state from
   elsewhere in this file; the rules below cover what's specific to this page.
   ========================================================================== */
.account-notice{text-align:center;padding:2.5rem 1.5rem}
.account-notice .btn{margin-top:.6rem}
.account-auth-grid{align-items:start}
.account-narrow-form{max-width:420px}
.account-form-msg{min-height:1.2em;font-size:.9rem;margin-top:.2rem}
.account-form-error{color:var(--danger)}
.account-form-success{color:var(--green)}
.account-dashboard-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.4rem}
.account-dashboard-head h2{margin:.15rem 0}
.account-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.2rem}
.account-tab-btn{background:var(--panel);border:1px solid var(--line);color:var(--muted);padding:.65rem 1.1rem;border-radius:999px;cursor:pointer;font-weight:600;transition:background .2s ease,color .2s ease}
.account-tab-btn.active{background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff;border-color:transparent}
.account-orders-list{display:grid;gap:1rem}
.order-card{border:1px solid var(--line);border-radius:1.2rem;padding:1.1rem 1.2rem;background:var(--bg-soft)}
.order-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.6rem}
.order-card-items{list-style:none;padding:0;margin:0 0 .8rem;color:var(--muted);display:grid;gap:.25rem;font-size:.93rem}
.order-card-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:.6rem;border-top:1px dashed var(--line)}
.order-status-badge.status-new{color:var(--blue)}
.order-status-badge.status-progress{color:var(--warning)}
.order-status-badge.status-delivered{color:var(--green)}
.order-status-badge.status-cancelled{color:var(--danger)}
@media (max-width:767px){
  .account-auth-grid{grid-template-columns:1fr}
}

/* =========================================================
   Dynamic category menu view: hover/tap a category to reveal
   its subcategories (name, plus an optional image) in a
   nested flyout. Used both in the header "Shop" menu (nested
   inside .shop-submenu, flyout pops to the side) and on the
   shop page's own nav (flyout drops down below). Only
   rendered at all when Admin controls > Category navigation
   is set to "Dynamic" - Simple view is completely untouched.
   ========================================================= */
.cat-nav-row{position:relative;display:flex;align-items:center;gap:.2rem}
.cat-nav-expand{
  flex:0 0 auto;width:26px;height:26px;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:none;border-radius:50%;
  color:var(--brand-brown-dark,#4f3d2c);cursor:pointer;font-size:.75rem;line-height:1;
  transition:transform .2s ease,background .2s ease;
}
.cat-nav-expand:hover{background:rgba(184,154,87,.16)}
.cat-nav-row:hover .cat-nav-expand,
.cat-nav-row.open .cat-nav-expand{transform:rotate(180deg)}
.cat-nav-flyout{
  display:none;
  position:absolute;top:calc(100% + .5rem);left:0;z-index:90;
  min-width:220px;max-width:280px;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;
  padding:.65rem;border-radius:1rem;
  background:rgba(255,252,247,.98);
  border:1px solid rgba(107,84,69,.14);
  box-shadow:0 20px 40px rgba(70,52,37,.12);
}
.cat-nav-row:hover .cat-nav-flyout,
.cat-nav-row.open .cat-nav-flyout{display:grid}
.shop-submenu .cat-nav-row .cat-nav-flyout{
  top:-.6rem;left:100%;margin-left:.5rem;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.cat-nav-flyout-item{
  display:flex;flex-direction:column;align-items:center;gap:.35rem;text-align:center;
  padding:.4rem;border-radius:.8rem;
  color:var(--brand-brown-dark,#4f3d2c)!important;
  opacity:1!important;
}
.cat-nav-flyout-item:hover{background:transparent}
.cat-nav-flyout-item img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:.65rem;background:var(--bg-soft)}
.cat-nav-flyout-noimg{display:block;width:100%;aspect-ratio:3/4;border-radius:.65rem;background:var(--bg-soft)}
.cat-nav-flyout-item span{font-size:.76rem;font-weight:600;line-height:1.2}
body[data-theme="dark"] .cat-nav-flyout{background:rgba(28,20,17,.98);border-color:rgba(255,255,255,.08)}
body[data-theme="dark"] .cat-nav-flyout-item{color:var(--text)!important}
body[data-theme="dark"] .cat-nav-expand{color:var(--text)}
@media (max-width:760px){
  .cat-nav-row{flex-wrap:wrap}
  .cat-nav-flyout{position:static;grid-template-columns:repeat(3,minmax(0,1fr));margin:.4rem 0 .2rem;width:100%}
  .shop-submenu .cat-nav-row .cat-nav-flyout{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* --- Dark mode: the SCROLLED home header never got a dark variant (only the transparent/top-of-page
   state above did - see body[data-theme="dark"].home-page:not(.header-scrolled) rules), so the bar
   stayed white and nav text stayed brand-brown even with dark mode on. Not touching the brand logo
   here - .brand-logo-light/.brand-logo-dark (header.html) already swap the correct logo file per
   theme via display, so no filter is needed on top of that. --- */
body[data-theme="dark"].home-page.header-scrolled .site-header{
  background:var(--panel);
  border-bottom-color:var(--line);
}
body[data-theme="dark"].home-page.header-scrolled .saya-nav-wrap{
  color:var(--text);
}
body[data-theme="dark"] #mainNav a{
  color:var(--text);
}
body[data-theme="dark"] #mainNav a.active,
body[data-theme="dark"] #mainNav a:hover{
  background:rgba(255,255,255,.08);
  color:var(--text);
}
body[data-theme="dark"].home-page.header-scrolled .theme-toggle,
body[data-theme="dark"].home-page.header-scrolled .menu-toggle,
body[data-theme="dark"].home-page.header-scrolled .icon-svg-link{
  background:color-mix(in srgb, var(--panel) 92%, white 4%);
  border-color:var(--line);
  color:var(--text);
}

/* --- Featured categories (homepage grid only - shop's category filter dropdown, the
   header's category submenu, and the footer's category links all use the same c.category
   data but a different template, so they're untouched): image-first card, name in bold
   caps centered underneath, no description text. Appended last so it wins over the
   .category-card base rules defined earlier in this file. --- */
.category-grid{gap:.5rem}
.category-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:0;
  padding:0;
  background:transparent;
  border:none;
  box-shadow:none;
}
.category-card-media{
  display:block;
  width:100%;
  aspect-ratio:4/5;
  border-radius:10px;
  overflow:hidden;
  background:var(--bg-soft);
}
.category-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0;
}
.category-card-name{
  display:block;
  margin-top:.7rem;
  font-size:.92rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--text);
}
body[data-theme="dark"] .category-card{background:transparent}

/* --- Header search icon + flyout. The icon itself reuses the existing .icon-svg-link
   button (same 42px circle, same light/dark/scrolled filter treatment as the other header
   icons) so it needs no styling of its own here - only the dropdown box and its own submit
   button, which are new. Submits to shop.html?search=... (see renderShop()/wireHeaderSearch()
   in app.js). --- */
.header-search-wrap{position:relative;display:inline-flex;align-items:center}
.header-search-form{
  position:absolute;top:calc(100% + .6rem);right:0;
  display:none;align-items:center;gap:.4rem;
  background:var(--panel);border:1px solid var(--line);
  border-radius:1rem;padding:.5rem;box-shadow:var(--shadow);
  min-width:240px;z-index:20;
}
.header-search-form.open{display:flex}
.header-search-form input{width:auto;flex:1;padding:.6rem .8rem;border-radius:.7rem}
.header-search-submit{
  width:36px;height:36px;flex:0 0 36px;padding:0;border:none;border-radius:.7rem;
  background:var(--brand-brown,#6f5843);cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.header-search-submit img{width:16px;height:16px;filter:brightness(0) invert(1)}
@media (max-width:480px){
  .header-search-form{position:fixed;left:1rem;right:1rem;top:auto}
}

/* --- Cart & checkout header: was just a bare logo link before. Now reads "Missfitn", a
   "Cart & Checkout" title, and a "Back to home" button, stacking cleanly on mobile. --- */
.checkout-header-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.checkout-logo-text{margin-left:.6rem;font-size:1.3rem;font-weight:800;color:var(--brand-brown-dark,#4f3d2c)}
body[data-theme="dark"] .checkout-logo-text{color:var(--text)}
.checkout-page-title{margin:0;font-size:1.5rem;font-weight:800;text-align:center;flex:1}
.checkout-back-btn{white-space:nowrap}
@media (max-width:700px){
  .checkout-header-row{justify-content:center;text-align:center}
  .checkout-page-title{order:3;flex:1 0 100%;font-size:1.25rem;margin-top:.3rem}
  .checkout-back-btn{order:2}
}

/* --- "* Required information" legend above the checkout form, matching the red asterisks
   already added to each actually-required field's placeholder (Email/First name/Address/
   City/Phone). --- */
.required-legend{margin:0 0 .2rem;font-size:.85rem;color:var(--muted)}

/* --- Dark mode contrast fix: the payment option labels and the payment-method note box were
   hardcoded to near-black text (#171717), invisible against the dark-mode panel background -
   the note box even ended up with matching near-black text AND background. --- */
body[data-theme="dark"] .payment-card-row strong{color:var(--text)}
body[data-theme="dark"] .payment-method-note{color:var(--text)}
body[data-theme="dark"] .brand-chip{background:var(--panel);border-color:var(--line);color:var(--text)}

/* --- Footer feature-strip items became <button> elements so they're clickable/keyboard-
   focusable (see renderFeatureStrip()/wireFeatureStrip() in app.js) - reset native button
   chrome so they look exactly like the plain items they replace. --- */
.feature-item{background:none;border:none;font:inherit;cursor:pointer}

/* --- Reviews/feature-strip popup: reuses .policy-popup/.reviews-modal-dialog/.review-card
   etc. already defined above (built for the product page's own Customer Reviews popup) - no
   new rules needed for the popup shell or review cards themselves. --- */

/* Free Shipping popup: the multi-currency price line (see multiCurrencyAmounts() in app.js -
   Admin > Settings > Payment > Currency rates) is always shown first, ahead of any custom
   popup text the merchant has written, so the actual figure is never hidden behind custom
   copy. Styled a bit larger/bolder than normal popup body text since it's the key figure. */
.feature-price-line{font-size:1.15rem;font-weight:700;color:var(--ink);}
body[data-theme="dark"] .feature-price-line{color:#f4ede2;}

/* ============================================================
   Mobile "app shell" pass (storefront) — the site already ships
   as an installable PWA (manifest.json + service-worker.js);
   this section makes it look and feel like an installed Android
   app on a phone instead of a shrunk desktop page: a persistent
   bottom tab bar, a native-feeling drawer-open animation, tap
   feedback on every card/button, tighter edge-to-edge spacing,
   more rounded/elevated cards, and a sticky mobile checkout bar.
   Everything here is additive and scoped to phone widths unless
   a selector says otherwise, so tablet/desktop are untouched.
   Appended (not edited in place above) so nothing already working
   can regress — later same-specificity rules win the cascade,
   the same pattern the rest of this file already relies on. */

/* ---- bottom tab bar (markup lives in footer.html > #appBottomNav) ---- */
.app-bottom-nav{display:none}
@media (max-width:760px){
  body:has(.app-bottom-nav){padding-bottom:calc(58px + env(safe-area-inset-bottom,0px))}
  /* Every property below is spelled out explicitly, even ones that look redundant, because
     this is a bare <nav> element and an older, unrelated rule elsewhere in this file
     (`nav{position:absolute;...top:76px;flex-direction:column;border-radius:1.2rem;...}`,
     scoped to the old header dropdown) targets ALL <nav> tags by element selector. A class
     selector beats it on any property both rules set, but a property only THIS rule's author
     forgets to set would otherwise silently leak in from that older rule (this bit us once
     already during testing - top:76px + bottom:0 with no height stretched the whole bar to
     768px tall). Setting every layout-relevant property here keeps this bar isolated from it. */
  .app-bottom-nav{
    display:flex;flex-direction:row;align-items:stretch;position:fixed;
    left:0;right:0;top:auto;bottom:0;height:auto;z-index:90;
    background:color-mix(in srgb,var(--panel) 96%,transparent);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    border:none;border-top:1px solid var(--line);border-radius:0;
    padding:.3rem .15rem calc(.3rem + env(safe-area-inset-bottom,0px));
    box-shadow:0 -10px 28px rgba(15,15,25,.10);
  }
  .abn-item{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;min-height:50px;padding:.2rem .1rem;border:none;background:none;color:var(--muted);font-size:.65rem;font-weight:700;cursor:pointer;border-radius:1rem;transition:color .15s ease,transform .12s ease;-webkit-tap-highlight-color:transparent}
  .abn-item svg{width:22px;height:22px;flex:0 0 auto}
  .abn-item.active{color:var(--pink)}
  .abn-item:active{transform:scale(.88)}
  .abn-icon-wrap{position:relative;display:flex}
  .abn-icon-wrap .cart-count-badge{top:-6px;right:-9px}
}
body[data-theme="dark"] .app-bottom-nav{box-shadow:0 -10px 28px rgba(0,0,0,.35)}

/* ---- native-feeling drawer open (hamburger menu, .saya-nav / #mainNav) ---- */
@keyframes missfitnDrawerIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:991px){
  .saya-nav.open{animation:missfitnDrawerIn .22s ease}
}

/* ---- tap / press feedback everywhere a card or button is the tap target ---- */
@media (max-width:760px){
  .btn,.product-card,.category-card,.cart-item,.arrival-chip,.checkout-card,.branch-card,#mainNav>a,#mainNav .nav-item>a{
    transition:transform .12s ease,box-shadow .15s ease,opacity .12s ease;
  }
  .btn:active,.product-card:active,.category-card:active,.cart-item:active,.arrival-chip:active,.branch-card:active{
    transform:scale(.97);opacity:.92;
  }
}

/* ---- edge-to-edge, elevated, rounded cards on phones ---- */
@media (max-width:760px){
  .container{width:min(1640px,calc(100% - 2rem))}
  .product-card,.category-card,.cart-item,.checkout-card,.panel{border-radius:1.4rem}
  .product-card{box-shadow:0 10px 26px rgba(15,15,25,.07)}
  .qty-control button{width:38px;height:38px}
  .btn{padding:1rem 1.2rem}
}
body[data-theme="dark"] .product-card{box-shadow:0 10px 26px rgba(0,0,0,.3)}

/* ---- sticky mobile "Total + Checkout" bar (cart.html) ---- */
.mobile-checkout-bar{display:none}
@media (max-width:760px){
  .mobile-checkout-bar.show{
    display:flex;align-items:center;justify-content:space-between;gap:1rem;
    position:fixed;left:0;right:0;bottom:calc(58px + env(safe-area-inset-bottom,0px));z-index:89;
    padding:.75rem 1rem;background:color-mix(in srgb,var(--panel) 97%,transparent);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    border-top:1px solid var(--line);box-shadow:0 -8px 22px rgba(15,15,25,.08);
  }
  .mcb-total{display:flex;flex-direction:column;line-height:1.15}
  .mcb-total span{font-size:.72rem;color:var(--muted)}
  .mcb-total strong{font-size:1.15rem}
  .mobile-checkout-bar .btn{padding:.85rem 1.3rem;white-space:nowrap}
}
body[data-theme="dark"] .mobile-checkout-bar.show{box-shadow:0 -8px 22px rgba(0,0,0,.32)}

/* ---- subtle native-style page-in animation, every page load ----
   Targets <main> rather than <body>: animating a *transform* on body would
   briefly make body the containing block for every position:fixed element
   on the page (header, bottom nav, checkout bar, floating buttons), which
   would drag them along with the fade instead of leaving them pinned. */
@keyframes missfitnPageIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:760px){
  main{animation:missfitnPageIn .28s ease}
}

/* ---- subcategory flyout hover grace period ----
   wireHoverGrace() in js/app.js toggles a `.hover-grace` class on the trigger element (the
   outer .nav-item.has-submenu wrapper, or a Dynamic-view .cat-nav-row) so the flyout it reveals
   stays open a little longer than raw CSS :hover would allow - long enough for the cursor to
   cross the gap to the flyout itself. These rules mirror the existing :hover-driven display
   rules exactly, just keyed off the class instead. */
.nav-item.has-submenu.hover-grace .shop-submenu{display:flex}
.cat-nav-row.hover-grace .cat-nav-flyout{display:grid}
.cat-nav-row.hover-grace .cat-nav-expand{transform:rotate(180deg)}
/* Mirrors the home-page transparent/not-yet-scrolled header override above (see the
   .home-page:not(.header-scrolled) block earlier in this file) so the grace period also works
   before the visitor has scrolled past the hero section. */
.home-page:not(.header-scrolled) #mainNav .nav-item.has-submenu.hover-grace .shop-submenu{
  display:flex!important;
}

/* ================= V102 tweaks ================= */
/* #1 — Subcategory flyout tiles: remove the ring/circle highlight, keep a hover zoom. */
.cat-nav-flyout-item.glow-target:hover{ box-shadow:none !important; border-color:transparent !important; transform:none !important; }
.cat-nav-flyout-item::after{ display:none !important; }
.cat-nav-flyout-item{ overflow:hidden; }
.cat-nav-flyout-item img, .cat-nav-flyout-noimg{ transition:transform .22s ease; }
.cat-nav-flyout-item:hover img, .cat-nav-flyout-item:hover .cat-nav-flyout-noimg{ transform:scale(1.06); }

/* #2 — Enlarge flyout cards ~90% (1.9x of the previous size) and keep 3 across (3x3) in both
   flyout variants. All widths, gaps, padding and the label scale together so the cards grow
   proportionally rather than just stretching. */
.cat-nav-flyout{ min-width:513px; max-width:661px; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.14rem; padding:1.52rem; }
.shop-submenu .cat-nav-row .cat-nav-flyout{ grid-template-columns:repeat(3,minmax(0,1fr)); min-width:593px; max-width:707px; }
.cat-nav-flyout-item{ padding:.95rem; gap:.86rem; }
.cat-nav-flyout-item span{ font-size:1.5rem; }

/* #4 — Keep words whole (no mid-word breaks) and balance headings/prose site-wide. */
p, li, h1, h2, h3, h4, h5, .ls-title, .ls-desc, .product-card-minimal h3,
.about-copy, .values-copy p, .hero-copy, .section-head h1, .section-head h3, .panel p{
  overflow-wrap:break-word; word-break:normal; -webkit-hyphens:none; hyphens:none;
}
h1, h2, h3, .section-head h1, .values-copy h4{ text-wrap:balance; }
p, .about-copy p, .values-copy p{ text-wrap:pretty; }
/* About intro copy: centered, comfortable measure instead of hugging the far-left of the wide page. */
.about-copy{ max-width:960px; margin-inline:auto; line-height:1.8; }
.about-copy p{ margin:0 0 1.1rem; }

/* ================= V104 — hamburger quick-action drawer ================= */
.nav-drawer-backdrop{position:fixed;inset:0;background:rgba(10,10,14,.42);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s;z-index:120}
.nav-drawer-backdrop.open{opacity:1;visibility:visible}
.nav-drawer{position:fixed;top:0;left:0;height:100%;width:min(340px,86vw);background:var(--panel);border-right:1px solid var(--line);box-shadow:0 20px 60px rgba(10,10,20,.28);transform:translateX(-102%);transition:transform .28s ease;z-index:121;display:flex;flex-direction:column;overflow-y:auto}
.nav-drawer.open{transform:none}
.nav-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:1.05rem 1.2rem;border-bottom:1px solid var(--line);font-weight:700;letter-spacing:.02em;font-size:1.02rem}
.nav-drawer-head button{all:unset;cursor:pointer;font-size:1.6rem;line-height:1;color:var(--muted);padding:0 .25rem}
.nd-search{display:flex;gap:.45rem;padding:.85rem 1.2rem;border-bottom:1px solid var(--line)}
.nd-search input{flex:1;min-width:0;background:var(--bg-soft);border:1px solid var(--line);border-radius:.7rem;padding:.6rem .8rem;color:var(--text)}
.nd-search button{all:unset;cursor:pointer;display:grid;place-items:center;width:42px;border-radius:.7rem;background:var(--brand-brown-dark,#3d3429)}
.nd-search button img{width:18px;height:18px;filter:brightness(0) invert(1)}
.nd-links{display:flex;flex-direction:column;padding:.55rem .6rem;border-bottom:1px solid var(--line)}
.nd-links a{padding:.68rem .8rem;border-radius:.6rem;color:var(--text);font-weight:600}
.nd-links a:hover{background:var(--bg-soft)}
.nd-actions{display:flex;flex-direction:column;padding:.55rem .6rem 1.3rem}
.nd-action{all:unset;cursor:pointer;display:flex;align-items:center;gap:.85rem;padding:.72rem .8rem;border-radius:.6rem;color:var(--text);font-weight:600}
.nd-action:hover{background:var(--bg-soft)}
.nd-action img{width:20px;height:20px;flex:0 0 20px;filter:brightness(0) saturate(100%) invert(26%) sepia(15%) saturate(727%) hue-rotate(349deg) brightness(91%) contrast(84%)}
body[data-theme="dark"] .nd-action img{filter:brightness(0) invert(1) opacity(.85)}
body.nav-drawer-open{overflow:hidden}
/* FAQ / policy accordions inside the feature modal */
.nd-faq details,.nd-policy-acc details{border:1px solid var(--line);border-radius:.6rem;margin-bottom:.5rem;background:var(--panel)}
.nd-faq summary,.nd-policy-acc summary{cursor:pointer;font-weight:600;padding:.62rem .75rem;list-style:none;position:relative}
.nd-faq summary::-webkit-details-marker,.nd-policy-acc summary::-webkit-details-marker{display:none}
.nd-faq summary::after,.nd-policy-acc summary::after{content:'+';position:absolute;right:.8rem;color:var(--muted)}
.nd-faq details[open] summary::after,.nd-policy-acc details[open] summary::after{content:'–'}
.nd-faq p{padding:.1rem .8rem .7rem;color:var(--muted);line-height:1.6;margin:0}
.nd-policy-acc>details>div{padding:.1rem .8rem .8rem;color:var(--muted);line-height:1.65;max-height:46vh;overflow:auto}

/* ================= V109 — Customer accounts: wishlist, addresses, notify, order tracking ================= */
/* Wishlist heart (shared look) */
.wish-heart svg{fill:none;stroke:#9a9a9a;stroke-width:2;stroke-linejoin:round}
.wish-heart.is-on svg{fill:var(--pink);stroke:var(--pink)}
/* Corner heart on product cards */
.product-card{position:relative}
.product-card>.wish-heart{position:absolute;top:.55rem;right:.55rem;z-index:6;width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,.92);box-shadow:0 2px 9px rgba(0,0,0,.16);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:transform .15s}
.product-card>.wish-heart svg{width:19px;height:19px}
.product-card>.wish-heart:hover{transform:scale(1.1)}
.list-card>.wish-heart{top:.7rem;right:.7rem}
/* Labeled wishlist button on the product page */
.detail-wishlist-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;margin-top:.55rem;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:.7rem 1rem;font-weight:600;cursor:pointer;transition:border-color .15s,color .15s}
.detail-wishlist-btn svg{width:18px;height:18px}
.detail-wishlist-btn:hover{border-color:var(--pink)}
.detail-wishlist-btn.is-on{border-color:var(--pink);color:var(--pink)}
/* Back-in-stock notify block */
.detail-notify{margin-top:.9rem;padding:.9rem 1rem;border:1px dashed var(--line);border-radius:12px;background:var(--bg-soft)}
.detail-notify-label{margin:0 0 .55rem;font-size:.9rem;color:var(--muted)}
.detail-notify-form{display:flex;gap:.5rem;flex-wrap:wrap}
.detail-notify-form input{flex:1 1 200px;min-width:0;padding:.6rem .7rem;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);font:inherit}
.detail-notify-form .btn{flex:0 0 auto}
.detail-notify-msg{margin-top:.5rem;font-size:.85rem}
.detail-notify-msg.is-ok{color:var(--green,#16a34a)}
.detail-notify-msg.is-error{color:var(--danger)}
/* Order tracking stepper (account page) */
.order-stepper{display:flex;flex-wrap:wrap;gap:.35rem;margin:.6rem 0}
.order-step{font-size:.72rem;font-weight:600;padding:.28rem .6rem;border-radius:999px;background:var(--bg-soft);color:var(--muted)}
.order-step.done{background:rgba(184,154,87,.18);color:var(--pink)}
.order-step.current{background:var(--pink);color:#fff}
.order-stepper.cancelled .order-step{background:rgba(220,38,38,.12);color:var(--danger)}
.order-tracking{margin:.1rem 0 .5rem;font-size:.85rem}
/* Account wishlist grid */
.account-wishlist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}
.wish-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.wish-thumb{display:block;aspect-ratio:1/1;overflow:hidden}
.wish-thumb img{width:100%;height:100%;object-fit:cover}
.wish-body{padding:.6rem .7rem;flex:1;display:flex;flex-direction:column;gap:.25rem}
.wish-name{font-weight:600;font-size:.9rem;color:var(--text);text-decoration:none;line-height:1.25}
.wish-name:hover{color:var(--pink)}
.wish-price{color:var(--pink);font-weight:700;font-size:.9rem}
.wish-remove{margin:0 .7rem .7rem;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:9px;padding:.4rem;font-size:.8rem;cursor:pointer}
.wish-remove:hover{border-color:var(--danger);color:var(--danger)}
/* Account addresses */
.account-addr-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}
.account-addr-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;margin-bottom:1rem}
.addr-card{border:1px solid var(--line);border-radius:12px;padding:.9rem 1rem;background:var(--panel)}
.addr-card.is-default{border-color:var(--pink);box-shadow:0 0 0 1px var(--pink)}
.addr-top{display:flex;align-items:center;gap:.5rem;margin-bottom:.3rem}
.addr-default-tag{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:var(--pink);color:#fff;padding:.12rem .4rem;border-radius:5px}
.addr-name{font-weight:600}
.addr-lines,.addr-phone{font-size:.85rem;margin-top:.2rem}
.addr-actions{display:flex;gap:.9rem;margin-top:.65rem;font-size:.82rem;flex-wrap:wrap}
.addr-actions .text-link{background:none;border:none;padding:0;cursor:pointer;color:var(--pink);font:inherit;font-size:.82rem}
.account-addr-form{border:1px solid var(--line);border-radius:12px;padding:1rem;background:var(--bg-soft);display:flex;flex-direction:column;gap:.6rem;max-width:560px}
.account-addr-form .two-col{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.account-addr-default{display:flex;align-items:center;gap:.5rem;font-size:.88rem}
.account-addr-actions{display:flex;gap:.6rem}
@media(max-width:520px){.account-addr-form .two-col{grid-template-columns:1fr}}
.product-photo-card{position:relative}
.product-photo-card>.wish-heart{position:absolute;top:.5rem;right:.5rem;z-index:6;width:34px;height:34px;border-radius:50%;border:none;background:rgba(255,255,255,.92);box-shadow:0 2px 9px rgba(0,0,0,.16);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.product-photo-card>.wish-heart svg{width:18px;height:18px}

/* ================= V110 — Marketing: offers, free-ship bar, newsletter, gift cards, points ================= */
/* Free-shipping progress bar (S9) */
.free-ship-bar{margin:.4rem 0 1rem;padding:.7rem .9rem;border:1px solid var(--line);border-radius:12px;background:var(--bg-soft)}
.fsb-text{font-size:.86rem;color:var(--text);margin-bottom:.5rem}
.fsb-track{height:8px;border-radius:99px;background:rgba(0,0,0,.08);overflow:hidden}
.fsb-fill{height:100%;background:var(--pink);border-radius:99px;transition:width .35s ease}
.free-ship-bar.is-complete .fsb-fill{background:var(--green,#16a34a)}
/* Offer apply block (S6/S7/S11) */
.offer-apply{display:flex;flex-direction:column;gap:.55rem;margin-bottom:1rem}
.offer-field{display:flex;gap:.5rem}
.offer-field input{flex:1;min-width:0;padding:.6rem .7rem;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);font:inherit}
.offer-field .btn{flex:0 0 auto}
.offer-points{border:1px dashed var(--line);border-radius:10px;padding:.6rem .7rem;background:var(--bg-soft)}
.offer-points-label{display:block;font-size:.82rem;color:var(--muted);margin-bottom:.4rem}
.offer-points-control{display:flex;gap:.5rem}
.offer-points-control input{flex:1;min-width:0;padding:.5rem .6rem;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--text);font:inherit}
.offer-msg{font-size:.82rem;color:var(--muted)}
.offer-msg.is-error{color:var(--danger)}
.checkout-totals.discount-line strong{color:var(--green,#16a34a)}
.offer-remove{border:none;background:none;color:var(--muted);cursor:pointer;font-size:1rem;line-height:1;padding:0 .1rem}
.offer-remove:hover{color:var(--danger)}
.points-earn-note{font-size:.8rem;color:var(--pink);margin-top:.5rem}
/* Footer newsletter (S8) */
.footer-newsletter{margin-top:1rem}
.footer-newsletter-row{display:flex;gap:.5rem;max-width:340px}
.footer-newsletter-row input{flex:1;min-width:0;padding:.55rem .7rem;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--text);font:inherit}
.footer-newsletter-msg{font-size:.8rem;margin-top:.4rem;min-height:1em}
.footer-newsletter-msg.is-ok{color:var(--green,#16a34a)}
.footer-newsletter-msg.is-error{color:var(--danger)}
/* Account points chip (S11) */
.account-head-right{display:flex;align-items:center;gap:1rem}
.account-points-chip{display:flex;flex-direction:column;align-items:center;background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;padding:.5rem .9rem;line-height:1.1}
.account-points-chip .apc-value{font-size:1.3rem;font-weight:800;color:var(--pink)}
.account-points-chip .apc-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
/* Buy-a-gift-card page (S7) */
.giftcard-buy-grid{align-items:start;gap:1.5rem}
.gc-label{display:block;font-weight:700;margin:1rem 0 .5rem;font-size:.9rem}
.gc-label:first-of-type{margin-top:0}
.gc-amounts{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.6rem}
.gc-amount{padding:.55rem .9rem;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);cursor:pointer;font-weight:600}
.gc-amount.active{background:var(--pink);color:#fff;border-color:var(--pink)}
.gc-payment-methods{display:flex;flex-direction:column;gap:.4rem}
.gc-pay-option{display:flex;align-items:center;gap:.5rem;border:1px solid var(--line);border-radius:9px;padding:.55rem .7rem;cursor:pointer}
.gc-preview{aspect-ratio:16/10;border-radius:16px;background:linear-gradient(135deg,#2a2015,#0f0b06);color:#f0e2c0;padding:1.4rem;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 20px 45px rgba(40,28,10,.3)}
.gc-preview-brand{font-weight:800;letter-spacing:.05em}
.gc-preview-label{font-size:.8rem;text-transform:uppercase;letter-spacing:.15em;opacity:.7}
.gc-preview-amount{font-size:2rem;font-weight:800;color:#e3c481}
.gc-preview-code{font-family:monospace;letter-spacing:2px;opacity:.75}

/* ================= V111 — Product experience: breadcrumbs, related, recently viewed, size guide, lightbox, share ================= */
/* Breadcrumbs (S17) */
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;font-size:.82rem;color:var(--muted);margin:0 0 1rem}
.breadcrumbs a{color:var(--muted);text-decoration:none}
.breadcrumbs a:hover{color:var(--pink)}
.breadcrumbs .bc-sep{color:var(--line);opacity:.9}
.breadcrumbs .bc-current{color:var(--text);font-weight:600}
/* Product rows: related (S12) + recently viewed (S13) */
.product-row-section{margin-top:2.5rem}
.product-row-title{font-size:1.3rem;margin:0 0 1rem;font-weight:700}
.product-row-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem}
@media(max-width:560px){.product-row-grid{grid-template-columns:repeat(2,1fr);gap:.7rem}}
/* Size guide (S14) */
.detail-size-label{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.size-guide-link{border:none;background:none;color:var(--pink);cursor:pointer;font-size:.82rem;font-weight:600;padding:0}
.size-guide-link:hover{text-decoration:underline}
.size-guide-note{font-size:.85rem;color:var(--muted);margin:.2rem 0 1rem}
.size-guide-table-wrap{overflow-x:auto}
.size-guide-table{width:100%;border-collapse:collapse;font-size:.9rem}
.size-guide-table th,.size-guide-table td{border:1px solid var(--line);padding:.5rem .7rem;text-align:center}
.size-guide-table thead th{background:var(--bg-soft);font-weight:700}
.size-guide-custom{white-space:pre-line;line-height:1.6}
/* Share (S16) */
.detail-share{display:flex;align-items:center;gap:.5rem;margin:.3rem 0 1rem;flex-wrap:wrap}
.detail-share-label{font-size:.82rem;color:var(--muted);font-weight:600;margin-right:.2rem}
.share-btn{width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer;transition:transform .14s,background .14s,color .14s;text-decoration:none}
.share-btn svg{width:18px;height:18px}
.share-btn:hover{transform:translateY(-2px)}
.share-wa:hover{background:#25d366;color:#fff;border-color:#25d366}
.share-fb:hover{background:#1877f2;color:#fff;border-color:#1877f2}
.share-x:hover{background:#000;color:#fff;border-color:#000}
.share-copy.copied{background:var(--green,#16a34a);color:#fff;border-color:var(--green,#16a34a)}
/* Zoom affordance on the main product image (S15) */
.detail-main-image-wrap{position:relative}
.detail-main-image{cursor:zoom-in}
.detail-zoom-btn{position:absolute;bottom:.7rem;right:.7rem;width:38px;height:38px;border-radius:50%;border:none;background:rgba(255,255,255,.92);color:#333;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 9px rgba(0,0,0,.18)}
.detail-zoom-btn svg{width:19px;height:19px}
/* Lightbox (S15) */
.mfn-lightbox{position:fixed;inset:0;z-index:2000;background:rgba(12,10,8,.92);display:flex;align-items:center;justify-content:center;padding:2rem}
.mfn-lightbox[hidden]{display:none}
.mfn-lightbox .lb-image{max-width:90vw;max-height:88vh;object-fit:contain;border-radius:6px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.mfn-lightbox .lb-close{position:absolute;top:1rem;right:1.4rem;font-size:2.4rem;line-height:1;color:#fff;background:none;border:none;cursor:pointer}
.mfn-lightbox .lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;font-size:2rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.mfn-lightbox .lb-nav:hover{background:rgba(255,255,255,.3)}
.mfn-lightbox .lb-prev{left:1.2rem}
.mfn-lightbox .lb-next{right:1.2rem}
body.lb-open{overflow:hidden}

/* ================= V112 — Discovery: faceted filters, search suggestions, quick view ================= */
/* Filters (S18) */
.rb-left{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;min-width:0}
.shop-filter-toggle-row{display:flex;align-items:center;gap:.7rem;margin:.2rem 0 .6rem}
.filters-toggle{display:inline-flex;align-items:center;gap:.45rem;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:10px;padding:.5rem .9rem;font:inherit;font-weight:600;cursor:pointer}
.filters-toggle svg{width:18px;height:18px}
.filters-toggle:hover,.filters-toggle.open{border-color:var(--pink);color:var(--pink)}
.filters-toggle.has-active{border-color:var(--pink)}
.active-filter-count{font-size:.78rem;color:var(--pink);font-weight:700}
.shop-filters{position:relative;display:flex;flex-direction:row;flex-wrap:wrap;gap:1.4rem 2.4rem;align-items:flex-start;padding:1.2rem 1.3rem;padding-right:9.5rem;margin-bottom:1rem;border:1px solid var(--line);border-radius:14px;background:var(--bg-soft)}
.shop-filters[hidden]{display:none}
.shop-filters>.facet-price{flex:0 0 auto;width:min(300px,100%)}
.facet-main{flex:1 1 380px;display:flex;flex-direction:column;gap:1.2rem;min-width:0}
.facet-group{display:flex;flex-direction:column;gap:.55rem;min-width:0}
.facet-main .facet-group{width:100%}
.facet-group[hidden]{display:none}
.facet-title{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.facet-chips{display:flex;flex-wrap:wrap;gap:.4rem;width:100%}
.facet-chip{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:99px;padding:.35rem .75rem;font:inherit;font-size:.85rem;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem}
.facet-chip:hover{border-color:var(--pink)}
.facet-chip.active{background:var(--pink);color:#fff;border-color:var(--pink)}
.facet-swatch{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.2);display:inline-block}
.facet-price-row{display:flex;align-items:center;gap:.4rem}
.facet-price-row input{width:84px;padding:.45rem .55rem;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);font:inherit}
.facet-price-hint{font-size:.76rem;color:var(--muted)}
.facet-clear{position:absolute;top:1.15rem;right:1.3rem;border:none;background:none;color:var(--pink);font:inherit;font-weight:600;cursor:pointer;padding:.3rem 0}
.facet-clear:hover{text-decoration:underline}
@media (max-width:700px){.shop-filters{padding-right:1.3rem}.facet-clear{position:static;align-self:flex-start;order:5}}
/* Search suggestions (S19) */
.header-search-form{position:relative}
.header-search-suggest{position:absolute;top:calc(100% + .4rem);right:0;width:min(360px,86vw);background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 45px rgba(20,15,10,.18);overflow:hidden;z-index:120}
.header-search-suggest[hidden]{display:none}
.hss-item{display:flex;align-items:center;gap:.7rem;padding:.55rem .8rem;text-decoration:none;color:var(--text);border-bottom:1px solid var(--line)}
.hss-item:hover{background:var(--bg-soft)}
.hss-item img{width:42px;height:42px;object-fit:cover;border-radius:8px;flex:0 0 auto;background:var(--bg-soft)}
.hss-name{flex:1;min-width:0;font-size:.88rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hss-price{font-size:.85rem;font-weight:700;color:var(--pink)}
.hss-all{width:100%;border:none;background:var(--bg-soft);color:var(--text);padding:.6rem;font:inherit;font-size:.82rem;font-weight:600;cursor:pointer;text-align:center}
.hss-all:hover{color:var(--pink)}
.hss-empty{padding:.8rem;font-size:.85rem;color:var(--muted);text-align:center}
/* Quick view (S20) */
.quickview-btn{position:absolute;left:.55rem;bottom:.55rem;z-index:6;border:none;background:rgba(20,16,12,.86);color:#fff;border-radius:99px;padding:.3rem .7rem;font:inherit;font-size:.72rem;font-weight:600;line-height:1;cursor:pointer;opacity:0;transform:translateY(8px);transition:opacity .16s,transform .16s;white-space:nowrap}
.product-card:hover .quickview-btn,.product-photo-card:hover .quickview-btn{opacity:1;transform:translateY(0)}
@media(hover:none){.quickview-btn{opacity:1;transform:none;left:.5rem;bottom:.5rem;background:rgba(20,16,12,.72);padding:.28rem .62rem;font-size:.7rem}}
.quickview-modal .feature-modal-dialog,.policy-popup-dialog.quickview-modal{max-width:820px;width:100%}
.quickview{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.qv-main{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px;background:var(--bg-soft)}
.qv-thumbs{display:flex;gap:.5rem;margin-top:.6rem;flex-wrap:wrap}
.qv-thumb{width:52px;height:52px;border-radius:8px;overflow:hidden;border:2px solid transparent;background:none;padding:0;cursor:pointer}
.qv-thumb.active{border-color:var(--pink)}
.qv-thumb img{width:100%;height:100%;object-fit:cover}
.qv-title{font-size:1.4rem;margin:.2rem 0 .5rem}
.qv-desc{color:var(--muted);font-size:.9rem;margin:.5rem 0 1rem}
.qv-field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.8rem}
.qv-field label{font-size:.8rem;font-weight:600}
.qv-field select{padding:.55rem .6rem;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--text);font:inherit}
.qv-avail{font-size:.85rem;color:var(--muted);margin:.2rem 0 .8rem}
.qv-info .btn{margin-bottom:.5rem}
@media(max-width:640px){.quickview{grid-template-columns:1fr}.qv-main{aspect-ratio:4/3}}

/* ================= V113 — Blog, SEO surface, analytics consent ================= */
/* Cookie consent (S25) */
.cookie-banner{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:1500;max-width:720px;margin:0 auto;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 50px rgba(20,15,10,.28);padding:1rem 1.2rem;display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;transform:translateY(140%);transition:transform .3s ease}
.cookie-banner.show{transform:translateY(0)}
.cookie-text{margin:0;flex:1;min-width:200px;font-size:.86rem;color:var(--muted)}
.cookie-actions{display:flex;gap:.5rem;flex:0 0 auto}
@media(max-width:520px){.cookie-banner{flex-direction:column;align-items:stretch}.cookie-actions{justify-content:flex-end}}
/* Blog / journal (S21) */
.blog-feature{display:grid;grid-template-columns:1.1fr 1fr;gap:1.6rem;align-items:center;text-decoration:none;color:var(--text);border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel);margin-bottom:2rem}
.blog-feature-media{aspect-ratio:16/10;overflow:hidden}
.blog-feature-media img{width:100%;height:100%;object-fit:cover}
.blog-feature-body{padding:1.5rem 1.8rem 1.5rem 0}
.blog-feature-body h2{font-size:1.6rem;margin:.3rem 0 .6rem}
.blog-readmore{color:var(--pink);font-weight:700}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.4rem}
.blog-card{text-decoration:none;color:var(--text);border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel);display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s}
.blog-card:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,15,10,.12)}
.blog-card-media{aspect-ratio:16/10;overflow:hidden}
.blog-card-media img{width:100%;height:100%;object-fit:cover}
.blog-card-body{padding:1rem 1.1rem 1.2rem}
.blog-card-body h3{font-size:1.1rem;margin:.25rem 0 .5rem}
.blog-date{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0}
.blog-excerpt{color:var(--muted);font-size:.9rem;margin:.3rem 0 0;line-height:1.5}
.blog-post{max-width:760px;margin:0 auto}
.blog-post-title{font-size:2.1rem;margin:.4rem 0 1rem;line-height:1.15}
.blog-post-cover{border-radius:16px;overflow:hidden;margin-bottom:1.5rem}
.blog-post-cover img{width:100%;height:auto;display:block}
.blog-post-body{font-size:1.05rem;line-height:1.75}
.blog-post-body p{margin:0 0 1.1rem}
.blog-back{margin-top:2rem}
.blog-back a{color:var(--pink);text-decoration:none;font-weight:600}
.footer-journal-link{display:inline-block;margin-top:.6rem;color:var(--pink);text-decoration:none;font-weight:600;font-size:.9rem}
@media(max-width:640px){.blog-feature{grid-template-columns:1fr}.blog-feature-body{padding:0 1.3rem 1.5rem}}

/* V116 — About page refined layout: full-width, structured, no side gaps */
.about-intro{margin:.4rem 0 2.4rem}
.about-intro-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:2.6rem;align-items:start}
.about-intro .ai-head h2{font-size:clamp(1.8rem,3.2vw,2.8rem);line-height:1.1;margin:.3rem 0 0;text-wrap:balance}
.about-intro-lead p{color:var(--muted);line-height:1.85;font-size:1.05rem;margin:0 0 1.1rem;text-wrap:pretty}
.about-intro-lead p:last-of-type{margin-bottom:0}
.about-intro-lead strong{color:var(--text)}
.about-countries{margin-top:1.3rem;display:flex;flex-wrap:wrap;gap:.5rem}
.about-country{font-size:.8rem;padding:.4rem .8rem;border-radius:999px;background:var(--bg-soft);border:1px solid var(--line);color:var(--muted)}
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin:0 0 2.6rem}
.about-stat{padding:1.4rem 1.3rem;border-radius:1.3rem;background:color-mix(in srgb,var(--panel) 98%,transparent);border:1px solid color-mix(in srgb,var(--line) 90%,transparent);box-shadow:var(--shadow)}
.about-stat strong{display:block;font-size:2.3rem;line-height:1;font-weight:800;background:linear-gradient(135deg,var(--pink),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}
.about-stat span{display:block;margin-top:.5rem;color:var(--muted);font-size:.92rem}
.about-features{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin:0 0 3rem}
.about-feature{padding:1.5rem 1.4rem;border-radius:1.3rem;background:color-mix(in srgb,var(--panel) 98%,transparent);border:1px solid color-mix(in srgb,var(--line) 90%,transparent);box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease}
.about-feature:hover{transform:translateY(-3px);box-shadow:0 18px 40px color-mix(in srgb,var(--pink) 12%,transparent),var(--shadow)}
.about-feature .af-ico{width:46px;height:46px;border-radius:1rem;display:grid;place-items:center;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 20%,transparent),color-mix(in srgb,var(--pink) 20%,transparent));margin-bottom:.95rem}
.about-feature .af-ico svg{width:23px;height:23px;color:var(--text)}
.about-feature h4{margin:0 0 .4rem;font-size:1.06rem}
.about-feature p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.6}
.about-branches-head{margin-bottom:1rem}
.about-branches-head h3{margin:.2rem 0 .4rem}
.about-branches-head .small-muted{max-width:640px;margin:0}
@media (max-width:980px){.about-intro-grid{grid-template-columns:1fr;gap:1.2rem}.about-stats{grid-template-columns:repeat(2,1fr)}.about-features{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.about-stats,.about-features{grid-template-columns:1fr}}

/* ==================== V117 — P4/P5/P9/P10/P11 ==================== */
/* P9 — Branches / store locator */
.branch-locator{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin:.4rem 0 2.6rem}
.branch-loc-card{display:flex;flex-direction:column;border:1px solid color-mix(in srgb,var(--line) 90%,transparent);border-radius:1.3rem;overflow:hidden;background:color-mix(in srgb,var(--panel) 98%,transparent);box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease}
.branch-loc-card:hover{transform:translateY(-3px)}
.branch-loc-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-soft)}
.branch-loc-media img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.branch-loc-card:hover .branch-loc-media img{transform:scale(1.05)}
.branch-loc-region{position:absolute;top:.6rem;left:.6rem;font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.3rem .6rem;border-radius:999px;background:color-mix(in srgb,var(--bg) 78%,transparent);color:var(--text);backdrop-filter:blur(4px)}
.branch-loc-body{padding:1rem 1.1rem 1.15rem;display:flex;flex-direction:column;gap:.35rem}
.branch-loc-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.branch-loc-top h3{margin:0;font-size:1.1rem}
.branch-loc-role{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding:.2rem .5rem;border-radius:999px;background:var(--bg-soft)}
.branch-loc-role.is-hq{color:#fff;background:linear-gradient(135deg,var(--pink),var(--purple))}
.branch-loc-city{display:flex;align-items:center;gap:.4rem;margin:0;color:var(--muted);font-size:.92rem}
.branch-loc-city svg{width:16px;height:16px;flex:0 0 auto;color:var(--pink)}
.branch-loc-link{margin-top:.35rem;font-weight:600;color:var(--blue);font-size:.9rem}
.branch-cta{display:flex;align-items:center;justify-content:space-between;gap:1.4rem;flex-wrap:wrap;border-radius:1.4rem}
.branch-cta h3{margin:0 0 .3rem}
.branch-cta-actions{display:flex;gap:.7rem;flex-wrap:wrap}
@media (max-width:980px){.branch-locator{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.branch-locator{grid-template-columns:1fr}}

/* P10 — Language switcher + RTL */
.lang-switch{position:relative}
.lang-switch-btn{display:inline-flex;align-items:center;gap:.35rem}
.lang-switch-btn svg{width:19px;height:19px}
.lang-switch-current{font-size:.75rem;font-weight:700;letter-spacing:.03em}
.lang-switch-menu{position:absolute;top:calc(100% + .5rem);right:0;min-width:170px;background:var(--panel);border:1px solid var(--line);border-radius:.9rem;box-shadow:var(--shadow);padding:.35rem;display:none;z-index:120}
.lang-switch.open .lang-switch-menu{display:block}
.lang-switch-menu button{display:flex;align-items:center;justify-content:space-between;gap:.6rem;width:100%;border:none;background:none;color:var(--text);padding:.55rem .7rem;border-radius:.6rem;cursor:pointer;font-size:.9rem}
.lang-switch-menu button:hover{background:var(--bg-soft)}
.lang-switch-menu button.active{background:color-mix(in srgb,var(--pink) 12%,var(--panel));font-weight:700}
.lang-switch-menu small{color:var(--muted);font-size:.72rem;font-weight:700}
html[dir="rtl"] .lang-switch-menu{right:auto;left:0}
html[dir="rtl"] .about-intro-grid,html[dir="rtl"] .breadcrumbs{text-align:right}
body.rtl .header-search-suggest{right:auto;left:0}

/* P5 — Product comparison */
.compare-chip{position:absolute;top:.55rem;left:.55rem;z-index:6;width:34px;height:34px;border-radius:50%;border:none;background:rgba(255,255,255,.92);box-shadow:0 2px 9px rgba(0,0,0,.16);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:transform .15s,background .15s,color .15s;color:#333}
.compare-chip svg{width:18px;height:18px}
.compare-chip:hover{transform:scale(1.08)}
.compare-chip.active{background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff}
.product-photo-card{position:relative}
.compare-action{position:static;width:100%;height:auto;border-radius:1rem;gap:.5rem;background:var(--panel);color:var(--text);border:1px solid var(--line);box-shadow:none;margin-top:.2rem}
.compare-action svg{width:18px;height:18px}
.compare-action.active{background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff;border-color:transparent}
.compare-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:1.1rem;z-index:58;max-width:calc(100% - 1.5rem)}
.compare-bar-inner{display:flex;align-items:center;gap:1rem;background:var(--panel);border:1px solid var(--line);box-shadow:0 14px 40px rgba(20,15,10,.22);border-radius:999px;padding:.5rem .5rem .5rem 1.2rem}
.compare-bar-count{font-size:.92rem;white-space:nowrap}
.compare-bar-count b{color:var(--pink)}
.compare-bar-actions{display:flex;align-items:center;gap:.5rem}
.compare-bar-actions .btn{padding:.6rem 1.1rem;border-radius:999px}
.compare-bar-clear{border:none;background:none;color:var(--muted);cursor:pointer;font:inherit;padding:.4rem .6rem;border-radius:999px}
.compare-bar-clear:hover{color:var(--text)}
@media (max-width:600px){.compare-bar{bottom:5.2rem}}
.compare-modal h3{margin:0 0 1rem}
.compare-table-wrap{overflow-x:auto}
.compare-table{border-collapse:collapse;width:100%;min-width:420px}
.compare-table th,.compare-table td{border:1px solid var(--line);padding:.7rem .8rem;text-align:left;vertical-align:top;font-size:.9rem}
.compare-table thead th{background:var(--bg-soft);vertical-align:bottom}
.compare-table .cmp-corner{background:transparent;border:none}
.cmp-head{display:flex;flex-direction:column;gap:.4rem;align-items:flex-start;color:var(--text)}
.cmp-head img{width:100%;max-width:120px;aspect-ratio:3/4;object-fit:cover;border-radius:.6rem;background:var(--bg-soft)}
.cmp-head span{font-weight:700;line-height:1.2}
.cmp-rm{margin-top:.4rem;border:none;background:none;color:var(--pink);cursor:pointer;font:inherit;font-size:.8rem;padding:0}
.cmp-rm:hover{text-decoration:underline}
.cmp-row-label{font-weight:700;background:var(--bg-soft);white-space:nowrap}
.cmp-in{color:var(--green,#2e8b57);font-weight:600}
.cmp-out{color:var(--danger,#c0392b);font-weight:600}

/* P4 — Product video */
.detail-video{margin-top:1rem}
.detail-video-label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
.detail-video-frame{position:relative;width:100%;aspect-ratio:16/9;border-radius:1rem;overflow:hidden;background:#000}
.detail-video-frame iframe,.detail-video-frame video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.detail-video-frame a.btn{position:absolute;inset:auto;left:50%;top:50%;transform:translate(-50%,-50%)}

/* P11 — Install app button */
.pwa-install-btn{margin-top:.9rem;display:inline-flex;align-items:center;gap:.45rem}

/* V119 — results count on the breadcrumb row (right-aligned), quick-view fixes */
.shop-topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.15rem}
.shop-topbar #shopBreadcrumb{flex:1 1 auto;min-width:0;margin:0}
.shop-topbar-count{color:var(--muted);font-size:.92rem;white-space:nowrap;flex:0 0 auto}
@media (max-width:560px){.shop-topbar-count{font-size:.85rem}}

/* ==================== V121 — order mgmt + storefront (A10-12, N1-2, P1-3, P13) ==================== */
/* P3 — WhatsApp float */
.wa-float{position:relative;width:60px;height:60px;border-radius:50%;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(37,211,102,.4);text-decoration:none}
.wa-float svg{width:34px;height:34px}
.wa-float:hover{transform:translateY(-2px)}
/* P13 — customer review photos */
.product-photos-section{margin-top:2rem}
.review-photo-strip{display:flex;gap:.6rem;flex-wrap:wrap}
.review-photo-thumb{border:none;padding:0;background:none;cursor:pointer;width:96px;height:120px;border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.review-photo-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.review-photo-thumb:hover img{transform:scale(1.06)}
/* P2 — product Q&A (storefront) */
.product-qa-section{margin-top:2.4rem;border-top:1px solid var(--line);padding-top:1.6rem}
.qa-list{display:flex;flex-direction:column;gap:1rem;margin:1rem 0 1.4rem}
.qa-item{background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:1rem 1.1rem}
.qa-q{margin:0 0 .5rem;font-weight:600;display:flex;gap:.5rem;align-items:flex-start}
.qa-a{margin:0;color:var(--muted);display:flex;gap:.5rem;align-items:flex-start}
.qa-badge{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:var(--ink,#1c1c22);color:#fff;font-size:.72rem;font-weight:800;display:grid;place-items:center}
.qa-badge-a{background:var(--pink)}
.qa-asker{display:block;margin-top:.5rem;font-size:.78rem;color:var(--muted)}
.qa-empty{margin:.6rem 0 1.2rem}
.qa-form{display:flex;flex-direction:column;gap:.6rem;max-width:560px}
.qa-form input,.qa-form textarea{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:.7rem .8rem;color:var(--text);font:inherit}
.qa-form .btn{align-self:flex-start}
.qa-msg{font-size:.88rem}
.qa-ok{color:var(--green,#2e8b57)}
.qa-err{color:var(--danger,#c0392b)}
/* P1 — guest order tracking */
.track-form{display:flex;gap:.6rem;flex-wrap:wrap;max-width:640px;margin:1rem 0 1.4rem}
.track-form input{flex:1 1 200px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:.8rem .9rem;color:var(--text);font:inherit}
.track-card{padding:1.4rem}
.track-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.track-head h3{margin:.2rem 0 0}
.track-status-badge{background:var(--ink,#1c1c22);color:#fff;padding:.35rem .8rem;border-radius:999px;font-weight:700;font-size:.85rem}
.track-steps{list-style:none;display:flex;gap:0;padding:0;margin:1rem 0;counter-reset:s}
.track-step{flex:1;position:relative;text-align:center;color:var(--muted);font-size:.82rem;padding-top:26px}
.track-step .track-dot{position:absolute;top:0;left:50%;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;background:var(--line);border:2px solid var(--line)}
.track-step::before{content:'';position:absolute;top:7px;left:-50%;width:100%;height:2px;background:var(--line)}
.track-step:first-child::before{display:none}
.track-step.done{color:var(--text)}
.track-step.done .track-dot{background:var(--pink);border-color:var(--pink)}
.track-step.done::before{background:var(--pink)}
.track-step.current .track-dot{box-shadow:0 0 0 4px color-mix(in srgb,var(--pink) 25%,transparent)}
.track-cancelled{padding:1rem;background:color-mix(in srgb,var(--danger,#c0392b) 10%,transparent);border-radius:10px;color:var(--danger,#c0392b);font-weight:600}
.track-courier{margin:.4rem 0 1rem;padding:.7rem .9rem;background:var(--bg-soft);border-radius:10px}
.track-cols{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:1rem}
.track-cols h4{font-size:.95rem;margin:0 0 .5rem}
.track-items,.track-timeline{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.4rem;font-size:.9rem;color:var(--muted)}
.track-total{margin-top:.7rem;color:var(--text)}
.track-return-wrap{margin-top:1.2rem;border-top:1px solid var(--line);padding-top:1rem}
.track-return-form{display:flex;flex-direction:column;gap:.6rem;max-width:520px;margin-top:.8rem}
.track-return-form textarea{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:.7rem .8rem;color:var(--text);font:inherit}
@media (max-width:640px){.track-cols{grid-template-columns:1fr}}
/* Admin — order tracking form + product picker + qa/returns rows */
.order-tracking-form{display:flex;gap:.6rem;align-items:flex-end;flex-wrap:wrap;margin-top:.6rem}
.tracking-notify{display:flex;align-items:center;gap:.35rem;font-size:.85rem;white-space:nowrap}
.op-picker{position:relative;margin-bottom:.6rem}
.op-results{position:absolute;top:100%;left:0;right:0;z-index:20;background:#fff;border:1px solid var(--line,#e5e5ea);border-radius:8px;box-shadow:0 12px 30px rgba(0,0,0,.12);max-height:240px;overflow:auto}
.op-result{display:block;width:100%;text-align:left;border:none;background:none;padding:.55rem .7rem;cursor:pointer;font:inherit}
.op-result:hover{background:var(--paper,#f4f4f8)}
.qa-admin-row,.ret-admin-row{border:1px solid var(--line,#e5e5ea);border-radius:12px;padding:1rem;margin-bottom:.8rem}
.qa-admin-q,.ret-admin-reason{margin:.5rem 0;font-weight:500}
.qa-admin-actions,.ret-admin-actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-top:.6rem}
.ret-admin-actions .ret-note{max-width:260px}

/* V123 — Photo Grid: hover image flip + 20% smaller cart button */
.product-photo-card{position:relative}
.product-photo-card .pc-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .4s ease,transform .5s ease}
.product-photo-card .pc-img-second{opacity:0}
.product-photo-card.has-second:hover .pc-img-main{opacity:0}
.product-photo-card.has-second:hover .pc-img-second{opacity:1}
.product-photo-card:hover .pc-img{transform:scale(1.04)}
/* Cart button shrunk ~20% in the dense photo grid */
.product-photo-card .image-cart-btn{width:43px;height:43px}
.product-photo-card .image-cart-btn .cart-icon-glyph{font-size:1rem}