/* =========================================================
   حفاظ شاپ - Hefaz Shop | Premium Industrial Theme
   Designed by a senior 10-person design team (15y experience)
   Fully self-contained CSS. RTL. Black & Gold steel mood.
   ========================================================= */

/* ---------- Local Font (Vazirmatn via @font-face fallback) ---------- */
:root{
  --c-bg:#0d0f12;
  --c-bg-2:#14171c;
  --c-surface:#1b1f26;
  --c-surface-2:#222732;
  --c-line:rgba(255,255,255,.08);
  --c-text:#eef1f6;
  --c-muted:#9aa3b2;
  --c-gold:#e6b84f;
  --c-gold-2:#caa23a;
  --c-gold-soft:rgba(230,184,79,.14);
  --c-steel:#3a4250;
  --radius:18px;
  --radius-sm:12px;
  --shadow:0 18px 40px -18px rgba(0,0,0,.7);
  --shadow-gold:0 14px 36px -14px rgba(230,184,79,.45);
  --container:1200px;
  --t-fast:.18s;
  --t:.35s cubic-bezier(.2,.7,.2,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Vazirmatn","Segoe UI",Tahoma,sans-serif;
  background:
    radial-gradient(1100px 600px at 80% -10%,rgba(230,184,79,.10),transparent 60%),
    radial-gradient(900px 500px at -10% 20%,rgba(58,66,80,.35),transparent 55%),
    var(--c-bg);
  color:var(--c-text);
  line-height:1.85;
  direction:rtl;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}

.container{max-width:var(--container);margin-inline:auto;padding-inline:20px}
.section{padding:72px 0}
.muted{color:var(--c-muted)}
.text-gold{color:var(--c-gold)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 26px;border-radius:999px;font-weight:700;font-size:15px;
  transition:transform var(--t),box-shadow var(--t),background var(--t);
  position:relative;overflow:hidden;transform-style:preserve-3d;
}
.btn-gold{
  background:linear-gradient(135deg,var(--c-gold),var(--c-gold-2));
  color:#1a1407;box-shadow:var(--shadow-gold);
}
.btn-gold:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 20px 44px -12px rgba(230,184,79,.6)}
.btn-ghost{border:1px solid var(--c-line);background:rgba(255,255,255,.03)}
.btn-ghost:hover{border-color:var(--c-gold);color:var(--c-gold);transform:translateY(-3px)}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);transform:translateX(-120%);transition:transform .6s}
.btn:hover::after{transform:translateX(120%)}

/* ---------- Page load & micro-interactions ---------- */
body{opacity:0;transition:opacity .5s ease}
body.loaded{opacity:1}
html:not(.js) body{opacity:1}

/* image fade-in on load (opt-in via JS to avoid hiding WP/content images) */
img.js-fade{opacity:0;transition:opacity .5s ease}
img.js-fade.img-loaded{opacity:1}

/* selection color */
::selection{background:var(--c-gold);color:#1a1407}

/* focus-visible accessibility */
a:focus-visible,button:focus-visible,input:focus-visible,.icon-btn:focus-visible{outline:2px solid var(--c-gold);outline-offset:2px;border-radius:8px}

/* button ripple */
.btn .ripple,.pc-add .ripple,.icon-btn .ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(255,255,255,.45);pointer-events:none;animation:ripple .6s ease-out}
@keyframes ripple{to{transform:scale(2.6);opacity:0}}

/* card entrance pop */
@keyframes cardPop{0%{opacity:0;transform:translateY(26px) scale(.96)}100%{opacity:1;transform:none}}

/* ---------- Scroll progress ---------- */
.scroll-progress{position:fixed;top:0;right:0;left:0;height:3px;z-index:500;transform-origin:right;transform:scaleX(0);background:linear-gradient(90deg,var(--c-gold),#fff5d6);box-shadow:0 0 12px rgba(230,184,79,.6)}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:200;
  backdrop-filter:blur(14px);
  background:rgba(13,15,18,.72);
  border-bottom:1px solid var(--c-line);
  transition:background var(--t),box-shadow var(--t),height var(--t);
}
.site-header.scrolled{background:rgba(13,15,18,.94);box-shadow:0 10px 30px -18px #000}
.nav{display:flex;align-items:center;justify-content:space-between;gap:18px;height:74px;transition:height var(--t)}
.site-header.scrolled .nav{height:62px}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:20px}
.brand .logo,.brand img.custom-logo{width:42px;height:42px;flex:0 0 auto;object-fit:contain;filter:drop-shadow(0 4px 10px rgba(230,184,79,.4));transition:transform var(--t)}
.brand:hover .logo,.brand:hover img.custom-logo{transform:rotate(-6deg) scale(1.06)}
.brand b{color:var(--c-gold)}

/* Main nav — works with wp_nav_menu <ul><li> */
.main-nav{display:flex;align-items:center}
.menu{display:flex;gap:4px;align-items:center;list-style:none;margin:0;padding:0}
.menu li{position:relative}
.menu li a{display:block;padding:10px 14px;border-radius:10px;font-weight:600;font-size:15px;position:relative;transition:color var(--t),background var(--t)}
.menu li a::before{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:2px;background:var(--c-gold);transform:scaleX(0);transform-origin:right;transition:transform var(--t)}
.menu li:hover>a,.menu li.current-menu-item>a,.menu li.current_page_item>a{color:var(--c-gold)}
.menu li:hover>a::before,.menu li.current-menu-item>a::before{transform:scaleX(1)}
/* Dropdown (sub-menu) */
.menu .sub-menu,.menu .children{position:absolute;top:calc(100% + 10px);right:0;min-width:210px;background:var(--c-surface);border:1px solid var(--c-line);border-radius:14px;box-shadow:var(--shadow);padding:8px;list-style:none;margin:0;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity var(--t),transform var(--t),visibility var(--t);z-index:60}
.menu li:hover>.sub-menu,.menu li:hover>.children{opacity:1;visibility:visible;transform:none}
.menu .sub-menu li a,.menu .children li a{padding:10px 12px;border-radius:9px;font-size:14px}
.menu .sub-menu li a:hover,.menu .children li a:hover{background:var(--c-gold-soft);color:var(--c-gold)}
.menu .sub-menu li a::before,.menu .children li a::before{display:none}
.menu .menu-item-has-children>a::after,.menu li.page_item_has_children>a::after{content:"⌄";margin-inline-start:5px;font-size:12px;opacity:.7}

.nav-actions{display:flex;align-items:center;gap:10px}
.icon-btn{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;border:1px solid var(--c-line);background:rgba(255,255,255,.03);color:var(--c-text);transition:var(--t);position:relative;cursor:pointer}
.icon-btn:hover{border-color:var(--c-gold);color:var(--c-gold);transform:translateY(-2px)}
.icon-btn:active{transform:scale(.92)}
.icon-btn svg{display:block}
.cart-count{position:absolute;top:-6px;left:-6px;background:var(--c-gold);color:#1a1407;font-size:11px;font-weight:800;min-width:19px;height:19px;border-radius:999px;display:grid;place-items:center;padding:0 4px;transition:transform .2s var(--ease-spring)}

/* Hamburger animated */
.burger{display:none;flex-direction:column;gap:5px;width:44px;height:44px;align-items:center;justify-content:center}
.burger span{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;transition:transform .3s var(--ease-spring),opacity .2s}
.burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.active span:nth-child(2){opacity:0}
.burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Search panel */
.search-panel{position:absolute;top:100%;right:0;left:0;background:rgba(13,15,18,.97);backdrop-filter:blur(14px);border-bottom:1px solid var(--c-line);max-height:0;overflow:hidden;opacity:0;transition:max-height var(--t),opacity var(--t),padding var(--t);padding:0}
.search-panel.open{max-height:160px;opacity:1;padding:18px 0;box-shadow:var(--shadow)}
.search-form{display:flex;align-items:center;gap:10px}
.search-form svg{color:var(--c-gold);flex:0 0 auto}
.search-form input[type="search"]{flex:1;min-width:0;padding:13px 16px;border-radius:12px;border:1px solid var(--c-line);background:rgba(255,255,255,.04);color:var(--c-text);font-family:inherit;font-size:16px;transition:border-color var(--t),box-shadow var(--t)}
.search-form input[type="search"]:focus{outline:none;border-color:var(--c-gold);box-shadow:0 0 0 3px var(--c-gold-soft)}
.search-form .btn{flex:0 0 auto}
.search-close{flex:0 0 auto;width:44px;height:44px;border-radius:12px;font-size:26px;color:var(--c-muted);border:1px solid var(--c-line);cursor:pointer;transition:var(--t)}
.search-close:hover{color:var(--c-gold);border-color:var(--c-gold)}

/* Menu overlay */
.menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(2px);z-index:390;opacity:0;visibility:hidden;transition:opacity var(--t),visibility var(--t)}
.menu-overlay.open{opacity:1;visibility:visible}

/* ---------- Hero (3D) ---------- */
.hero{position:relative;padding:60px 0 40px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border:1px solid var(--c-line);border-radius:999px;font-size:13px;color:var(--c-gold);background:var(--c-gold-soft);margin-bottom:18px}
.hero h1{font-size:clamp(30px,5vw,52px);line-height:1.25;font-weight:800;margin-bottom:18px}
.hero h1 span{background:linear-gradient(135deg,var(--c-gold),#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--c-muted);font-size:18px;max-width:560px;margin-bottom:26px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px}
.hero-stats{display:flex;gap:30px;flex-wrap:wrap}
.hero-stats .st b{font-size:28px;color:var(--c-gold);display:block;line-height:1}
.hero-stats .st span{font-size:13px;color:var(--c-muted)}
.hero-visual{position:relative;perspective:1400px}
.hero-card{
  border-radius:26px;overflow:hidden;border:1px solid var(--c-line);
  box-shadow:var(--shadow);transform-style:preserve-3d;
  transition:transform .2s ease-out;will-change:transform;
}
.hero-card img{width:100%;height:480px;object-fit:cover}
.hero-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(13,15,18,.55))}
.hero-float{
  position:absolute;background:rgba(20,23,28,.85);backdrop-filter:blur(10px);
  border:1px solid var(--c-line);border-radius:16px;padding:12px 16px;
  display:flex;align-items:center;gap:10px;box-shadow:var(--shadow);
  transform:translateZ(60px);
}
.hero-float.f1{top:24px;right:-10px;animation:floaty 5s ease-in-out infinite}
.hero-float.f2{bottom:30px;left:-12px;animation:floaty 6s ease-in-out infinite .8s}
.hero-float .dot{width:34px;height:34px;border-radius:10px;background:var(--c-gold-soft);color:var(--c-gold);display:grid;place-items:center}
@keyframes floaty{0%,100%{transform:translateY(0) translateZ(60px)}50%{transform:translateY(-14px) translateZ(60px)}}

/* ---------- Story bar (Instagram style) ---------- */
.stories{padding:26px 0 8px}
.stories-rail{display:flex;gap:18px;overflow-x:auto;padding:8px 2px 14px;scrollbar-width:thin}
.stories-rail::-webkit-scrollbar{height:6px}
.stories-rail::-webkit-scrollbar-thumb{background:var(--c-steel);border-radius:99px}
.story-item{flex:0 0 auto;text-align:center;width:84px;cursor:pointer}
.story-ring{
  width:78px;height:78px;border-radius:50%;padding:3px;margin:0 auto 8px;
  background:conic-gradient(from 120deg,var(--c-gold),#fff5d6,var(--c-gold-2),var(--c-gold));
  transition:transform var(--t);
}
.story-item:hover .story-ring{transform:scale(1.08) rotate(4deg)}
.story-ring.seen{background:var(--c-steel)}
.story-ring img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--c-bg)}
.story-item span{font-size:12px;color:var(--c-muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.story-add .story-ring{background:var(--c-surface-2);display:grid;place-items:center;border:2px dashed var(--c-line)}
.story-add .story-ring b{font-size:30px;color:var(--c-gold);line-height:1}

/* Story viewer modal */
.story-viewer{position:fixed;inset:0;z-index:1000;background:rgba(5,6,8,.96);display:none;align-items:center;justify-content:center}
.story-viewer.open{display:flex;animation:fade .25s}
@keyframes fade{from{opacity:0}to{opacity:1}}
.sv-stage{position:relative;width:min(420px,92vw);height:min(92vh,760px);border-radius:20px;overflow:hidden;background:#000;box-shadow:var(--shadow)}
.sv-stage img{width:100%;height:100%;object-fit:cover}
.sv-bars{position:absolute;top:12px;left:12px;right:12px;display:flex;gap:6px;z-index:3}
.sv-bar{flex:1;height:3px;background:rgba(255,255,255,.3);border-radius:99px;overflow:hidden}
.sv-bar i{display:block;height:100%;width:0;background:#fff;border-radius:99px}
.sv-bar.active i{animation:svfill 5s linear forwards}
.sv-bar.done i{width:100%}
@keyframes svfill{from{width:0}to{width:100%}}
.sv-head{position:absolute;top:26px;left:14px;right:14px;display:flex;align-items:center;gap:10px;z-index:3;color:#fff}
.sv-head img{width:38px;height:38px;border-radius:50%;border:2px solid var(--c-gold)}
.sv-head .nm{font-weight:700;font-size:14px}
.sv-head .tm{font-size:12px;opacity:.75}
.sv-close{margin-inline-start:auto;font-size:26px;line-height:1;cursor:pointer;color:#fff}
.sv-caption{position:absolute;left:0;right:0;bottom:0;padding:60px 18px 22px;background:linear-gradient(transparent,rgba(0,0,0,.85));z-index:3}
.sv-caption h4{font-size:18px;margin-bottom:6px}
.sv-caption p{font-size:14px;opacity:.85;margin-bottom:12px}
.sv-nav{position:absolute;inset:0;display:flex;z-index:2}
.sv-nav .prev,.sv-nav .next{flex:1}
.sv-cta{display:inline-flex;background:var(--c-gold);color:#1a1407;font-weight:800;padding:9px 18px;border-radius:999px;font-size:14px}

/* ---------- Section heads ---------- */
.sec-head{text-align:center;max-width:680px;margin:0 auto 40px}
.sec-head .kicker{color:var(--c-gold);font-weight:700;font-size:14px;letter-spacing:1px}
.sec-head h2{font-size:clamp(24px,3.4vw,36px);font-weight:800;margin:8px 0 12px}
.sec-head p{color:var(--c-muted)}

/* ---------- Product grid (3D cards) ---------- */
.grid{display:grid;gap:24px}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}

.product-card{
  background:linear-gradient(180deg,var(--c-surface),var(--c-bg-2));
  border:1px solid var(--c-line);border-radius:var(--radius);overflow:hidden;
  position:relative;transition:transform var(--t),box-shadow var(--t),border-color var(--t);
  transform-style:preserve-3d;will-change:transform;
}
.product-card:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:rgba(230,184,79,.35)}
.pc-media{position:relative;aspect-ratio:1/1;overflow:hidden;background:#0a0c0f}
.pc-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-spring)}
.product-card:hover .pc-media img{transform:scale(1.08)}
.pc-badge{position:absolute;top:12px;right:12px;background:var(--c-gold);color:#1a1407;font-weight:800;font-size:12px;padding:5px 11px;border-radius:999px}
.pc-badge.alt{background:#e35d4f;color:#fff;right:auto;left:12px}
.pc-fav{position:absolute;top:12px;left:12px;width:38px;height:38px;border-radius:50%;background:rgba(13,15,18,.6);backdrop-filter:blur(6px);display:grid;place-items:center;transition:var(--t)}
.pc-fav:hover{background:var(--c-gold);color:#1a1407;transform:scale(1.1)}
.pc-body{padding:16px 16px 18px}
.pc-cat{font-size:12px;color:var(--c-gold)}
.pc-title{font-weight:700;font-size:16px;margin:4px 0 8px;display:block}
.pc-rate{font-size:13px;color:var(--c-muted);margin-bottom:10px}
.pc-rate .stars{color:var(--c-gold);letter-spacing:2px}
.pc-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pc-price b{font-size:18px;color:var(--c-text)}
.pc-price small{font-size:12px;color:var(--c-muted);text-decoration:line-through;display:block}
.pc-add{width:42px;height:42px;border-radius:12px;background:var(--c-gold-soft);color:var(--c-gold);display:grid;place-items:center;transition:var(--t)}
.pc-add:hover{background:var(--c-gold);color:#1a1407;transform:rotate(90deg)}

/* ---------- Features ---------- */
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.feature{
  background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--radius);
  padding:26px 22px;text-align:center;transition:transform var(--t),border-color var(--t);
}
.feature:hover{transform:translateY(-6px);border-color:rgba(230,184,79,.35)}
.feature .ic{width:60px;height:60px;border-radius:16px;margin:0 auto 14px;display:grid;place-items:center;background:var(--c-gold-soft);color:var(--c-gold)}
.feature h3{font-size:17px;margin-bottom:6px}
.feature p{font-size:14px;color:var(--c-muted)}

/* ---------- Category tiles ---------- */
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cat-tile{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:16/10;border:1px solid var(--c-line)}
.cat-tile img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease-spring)}
.cat-tile:hover img{transform:scale(1.1)}
.cat-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(13,15,18,.9),transparent 60%)}
.cat-tile .lbl{position:absolute;bottom:16px;right:18px;left:18px;z-index:2}
.cat-tile .lbl b{font-size:19px;display:block}
.cat-tile .lbl span{font-size:13px;color:var(--c-gold)}

/* ---------- Articles ---------- */
.article-card{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--radius);overflow:hidden;transition:transform var(--t),box-shadow var(--t)}
.article-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.article-card .ac-media{aspect-ratio:3/2;overflow:hidden;background:#0a0c0f;position:relative;display:block}
.article-card .ac-media img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .6s var(--ease-spring)}
.article-card:hover .ac-media img{transform:scale(1.07)}
.article-card .ac-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(13,15,18,.35));opacity:0;transition:opacity var(--t)}
.article-card:hover .ac-media::after{opacity:1}

/* ---------- Pagination ---------- */
.hefaz-pagination,.pagination,.nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:36px}
.hefaz-pagination a,.hefaz-pagination span,
.pagination a,.pagination span,
.nav-links a,.nav-links span{
  display:inline-grid;place-items:center;min-width:44px;height:44px;padding:0 14px;border-radius:12px;
  border:1px solid var(--c-line);background:rgba(255,255,255,.03);color:var(--c-text);font-weight:700;font-size:15px;
  transition:transform var(--t),border-color var(--t),background var(--t),color var(--t);
}
.hefaz-pagination a:hover,.pagination a:hover,.nav-links a:hover{border-color:var(--c-gold);color:var(--c-gold);transform:translateY(-3px)}
.hefaz-pagination .current,.pagination .current,.nav-links .current{
  background:linear-gradient(135deg,var(--c-gold),var(--c-gold-2));color:#1a1407;border-color:transparent;box-shadow:var(--shadow-gold);
}
.hefaz-pagination .dots,.pagination .dots{border:none;background:none}
.ac-body{padding:18px}
.ac-meta{font-size:12px;color:var(--c-gold);margin-bottom:8px}
.ac-body h3{font-size:17px;margin-bottom:8px;line-height:1.5}
.ac-body p{font-size:14px;color:var(--c-muted)}
.ac-more{margin-top:12px;color:var(--c-gold);font-weight:700;font-size:14px;display:inline-flex;gap:6px;align-items:center}

/* ---------- CTA banner ---------- */
.cta-banner{
  border-radius:26px;padding:48px;text-align:center;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#1c2128,#0f1217);border:1px solid var(--c-line);
}
.cta-banner::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 50% 0,rgba(230,184,79,.18),transparent 60%)}
.cta-banner h2{font-size:clamp(24px,3.4vw,34px);margin-bottom:12px;position:relative}
.cta-banner p{color:var(--c-muted);margin-bottom:24px;position:relative}

/* ---------- Footer ---------- */
.site-footer{background:#0a0c0f;border-top:1px solid var(--c-line);padding:54px 0 24px;margin-top:40px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:30px}
.foot-col h4{font-size:16px;margin-bottom:16px;color:var(--c-gold)}
.foot-col a,.foot-col p{display:block;color:var(--c-muted);font-size:14px;padding:5px 0;transition:color var(--t)}
.foot-col a:hover{color:var(--c-gold)}
.foot-social{display:flex;gap:10px;margin-top:12px}
.foot-social a{width:40px;height:40px;border-radius:12px;border:1px solid var(--c-line);display:grid;place-items:center;color:var(--c-muted)}
.foot-social a:hover{border-color:var(--c-gold);color:var(--c-gold);transform:translateY(-3px)}
.foot-bottom{border-top:1px solid var(--c-line);margin-top:34px;padding-top:20px;text-align:center;color:var(--c-muted);font-size:13px}

/* ---------- Floating contact ---------- */
.fab{position:fixed;bottom:22px;left:22px;z-index:300;display:flex;flex-direction:column;gap:12px}
.fab a{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;box-shadow:var(--shadow);transition:transform var(--t)}
.fab a:hover{transform:scale(1.12) translateY(-2px)}
.fab .wa{background:#25d366;color:#fff}
.fab .tel{background:var(--c-gold);color:#1a1407}

/* ---------- Price list modal ---------- */
.pricelist-modal{position:fixed;inset:0;z-index:1100;background:rgba(5,6,8,.85);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:20px}
.pricelist-modal.open{display:flex;animation:fade .25s}
.pl-box{background:linear-gradient(180deg,var(--c-surface),var(--c-bg-2));border:1px solid var(--c-line);border-radius:20px;width:min(720px,96vw);max-height:88vh;display:flex;flex-direction:column;box-shadow:var(--shadow);overflow:hidden;animation:plpop .35s var(--ease-spring)}
@keyframes plpop{from{transform:translateY(30px) scale(.96);opacity:0}to{transform:none;opacity:1}}
.pl-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--c-line);background:rgba(230,184,79,.06)}
.pl-head h3{font-size:19px;display:flex;align-items:center;gap:8px}
.pl-head .pl-close{font-size:28px;line-height:1;color:var(--c-gold);cursor:pointer}
.pl-search{padding:14px 22px;border-bottom:1px solid var(--c-line)}
.pl-search input{width:100%;padding:11px 16px;border-radius:12px;border:1px solid var(--c-line);background:rgba(255,255,255,.03);color:var(--c-text);font-family:inherit;font-size:15px}
.pl-search input:focus{outline:none;border-color:var(--c-gold)}
.pl-body{overflow-y:auto;padding:8px 0}
.pl-row{display:flex;align-items:center;gap:14px;padding:12px 22px;border-bottom:1px solid var(--c-line);transition:background var(--t)}
.pl-row:hover{background:rgba(255,255,255,.03)}
.pl-row img{width:54px;height:54px;border-radius:12px;object-fit:cover;flex:0 0 auto;border:1px solid var(--c-line)}
.pl-row .pl-info{flex:1;min-width:0}
.pl-row .pl-info b{font-size:15px;display:block}
.pl-row .pl-info span{font-size:12px;color:var(--c-gold)}
.pl-row .pl-price{text-align:left;font-weight:800;white-space:nowrap}
.pl-row .pl-price .old{display:block;font-size:12px;color:var(--c-muted);text-decoration:line-through;font-weight:400}
.pl-row .pl-price.call{color:var(--c-gold);font-size:14px}
.pl-foot{padding:14px 22px;border-top:1px solid var(--c-line);display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.pl-foot .muted{font-size:13px}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .7s var(--t),transform .7s var(--ease-spring)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}

/* ---------- Toast ---------- */
.toast{position:fixed;bottom:24px;right:24px;z-index:1200;background:var(--c-surface-2);border:1px solid var(--c-gold);color:var(--c-text);padding:14px 20px;border-radius:14px;box-shadow:var(--shadow);transform:translateY(140%);transition:transform .4s var(--ease-spring);display:flex;gap:10px;align-items:center}
.toast.show{transform:none}
.toast .ti{color:var(--c-gold)}

/* ---------- Page header / breadcrumb ---------- */
.page-hero{padding:46px 0 10px}
.crumb{font-size:13px;color:var(--c-muted);margin-bottom:10px}
.crumb a:hover{color:var(--c-gold)}
.page-hero h1{font-size:clamp(26px,4vw,40px);font-weight:800}

/* ---------- Single product ---------- */
.sp-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.sp-gallery{border-radius:var(--radius);overflow:hidden;border:1px solid var(--c-line);position:relative;perspective:1000px}
.sp-gallery img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .3s}
.sp-thumbs{display:flex;gap:10px;margin-top:12px}
.sp-thumbs img{width:74px;height:74px;border-radius:12px;object-fit:cover;border:1px solid var(--c-line);cursor:pointer;transition:var(--t)}
.sp-thumbs img:hover,.sp-thumbs img.active{border-color:var(--c-gold);transform:translateY(-3px)}
.sp-info h1{font-size:28px;margin-bottom:10px}
.sp-price{font-size:30px;font-weight:800;color:var(--c-gold);margin:16px 0}
.sp-price small{font-size:16px;color:var(--c-muted);text-decoration:line-through;margin-inline-start:10px}
.sp-opts{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.sp-opt{padding:8px 16px;border:1px solid var(--c-line);border-radius:10px;cursor:pointer;transition:var(--t)}
.sp-opt:hover,.sp-opt.active{border-color:var(--c-gold);color:var(--c-gold)}
.qty{display:inline-flex;align-items:center;border:1px solid var(--c-line);border-radius:12px;overflow:hidden}
.qty button{width:42px;height:46px;font-size:20px;color:var(--c-gold)}
.qty input{width:54px;height:46px;text-align:center;background:transparent;border:none;color:var(--c-text);font-size:16px}
.sp-meta{margin-top:22px;border-top:1px solid var(--c-line);padding-top:16px;font-size:14px;color:var(--c-muted)}
.sp-meta div{padding:4px 0}
.tabs{margin-top:40px}
.tab-nav{display:flex;gap:8px;border-bottom:1px solid var(--c-line);flex-wrap:wrap}
.tab-nav button{padding:12px 18px;font-weight:700;color:var(--c-muted);position:relative}
.tab-nav button.active{color:var(--c-gold)}
.tab-nav button.active::after{content:"";position:absolute;bottom:-1px;right:0;left:0;height:2px;background:var(--c-gold)}
.tab-pane{display:none;padding:22px 0;animation:fade .3s}
.tab-pane.active{display:block}

/* ---------- Mobile menu ---------- */
.mobile-menu{position:fixed;top:0;bottom:0;right:0;width:min(320px,86vw);z-index:400;background:linear-gradient(180deg,var(--c-bg-2),var(--c-bg));border-inline-start:1px solid var(--c-line);box-shadow:-20px 0 50px -20px #000;transform:translateX(100%);transition:transform .4s var(--ease-spring);padding:30px 24px;display:flex;flex-direction:column;gap:6px;overflow-y:auto}
.mobile-menu.open{transform:none}
.mobile-menu .mm-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.mobile-menu .mm-list li{opacity:0;transform:translateX(20px)}
.mobile-menu.open .mm-list li{animation:mmIn .4s var(--ease-spring) forwards}
.mobile-menu.open .mm-list li:nth-child(1){animation-delay:.08s}
.mobile-menu.open .mm-list li:nth-child(2){animation-delay:.14s}
.mobile-menu.open .mm-list li:nth-child(3){animation-delay:.20s}
.mobile-menu.open .mm-list li:nth-child(4){animation-delay:.26s}
.mobile-menu.open .mm-list li:nth-child(5){animation-delay:.32s}
.mobile-menu.open .mm-list li:nth-child(6){animation-delay:.38s}
@keyframes mmIn{to{opacity:1;transform:none}}
.mobile-menu .mm-list a{display:block;padding:14px 10px;border-bottom:1px solid var(--c-line);font-size:17px;font-weight:600;transition:color var(--t),padding var(--t)}
.mobile-menu .mm-list a:hover{color:var(--c-gold);padding-inline-start:18px}
.mobile-menu .sub-menu,.mobile-menu .children{list-style:none;margin:0;padding-inline-start:14px}
.mobile-menu .sub-menu a,.mobile-menu .children a{font-size:15px;color:var(--c-muted)}
.mm-contact{margin-top:auto;padding-top:20px}
.mm-contact .btn{width:100%;justify-content:center}
.mm-close{align-self:flex-start;font-size:32px;line-height:1;margin-bottom:20px;color:var(--c-gold);cursor:pointer}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .grid-4{grid-template-columns:repeat(3,1fr)}
  .features{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .hero-grid{grid-template-columns:1fr}
  .hero-visual{order:-1}
  .hero-card img{height:320px}
  .sp-grid{grid-template-columns:1fr}
  .cats{grid-template-columns:1fr 1fr}
  .main-nav{display:none}
  .burger{display:flex}
}
@media (max-width:560px){
  .grid-4,.grid-3,.grid-2{grid-template-columns:repeat(2,1fr)}
  .cats{grid-template-columns:1fr}
  .features{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .section{padding:48px 0}
  .cta-banner{padding:30px 20px}
  .hero-stats{gap:18px}
}
@media (max-width:380px){
  .grid-4,.grid-3,.grid-2{grid-template-columns:1fr}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}