  :root{
    --navy-deep:#081B30;
    --navy:#0E2A47;
    --navy-mid:#15375C;
    --copper:#E8A33D;
    --copper-dark:#C9821F;
    --white:#FFFFFF;
    --bg-soft:#F4F6F9;
    --ink:#16202B;
    --ink-soft:#5C6B7A;
    --line:#E3E8EE;
    --radius:10px;
    --shadow-sm:0 2px 8px rgba(8,27,48,.06);
    --shadow-md:0 8px 24px rgba(8,27,48,.10);
    --shadow-lg:0 20px 50px rgba(8,27,48,.18);
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Vazirmatn',sans-serif;
    background:var(--white);
    color:var(--ink);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block;}
  a{text-decoration:none;color:inherit;}
  ul{list-style:none;}
  button{font-family:inherit;cursor:pointer;border:none;background:none;}
  .container{max-width:1240px;margin:0 auto;padding:0 24px;}
  @media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important;transition-duration:.001ms !important;}}

  /* ===== Topbar ===== */
  .topbar{
    background:var(--navy-deep);
    color:#C9D6E4;
    font-size:13px;
  }
  .topbar .container{
    display:flex;justify-content:space-between;align-items:center;
    height:38px;
  }
  .topbar-links{display:flex;gap:22px;}
  .topbar-links span{display:inline-flex;align-items:center;gap:6px;}
  .topbar-right{display:flex;gap:18px;}
  .topbar a:hover{color:var(--copper);}

  /* ===== Header ===== */
  header.site-header{
    background:var(--white);
    border-bottom:1px solid var(--line);
    position:sticky;top:0;z-index:100;
    transition:box-shadow .25s ease;
  }
  header.site-header.scrolled{box-shadow:var(--shadow-md);}
  .header-main{
    display:flex;align-items:center;gap:28px;
    height:84px;
  }
  .logo{
    display:flex;align-items:center;gap:10px;
    font-weight:800;font-size:22px;color:var(--navy);
    flex-shrink:0;
  }
  .logo .logo-mark{
    width:42px;height:42px;border-radius:9px;
    background:linear-gradient(145deg,var(--navy) 0%,var(--navy-mid) 100%);
    display:flex;align-items:center;justify-content:center;
    box-shadow:var(--shadow-sm);
  }
  .logo .logo-mark svg{width:24px;height:24px;}
  .logo small{display:block;font-weight:500;font-size:11px;color:var(--ink-soft);margin-top:1px;}

  .search-box{
    flex:1;max-width:480px;
    display:flex;align-items:center;
    background:var(--bg-soft);
    border:1.5px solid transparent;
    border-radius:999px;
    padding:0 6px 0 18px;
    height:46px;
    transition:border-color .2s;
  }
  .search-box:focus-within{border-color:var(--copper);background:var(--white);}
  .search-box input{
    flex:1;border:none;background:transparent;font-family:inherit;
    font-size:14px;height:100%;outline:none;color:var(--ink);
  }
  .search-box input::placeholder{color:#9AA7B5;}
  .search-box button{
    width:38px;height:38px;border-radius:50%;
    background:var(--navy);color:white;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;transition:background .2s;
  }
  .search-box button:hover{background:var(--copper-dark);}

  .header-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  .icon-btn{
    position:relative;
    display:flex;flex-direction:column;align-items:center;gap:4px;
    padding:8px 12px;border-radius:8px;
    color:var(--navy);font-size:11px;font-weight:600;
    transition:background .2s;
  }
  .icon-btn:hover{background:var(--bg-soft);}
  .icon-btn svg{width:22px;height:22px;}
  .cart-count{
    position:absolute;top:2px;left:6px;
    background:var(--copper);color:var(--navy-deep);
    font-size:10px;font-weight:800;
    width:18px;height:18px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    border:2px solid white;
  }

  /* nav */
  nav.main-nav{
    background:var(--navy);
  }
  .nav-inner{display:flex;align-items:center;gap:2px;height:52px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .nav-inner::-webkit-scrollbar{display:none;}
  .nav-inner > li{position:relative;}
  .nav-inner > li > a{
    display:flex;align-items:center;gap:6px;
    color:#E6ECF3;font-size:14.5px;font-weight:600;
    padding:0 18px;height:52px;
    transition:background .2s,color .2s;
  }
  .nav-inner > li > a:hover{background:var(--navy-mid);color:var(--copper);}
  .nav-inner li.all-cats > a{
    background:var(--copper);color:var(--navy-deep);
  }
  .nav-inner li.all-cats > a:hover{background:var(--copper-dark);color:var(--navy-deep);}
  .mega{
    position:absolute;top:100%;right:0;
    background:white;border-radius:0 0 12px 12px;
    box-shadow:var(--shadow-lg);
    width:560px;padding:22px;
    display:grid;grid-template-columns:1fr 1fr;gap:6px 28px;
    opacity:0;visibility:hidden;transform:translateY(-6px);
    transition:all .2s ease;
    z-index:50;
  }
  .nav-inner > li:hover .mega{opacity:1;visibility:visible;transform:translateY(0);}
  .mega a{display:block;padding:8px 4px;font-size:13.5px;color:var(--ink-soft);border-radius:6px;}
  .mega a:hover{color:var(--copper-dark);background:var(--bg-soft);padding-right:10px;}
  .mega-title{font-size:12px;font-weight:700;color:var(--navy);padding:8px 4px 2px;border-bottom:2px solid var(--bg-soft);margin-bottom:4px;}

  

  /* ===== Hero ===== */
  .hero{
    background:linear-gradient(120deg,var(--navy-deep) 0%,var(--navy) 55%,var(--navy-mid) 100%);
    color:white;position:relative;overflow:hidden;
  }
  .hero::before{
    content:"";position:absolute;inset:0;
    background-image:
      repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px 64px),
      repeating-linear-gradient(0deg, rgba(255,255,255,.035) 0 1px, transparent 1px 64px);
    pointer-events:none;
  }
  .hero-grid{
    position:relative;z-index:2;
    display:grid;grid-template-columns:1.1fr .9fr;gap:40px;
    align-items:center;
    padding:64px 24px 70px;
    min-height:480px;
  }
  .hero-eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    background:rgba(232,163,61,.15);border:1px solid rgba(232,163,61,.4);
    color:var(--copper);font-size:13px;font-weight:700;
    padding:7px 16px;border-radius:999px;margin-bottom:22px;
  }
  .hero h1{
    font-size:46px;font-weight:800;line-height:1.35;margin-bottom:18px;
  }
  .hero h1 span{color:var(--copper);}
  .hero p{font-size:16.5px;color:#C9D6E4;max-width:480px;margin-bottom:32px;}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:15px 28px;border-radius:8px;font-weight:700;font-size:14.5px;
    transition:all .2s ease;
  }
  .btn-copper{background:var(--copper);color:var(--navy-deep);}
  .btn-copper:hover{background:var(--copper-dark);transform:translateY(-2px);box-shadow:0 10px 24px rgba(232,163,61,.3);}
  .btn-outline{border:1.5px solid rgba(255,255,255,.35);color:white;}
  .btn-outline:hover{background:rgba(255,255,255,.08);border-color:white;}

  .hero-spec-card{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.14);
    border-radius:16px;backdrop-filter:blur(6px);
    padding:30px;position:relative;
  }
  .breaker-rack{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:22px;}
  .breaker{
    aspect-ratio:1/1.05;border-radius:8px;
    background:linear-gradient(160deg,#2A4565,#1B3550);
    border:1px solid rgba(255,255,255,.12);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
    position:relative;cursor:pointer;text-decoration:none;
    transition:border-color .2s, background .2s, transform .2s;
    padding:10px 4px 8px;
  }
  .breaker:hover{border-color:rgba(232,163,61,.5);background:linear-gradient(160deg,#33507A,#21405F);transform:translateY(-2px);}
  .breaker .breaker-ic{width:20px;height:20px;color:#C9D6E4;flex-shrink:0;}
  .breaker .breaker-switch{width:5px;height:16px;border-radius:2px;background:var(--copper);transition:transform .35s cubic-bezier(.4,0,.2,1), background .2s;}
  .breaker.on .breaker-switch{transform:translateY(0);}
  .breaker:hover .breaker-switch{transform:translateY(6px);background:#FFC766;}
  .breaker .breaker-label{font-size:10.5px;color:#C9D6E4;text-align:center;line-height:1.3;}
  .hero-spec-card .spec-label{font-size:12px;color:#9FB0C2;text-align:center;margin-bottom:4px;}
  .hero-stats{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.14);padding-top:18px;}
  .hero-stats div{text-align:center;}
  .hero-stats b{display:block;font-size:22px;color:var(--copper);font-weight:800;}
  .hero-stats span{font-size:12px;color:#9FB0C2;}

  /* ===== Trust strip ===== */
  .trust-strip{background:var(--bg-soft);border-bottom:1px solid var(--line);}
  .trust-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:22px 24px;gap:16px;}
  .trust-item{display:flex;align-items:center;gap:12px;}
  .trust-item .ic{
    width:42px;height:42px;border-radius:10px;background:white;
    display:flex;align-items:center;justify-content:center;color:var(--copper-dark);
    box-shadow:var(--shadow-sm);flex-shrink:0;
  }
  .trust-item .ic svg{width:22px;height:22px;}
  .trust-item b{display:block;font-size:13.5px;color:var(--navy);}
  .trust-item span{font-size:12px;color:var(--ink-soft);}

  /* ===== Section heading ===== */
  .section{padding:64px 24px;}
  .section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px;flex-wrap:wrap;gap:14px;}
  .section-head h2{font-size:27px;font-weight:800;color:var(--navy);}
  .section-head .eyebrow{font-size:12.5px;font-weight:700;color:var(--copper-dark);letter-spacing:.3px;margin-bottom:6px;display:block;}
  .section-head p{color:var(--ink-soft);font-size:14px;margin-top:6px;max-width:520px;}
  .link-more{font-size:13.5px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:6px;}
  .link-more:hover{color:var(--copper-dark);}

  /* ===== Categories ===== */
  .cat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
  .cat-card{
    background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);
    padding:22px 14px;text-align:center;transition:all .25s ease;
  }
  .cat-card:hover{
    background:var(--navy);border-color:var(--navy);transform:translateY(-4px);box-shadow:var(--shadow-md);
  }
  .cat-card .cat-ic{
    width:54px;height:54px;margin:0 auto 14px;border-radius:50%;
    background:white;display:flex;align-items:center;justify-content:center;color:var(--navy);
    transition:all .25s ease;
  }
  .cat-card:hover .cat-ic{background:var(--copper);color:var(--navy-deep);}
  .cat-card .cat-ic svg{width:26px;height:26px;}
  .cat-card b{font-size:13.5px;color:var(--navy);display:block;transition:color .25s;}
  .cat-card:hover b{color:white;}
  .cat-card span{font-size:11.5px;color:var(--ink-soft);transition:color .25s;}
  .cat-card:hover span{color:#AFC1D4;}

  /* ===== Products ===== */
  .prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
  .prod-card{
    border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
    background:white;transition:all .25s ease;display:flex;flex-direction:column;
  }
  .prod-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);border-color:transparent;}
  .prod-img{
    aspect-ratio:1/1;background:linear-gradient(150deg,#EEF2F6,#E3E9EF);
    display:flex;align-items:center;justify-content:center;position:relative;
  }
  .prod-img svg{width:78%;height:78%;color:#AEBBC9;}
  .prod-badge{
    position:absolute;top:10px;right:10px;
    background:var(--copper);color:var(--navy-deep);
    font-size:11px;font-weight:800;padding:4px 10px;border-radius:999px;
  }
  .prod-badge.new{background:var(--navy);color:white;}
  .wish-btn{
    position:absolute;top:10px;left:10px;width:32px;height:32px;border-radius:50%;
    background:white;display:flex;align-items:center;justify-content:center;
    box-shadow:var(--shadow-sm);color:var(--ink-soft);transition:all .2s;
  }
  .wish-btn:hover{color:#E0445B;transform:scale(1.08);}
  .wish-btn.active{color:#E0445B;}
  .wish-btn.active svg{fill:#E0445B;}
  .wish-btn svg{width:16px;height:16px;}
  .prod-body{padding:16px;display:flex;flex-direction:column;gap:8px;flex:1;}
  .prod-cat{font-size:11.5px;color:var(--copper-dark);font-weight:700;}
  .prod-title{font-size:14.5px;font-weight:700;color:var(--ink);line-height:1.5;}
  .spec-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px;}
  .spec-tag{
    font-size:10.5px;border:1px solid var(--line);color:var(--ink-soft);
    padding:3px 8px;border-radius:5px;font-weight:600;background:var(--bg-soft);
  }
  .prod-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:10px;border-top:1px solid var(--line);}
  .price{font-size:16px;font-weight:800;color:var(--navy);}
  .price small{font-size:11px;color:var(--ink-soft);font-weight:500;}
  .add-btn{
    width:38px;height:38px;border-radius:8px;background:var(--navy);color:white;
    display:flex;align-items:center;justify-content:center;transition:background .2s;
  }
  .add-btn:hover{background:var(--copper-dark);}
  .add-btn svg{width:18px;height:18px;}

  /* ===== Banner ===== */
  .promo-banner{
    margin:0 24px;border-radius:16px;
    background:linear-gradient(120deg,var(--copper) 0%,#F0B860 100%);
    padding:38px 44px;display:flex;justify-content:space-between;align-items:center;
    color:var(--navy-deep);flex-wrap:wrap;gap:20px;
  }
  .promo-banner h3{font-size:24px;font-weight:800;margin-bottom:8px;}
  .promo-banner p{font-size:14px;opacity:.85;max-width:420px;}
  .promo-banner .btn{background:var(--navy-deep);color:white;}
  .promo-banner .btn:hover{background:var(--navy);}

  /* ===== Brands ===== */
  .brand-strip{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:30px;padding:36px 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .brand-strip span{font-weight:800;font-size:17px;color:#B7C2CE;letter-spacing:.5px;}

  /* ===== Footer ===== */
  footer{background:var(--navy-deep);color:#AEBBC9;}
  .footer-top{padding:56px 24px 36px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;}
  .footer-col h4{color:white;font-size:15px;font-weight:700;margin-bottom:18px;}
  .footer-col ul li{margin-bottom:11px;font-size:13.5px;}
  .footer-col ul li a:hover{color:var(--copper);}
  .footer-about p{font-size:13.5px;line-height:1.9;margin-bottom:18px;color:#9FB0C2;}
  .footer-logo{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
  .footer-logo .logo-mark{width:38px;height:38px;border-radius:8px;background:var(--copper);display:flex;align-items:center;justify-content:center;}
  .footer-logo .logo-mark svg{width:20px;height:20px;color:var(--navy-deep);}
  .footer-logo b{color:white;font-size:18px;font-weight:800;}
  .social-row{display:flex;gap:10px;}
  .social-row a{
    width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.07);
    display:flex;align-items:center;justify-content:center;transition:all .2s;
  }
  .social-row a:hover{background:var(--copper);color:var(--navy-deep);}
  .social-row svg{width:17px;height:17px;}
  .contact-line{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;margin-bottom:14px;}
  .contact-line svg{width:18px;height:18px;flex-shrink:0;color:var(--copper);margin-top:2px;}
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,.08);
    padding:20px 24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
    font-size:12.5px;
  }
  .pay-icons{display:flex;gap:8px;}
  .pay-icons span{
    background:white;color:var(--navy);font-size:10.5px;font-weight:800;
    padding:5px 10px;border-radius:5px;
  }

  /* ===== toast ===== */
  .toast{
    position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(20px);
    background:var(--navy-deep);color:white;padding:14px 24px;border-radius:10px;
    font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:10px;
    box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;
    transition:all .3s ease;z-index:999;
  }
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
  .toast svg{width:18px;height:18px;color:var(--copper);}

  /* ===== Responsive ===== */
  @media (max-width:1080px){
    .cat-grid{grid-template-columns:repeat(3,1fr);}
    .prod-grid{grid-template-columns:repeat(2,1fr);}
    .footer-top{grid-template-columns:1fr 1fr;}
    .hero-grid{grid-template-columns:1fr;}
    .hero h1{font-size:34px;}
  }
  .mobile-nav-toggle{display:none;}
  .mobile-nav-panel{display:none;}

  @media (max-width:760px){
    .topbar{display:none;}
    .search-box{display:none;}
  body{overflow-x:hidden;}
  .container{overflow-x:visible;}
  .header-main{gap:10px;}
  .header-actions{gap:0;}
  .icon-btn{padding:8px 6px;}
    .mega{display:none;}
    .trust-grid{grid-template-columns:1fr 1fr;}
    .cat-grid{grid-template-columns:repeat(2,1fr);}
    .prod-grid{grid-template-columns:1fr 1fr;}
    .promo-banner{flex-direction:column;text-align:center;}
    .footer-top{grid-template-columns:1fr;text-align:right;}
    .section-head{flex-direction:column;align-items:flex-start;}
    .icon-btn span{display:none;}

    /* منوی افقی اسکرول‌شونده اصلی روی موبایل مخفی می‌شود */
    .nav-inner{display:none;}

    /* دکمه تمام‌عرض «دسته‌بندی‌ها» که منوی کشویی را باز می‌کند */
    .mobile-nav-toggle{
      display:flex;align-items:center;justify-content:space-between;
      width:100%;height:48px;padding:0 20px;background:var(--navy);
      color:#fff;font-size:14.5px;font-weight:700;
    }
    .mobile-nav-toggle svg{width:18px;height:18px;transition:transform .25s;}
    .mobile-nav-toggle.open svg{transform:rotate(180deg);}

    /* پنل کشویی: هر دسته یک ردیف تمام‌عرض، بدون بریدگی متن */
    .mobile-nav-panel{
      display:none;background:var(--navy-mid);
      border-top:1px solid rgba(255,255,255,.1);
    }
    .mobile-nav-panel.open{display:block;}
    .mobile-nav-panel a{
      display:block;width:100%;padding:14px 20px;
      color:#E6ECF3;font-size:14px;font-weight:600;
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .mobile-nav-panel a:active{background:rgba(255,255,255,.06);}
    .mobile-nav-panel a.featured{color:var(--copper);}
  }

/* ===== Breadcrumb ===== */
.breadcrumb{background:var(--bg-soft);border-bottom:1px solid var(--line);}
.breadcrumb .container{display:flex;align-items:center;gap:8px;height:48px;font-size:13px;color:var(--ink-soft);}
.breadcrumb a:hover{color:var(--copper-dark);}
.breadcrumb svg{width:13px;height:13px;opacity:.6;}
.breadcrumb .current{color:var(--navy);font-weight:600;}

/* ===== Page header (simple pages) ===== */
.page-head{padding:40px 24px 8px;}
.page-head h1{font-size:24px;font-weight:800;color:var(--navy);}

/* ===== Buttons (shared extras) ===== */
.btn-block{width:100%;justify-content:center;}
.btn-navy{background:var(--navy);color:#fff;}
.btn-navy:hover{background:var(--navy-mid);}
.btn-ghost{background:var(--bg-soft);color:var(--navy);}
.btn-ghost:hover{background:#E7ECF2;}
.btn-sm{padding:9px 16px;font-size:13px;}
.btn[disabled]{opacity:.5;pointer-events:none;}

/* ===== Quantity stepper ===== */
.qty-stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden;width:fit-content;}
.qty-stepper button{width:34px;height:34px;display:flex;align-items:center;justify-content:center;color:var(--navy);font-size:16px;font-weight:700;transition:background .15s;}
.qty-stepper button:hover{background:var(--bg-soft);}
.qty-stepper input{width:42px;height:34px;text-align:center;border:none;border-inline:1px solid var(--line);font-family:inherit;font-weight:700;color:var(--ink);font-size:14px;}
.qty-stepper input:focus{outline:none;}

/* ===== Product detail page ===== */
.pdp-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:36px 24px 0;}
.pdp-gallery{position:sticky;top:90px;align-self:start;}
.pdp-main-img{
  aspect-ratio:1/1;border-radius:14px;background:linear-gradient(150deg,#EEF2F6,#E3E9EF);
  display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;margin-bottom:14px;
}
.pdp-main-img svg{width:80%;height:80%;color:#AEBBC9;}
.pdp-thumbs{display:flex;gap:10px;}
.pdp-thumb{
  width:72px;height:72px;border-radius:8px;background:var(--bg-soft);border:2px solid transparent;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s;flex-shrink:0;
}
.pdp-thumb.active{border-color:var(--copper);}
.pdp-thumb svg{width:85%;height:85%;color:#AEBBC9;}

.pdp-info .pdp-cat{font-size:13px;font-weight:700;color:var(--copper-dark);}
.pdp-info h1{font-size:25px;font-weight:800;color:var(--navy);margin:8px 0 12px;line-height:1.5;}
.pdp-meta{display:flex;align-items:center;gap:14px;margin-bottom:18px;font-size:13px;color:var(--ink-soft);}
.pdp-meta .stars{color:var(--copper);letter-spacing:1px;}
.pdp-price-row{display:flex;align-items:baseline;gap:10px;margin-bottom:6px;}
.pdp-price-row .price{font-size:28px;}
.pdp-price-row .old-price{font-size:15px;color:#A8B4C0;text-decoration:line-through;}
.pdp-stock{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#1E9E5A;font-weight:700;margin-bottom:22px;}
.pdp-stock svg{width:14px;height:14px;}
.pdp-stock::before{content:"";width:7px;height:7px;border-radius:50%;background:#1E9E5A;}
.pdp-stock.in{color:#1E9E5A;}
.pdp-stock.in::before{background:#1E9E5A;}
.pdp-stock.low{color:var(--copper-dark);}
.pdp-stock.low::before{background:var(--copper);}
.pdp-stock.out{color:#C13A4D;}
.pdp-stock.out::before{background:#C13A4D;}

/* card-level stock badges */
.stock-line{font-size:11.5px;font-weight:700;margin-top:2px;display:flex;align-items:center;gap:5px;}
.stock-line::before{content:"";width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.stock-line.in{color:#1E9E5A;}
.stock-line.in::before{background:#1E9E5A;}
.stock-line.low{color:var(--copper-dark);}
.stock-line.low::before{background:var(--copper);}
.stock-line.out{color:#C13A4D;}
.stock-line.out::before{background:#C13A4D;}

/* out-of-stock product card treatment */
.prod-card.is-out .prod-img{opacity:.55;}
.prod-card.is-out .prod-title{color:#9AA7B5;}
.out-of-stock-overlay{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:var(--navy-deep);color:#fff;font-size:12px;font-weight:800;
  padding:6px 16px;border-radius:999px;z-index:2;white-space:nowrap;
}
.add-btn.out-of-stock{background:#E3E8EE;color:#A8B4C0;cursor:not-allowed;}
.add-btn.out-of-stock:hover{background:#E3E8EE;}
.add-btn[disabled]{pointer-events:none;}

.pdp-specs{border:1px solid var(--line);border-radius:10px;margin-bottom:22px;overflow:hidden;}
.pdp-specs .row{display:flex;justify-content:space-between;padding:11px 16px;font-size:13.5px;border-bottom:1px solid var(--line);}
.pdp-specs .row:last-child{border-bottom:none;}
.pdp-specs .row:nth-child(even){background:var(--bg-soft);}
.pdp-specs .row span:first-child{color:var(--ink-soft);}
.pdp-specs .row span:last-child{font-weight:700;color:var(--navy);}

.pdp-buy-row{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.pdp-buy-row .btn{flex:1;}
.icon-square{
  width:50px;height:50px;border-radius:8px;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--ink-soft);transition:all .2s;flex-shrink:0;
}
.icon-square:hover{border-color:var(--copper);color:var(--copper-dark);}
.icon-square svg{width:20px;height:20px;}
.icon-square.active{color:#E0445B;border-color:#E0445B;}
.icon-square.active svg{fill:#E0445B;}

.pdp-trust-mini{display:flex;gap:18px;flex-wrap:wrap;padding-top:18px;border-top:1px solid var(--line);}
.pdp-trust-mini div{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-soft);}
.pdp-trust-mini svg{width:16px;height:16px;color:var(--copper-dark);}

/* tabs */
.tabs-nav{display:flex;gap:6px;border-bottom:2px solid var(--line);margin:0 24px;}
.tab-btn{padding:14px 22px;font-size:14px;font-weight:700;color:var(--ink-soft);border-bottom:3px solid transparent;margin-bottom:-2px;transition:all .2s;}
.tab-btn.active{color:var(--navy);border-color:var(--copper);}
.tab-panel{padding:28px 24px;max-width:900px;display:none;}
.tab-panel.active{display:block;}
.tab-panel p{color:var(--ink-soft);font-size:14.5px;margin-bottom:14px;}
.review-item{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);}
.review-avatar{width:42px;height:42px;border-radius:50%;background:var(--navy);color:white;display:flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0;}
.review-item b{font-size:13.5px;color:var(--navy);}
.review-stars{color:var(--copper);font-size:12px;margin:3px 0 6px;}
.review-item p{margin:0;font-size:13.5px;}

/* ===== Cart page ===== */
.cart-layout{display:grid;grid-template-columns:2.2fr 1fr;gap:28px;padding:32px 24px 80px;align-items:start;}
.cart-table{border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.cart-row{display:grid;grid-template-columns:64px 1fr auto auto auto;gap:16px;align-items:center;padding:16px;border-bottom:1px solid var(--line);}
.cart-row:last-child{border-bottom:none;}
.cart-row .thumb{width:64px;height:64px;border-radius:8px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;}
.cart-row .thumb svg{width:85%;height:85%;color:#AEBBC9;}
.cart-row .info b{display:block;font-size:13.5px;color:var(--ink);margin-bottom:4px;}
.cart-row .info span{font-size:12px;color:var(--ink-soft);}
.cart-row .unit-price{font-size:13px;color:var(--ink-soft);white-space:nowrap;}
.cart-row .line-price{font-size:14.5px;font-weight:800;color:var(--navy);white-space:nowrap;}
.remove-btn{color:#A8B4C0;transition:color .2s;}
.remove-btn:hover{color:#E0445B;}
.remove-btn svg{width:18px;height:18px;}
.cart-empty{text-align:center;padding:70px 24px;}
.cart-empty svg{width:64px;height:64px;color:#D6DEE6;margin:0 auto 18px;}
.cart-empty h3{font-size:17px;color:var(--navy);margin-bottom:8px;}
.cart-empty p{color:var(--ink-soft);font-size:13.5px;margin-bottom:22px;}

.summary-card{border:1px solid var(--line);border-radius:12px;padding:22px;position:sticky;top:90px;}
.summary-card h3{font-size:15.5px;color:var(--navy);margin-bottom:18px;}
.summary-row{display:flex;justify-content:space-between;font-size:13.5px;color:var(--ink-soft);margin-bottom:12px;}
.summary-row.total{border-top:1px solid var(--line);padding-top:14px;margin-top:6px;font-size:16px;font-weight:800;color:var(--navy);}
.coupon-row{display:flex;gap:8px;margin:18px 0;}
.coupon-row input{flex:1;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:13px;font-family:inherit;height:40px;}
.coupon-row input:focus{outline:none;border-color:var(--copper);}

/* ===== Checkout / stepper ===== */
.step-track{display:flex;justify-content:center;gap:0;padding:30px 24px 10px;}
.step-item{display:flex;align-items:center;gap:10px;}
.step-circle{width:32px;height:32px;border-radius:50%;background:var(--bg-soft);border:2px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:var(--ink-soft);transition:all .25s;}
.step-item.active .step-circle{background:var(--navy);border-color:var(--navy);color:white;}
.step-item.done .step-circle{background:var(--copper);border-color:var(--copper);color:var(--navy-deep);}
.step-item span{font-size:13px;font-weight:700;color:var(--ink-soft);}
.step-item.active span{color:var(--navy);}
.step-divider{width:60px;height:2px;background:var(--line);margin:0 8px;}

.checkout-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;padding:10px 24px 80px;align-items:start;}
.form-card{border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:20px;}
.form-card h3{font-size:15px;color:var(--navy);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.form-card h3 svg{width:18px;height:18px;color:var(--copper-dark);}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.form-field{margin-bottom:14px;}
.form-field.full{grid-column:1/-1;}
.form-field label{display:block;font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:6px;}
.form-field input,.form-field textarea,.form-field select{
  width:100%;border:1px solid var(--line);border-radius:8px;padding:11px 14px;font-family:inherit;font-size:13.5px;color:var(--ink);transition:border-color .2s;
}
.form-field input:focus,.form-field textarea:focus,.form-field select:focus{outline:none;border-color:var(--copper);}
.pay-options{display:flex;flex-direction:column;gap:10px;}
.pay-option{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:10px;padding:14px 16px;cursor:pointer;transition:all .2s;}
.pay-option:hover{border-color:#C9D6E4;}
.pay-option.selected{border-color:var(--copper);background:#FFF9EF;}
.pay-option input{accent-color:var(--copper);width:17px;height:17px;}
.pay-option .pay-logo{font-weight:800;font-size:13px;color:var(--navy);}
.pay-option span.desc{font-size:11.5px;color:var(--ink-soft);margin-right:auto;}
.order-success{text-align:center;padding:70px 24px;max-width:480px;margin:0 auto;}
.order-success .check-circle{
  width:84px;height:84px;border-radius:50%;background:#E7F7EE;color:#1E9E5A;
  display:flex;align-items:center;justify-content:center;margin:0 auto 24px;
}
.order-success .check-circle svg{width:42px;height:42px;}
.order-success h2{font-size:22px;color:var(--navy);margin-bottom:10px;}
.order-success p{color:var(--ink-soft);font-size:14px;margin-bottom:8px;}
.order-success .order-no{display:inline-block;background:var(--bg-soft);padding:8px 18px;border-radius:8px;font-weight:800;color:var(--navy);margin:14px 0 26px;letter-spacing:.5px;}

@media (max-width:900px){
  .pdp-grid{grid-template-columns:1fr;}
  .pdp-gallery{position:static;}
  .cart-layout{grid-template-columns:1fr;}
  .summary-card{position:static;}
  .checkout-layout{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}
  .cart-row{grid-template-columns:48px 1fr;grid-template-areas:"thumb info" "thumb qty" "thumb price";row-gap:8px;}
  .cart-row .thumb{grid-area:thumb;}
  .cart-row .info{grid-area:info;}
  .step-track{flex-wrap:wrap;}
  .step-divider{width:30px;}
}

/* ===== Shop / Filter page ===== */
.shop-layout{display:grid;grid-template-columns:260px 1fr;gap:28px;padding:28px 24px 80px;align-items:start;}
.filter-sidebar{border:1px solid var(--line);border-radius:12px;padding:20px;position:sticky;top:90px;}
.filter-group{border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:18px;}
.filter-group:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
.filter-group h4{font-size:13.5px;color:var(--navy);margin-bottom:12px;display:flex;justify-content:between;align-items:center;}
.filter-check{display:flex;align-items:center;gap:9px;margin-bottom:10px;font-size:13px;color:var(--ink-soft);cursor:pointer;}
.filter-check input{accent-color:var(--copper);width:15px;height:15px;}
.filter-check span.cnt{margin-right:auto;color:#A8B4C0;font-size:11.5px;}
.price-range{display:flex;flex-direction:column;gap:10px;}
.price-range input[type="range"]{accent-color:var(--copper);width:100%;}
.price-inputs{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--ink-soft);}
.price-inputs input{width:100%;border:1px solid var(--line);border-radius:6px;padding:7px 8px;font-family:inherit;font-size:12px;}
.clear-filters{font-size:12px;color:var(--copper-dark);font-weight:700;cursor:pointer;}

.shop-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px;}
.shop-toolbar .result-count{font-size:13px;color:var(--ink-soft);}
.shop-toolbar .result-count b{color:var(--navy);}
.sort-select{display:flex;align-items:center;gap:8px;}
.sort-select select{border:1px solid var(--line);border-radius:8px;padding:9px 14px;font-family:inherit;font-size:13px;color:var(--ink);}
.active-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;}
.chip{display:flex;align-items:center;gap:6px;background:var(--bg-soft);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:12px;color:var(--navy);}
.chip button{color:var(--ink-soft);font-size:14px;line-height:1;}

@media (max-width:900px){
  .shop-layout{grid-template-columns:1fr;}
  .filter-sidebar{position:static;display:none;}
  .filter-sidebar.open{display:block;}
  
}

/* ===== Static content pages (about / contact / faq) ===== */
.static-hero{background:linear-gradient(120deg,var(--navy-deep),var(--navy));color:#fff;padding:48px 24px;text-align:center;}
.static-hero h1{font-size:28px;font-weight:800;margin-bottom:10px;}
.static-hero p{color:#C9D6E4;font-size:14px;max-width:560px;margin:0 auto;}
.static-content{max-width:880px;margin:0 auto;padding:48px 24px 70px;}
.static-content h2{font-size:19px;color:var(--navy);margin:32px 0 14px;}
.static-content h2:first-child{margin-top:0;}
.static-content p{color:var(--ink-soft);font-size:14.5px;margin-bottom:14px;}

.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:30px 0;}
.about-stats div{text-align:center;background:var(--bg-soft);border-radius:10px;padding:20px 10px;}
.about-stats b{display:block;font-size:24px;color:var(--navy);font-weight:800;}
.about-stats span{font-size:12px;color:var(--ink-soft);}

.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:24px 0;}
.value-card{border:1px solid var(--line);border-radius:10px;padding:20px;text-align:center;}
.value-card .ic{width:46px;height:46px;border-radius:50%;background:var(--bg-soft);color:var(--copper-dark);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.value-card .ic svg{width:22px;height:22px;}
.value-card b{display:block;font-size:13.5px;color:var(--navy);margin-bottom:6px;}
.value-card span{font-size:12.5px;color:var(--ink-soft);}

.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px;padding:48px 24px 70px;max-width:1100px;margin:0 auto;}
.contact-info-card{border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:16px;}
.contact-info-card .row{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px;}
.contact-info-card .row:last-child{margin-bottom:0;}
.contact-info-card .icon-square{flex-shrink:0;}
.contact-info-card b{display:block;font-size:13.5px;color:var(--navy);margin-bottom:3px;}
.contact-info-card span{font-size:13px;color:var(--ink-soft);}
.map-placeholder{aspect-ratio:16/10;border-radius:12px;background:linear-gradient(150deg,#EEF2F6,#E3E9EF);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#AEBBC9;border:1px solid var(--line);}
.map-placeholder svg{width:40px;height:40px;}
.map-placeholder span{font-size:12.5px;color:var(--ink-soft);}

.faq-search{max-width:560px;margin:0 auto 36px;}
.faq-search .search-box{height:52px;border:1px solid var(--line);}
.faq-cats{display:flex;gap:10px;justify-content:center;margin-bottom:32px;flex-wrap:wrap;}
.faq-cat-btn{padding:9px 18px;border-radius:999px;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink-soft);transition:all .2s;}
.faq-cat-btn.active{background:var(--navy);color:#fff;border-color:var(--navy);}
.faq-item{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;overflow:hidden;}
.faq-q{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;cursor:pointer;font-size:14px;font-weight:700;color:var(--navy);}
.faq-q svg{width:18px;height:18px;color:var(--ink-soft);transition:transform .25s;flex-shrink:0;}
.faq-item.open .faq-q svg{transform:rotate(180deg);}
.faq-a{padding:0 18px;font-size:13.5px;color:var(--ink-soft);max-height:0;overflow:hidden;transition:all .3s ease;}
.faq-item.open .faq-a{padding:0 18px 18px;max-height:300px;}

@media (max-width:760px){
  .about-stats{grid-template-columns:1fr 1fr;}
  .value-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
}

/* disabled-looking link button (used when checkout is blocked by out-of-stock items) */
.btn-disabled-link{opacity:.45;cursor:not-allowed;pointer-events:none;}

/* ===== بهینه‌سازی‌های رندر ===== */
.prod-card{contain:layout style;}
.prod-img svg{will-change:auto;}
.btn-copper:hover,.btn-copper{backface-visibility:hidden;}
.hero{contain:layout paint;}
