/* ==========================================================================
   PARSPECO  |  پایا انرژی سرزمین پارس
   Design system  —  Bootstrap 5 RTL override layer
   Palette taken from HOME.jpg mock-up:
       cream  #FFF6DB   olive #4E5F29   amber #FDB813
   ========================================================================== */

/* ---------- Fonts ---------- */
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-Black.woff2') format('woff2');font-weight:900;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --cream:#FFF6DB;
  --cream-2:#FBEFCC;
  --olive:#4E5F29;
  --olive-2:#64783B;
  --olive-3:#3B4A1D;
  --olive-ink:#2C3714;
  --amber:#FDB813;
  --amber-2:#E8A505;
  --ink:#26301A;
  --muted:#6B7360;
  --line:rgba(78,95,41,.16);
  --white:#fff;

  --r-sm:8px; --r:14px; --r-lg:22px; --r-xl:32px;
  --sh-sm:0 2px 10px rgba(44,55,20,.07);
  --sh:0 10px 34px rgba(44,55,20,.10);
  --sh-lg:0 22px 60px rgba(44,55,20,.16);
  --nav-h:82px;

  --bs-body-font-family:'Vazirmatn',system-ui,sans-serif;
}

*{-webkit-tap-highlight-color:transparent}
/* NOTE: overflow-x must NOT be `hidden` here — it silently breaks the
   pinned navbar. `clip` contains overflow without that side effect. */
html{scroll-behavior:smooth;scroll-padding-top:var(--scroll-pad,100px);overflow-x:clip}

body{
  font-family:'Vazirmatn',system-ui,sans-serif;
  background:var(--cream);
  color:var(--ink);
  font-size:16px;
  line-height:2;
  overflow-x:clip;
}

/* Latin numerals & model codes stay LTR */
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.num{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3{font-weight:800;line-height:1.5;color:var(--olive-ink);letter-spacing:-.2px}
a{text-decoration:none;color:var(--olive);transition:color .2s}
a:hover{color:var(--amber-2)}
p{margin-bottom:1rem}
img{max-width:100%}
::selection{background:var(--amber);color:var(--olive-ink)}

/* scrollbar */
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:var(--cream-2)}
::-webkit-scrollbar-thumb{background:var(--olive-2);border-radius:20px;border:3px solid var(--cream-2)}
::-webkit-scrollbar-thumb:hover{background:var(--olive)}

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn{font-weight:700;border-radius:100px;padding:.72rem 1.7rem;transition:.25s cubic-bezier(.4,0,.2,1);border:2px solid transparent;font-size:.95rem}
.btn-amber{background:var(--amber);color:var(--olive-ink);box-shadow:0 6px 20px rgba(253,184,19,.34)}
.btn-amber:hover{background:var(--amber-2);color:var(--olive-ink);transform:translateY(-2px);box-shadow:0 12px 30px rgba(253,184,19,.45)}
.btn-olive{background:var(--olive);color:var(--cream)}
.btn-olive:hover{background:var(--olive-3);color:var(--cream);transform:translateY(-2px);box-shadow:var(--sh)}
.btn-ghost{background:transparent;color:var(--cream);border-color:rgba(255,246,219,.55)}
.btn-ghost:hover{background:var(--cream);color:var(--olive);border-color:var(--cream)}
.btn-outline-olive{background:transparent;color:var(--olive);border-color:var(--olive)}
.btn-outline-olive:hover{background:var(--olive);color:var(--cream)}
.btn-lg{padding:.95rem 2.3rem;font-size:1.03rem}
.btn-sm{padding:.5rem 1.2rem;font-size:.85rem}

/* ==========================================================================
   Top bar + Navbar
   ========================================================================== */
.topbar{background:var(--olive-ink);color:rgba(255,246,219,.82);font-size:.82rem;padding:.42rem 0}
.topbar a{color:rgba(255,246,219,.82)}
.topbar a:hover{color:var(--amber)}
.topbar .sep{opacity:.3;margin:0 .55rem}
.topbar .soc{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:rgba(255,246,219,.1);margin-inline-start:5px;transition:.2s}
.topbar .soc:hover{background:var(--amber);color:var(--olive-ink)}

/* The navbar is FIXED so it stays pinned to the top of the viewport on every
   page and at every scroll position. `body` reserves its height via --nav-h,
   which main.js measures and keeps in sync. */
.site-nav{
  background:var(--cream);
  border-bottom:1px solid var(--line);
  transition:box-shadow .3s,padding .3s;
  padding:.55rem 0;
  position:fixed;top:0;inset-inline:0;z-index:1030;
}
body{padding-top:var(--nav-h,78px)}
.site-nav.stuck{box-shadow:0 6px 26px rgba(44,55,20,.12);padding:.28rem 0}
.navbar-brand img{height:46px;transition:height .3s}
.site-nav.stuck .navbar-brand img{height:38px}

.site-nav .nav-link{
  color:var(--olive-ink);font-weight:600;font-size:.98rem;
  padding:.55rem 1rem !important;border-radius:100px;position:relative;transition:.2s;
}
.site-nav .nav-link:hover,.site-nav .nav-link.active{color:var(--olive);background:rgba(78,95,41,.07)}
.site-nav .nav-link.active::after{
  content:"";position:absolute;bottom:2px;inset-inline-start:50%;transform:translateX(50%);
  width:20px;height:3px;border-radius:3px;background:var(--amber)
}
.dropdown-menu{
  border:none;border-radius:var(--r);box-shadow:var(--sh-lg);padding:.5rem;
  background:var(--white);min-width:230px;font-size:.94rem;
  animation:ddIn .22s ease
}
@keyframes ddIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.dropdown-item{border-radius:9px;padding:.55rem .85rem;font-weight:500;color:var(--ink)}
.dropdown-item:hover{background:var(--cream);color:var(--olive)}
.navbar-toggler{border:none;padding:.35rem .5rem;font-size:1.5rem;color:var(--olive)}
.navbar-toggler:focus{box-shadow:none}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{position:relative;min-height:clamp(520px,78vh,760px);display:flex;align-items:center;overflow:hidden;background:var(--olive-ink)}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;animation:kb 22s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.09)}}
.hero-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(275deg,rgba(44,55,20,.05) 0%,rgba(44,55,20,.55) 45%,rgba(44,55,20,.92) 100%)
}
.hero-inner{position:relative;z-index:2;padding:4rem 0;color:var(--cream)}
.hero .eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;background:rgba(253,184,19,.16);
  border:1px solid rgba(253,184,19,.5);color:var(--amber);
  padding:.4rem 1.05rem;border-radius:100px;font-size:.85rem;font-weight:700;margin-bottom:1.3rem
}
.hero h1{font-size:clamp(2rem,4.4vw,3.5rem);font-weight:900;color:var(--cream);line-height:1.45;margin-bottom:1.1rem}
.hero h1 .hl{color:var(--amber)}
.hero p.lead{font-size:clamp(1rem,1.5vw,1.18rem);color:rgba(255,246,219,.86);max-width:640px;line-height:2.1;font-weight:300}
.hero-stats{display:flex;gap:2.6rem;flex-wrap:wrap;margin-top:2.6rem;padding-top:1.7rem;border-top:1px solid rgba(255,246,219,.2)}
.hero-stats .v{font-size:2rem;font-weight:900;color:var(--amber);line-height:1}
.hero-stats .l{font-size:.85rem;color:rgba(255,246,219,.75)}

/* ==========================================================================
   Sections
   ========================================================================== */
.sec{padding:clamp(3.5rem,7vw,6.5rem) 0}
.sec-olive{background:var(--olive);color:var(--cream)}
.sec-olive h1,.sec-olive h2,.sec-olive h3,.sec-olive h4{color:var(--cream)}
.sec-olive p{color:rgba(255,246,219,.8)}
.sec-dark{background:var(--olive-ink);color:var(--cream)}
.sec-dark h2,.sec-dark h3{color:var(--cream)}
.sec-cream2{background:var(--cream-2)}
.sec-white{background:#fff}

.sec-head{margin-bottom:3rem}
.sec-head .kicker{
  display:inline-block;color:var(--amber-2);font-weight:800;font-size:.85rem;
  letter-spacing:1px;margin-bottom:.6rem;position:relative;padding-inline-start:34px
}
.sec-head .kicker::before{content:"";position:absolute;inset-inline-start:0;top:50%;width:26px;height:2px;background:var(--amber)}
.sec-olive .kicker,.sec-dark .kicker{color:var(--amber)}
.sec-head h2{font-size:clamp(1.6rem,3.2vw,2.5rem);font-weight:900;margin-bottom:.7rem}
.sec-head p{color:var(--muted);font-size:1.02rem;max-width:720px;line-height:2.05}
.sec-olive .sec-head p,.sec-dark .sec-head p{color:rgba(255,246,219,.78)}
.sec-head.center{text-align:center}
.sec-head.center p{margin-inline:auto}
.sec-head.center .kicker{padding-inline:34px}
.sec-head.center .kicker::after{content:"";position:absolute;inset-inline-end:0;top:50%;width:26px;height:2px;background:var(--amber)}

/* ==========================================================================
   Quick service strip (3 icons, like mock-up)
   ========================================================================== */
.qstrip{background:var(--olive-2);padding:2.4rem 0}
.qitem{display:flex;align-items:center;gap:1.1rem;color:var(--cream);padding:.6rem 0}
.qitem .ic{
  flex:0 0 auto;width:56px;height:56px;border-radius:16px;display:grid;place-items:center;
  background:rgba(255,246,219,.13);border:1px solid rgba(255,246,219,.2);font-size:1.5rem;color:var(--amber);transition:.3s
}
.qitem:hover .ic{background:var(--amber);color:var(--olive-ink);transform:rotate(-6deg) scale(1.06)}
.qitem h5{color:var(--cream);font-size:1.03rem;margin:0 0 .12rem;font-weight:700}
.qitem span{font-size:.85rem;color:rgba(255,246,219,.7);line-height:1.7}

/* ==========================================================================
   Application / category chips row  (mock-up olive icon row)
   ========================================================================== */
.appsrow{background:var(--olive);padding:3rem 0}
.appcard{
  display:block;text-align:center;color:var(--cream);padding:1.5rem .6rem;border-radius:var(--r);
  border:1px solid rgba(255,246,219,.14);background:rgba(255,246,219,.04);transition:.3s;height:100%
}
.appcard:hover{background:var(--amber);border-color:var(--amber);color:var(--olive-ink);transform:translateY(-7px);box-shadow:0 16px 36px rgba(0,0,0,.22)}
.appcard .ic{font-size:2.1rem;margin-bottom:.55rem;color:var(--amber);transition:.3s;line-height:1}
.appcard:hover .ic{color:var(--olive-ink)}
.appcard .t{font-size:.9rem;font-weight:700;line-height:1.6}

/* ==========================================================================
   Product cards
   ========================================================================== */
.pcard{
  background:#fff;border-radius:var(--r-lg);overflow:hidden;height:100%;
  border:1px solid var(--line);transition:.35s cubic-bezier(.4,0,.2,1);position:relative;display:flex;flex-direction:column
}
.pcard:hover{transform:translateY(-9px);box-shadow:var(--sh-lg);border-color:transparent}
.pcard .thumb{position:relative;aspect-ratio:1/1;background:#fff;overflow:hidden;display:grid;place-items:center;padding:6%}
.pcard .thumb img{width:100%;height:100%;object-fit:contain;transition:transform .5s}
.pcard:hover .thumb img{transform:scale(1.07)}
.pcard .badge-cat{
  position:absolute;top:12px;inset-inline-start:12px;background:var(--olive);color:var(--cream);
  font-size:.7rem;font-weight:700;padding:.28rem .7rem;border-radius:100px;z-index:2
}
.pcard .badge-hot{position:absolute;top:12px;inset-inline-end:12px;background:var(--amber);color:var(--olive-ink);font-size:.7rem;font-weight:800;padding:.28rem .7rem;border-radius:100px;z-index:2}
.pcard .body{padding:1.15rem 1.25rem 1.35rem;display:flex;flex-direction:column;flex:1;border-top:1px solid var(--line)}
.pcard .model{font-family:'Vazirmatn',monospace;direction:ltr;text-align:left;font-size:1.02rem;font-weight:800;color:var(--olive);margin-bottom:.35rem;letter-spacing:.3px}
.pcard .ptitle{font-size:.9rem;color:var(--muted);margin-bottom:.85rem;line-height:1.85;font-weight:500}
.pcard .specs{list-style:none;padding:0;margin:0 0 1rem;font-size:.83rem}
.pcard .specs li{display:flex;justify-content:space-between;gap:.5rem;padding:.32rem 0;border-bottom:1px dashed var(--line);color:var(--muted);line-height:1.7}
.pcard .specs li:last-child{border-bottom:none}
.pcard .specs b{color:var(--olive-ink);font-weight:700;direction:ltr}
.pcard .foot{margin-top:auto}

/* ==========================================================================
   Category / solution tiles
   ========================================================================== */
.ctile{
  position:relative;border-radius:var(--r-lg);overflow:hidden;height:100%;min-height:270px;
  display:flex;align-items:flex-end;color:var(--cream);isolation:isolate;background:var(--olive-ink)
}
.ctile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .7s}
.ctile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(44,55,20,.94) 6%,rgba(44,55,20,.42) 55%,rgba(44,55,20,.12) 100%)}
.ctile:hover img{transform:scale(1.1)}
.ctile .in{padding:1.5rem 1.6rem;width:100%}
.ctile .n{font-size:.75rem;font-weight:800;color:var(--olive-ink);background:var(--amber);display:inline-block;padding:.15rem .55rem;border-radius:6px;margin-bottom:.6rem}
.ctile h4{color:var(--cream);font-size:1.18rem;margin-bottom:.35rem;font-weight:800}
.ctile p{color:rgba(255,246,219,.82);font-size:.87rem;margin:0;line-height:1.85}
.ctile .go{margin-top:.85rem;display:inline-flex;align-items:center;gap:.4rem;color:var(--amber);font-weight:700;font-size:.87rem}
.ctile:hover .go{gap:.75rem}

/* ==========================================================================
   Feature / value cards
   ========================================================================== */
.fcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.9rem 1.6rem;height:100%;transition:.3s;position:relative;overflow:hidden}
.fcard::before{content:"";position:absolute;top:0;inset-inline-start:0;width:0;height:4px;background:var(--amber);transition:width .35s}
.fcard:hover{transform:translateY(-6px);box-shadow:var(--sh)}
.fcard:hover::before{width:100%}
.fcard .ic{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:var(--cream);color:var(--olive);font-size:1.55rem;margin-bottom:1.05rem;transition:.3s}
.fcard:hover .ic{background:var(--amber);color:var(--olive-ink);transform:rotate(-8deg)}
.fcard h4{font-size:1.06rem;margin-bottom:.5rem;font-weight:800}
.fcard p{color:var(--muted);font-size:.9rem;margin:0;line-height:2}

/* on olive bg */
.sec-olive .fcard,.sec-dark .fcard{background:rgba(255,246,219,.06);border-color:rgba(255,246,219,.15)}
.sec-olive .fcard h4,.sec-dark .fcard h4{color:var(--cream)}
.sec-olive .fcard p,.sec-dark .fcard p{color:rgba(255,246,219,.75)}
.sec-olive .fcard .ic,.sec-dark .fcard .ic{background:rgba(253,184,19,.15);color:var(--amber)}

/* ==========================================================================
   Goals / mission list
   ========================================================================== */
.goal{display:flex;gap:1rem;padding:1.05rem 1.15rem;border-radius:var(--r);background:#fff;border:1px solid var(--line);height:100%;transition:.28s}
.goal:hover{border-color:var(--amber);box-shadow:var(--sh-sm);transform:translateX(-5px)}
.goal .n{flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:var(--cream);color:var(--olive);display:grid;place-items:center;font-weight:800;font-size:.85rem;transition:.28s}
.goal:hover .n{background:var(--amber);color:var(--olive-ink)}
.goal p{margin:0;font-size:.9rem;line-height:2;color:var(--ink)}

/* ==========================================================================
   Stats band (mock-up: b/w photo + amber block)
   ========================================================================== */
.statband{display:grid;grid-template-columns:1.25fr .95fr;min-height:330px}
.statband .ph{position:relative;overflow:hidden}
.statband .ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.06)}
.statband .bx{background:var(--amber);display:flex;align-items:center;padding:2.6rem 2.2rem}
.statband .item{text-align:center;flex:1}
.statband .item .ic{font-size:1.5rem;color:var(--olive-ink);opacity:.7;margin-bottom:.35rem}
.statband .item .v{font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:900;color:var(--olive-ink);line-height:1}
.statband .item .l{font-size:.82rem;color:var(--olive-ink);opacity:.85;font-weight:600;margin-top:.25rem;line-height:1.7}
@media(max-width:768px){.statband{grid-template-columns:1fr}.statband .ph{min-height:220px}}

/* ==========================================================================
   Org chart
   ========================================================================== */
.orgwrap{overflow-x:auto;padding:1rem .25rem 1.5rem}
.org{min-width:940px}
.org .lvl{display:flex;justify-content:center;gap:.85rem;flex-wrap:nowrap}
.org .node{
  background:rgba(255,246,219,.08);border:1.6px solid rgba(255,246,219,.42);color:var(--cream);
  border-radius:100px;padding:.6rem 1.15rem;font-size:.86rem;font-weight:700;text-align:center;white-space:nowrap;transition:.25s
}
.org .node:hover{background:var(--amber);border-color:var(--amber);color:var(--olive-ink);transform:translateY(-3px)}
.org .node.root{background:var(--amber);border-color:var(--amber);color:var(--olive-ink);font-weight:800;font-size:.95rem;padding:.7rem 2rem}
.org .conn{height:26px;width:100%;position:relative}
.org .conn::before{content:"";position:absolute;top:0;bottom:0;inset-inline-start:50%;width:1.6px;background:rgba(255,246,219,.35)}
.org .rail{height:1.6px;background:rgba(255,246,219,.35);margin:0 auto;width:88%}
.org .drops{display:flex;justify-content:space-around;height:20px}
.org .drops i{display:block;width:1.6px;background:rgba(255,246,219,.35);height:100%}

/* dept accordion cards */
.dept{background:rgba(255,246,219,.055);border:1px solid rgba(255,246,219,.16);border-radius:var(--r);overflow:hidden;height:100%;transition:.3s}
.dept:hover{border-color:var(--amber);background:rgba(255,246,219,.1)}
.dept .hd{display:flex;align-items:center;gap:.7rem;padding:.95rem 1.1rem;border-bottom:1px solid rgba(255,246,219,.14);font-weight:800;color:var(--cream);font-size:.98rem}
.dept .hd .ic{width:34px;height:34px;border-radius:10px;background:rgba(253,184,19,.18);color:var(--amber);display:grid;place-items:center;flex:0 0 auto}
.dept ul{list-style:none;margin:0;padding:.85rem 1.1rem;columns:1}
.dept li{font-size:.85rem;color:rgba(255,246,219,.78);padding:.24rem 0 .24rem 0;line-height:1.85;position:relative;padding-inline-start:15px}
.dept li::before{content:"";position:absolute;inset-inline-start:0;top:.85em;width:5px;height:5px;border-radius:50%;background:var(--amber);opacity:.75}

/* ==========================================================================
   Gallery / masonry (mock-up photo grid)
   ========================================================================== */
.mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.mgrid a{position:relative;display:block;border-radius:var(--r);overflow:hidden;background:var(--olive-ink);aspect-ratio:4/3}
.mgrid a.tall{grid-row:span 2;aspect-ratio:auto}
.mgrid a.wide{grid-column:span 2}
.mgrid img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.mgrid a:hover img{transform:scale(1.09)}
.mgrid a::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(44,55,20,.7),transparent 55%);opacity:0;transition:.35s}
.mgrid a:hover::after{opacity:1}
.mgrid .cap{position:absolute;bottom:0;inset-inline:0;padding:.9rem 1rem;color:var(--cream);font-size:.85rem;font-weight:700;z-index:2;transform:translateY(10px);opacity:0;transition:.35s}
.mgrid a:hover .cap{transform:none;opacity:1}
@media(max-width:992px){.mgrid{grid-template-columns:repeat(2,1fr)}.mgrid a.wide{grid-column:span 2}}
@media(max-width:576px){.mgrid{grid-template-columns:1fr}.mgrid a.wide,.mgrid a.tall{grid-column:auto;grid-row:auto;aspect-ratio:4/3}}

/* ==========================================================================
   About split
   ========================================================================== */
.about-img{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-lg)}
.about-img img{width:100%;display:block}
.about-badge{
  position:absolute;bottom:20px;inset-inline-end:20px;background:var(--amber);color:var(--olive-ink);
  border-radius:var(--r);padding:1rem 1.3rem;box-shadow:var(--sh);text-align:center
}
.about-badge .v{font-size:1.8rem;font-weight:900;line-height:1}
.about-badge .l{font-size:.75rem;font-weight:700}

/* ==========================================================================
   Timeline (vision)
   ========================================================================== */
.tl{position:relative;padding-inline-start:0}
.tl::before{content:"";position:absolute;inset-inline-start:19px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--amber),rgba(253,184,19,.15))}
.tl .it{position:relative;padding-inline-start:56px;padding-bottom:1.9rem}
.tl .it:last-child{padding-bottom:0}
.tl .dot{position:absolute;inset-inline-start:0;top:2px;width:40px;height:40px;border-radius:50%;background:var(--olive);border:3px solid var(--amber);display:grid;place-items:center;color:var(--amber);font-weight:800;font-size:.85rem}
.tl h5{font-size:1.02rem;margin-bottom:.3rem;font-weight:800}
.tl p{font-size:.9rem;margin:0;line-height:2}

/* ==========================================================================
   Contact
   ========================================================================== */
.cbox{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.5rem;height:100%;text-align:center;transition:.3s}
.cbox:hover{transform:translateY(-6px);box-shadow:var(--sh);border-color:var(--amber)}
.cbox .ic{width:56px;height:56px;margin:0 auto .9rem;border-radius:50%;background:var(--cream);color:var(--olive);display:grid;place-items:center;font-size:1.4rem;transition:.3s}
.cbox:hover .ic{background:var(--amber);color:var(--olive-ink)}
.cbox h5{font-size:1rem;margin-bottom:.4rem}
.cbox p,.cbox a{font-size:.9rem;color:var(--muted);margin:0;line-height:1.95}
.cbox a:hover{color:var(--olive)}

.form-control,.form-select{
  border:1.6px solid var(--line);border-radius:var(--r-sm);padding:.75rem 1rem;
  font-family:'Vazirmatn';font-size:.94rem;background:#fff;color:var(--ink);transition:.2s
}
.form-control:focus,.form-select:focus{border-color:var(--amber);box-shadow:0 0 0 .2rem rgba(253,184,19,.18);background:#fff}
.form-label{font-weight:700;font-size:.88rem;margin-bottom:.4rem;color:var(--olive-ink)}
.form-control::placeholder{color:#9aa393;font-weight:300}

/* ==========================================================================
   CTA band
   ========================================================================== */
.cta{background:var(--amber);border-radius:var(--r-xl);padding:clamp(2rem,4vw,3.2rem);position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;inset-inline-end:-60px;top:-60px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.16)}
.cta::after{content:"";position:absolute;inset-inline-start:-40px;bottom:-90px;width:200px;height:200px;border-radius:50%;background:rgba(78,95,41,.1)}
.cta h3{color:var(--olive-ink);font-size:clamp(1.35rem,2.6vw,2rem);font-weight:900;margin-bottom:.5rem;position:relative;z-index:2}
.cta p{color:rgba(44,55,20,.82);margin:0;position:relative;z-index:2;font-size:1rem}
.cta .btn{position:relative;z-index:2}

/* ==========================================================================
   Footer
   ========================================================================== */
.foot{background:var(--olive-ink);color:rgba(255,246,219,.72);padding:3.6rem 0 0;font-size:.9rem}
.foot h6{color:var(--cream);font-weight:800;font-size:1rem;margin-bottom:1.1rem;position:relative;padding-bottom:.6rem}
.foot h6::after{content:"";position:absolute;bottom:0;inset-inline-start:0;width:32px;height:2.5px;background:var(--amber);border-radius:3px}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin-bottom:.5rem}
.foot a{color:rgba(255,246,219,.72);font-size:.9rem;transition:.2s;display:inline-block}
.foot a:hover{color:var(--amber);transform:translateX(-4px)}
.foot .brand img{height:52px;margin-bottom:1rem}
.foot .soc{display:flex;gap:.5rem;margin-top:1.1rem}
.foot .soc a{width:38px;height:38px;border-radius:50%;background:rgba(255,246,219,.09);display:grid;place-items:center;color:var(--cream);font-size:1rem}
.foot .soc a:hover{background:var(--amber);color:var(--olive-ink);transform:translateY(-3px)}
.foot .bottom{border-top:1px solid rgba(255,246,219,.12);margin-top:2.6rem;padding:1.1rem 0;font-size:.83rem;color:rgba(255,246,219,.5)}
.foot .contact-li{display:flex;gap:.6rem;align-items:flex-start;margin-bottom:.75rem;line-height:1.9}
.foot .contact-li i{color:var(--amber);margin-top:.35rem;flex:0 0 auto}

/* ==========================================================================
   Page hero (inner pages)
   ========================================================================== */
.phero{background:var(--olive);color:var(--cream);padding:3.2rem 0 3rem;position:relative;overflow:hidden}
.phero::before{content:"";position:absolute;inset-inline-end:-80px;top:-80px;width:320px;height:320px;border-radius:50%;background:rgba(253,184,19,.09)}
.phero::after{content:"";position:absolute;inset-inline-start:8%;bottom:-120px;width:220px;height:220px;border-radius:50%;background:rgba(255,246,219,.05)}
.phero h1{color:var(--cream);font-size:clamp(1.7rem,3.6vw,2.7rem);font-weight:900;margin-bottom:.5rem;position:relative;z-index:2}
.phero p{color:rgba(255,246,219,.82);max-width:680px;margin:0;position:relative;z-index:2;line-height:2.05}
.breadcrumb{margin:0 0 .9rem;position:relative;z-index:2;font-size:.85rem;--bs-breadcrumb-divider-color:rgba(255,246,219,.45)}
.breadcrumb a{color:rgba(255,246,219,.7)}
.breadcrumb a:hover{color:var(--amber)}
.breadcrumb-item.active{color:var(--amber)}
.breadcrumb-item+.breadcrumb-item::before{color:rgba(255,246,219,.4)}

/* ==========================================================================
   Spec table
   ========================================================================== */
.spectable{width:100%;border-collapse:separate;border-spacing:0;font-size:.88rem;background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.spectable th{background:var(--olive);color:var(--cream);font-weight:700;padding:.72rem 1rem;text-align:start;font-size:.85rem}
.spectable td{padding:.62rem 1rem;border-bottom:1px solid var(--line);color:var(--ink)}
.spectable tr:last-child td{border-bottom:none}
.spectable tbody tr:nth-child(odd){background:rgba(255,246,219,.5)}
.spectable td.k{font-weight:700;color:var(--olive-ink);width:38%}
.spectable td.v{direction:ltr;text-align:start;font-family:'Vazirmatn'}
.spectable .grp td{background:var(--cream-2);font-weight:800;color:var(--olive-ink)}

/* ==========================================================================
   Filter pills
   ========================================================================== */
.fpill{
  border:1.6px solid var(--line);background:#fff;color:var(--olive-ink);border-radius:100px;
  padding:.5rem 1.25rem;font-size:.88rem;font-weight:700;cursor:pointer;transition:.24s
}
.fpill:hover{border-color:var(--olive);color:var(--olive)}
.fpill.on{background:var(--olive);border-color:var(--olive);color:var(--cream)}

/* ==========================================================================
   Misc
   ========================================================================== */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .65s ease,transform .65s cubic-bezier(.4,0,.2,1)}
.reveal.in{opacity:1;transform:none}

.chip{display:inline-block;background:var(--cream-2);color:var(--olive);border-radius:100px;padding:.28rem .85rem;font-size:.8rem;font-weight:700;margin:0 0 .35rem}
.sec-olive .chip,.sec-dark .chip{background:rgba(253,184,19,.16);color:var(--amber)}

.divider-wave{height:56px;background:var(--cream);border-radius:100% 100% 0 0 / 100% 100% 0 0;margin-top:-56px;position:relative;z-index:3}

.partner{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.15rem .8rem;text-align:center;
  font-size:.85rem;font-weight:700;color:var(--olive-ink);height:100%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:.5rem;transition:.28s;line-height:1.7
}
.partner:hover{border-color:var(--amber);transform:translateY(-5px);box-shadow:var(--sh-sm);color:var(--olive)}
.partner .ic{font-size:1.5rem;color:var(--amber)}

.to-top{
  position:fixed;inset-inline-end:22px;bottom:22px;width:46px;height:46px;border-radius:50%;
  background:var(--olive);color:var(--cream);display:grid;place-items:center;z-index:1040;border:none;
  box-shadow:var(--sh);opacity:0;visibility:hidden;transform:translateY(14px);transition:.3s;font-size:1.1rem
}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--amber);color:var(--olive-ink)}

.wa-float{
  position:fixed;inset-inline-end:22px;bottom:78px;width:46px;height:46px;border-radius:50%;
  background:#25D366;color:#fff;display:grid;place-items:center;z-index:1040;box-shadow:var(--sh);font-size:1.25rem;transition:.3s
}
.wa-float:hover{transform:scale(1.09);color:#fff}

/* accordion (FAQ) */
.accordion-item{border:1px solid var(--line);border-radius:var(--r) !important;margin-bottom:.75rem;overflow:hidden;background:#fff}
.accordion-button{font-weight:700;font-size:.97rem;color:var(--olive-ink);background:#fff;padding:1.05rem 1.25rem}
.accordion-button:not(.collapsed){background:var(--cream);color:var(--olive);box-shadow:none}
.accordion-button:focus{box-shadow:none;border-color:var(--line)}
.accordion-button::after{margin-inline-start:auto;margin-inline-end:0}
.accordion-body{font-size:.9rem;color:var(--muted);line-height:2.05;padding:0 1.25rem 1.2rem}

/* carousel arrows */
.snap-row{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.75rem;scrollbar-width:thin}
.snap-row>*{scroll-snap-align:start;flex:0 0 clamp(230px,26vw,300px)}

@media(max-width:991px){
  body{font-size:15px}
  .site-nav .nav-link{padding:.65rem .5rem !important}
  .site-nav .navbar-collapse{
    background:#fff;border-radius:var(--r);padding:.7rem;margin-top:.7rem;box-shadow:var(--sh);
    /* the bar is fixed, so a long menu must scroll inside the viewport */
    max-height:calc(100vh - var(--nav-h,78px) - 1.6rem);
    overflow-y:auto;overscroll-behavior:contain
  }
  .hero{min-height:auto;padding:2rem 0}
  .hero-stats{gap:1.6rem}
  /* tame large gutters so rows never exceed the viewport */
  .row.g-5{--bs-gutter-x:1.5rem;--bs-gutter-y:1.5rem}
  .statband .bx{padding:1.9rem 1.1rem}
  .statband .item .l{font-size:.74rem}
  .cta{border-radius:var(--r-lg)}
}
@media(max-width:575px){
  .hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1rem}
  .hero-stats .v{font-size:1.6rem}
  .hero-stats .l{font-size:.78rem}
  .hero .eyebrow{font-size:.75rem;padding:.35rem .8rem}
  .pcard .body{padding:.9rem .95rem 1.1rem}
  .pcard .model{font-size:.92rem}
  .pcard .specs{font-size:.78rem}
  .fpill{padding:.42rem 1rem;font-size:.82rem}
  .statband .bx{flex-direction:column;gap:1.4rem}
  .spectable{font-size:.82rem}
  .spectable td,.spectable th{padding:.55rem .7rem}
}
@media print{.site-nav,.topbar,.foot,.to-top,.wa-float{display:none}}