:root{
  --org:#E8510A;--org-dk:#c04008;--org-lt:#FFF2EC;--org-mid:#f47840;--red:#b83020;
  --ink:#18120a;--ink2:#38280e;--ink3:#7a6a52;
  --bg:#FAF8F4;--bg2:#F4EDE3;--bg3:#EAE0D3;
  --white:#fff;--border:rgba(24,18,10,0.08);--bord-o:rgba(232,81,10,0.22);
  --green:#2a6049;
  --ff-d:'Playfair Display',serif;--ff-b:'Outfit',sans-serif;
  --shadow-sm:0 2px 12px rgba(24,18,10,.06);
  --shadow-md:0 8px 32px rgba(24,18,10,.1);
  --shadow-org:0 8px 28px rgba(232,81,10,.22);
  /* Luxury system */
  --gold:#C8A862;--gold-dk:#9A7C3A;--gold-lt:rgba(200,168,98,.08);
  --gold-mid:#D4B878;--gold-border:rgba(200,168,98,.2);
  --lux:#0B0A0F;--lux2:#131121;--lux3:#1C1A2E;
  --cream:#F4EDE2;--cream-dim:rgba(244,237,226,.50);
  --cream-faint:rgba(244,237,226,.15);
  --warm-dark:#1E1A14;--warm-dark2:#261F17;
}
/* Dark transparent nav over dark hero */
nav.at-top{background:rgba(11,10,15,0)!important;backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;border-bottom-color:rgba(200,168,98,.1)!important;box-shadow:none!important;}
nav.at-top .wm1{color:#fff!important;}
nav.at-top .wm2{color:rgba(244,237,226,.3)!important;}
nav.at-top .nav-links a{color:rgba(244,237,226,.62)!important;}
nav.at-top .nav-links a:hover{color:#fff!important;}
nav.at-top .hamburger span{background:#fff!important;}
nav.at-top .btn-org{background:var(--org)!important;color:#fff!important;}
/* Warm scrolled nav */
nav.scrolled{background:rgba(250,248,244,.93)!important;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--ink);font-family:var(--ff-b);font-weight:300;line-height:1.7;overflow-x:hidden;}
h1,h2,h3,h4{font-family:var(--ff-d);font-weight:500;line-height:1.15;}
.ctr{max-width:1280px;margin:0 auto;padding:0 2rem;}
.lbl{font-size:.66rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--org);margin-bottom:.6rem;display:block;}
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.4rem;font-family:var(--ff-b);font-size:.73rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;text-decoration:none;border:none;cursor:pointer;transition:all .22s;line-height:1;}
.btn-org{background:var(--org);color:#fff;}
.btn-org:hover{background:var(--org-dk);transform:translateY(-2px);box-shadow:var(--shadow-org);}
.btn-out{background:transparent;color:var(--ink);border:1px solid var(--border);}
.btn-out:hover{border-color:var(--org);color:var(--org);}
.btn-ink{background:var(--ink);color:#fff;}
.btn-ink:hover{background:var(--ink2);transform:translateY(-2px);}
.tag{display:inline-block;font-size:.62rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:.18rem .55rem;background:var(--org);color:#fff;}
.tag-green{background:var(--green);}
.tag-ink{background:var(--ink);}

/* SCROLL PROGRESS */
#sprog{position:fixed;top:0;left:0;height:3px;background:var(--org);z-index:100000;width:0%;pointer-events:none;transition:width .1s;}

/* REDUCED MOTION */
@media (prefers-reduced-motion: reduce) {
  *{transition:none!important;animation:none!important;}
  html{scroll-behavior:auto;}
}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:9000;padding:.9rem 0;background:rgba(255,255,255,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);transition:all .3s;}
nav.scrolled{padding:.55rem 0;box-shadow:0 2px 30px rgba(24,18,10,.07);}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.nav-logo{text-decoration:none;display:flex;align-items:center;gap:.65rem;}
.wm1{font-family:var(--ff-d);font-size:0.82rem;font-weight:700;color:var(--org);text-transform:uppercase;letter-spacing:.04em;}
.wm2{font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink3);margin-top:2px;}
.wm{display:flex;flex-direction:column;line-height:1;}
.nav-links{display:flex;gap:1.8rem;list-style:none;}
.nav-links a{color:var(--ink2);text-decoration:none;font-size:.76rem;letter-spacing:.06em;font-weight:400;transition:color .2s;position:relative;}
.nav-links a::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:1.5px;background:var(--org);transform:scaleX(0);transition:transform .25s;}
.nav-links a:hover,.nav-links a.active{color:var(--org);}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1);}
.nav-actions{display:flex;align-items:center;gap:.6rem;}
.cart-btn{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:transparent;cursor:pointer;transition:all .2s;}
.cart-btn:hover{border-color:var(--org);background:var(--org-lt);}
.cart-count{position:absolute;top:-5px;right:-5px;width:18px;height:18px;background:var(--org);color:#fff;font-size:.6rem;font-weight:700;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--ff-b);display:none;}
.cart-count.show{display:flex;}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:0;cursor:pointer;}
.hamburger span{width:22px;height:1.5px;background:var(--ink);display:block;transition:all .3s;}
.mob-nav{display:none;position:fixed;inset:0;z-index:9500;background:#fff;flex-direction:column;align-items:center;justify-content:center;gap:1.8rem;}
.mob-nav.open{display:flex;}
.mob-nav a{font-family:var(--ff-d);font-size:2rem;color:var(--ink);text-decoration:none;transition:color .2s;}
.mob-nav a:hover{color:var(--org);}
.mob-close{position:absolute;top:1.5rem;right:1.5rem;background:none;border:none;font-size:2rem;color:var(--ink3);cursor:pointer;}

/* HERO BANNER — luxury dark */
#shop-hero{background:var(--lux);padding:7.5rem 0 4rem;position:relative;overflow:hidden;margin-top:0;}
#shop-hero::before{content:'';position:absolute;inset:0;
  background-image:repeating-linear-gradient(60deg,transparent,transparent 40px,rgba(200,168,98,.02) 40px,rgba(200,168,98,.02) 41px),repeating-linear-gradient(-60deg,transparent,transparent 40px,rgba(200,168,98,.015) 40px,rgba(200,168,98,.015) 41px);
  pointer-events:none;}
#shop-hero::after{content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 70% 30%,rgba(232,81,10,.12) 0%,transparent 55%);
  pointer-events:none;}
.hero-stripe-top{position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),var(--org),var(--gold),transparent);}
.shop-hero-inner{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:3rem;flex-wrap:wrap;}
.shop-hero-eyebrow{font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:.8rem;margin-bottom:1.5rem;font-family:var(--ff-b);}
.shop-hero-eyebrow::before{content:'';height:1px;width:28px;background:var(--gold);flex-shrink:0;}
.shop-hero-left h1{font-size:clamp(2.2rem,4.5vw,4rem);color:var(--cream);line-height:1.08;letter-spacing:-.02em;margin-bottom:.8rem;}
.shop-hero-left h1 em{color:var(--org);font-style:italic;text-shadow:0 4px 32px rgba(232,81,10,.3);}
.shop-hero-left p{font-size:.92rem;color:var(--cream-dim);max-width:500px;line-height:1.85;}
.shop-hero-stats{display:flex;gap:2rem;flex-wrap:wrap;padding-top:2rem;border-top:1px solid rgba(244,237,226,.07);}
.sh-stat .n{font-family:var(--ff-d);font-size:1.8rem;color:var(--org);font-weight:700;line-height:1;text-shadow:0 4px 24px rgba(232,81,10,.3);}
.sh-stat .l{font-size:.62rem;color:var(--cream-faint);letter-spacing:.12em;text-transform:uppercase;margin-top:.2rem;}
/* Mode bar on warm tan */
#mode-bar{background:var(--bg3);border-bottom:1px solid var(--border);}

/* MODE SWITCHER */
#mode-bar{background:var(--bg3);border-bottom:1px solid var(--border);padding:.7rem 0;}
.mode-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.mode-tabs{display:flex;gap:.3rem;}
.mode-tab{padding:.45rem 1.2rem;font-family:var(--ff-b);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--border);background:transparent;color:var(--ink3);cursor:pointer;transition:all .2s;}
.mode-tab.active{background:var(--org);color:#fff;border-color:var(--org);}
.mode-note{font-size:.72rem;color:var(--ink3);}
.mode-note strong{color:var(--org);}

/* SEARCH BAR */
#search-bar{background:var(--bg2);padding:1.2rem 0;border-bottom:1px solid var(--border);}
.search-row{display:flex;gap:.6rem;align-items:center;}
.search-wrap{position:relative;flex:1;max-width:520px;}
.search-wrap input{width:100%;padding:.65rem 1rem .65rem 2.6rem;border:1px solid var(--border);background:var(--bg);font-family:var(--ff-b);font-size:.86rem;color:var(--ink);outline:none;transition:border-color .2s;}
.search-wrap input:focus{border-color:var(--org);}
.search-icon{position:absolute;left:.8rem;top:50%;transform:translateY(-50%);color:var(--ink3);pointer-events:none;}
.search-clear{position:absolute;right:.8rem;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--ink3);cursor:pointer;font-size:1rem;display:none;}
.search-wrap input:not(:placeholder-shown) ~ .search-clear{display:block;}
.sort-select{padding:.65rem .9rem;border:1px solid var(--border);background:var(--bg);font-family:var(--ff-b);font-size:.82rem;color:var(--ink);outline:none;cursor:pointer;appearance:none;padding-right:2rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237a6a52' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .6rem center;}
.result-count{font-size:.78rem;color:var(--ink3);margin-left:auto;}

/* LAYOUT */
#shop-main{padding:2.5rem 0 5rem;}
.shop-layout{display:grid;grid-template-columns:240px 1fr;gap:2.5rem;align-items:start;}

/* SIDEBAR FILTERS */
.sidebar{position:sticky;top:5.5rem;}
.filter-section{border-bottom:1px solid var(--border);padding-bottom:1.4rem;margin-bottom:1.4rem;}
.filter-section:last-child{border-bottom:none;}
.filter-title{font-family:var(--ff-d);font-size:.92rem;color:var(--ink);margin-bottom:.9rem;display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none;}
.filter-title::after{content:'−';font-size:1.1rem;color:var(--ink3);}
.filter-title.collapsed::after{content:'+';}
.filter-body{overflow:hidden;transition:max-height .3s ease;}
.filter-body.collapsed{max-height:0!important;}
.filter-check{display:flex;align-items:center;gap:.6rem;margin-bottom:.55rem;cursor:pointer;font-size:.82rem;color:var(--ink2);}
.filter-check input{accent-color:var(--org);width:14px;height:14px;cursor:pointer;}
.filter-check:hover{color:var(--org);}
.filter-count{margin-left:auto;font-size:.68rem;color:var(--ink3);}
.price-range{display:flex;gap:.5rem;align-items:center;margin-top:.3rem;}
.price-range input{width:80px;padding:.45rem .6rem;border:1px solid var(--border);font-family:var(--ff-b);font-size:.8rem;color:var(--ink);outline:none;}
.price-range input:focus{border-color:var(--org);}
.price-range span{font-size:.8rem;color:var(--ink3);}
.filter-clear{font-size:.7rem;color:var(--org);background:none;border:none;cursor:pointer;letter-spacing:.06em;text-transform:uppercase;padding:.3rem 0;}
.active-filters{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:1.2rem;}
.af-tag{display:flex;align-items:center;gap:.3rem;padding:.22rem .6rem;background:var(--org-lt);border:1px solid var(--bord-o);font-size:.68rem;color:var(--org);}
.af-tag button{background:none;border:none;color:var(--org);cursor:pointer;font-size:.75rem;line-height:1;padding:0;}
.moq-badge{display:inline-flex;align-items:center;gap:.35rem;font-size:.68rem;color:var(--green);background:rgba(42,96,73,.08);border:1px solid rgba(42,96,73,.2);padding:.2rem .55rem;margin-top:.6rem;}

/* PRODUCT GRID */
.products-area{}
.products-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;flex-wrap:wrap;gap:.8rem;}
.view-toggle{display:flex;gap:.3rem;}
.vt-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:transparent;cursor:pointer;transition:all .2s;color:var(--ink3);}
.vt-btn.active,.vt-btn:hover{border-color:var(--org);background:var(--org-lt);color:var(--org);}
.prod-grid{display:grid;gap:1px;background:var(--border);}
.prod-grid.grid-4{grid-template-columns:repeat(4,1fr);}
.prod-grid.grid-3{grid-template-columns:repeat(3,1fr);}
.prod-grid.grid-list{grid-template-columns:1fr;}
.no-results{grid-column:1/-1;text-align:center;padding:4rem 2rem;color:var(--ink3);}
.no-results h3{font-family:var(--ff-d);font-size:1.4rem;color:var(--ink);margin-bottom:.6rem;}

/* PRODUCT CARD */
.prod-card{background:var(--bg);overflow:hidden;transition:all .25s;position:relative;cursor:pointer;}
.prod-card:hover{z-index:2;box-shadow:var(--shadow-md);}
.prod-card-img{aspect-ratio:3/4;background:var(--bg3);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;color:var(--ink3);font-size:.72rem;position:relative;overflow:hidden;border-bottom:1px solid var(--border);}
.prod-card-img svg{opacity:.15;}
.prod-card-img .img-overlay{position:absolute;inset:0;background:rgba(24,18,10,.5);display:flex;align-items:center;justify-content:center;gap:.7rem;opacity:0;transition:opacity .25s;}
.prod-card:hover .img-overlay{opacity:1;}
.prod-card-img::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--org),var(--org-mid));transform:scaleX(0);transition:transform .3s;transform-origin:left;}
.prod-card:hover .prod-card-img::after{transform:scaleX(1);}
.badges{position:absolute;top:.7rem;left:.7rem;display:flex;flex-direction:column;gap:.3rem;z-index:1;}
.wishlist-btn{position:absolute;top:.7rem;right:.7rem;width:30px;height:30px;background:rgba(255,255,255,.9);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;z-index:1;color:var(--ink3);}
.wishlist-btn:hover,.wishlist-btn.active{color:var(--org);background:#fff;}
.prod-card-body{padding:1.1rem;}
.prod-card-name{font-family:var(--ff-d);font-size:1rem;color:var(--ink);margin-bottom:.25rem;transition:color .2s;}
.prod-card:hover .prod-card-name{color:var(--org);}
.prod-card-meta{font-size:.72rem;color:var(--ink3);margin-bottom:.3rem;}
.prod-card-price{font-family:var(--ff-d);font-size:1.05rem;color:var(--ink);margin-bottom:.3rem;}
.prod-card-price .b2b-note{font-size:.65rem;color:var(--org);font-family:var(--ff-b);font-style:normal;margin-left:.4rem;}
.prod-card-moq{font-size:.65rem;color:var(--org);letter-spacing:.05em;margin-bottom:.9rem;}
.prod-card-footer{display:flex;gap:.5rem;}
.prod-card-footer .btn{flex:1;justify-content:center;padding:.5rem .8rem;}

/* LIST VIEW CARD */
.prod-grid.grid-list .prod-card{display:grid;grid-template-columns:160px 1fr;}
.prod-grid.grid-list .prod-card-img{aspect-ratio:unset;min-height:160px;border-bottom:none;border-right:1px solid var(--border);}
.prod-grid.grid-list .prod-card-body{padding:1.4rem;display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;}
.prod-grid.grid-list .prod-card-info{flex:1;}
.prod-grid.grid-list .prod-card-actions{display:flex;flex-direction:column;gap:.5rem;align-items:flex-end;min-width:140px;}
.prod-grid.grid-list .prod-card-footer{flex-direction:column;width:100%;}

/* DETAIL MODAL */
#prod-modal{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:1.5rem;opacity:0;pointer-events:none;transition:opacity .3s;}
#prod-modal.open{opacity:1;pointer-events:all;}
.modal-backdrop{position:absolute;inset:0;background:rgba(24,18,10,.7);backdrop-filter:blur(4px);}
.modal-box{position:relative;z-index:1;background:#fff;width:100%;max-width:860px;max-height:90vh;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;transform:translateY(16px);transition:transform .3s;}
#prod-modal.open .modal-box{transform:translateY(0);}
.modal-img{aspect-ratio:3/4;background:var(--bg3);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;color:var(--ink3);font-size:.76rem;position:relative;}
.modal-img::after{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--org),var(--org-mid));}
.modal-body{padding:2.2rem;overflow-y:auto;}
.modal-close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;background:var(--ink);border:none;color:#fff;font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;transition:background .2s;}
.modal-close:hover{background:var(--org);}
.modal-name{font-family:var(--ff-d);font-size:1.7rem;color:var(--ink);line-height:1.2;margin-bottom:.4rem;}
.modal-sub{font-size:.8rem;color:var(--ink3);margin-bottom:1.2rem;}
.modal-price{font-family:var(--ff-d);font-size:1.3rem;color:var(--org);margin-bottom:.3rem;}
.modal-price-note{font-size:.72rem;color:var(--ink3);margin-bottom:1.2rem;}
.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:1.3rem;}
.spec-item{background:var(--bg2);padding:.7rem .9rem;}
.spec-key{font-size:.62rem;color:var(--ink3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.15rem;}
.spec-val{font-size:.88rem;color:var(--ink);font-weight:500;}
.modal-desc{font-size:.84rem;color:var(--ink3);line-height:1.75;margin-bottom:1.3rem;}
.qty-row{display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;}
.qty-row label{font-size:.68rem;color:var(--ink3);letter-spacing:.1em;text-transform:uppercase;}
.qty-ctrl{display:flex;align-items:center;border:1px solid var(--border);}
.qty-ctrl button{width:34px;height:34px;background:none;border:none;font-size:1.1rem;cursor:pointer;color:var(--ink3);transition:all .2s;}
.qty-ctrl button:hover{background:var(--org-lt);color:var(--org);}
.qty-ctrl span{width:50px;text-align:center;font-size:.9rem;font-family:var(--ff-b);}
.modal-actions{display:flex;gap:.6rem;flex-wrap:wrap;}
.modal-actions .btn{flex:1;justify-content:center;}

/* CART DRAWER */
#cart-drawer{position:fixed;right:0;top:0;bottom:0;width:380px;background:#fff;z-index:9800;box-shadow:-4px 0 40px rgba(24,18,10,.12);transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;}
#cart-drawer.open{transform:translateX(0);}
.cart-header{padding:1.3rem 1.5rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.cart-header h3{font-family:var(--ff-d);font-size:1.2rem;color:var(--ink);}
.cart-close{background:none;border:none;font-size:1.4rem;color:var(--ink3);cursor:pointer;transition:color .2s;}
.cart-close:hover{color:var(--org);}
.cart-items{flex:1;overflow-y:auto;padding:1rem 1.5rem;}
.cart-empty{text-align:center;padding:3rem 1rem;color:var(--ink3);}
.cart-empty p{font-size:.85rem;margin-top:.5rem;}
.cart-item{display:grid;grid-template-columns:64px 1fr auto;gap:.8rem;align-items:start;padding:.9rem 0;border-bottom:1px solid var(--border);}
.ci-img{width:64px;height:80px;background:var(--bg3);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ci-name{font-family:var(--ff-d);font-size:.9rem;color:var(--ink);margin-bottom:.2rem;}
.ci-meta{font-size:.72rem;color:var(--ink3);}
.ci-qty{display:flex;align-items:center;gap:.4rem;margin-top:.5rem;}
.ci-qty button{width:22px;height:22px;border:1px solid var(--border);background:none;cursor:pointer;font-size:.8rem;color:var(--ink3);transition:all .2s;}
.ci-qty button:hover{border-color:var(--org);color:var(--org);}
.ci-qty span{font-size:.82rem;min-width:24px;text-align:center;}
.ci-price{font-family:var(--ff-d);font-size:.95rem;color:var(--org);white-space:nowrap;}
.ci-remove{background:none;border:none;color:var(--ink3);cursor:pointer;font-size:.8rem;padding:.2rem;transition:color .2s;}
.ci-remove:hover{color:var(--org);}
.cart-footer{padding:1.3rem 1.5rem;border-top:1px solid var(--border);}
.cart-subtotal{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:.5rem;}
.cart-subtotal strong{font-family:var(--ff-d);font-size:1.05rem;color:var(--ink);}
.cart-note{font-size:.72rem;color:var(--ink3);margin-bottom:1rem;padding:.7rem;background:var(--org-lt);border-left:2px solid var(--org);}
.cart-footer .btn{width:100%;justify-content:center;padding:.85rem;font-size:.8rem;}
.cart-overlay{position:fixed;inset:0;background:rgba(24,18,10,.4);z-index:9700;opacity:0;pointer-events:none;transition:opacity .3s;}
.cart-overlay.show{opacity:1;pointer-events:all;}

/* PAGINATION */
.pagination{display:flex;align-items:center;gap:.3rem;margin-top:3rem;justify-content:center;}
.pg-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:transparent;cursor:pointer;font-family:var(--ff-b);font-size:.82rem;color:var(--ink3);transition:all .2s;}
.pg-btn:hover,.pg-btn.active{border-color:var(--org);background:var(--org);color:#fff;}
.pg-btn.prev-next{width:auto;padding:0 .9rem;gap:.3rem;}

/* TOAST */
#toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(80px);background:var(--ink);color:#fff;padding:.75rem 1.5rem;font-size:.8rem;letter-spacing:.04em;z-index:99999;transition:transform .3s cubic-bezier(.4,0,.2,1);white-space:nowrap;display:flex;align-items:center;gap:.6rem;}
#toast.show{transform:translateX(-50%) translateY(0);}
#toast::before{content:'✓';color:var(--org);font-weight:700;}

/* WHATSAPP */
.wa-float{position:fixed;bottom:2rem;right:2rem;z-index:9600;}
.wa-btn{width:52px;height:52px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(37,211,102,.4);transition:all .3s;text-decoration:none;}
.wa-btn:hover{transform:scale(1.1);}
.wa-btn svg{width:26px;height:26px;fill:#fff;}

/* CHECKOUT MODAL */
#checkout-modal{position:fixed;inset:0;z-index:10001;display:flex;align-items:center;justify-content:center;padding:1.5rem;opacity:0;pointer-events:none;transition:opacity .3s;}
#checkout-modal.open{opacity:1;pointer-events:all;}
.checkout-box{position:relative;z-index:1;background:#fff;width:100%;max-width:640px;max-height:90vh;overflow-y:auto;transform:translateY(16px);transition:transform .3s;}
#checkout-modal.open .checkout-box{transform:translateY(0);}
.checkout-hdr{padding:1.5rem 2rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.checkout-hdr h2{font-family:var(--ff-d);font-size:1.4rem;color:var(--ink);}
.checkout-body{padding:2rem;}
.fg{margin-bottom:.9rem;}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-bottom:.9rem;}
label{display:block;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin-bottom:.35rem;}
input[type=text],input[type=email],input[type=tel],select,textarea{width:100%;padding:.7rem .9rem;background:var(--bg);border:1px solid var(--border);color:var(--ink);font-family:var(--ff-b);font-size:.86rem;outline:none;transition:border-color .22s;appearance:none;}
input:focus,select:focus,textarea:focus{border-color:var(--org);}
textarea{resize:vertical;min-height:90px;}
.order-summary{background:var(--bg2);padding:1.2rem;margin-bottom:1.2rem;border:1px solid var(--border);}
.os-title{font-family:var(--ff-d);font-size:.95rem;color:var(--ink);margin-bottom:.8rem;}
.os-row{display:flex;justify-content:space-between;font-size:.82rem;color:var(--ink3);margin-bottom:.4rem;}
.os-row.total{font-weight:600;color:var(--ink);font-size:.9rem;border-top:1px solid var(--border);padding-top:.6rem;margin-top:.4rem;}
.mode-switch-note{font-size:.75rem;color:var(--ink3);background:var(--org-lt);border-left:2px solid var(--org);padding:.7rem .9rem;margin-bottom:1.1rem;}
.checkout-success{text-align:center;padding:3rem 2rem;}
.checkout-success h2{font-family:var(--ff-d);font-size:1.8rem;color:var(--ink);margin-bottom:.7rem;}
.checkout-success p{font-size:.9rem;color:var(--ink3);max-width:360px;margin:0 auto 1.5rem;}
.success-icon{font-size:3rem;margin-bottom:1rem;}

/* MOBILE FILTER BUTTON */
.mob-filter-btn{display:none;align-items:center;gap:.5rem;padding:.6rem 1.1rem;font-family:var(--ff-b);font-size:.73rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--border);background:var(--bg);color:var(--ink);cursor:pointer;transition:all .2s;}
.mob-filter-btn:hover{border-color:var(--org);color:var(--org);}
.mob-filter-btn .filter-badge{background:var(--org);color:#fff;font-size:.6rem;font-weight:700;border-radius:20px;padding:.1rem .45rem;margin-left:.3rem;display:none;}
.mob-filter-btn .filter-badge.show{display:inline;}
.mob-filter-overlay{display:none;position:fixed;inset:0;background:rgba(24,18,10,.5);z-index:8000;}
.mob-filter-overlay.show{display:block;}
@media(max-width:768px){
  .mob-filter-btn{display:flex;}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:min(320px,90vw);background:#fff;z-index:8500;overflow-y:auto;padding:1.5rem;transform:translateX(-100%);transition:transform .32s cubic-bezier(.4,0,.2,1);display:block!important;}
  .sidebar.mob-open{transform:translateX(0);}
  .mob-sidebar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.2rem;padding-bottom:1rem;border-bottom:1px solid var(--border);}
  .mob-sidebar-header h3{font-family:var(--ff-d);font-size:1.1rem;color:var(--ink);}
  .mob-sidebar-close{background:none;border:none;font-size:1.4rem;color:var(--ink3);cursor:pointer;padding:.25rem;}
}
@media(max-width:1024px){
  .shop-layout{grid-template-columns:200px 1fr;}
  .prod-grid.grid-4{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:768px){
  .nav-links,.nav-actions .btn{display:none;}
  .hamburger{display:flex;}
  .shop-layout{grid-template-columns:1fr;}
  .prod-grid.grid-4,.prod-grid.grid-3{grid-template-columns:repeat(2,1fr);}
  .prod-grid.grid-list .prod-card{grid-template-columns:120px 1fr;}
  .modal-box{grid-template-columns:1fr;max-height:95vh;}
  .modal-img{aspect-ratio:16/9;min-height:200px;}
  #cart-drawer{width:100%;}
  .fr{grid-template-columns:1fr;}
}
@media(max-width:480px){
  .prod-grid.grid-4,.prod-grid.grid-3,.prod-grid.grid-list{grid-template-columns:1fr;}
  .prod-grid.grid-list .prod-card{grid-template-columns:1fr;}
  .prod-grid.grid-list .prod-card-img{border-right:none;border-bottom:1px solid var(--border);min-height:200px;}
}

/* FOOTER */
footer{background:var(--ink);padding:4.5rem 0 0;}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3.5rem;margin-bottom:3.5rem;}
.foot-logo-img{height:52px;width:auto;margin-bottom:.9rem;display:block;filter:brightness(0) invert(1);}
.foot-brand p{font-size:.76rem;color:rgba(255,255,255,.38);line-height:1.8;margin-bottom:1.1rem;}
.bgmea-pill{display:flex;align-items:center;gap:.4rem;font-size:.63rem;color:rgba(255,255,255,.38);letter-spacing:.06em;margin-bottom:.4rem;}
.bgmea-pill::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--org-mid);display:inline-block;}
.foot-col h4{font-family:var(--ff-d);font-size:.93rem;color:#fff;margin-bottom:1rem;}
.foot-col ul{list-style:none;}
.foot-col li{margin-bottom:.42rem;}
.foot-col a{font-size:.76rem;color:rgba(255,255,255,.38);text-decoration:none;transition:color .2s;}
.foot-col a:hover{color:var(--org-mid);}
.soc-row{display:flex;gap:.6rem;margin-bottom:.9rem;}
.soc-a{width:42px;height:42px;border-radius:4px;display:flex;align-items:center;justify-content:center;text-decoration:none;transition:all .25s;position:relative;overflow:hidden;}
.soc-a svg{position:relative;z-index:1;transition:transform .2s;}
.soc-a:hover svg{transform:scale(1.15);}
.soc-fb{background:rgba(24,119,242,.12);color:#1877f2;border:1px solid rgba(24,119,242,.25);}
.soc-fb:hover{background:#1877f2;color:#fff;border-color:#1877f2;}
.soc-ig{background:rgba(225,48,108,.1);color:#e1306c;border:1px solid rgba(225,48,108,.22);}
.soc-ig:hover{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);color:#fff;border-color:transparent;}
.soc-x{background:rgba(255,255,255,.06);color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.12);}
.soc-x:hover{background:#000;color:#fff;border-color:#000;}
.soc-li{background:rgba(10,102,194,.12);color:#0a66c2;border:1px solid rgba(10,102,194,.25);}
.soc-li:hover{background:#0a66c2;color:#fff;border-color:#0a66c2;}
.soc-wa{background:rgba(37,211,102,.12);color:#25d366;border:1px solid rgba(37,211,102,.25);}
.soc-wa:hover{background:#25d366;color:#fff;border-color:#25d366;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.07);padding:1.6rem 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;}
.foot-bottom p{font-size:.68rem;color:rgba(255,255,255,.25);}
.foot-bottom a{color:rgba(255,255,255,.25);text-decoration:none;margin-left:1rem;}
.foot-bottom a:hover{color:var(--org-mid);}
.foot-stripe{height:4px;background:linear-gradient(90deg,var(--org),var(--org-mid),var(--red));}
@media(max-width:1024px){.foot-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:768px){.foot-grid{grid-template-columns:1fr;}.foot-bottom{flex-direction:column;text-align:center;}}

/* GDPR COOKIE BANNER */
#cookieBanner{position:fixed;bottom:0;left:0;right:0;z-index:99997;background:var(--ink);border-top:2px solid var(--org);padding:1rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;transform:translateY(100%);transition:transform .4s cubic-bezier(.4,0,.2,1);}
#cookieBanner.cb-visible{transform:translateY(0);}
.cookie-text{font-size:.75rem;color:rgba(255,255,255,.7);line-height:1.55;flex:1;min-width:200px;}
.cookie-text a{color:var(--org-mid);text-decoration:underline;}
.cookie-actions{display:flex;gap:.5rem;flex-shrink:0;flex-wrap:wrap;}
.cookie-accept{padding:.5rem 1.3rem;background:var(--org);color:#fff;border:none;font-family:var(--ff-b);font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .2s;}
.cookie-accept:hover{background:var(--org-dk);}
.cookie-decline{padding:.5rem 1rem;background:transparent;color:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.15);font-family:var(--ff-b);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:all .2s;}
.cookie-decline:hover{border-color:rgba(255,255,255,.4);color:rgba(255,255,255,.75);}
@media(max-width:600px){#cookieBanner{flex-direction:column;align-items:flex-start;}.cookie-actions{width:100%;}}

/* ════════════════════════════════════════════════════════════════
   CURRENCY BAR & INCOTERM SYSTEM
   ════════════════════════════════════════════════════════════════ */

/* ── CURRENCY & INCOTERM BAR ───────────────────────────────────── */
#currency-bar {
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  padding: .65rem 0;
  position: sticky;
  top: 65px;
  z-index: 850;
  box-shadow: 0 2px 12px rgba(24,18,10,.04);
}
.cb-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
}
.cb-left, .cb-right {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
}
.cb-label {
  font-size: .63rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink3);
  white-space: nowrap;
}
.cb-rate-note {
  font-size: .62rem;
  color: var(--ink3);
  opacity: .7;
  font-style: italic;
}

/* Currency toggle pills */
.cb-currency-tabs {
  display: flex;
  gap: .25rem;
}
.cb-cur {
  display: flex;
  align-items: center;
  gap: .3rem;
  padding: .3rem .75rem;
  font-family: var(--ff-b);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .06em;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--ink3);
  cursor: pointer;
  transition: all .18s;
  white-space: nowrap;
}
.cb-cur:hover { border-color: var(--org); color: var(--org); background: var(--org-lt); }
.cb-cur.active {
  background: var(--org);
  border-color: var(--org);
  color: #fff;
}
.cb-flag { font-size: .85rem; line-height: 1; }

/* Incoterm tabs */
.cb-inco-tabs { display: flex; gap: .25rem; }
.cb-inco {
  padding: .3rem .85rem;
  font-family: var(--ff-b);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--ink3);
  cursor: pointer;
  transition: all .18s;
}
.cb-inco:hover { border-color: var(--org); color: var(--org); }
.cb-inco.active { background: var(--ink); border-color: var(--ink); color: #fff; }

/* Incoterm popup definition */
.cb-inco-def {
  position: absolute;
  top: calc(100% + .5rem);
  right: 0;
  width: 300px;
  background: var(--ink);
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 12px 40px rgba(24,18,10,.25);
  padding: 1.2rem;
  z-index: 1200;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity .22s, transform .22s;
}
.cb-inco-def.visible {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0);
}
.cb-right { position: relative; }
.cb-def-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .1em;
  color: #fff;
  padding: .22rem .65rem;
  margin-bottom: .6rem;
}
.cb-def-full {
  font-family: var(--ff-d);
  font-size: .88rem;
  color: #fff;
  margin-bottom: .4rem;
  line-height: 1.3;
}
.cb-def-short {
  font-size: .74rem;
  color: rgba(255,255,255,.5);
  line-height: 1.6;
  margin-bottom: .8rem;
}
.cb-def-more {
  background: none;
  border: none;
  border-bottom: 1px solid rgba(232,81,10,.4);
  color: var(--org);
  font-size: .67rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  padding: 0 0 1px;
  font-family: var(--ff-b);
  transition: border-color .2s;
}
.cb-def-more:hover { border-color: var(--org); }
.cb-inco-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100;
}

/* Incoterm inline link in hero */
.inco-inline {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  border-bottom: 1px dashed rgba(232,81,10,.5);
  color: var(--org);
  cursor: pointer;
  font-weight: 500;
  transition: border-color .2s;
}
.inco-inline:hover { border-color: var(--org); }
.inco-inline svg { opacity: .7; }

/* ── MODAL PRICING EXTENSIONS ──────────────────────────────────── */
.modal-price-wrap {
  display: flex;
  align-items: baseline;
  gap: .75rem;
  flex-wrap: wrap;
  margin-bottom: .2rem;
}
.modal-price-converted {
  font-family: var(--ff-d);
  font-size: 1.1rem;
  color: var(--ink3);
  font-style: italic;
}
.modal-inco-row {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin: .5rem 0 .8rem;
  flex-wrap: wrap;
}
.modal-inco-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .22rem .7rem;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .1em;
  color: #fff;
  background: var(--org);
  transition: background .25s;
}
.modal-inco-label {
  font-size: .74rem;
  color: var(--ink3);
  flex: 1;
}
.modal-inco-info {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  background: none;
  border: none;
  color: var(--org);
  font-size: .67rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  font-family: var(--ff-b);
  padding: 0;
  border-bottom: 1px solid transparent;
  transition: border-color .2s;
}
.modal-inco-info:hover { border-color: var(--org); }

/* Card incoterm pill */
.card-inco-pill {
  display: inline-flex;
  align-items: center;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .08em;
  color: #fff;
  padding: .1rem .4rem;
  vertical-align: middle;
  margin-left: .25rem;
  transition: background .25s;
}

/* ── INCOTERM FULL EXPLAINER MODAL ─────────────────────────────── */
#inco-modal {
  position: fixed;
  inset: 0;
  z-index: 10500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s;
}
#inco-modal.open { opacity: 1; pointer-events: all; }
.inco-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(24,18,10,.6);
  backdrop-filter: blur(4px);
}
.inco-modal-box {
  position: relative;
  z-index: 1;
  background: #fff;
  width: 100%;
  max-width: 780px;
  max-height: 90vh;
  overflow-y: auto;
  transform: translateY(16px);
  transition: transform .3s;
}
#inco-modal.open .inco-modal-box { transform: translateY(0); }
.inco-modal-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.4rem 2rem;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 2;
}
.inco-modal-hdr h2 { font-family: var(--ff-d); font-size: 1.3rem; color: var(--ink); }
.inco-modal-body { padding: 2rem; }
.inco-intro {
  font-size: .85rem;
  color: var(--ink3);
  line-height: 1.75;
  margin-bottom: 2rem;
  max-width: 600px;
}

/* Incoterm cards */
.inco-cards { display: flex; flex-direction: column; gap: 1.5rem; margin-bottom: 2rem; }
.inco-card {
  border: 1px solid var(--border);
  overflow: hidden;
  transition: all .25s;
}
.inco-card--active { border-color: var(--org); box-shadow: 0 4px 20px rgba(232,81,10,.1); }
.inco-card-hdr {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 1.5rem;
  background: var(--bg2);
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.inco-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px; height: 52px;
  font-size: .88rem;
  font-weight: 900;
  letter-spacing: .1em;
  color: #fff;
  flex-shrink: 0;
}
.inco-badge--fob { background: var(--org); }
.inco-badge--cif { background: #0052a3; }
.inco-badge--exw { background: #2a6049; }
.inco-name { font-family: var(--ff-d); font-size: 1rem; color: var(--ink); font-weight: 600; }
.inco-port { font-size: .72rem; color: var(--ink3); margin-top: .1rem; }
.inco-tag-default {
  margin-left: auto;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--org);
  background: var(--org-lt);
  border: 1px solid var(--bord-o);
  padding: .22rem .65rem;
}
.inco-desc {
  font-size: .82rem;
  color: var(--ink3);
  line-height: 1.75;
  padding: 1.1rem 1.5rem;
  border-bottom: 1px solid var(--border);
}
.inco-desc strong { color: var(--ink); }

/* Diagram */
.inco-diagram {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0;
  align-items: stretch;
}
.inco-step { padding: 1rem 1.5rem; }
.inco-step--seller { background: rgba(232,81,10,.04); border-right: 1px solid var(--border); }
.inco-step--buyer  { background: rgba(24,18,10,.02); }
.inco-step-label {
  font-size: .63rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .6rem;
}
.inco-step--seller .inco-step-label { color: var(--org); }
.inco-step--buyer  .inco-step-label { color: var(--ink3); }
.inco-step-items { display: flex; flex-direction: column; gap: .3rem; }
.inco-step-items span {
  font-size: .76rem;
  color: var(--ink3);
  display: flex;
  align-items: center;
  gap: .4rem;
  line-height: 1.4;
}
.inco-step--seller .inco-step-items span::before { content: '✓'; color: var(--org); font-weight: 700; flex-shrink: 0; }
.inco-step--buyer  .inco-step-items span::before { content: '◦'; color: var(--ink3); flex-shrink: 0; }

/* Divider with ship icon */
.inco-divider {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem .5rem;
  gap: .35rem;
  background: var(--bg3);
  border-right: 1px solid var(--border);
}
.inco-divider-line {
  width: 1px;
  flex: 1;
  background: var(--border);
}
.inco-divider-ship { font-size: 1.4rem; line-height: 1; }
.inco-divider-tag {
  font-size: .56rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink3);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: nowrap;
  opacity: .7;
}

/* Best for */
.inco-best-for {
  font-size: .76rem;
  color: var(--green);
  background: var(--green-lt);
  padding: .75rem 1.5rem;
  border-top: 1px solid rgba(42,96,73,.15);
}

.inco-disclaimer {
  font-size: .76rem;
  color: var(--ink3);
  background: var(--bg2);
  border: 1px solid var(--border);
  border-left: 3px solid var(--org);
  padding: .9rem 1.1rem;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}
.inco-modal-cta { display: flex; justify-content: flex-start; }

/* ── RESPONSIVE ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .cb-inner { gap: .8rem; }
  .cb-right { width: 100%; }
  .cb-inco-def { right: auto; left: 0; width: 100%; }
  .inco-diagram { grid-template-columns: 1fr; }
  .inco-divider { flex-direction: row; padding: .5rem 1.5rem; writing-mode: horizontal-tb; }
  .inco-divider-tag { writing-mode: horizontal-tb; }
  .inco-divider-line { width: 40px; height: 1px; flex: none; }
  .inco-step--seller { border-right: none; border-bottom: 1px solid var(--border); }
  .cb-currency-tabs { gap: .2rem; }
  .cb-cur { padding: .28rem .55rem; font-size: .65rem; }
  #inco-modal { padding: 0; align-items: flex-end; }
  .inco-modal-box { max-height: 92vh; border-radius: 0; }
}
@media (max-width: 480px) {
  .cb-left, .cb-right { width: 100%; }
  .cb-label { display: none; }
}