:root{
  /* logodan götürülmüş dəqiq rənglər */
  --navy:#284795; --navy-2:#324D8F; --navy-deep:#152A5E; --navy-ink:#0C1830;
  --red:#E31E24; --red-deep:#B4161B;
  --chill:#EDF3FC; --warm:#FDF0F1; --tint:#F2F4F7; --tint-2:#FAFBFC;
  --ink:#131A24; --ink-2:#3A4456; --mute:#5D6678; --faint:#949CAC;
  --ground:#FFFFFF; --surface:#F7F8FA; --line:#E6E9EE; --line-2:#F0F2F6;
  --shadow:0 24px 50px -30px rgba(19,26,36,.35);
  --wrap:1240px;
  --sans:"Nunito Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --disp:"Nunito Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--sans);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;letter-spacing:-.015em;line-height:1.15;margin:0;text-wrap:balance}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(1rem,3vw,2rem)}
.mono{font-family:var(--mono);font-size:.76rem;letter-spacing:.04em;text-transform:uppercase}

/* ══ üst zolaq ══ */
/* Üst zolaq ağdır: sayt tamamilə açıq/kurumsal qalsın, tünd rəng yalnız
   footer-də və bir CTA bandında vurğu kimi işlənsin. */
.topbar{background:var(--ground);color:var(--mute);font-size:.82rem;border-bottom:1px solid var(--line-2)}
.topbar .wrap{display:flex;gap:1.5rem;align-items:center;min-height:42px;flex-wrap:wrap}
.topbar .adr{display:inline-flex;gap:.45rem;align-items:center;opacity:.8}
.topbar a{display:inline-flex;align-items:center;gap:.45rem;color:var(--mute)}
.topbar a:hover{color:var(--navy)}
.topbar svg{width:14px;height:14px;flex:none;stroke:var(--navy);fill:none;stroke-width:1.9;opacity:.85}
.topbar .sp{margin-left:auto;display:flex;gap:.35rem;align-items:center}
.lang{display:flex;gap:2px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:2px}
.lang a{padding:.14rem .6rem;border-radius:999px;font-weight:600;font-size:.75rem;letter-spacing:.04em;color:var(--mute)}
.lang a.on{background:var(--navy);color:#fff}

/* ══ başlıq ══ */
header.site{position:sticky;top:0;z-index:60;background:var(--ground);
  border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(16,23,37,.03)}
.hd{display:flex;align-items:center;gap:clamp(.7rem,1.5vw,1.6rem);min-height:100px;
  transition:min-height .25s ease}
/* aşağı sürüşdürdükdə başlıq yığcamlaşır və yapışıq qalır */
header.site.stuck{box-shadow:0 6px 22px -14px rgba(19,26,36,.35)}
header.site.stuck .hd{min-height:70px}
header.site.stuck .logo img{height:48px}
.logo{display:flex;align-items:center}
.logo img{height:68px;width:auto;transition:height .25s ease}
nav.main{display:flex;gap:.15rem;margin-left:auto}
nav.main>div{position:relative}
nav.main>div>a{position:relative;display:flex;align-items:center;gap:.34rem;
  padding:.68rem clamp(.42rem,.9vw,.78rem);white-space:nowrap;
  font-weight:600;font-size:.93rem;color:var(--ink-2);transition:color .16s}
nav.main>div>a::after{content:"";position:absolute;left:clamp(.42rem,.9vw,.78rem);
  right:clamp(.42rem,.9vw,.78rem);bottom:.28rem;height:2px;
  border-radius:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .22s}
nav.main>div:hover>a{color:var(--navy)}
nav.main>div:hover>a::after{transform:scaleX(1)}
nav.main>div>a .ch{width:9px;height:9px;stroke:currentColor;fill:none;stroke-width:2.6;opacity:.45;transition:transform .2s}
nav.main>div:hover>a .ch{transform:rotate(180deg);opacity:.8}
.drop::before,.mega::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.drop{position:absolute;top:calc(100% + 6px);left:0;min-width:248px;background:var(--ground);
  border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:.5rem;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s}
nav.main>div:hover .drop{opacity:1;visibility:visible;transform:none}
.drop a{display:block;padding:.56rem .72rem;border-radius:8px;font-size:.9rem;color:var(--ink-2)}
.drop a:hover{background:var(--chill);color:var(--navy)}
.drop-br{min-width:218px;display:grid;grid-template-columns:1fr 1fr;gap:.1rem .25rem;padding:.65rem}
.drop-br .dh{grid-column:1/-1;font-size:.72rem;font-weight:700;color:var(--faint);
  padding:.35rem .55rem .2rem;letter-spacing:.02em}
.drop-br .dall{grid-column:1/-1;margin-top:.35rem;padding-top:.55rem;border-top:1px solid var(--line-2);
  font-weight:700;color:var(--navy)}
.hd .cta{display:inline-flex;align-items:center;gap:.5rem;background:var(--red);color:#fff;border:0;cursor:pointer;font:inherit;
  padding:.66rem clamp(.7rem,1.2vw,1.05rem);border-radius:10px;font-weight:600;font-size:.9rem;
  white-space:nowrap;flex:none;box-shadow:0 12px 26px -14px rgba(227,30,36,.8)}
.hd .cta:hover{background:var(--red-deep)}
.hd .cta svg{width:16px;height:16px;fill:currentColor}
.burger{display:none}

/* ══ mega menyu (məhsullar) ═══════════════════════════════════════
   Seçim JS ilə "yapışır" (.on sinfi): əvvəlki saf-CSS `:has(:hover)`
   variantında siçan kateqoriyadan alt kateqoriyalara keçən kimi hover
   itir və panel geri sıçrayırdı — qırmızı (isitmə) qrupunu seçmək
   mümkün olmurdu. İndi kateqoriya seçili qalır, rəng bütün panelə
   yayılır: sol kart, başlıq, nöqtələr və sağdakı blok. */
/* Panel loqonun sol kənarından “Qiymət al” düyməsinin sağ kənarına qədər
   uzanır — --ml / --mr dəyərləri JS ilə faktiki mövqedən ölçülür,
   çünki menyu adlarının uzunluğu dilə görə dəyişir. */
.mega{position:absolute;top:calc(100% + 10px);left:var(--ml,0px);right:var(--mr,0px);
  width:auto;transform:translateY(-6px);
  background:var(--ground);border:1px solid var(--line);border-radius:20px;
  box-shadow:0 36px 80px -38px rgba(19,26,36,.45);padding:.7rem;
  display:grid;grid-template-columns:320px 1fr 268px;gap:.7rem;
  opacity:0;visibility:hidden;transition:opacity .18s,visibility .18s,transform .18s;
  z-index:70;--acc:var(--navy);--acc-soft:var(--chill)}
.mega.is-heat{--acc:var(--red);--acc-soft:var(--warm)}
nav.main>div:hover .mega{opacity:1;visibility:visible;transform:translateY(0)}

/* sol ray */
.mrail{display:flex;flex-direction:column;gap:.3rem;padding:.4rem;background:var(--surface);
  border-radius:16px;border:1px solid var(--line-2)}
.mcat{position:relative;display:flex;align-items:center;gap:.75rem;padding:.8rem .85rem;border-radius:12px;
  background:transparent;border:1px solid transparent;transition:background .16s,border-color .16s,box-shadow .16s}
.mcat::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%) scaleY(0);
  width:3px;height:60%;border-radius:0 3px 3px 0;transition:transform .2s}
.mcat.cool::before{background:var(--navy)} .mcat.heat::before{background:var(--red)}
.mcat.on{background:var(--ground);border-color:var(--line);box-shadow:0 10px 26px -16px rgba(19,26,36,.45)}
.mcat.on::before{transform:translateY(-50%) scaleY(1)}
.mcat i{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;
  background:var(--tint);color:var(--faint);transition:background .18s,color .18s}
.mcat.cool.on i{background:var(--navy);color:#fff} .mcat.heat.on i{background:var(--red);color:#fff}
.mcat i svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.mcat .tx b{font-size:.97rem;font-weight:700;color:var(--ink);display:block;line-height:1.3}
.mcat .ar{margin-left:auto;width:15px;height:15px;stroke:var(--faint);fill:none;stroke-width:2.6;
  opacity:0;transform:translateX(-5px);transition:.18s}
.mcat.on .ar{opacity:1;transform:none;stroke:var(--acc)}
.mall{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.7rem .85rem;border-radius:12px;font-weight:600;font-size:.87rem;color:var(--acc);
  border:1px solid var(--line);background:var(--ground)}
.mall:hover{border-color:var(--acc);background:var(--acc-soft)}
.mall svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.6}

/* orta panel */
.mpane{display:none;padding:.9rem .6rem .6rem;grid-template-columns:1fr 1fr;gap:.15rem .6rem;align-content:start}
.mpane.on{display:grid}
.mpane .ph{grid-column:1/-1;font-size:.8rem;font-weight:700;color:var(--acc);margin:0 .4rem .5rem;
  padding-bottom:.5rem;border-bottom:1px solid var(--line-2)}
.mpane a{display:flex;align-items:center;gap:.6rem;padding:.46rem .55rem;border-radius:10px;
  font-size:.9rem;color:var(--ink-2);white-space:nowrap;
  transition:background .15s,color .15s,transform .18s}
.mpane a b [opacity]{opacity:.7!important}
.mpane a b{width:40px;height:40px;border-radius:12px;flex:none;display:grid;place-items:center;
  background:var(--tint);color:#8E9AAF;transition:background .18s,color .18s,transform .28s cubic-bezier(.2,1.4,.4,1)}
.mpane a b svg{width:27px;height:27px;stroke-width:2.05}
.mpane a:hover{background:var(--acc-soft);color:var(--acc);transform:translateX(3px)}
.mpane a:hover b{background:var(--acc-soft);color:var(--acc);transform:scale(1.1) rotate(-4deg)}

/* sağ blok — şəkilli */
.mpromo{position:relative;overflow:hidden;border-radius:16px;border:1px solid var(--line);
  background:var(--ground);display:block;height:100%}
.mpromo .fig{position:relative;display:block;height:100%;min-height:230px;overflow:hidden;background:var(--tint)}
.mpromo .fig img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.mpromo:hover .fig img{transform:scale(1.045)}
.mpromo::after{content:"";position:absolute;inset:0;border-radius:16px;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,.9);transition:box-shadow .25s}
.mpromo:hover::after{box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
/* Promo şəkli seçilmiş kateqoriyaya görə dəyişir (JS `.on` qoyur). */
.mpromo .fig img{display:none}
.mpromo .fig img.on{display:block}
@media (max-width:1180px){ .mega{grid-template-columns:240px 1fr} .mpromo{display:none} }

/* ══ slayder — AĞ kurumsal variant ══
   Əvvəlki tünd laciverd fon "çox mavi" göründüyü üçün tamamilə ağa
   çevrildi: mətn tünd, sağdakı məhsul paneli isə yalnız incə tonlu
   (soyutma = mavi, isitmə = qırmızı) — rəng vurğu kimi qalır. */
.hero{position:relative;background:var(--ink);overflow:hidden}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;pointer-events:none}
.slide.on{opacity:1;position:relative;pointer-events:auto}
/* banner fonu — aktiv slaydda yavaş yaxınlaşma */
.slide-bg{position:absolute;inset:0;overflow:hidden;background:var(--ink)}
.slide-bg img{width:100%;height:100%;object-fit:cover;object-position:center right;
  transform:scale(1.06);transition:transform 9s linear}
.slide.on .slide-bg img{transform:scale(1)}
.slide-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(9,17,34,.9) 0%,rgba(9,17,34,.74) 34%,rgba(9,17,34,.18) 62%,rgba(9,17,34,0) 82%)}
.slide-in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.62fr);
  align-content:center;min-height:clamp(420px,44vw,560px);padding:clamp(2.4rem,5vw,4rem) 0 clamp(3.4rem,6vw,5rem)}
/* mətn blokları sıra ilə peyda olur */
.slide.on .slide-in>div>*{animation:hero-up .7s cubic-bezier(.2,.8,.3,1) both}
.slide.on .eyebrow{animation-delay:.05s}
.slide.on h1{animation-delay:.16s}
.slide.on p.lead{animation-delay:.27s}
.slide.on .chips{animation-delay:.38s}
.slide.on .acts{animation-delay:.49s}
@keyframes hero-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.24);color:#fff;padding:.4rem .9rem;border-radius:999px;
  font-size:.82rem;font-weight:500;backdrop-filter:blur(6px)}
.eyebrow b{width:6px;height:6px;border-radius:50%;background:var(--red)}
.slide.heat .eyebrow b{background:#7FB0FF}
.slide h1{font-size:clamp(1.9rem,1.15rem + 2.7vw,3.1rem);font-weight:700;margin:1.1rem 0 .9rem;
  color:#fff;letter-spacing:-.025em;line-height:1.14;text-wrap:balance}
.slide h1 em{font-style:normal;color:#8FB5FF}
.slide.heat h1 em{color:#FF8A8F}
.slide p.lead{margin:0;max-width:46ch;color:rgba(255,255,255,.82);font-size:clamp(.98rem,.94rem + .2vw,1.08rem)}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.4rem 0 1.7rem}
.chips span{font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;padding:.38rem .75rem;
  border-radius:7px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.9)}
.acts{display:flex;flex-wrap:wrap;gap:.7rem}
.b1,.b2{display:inline-flex;align-items:center;gap:.55rem;padding:.88rem 1.45rem;border-radius:12px;
  font-weight:600;font-size:.95rem;transition:.2s}
.b1{background:var(--red);color:#fff;box-shadow:0 18px 38px -20px rgba(227,30,36,.85)}
.b1:hover{background:var(--red-deep);gap:.8rem;transform:translateY(-2px)}
.slide.heat .b1{background:#fff;color:var(--navy);box-shadow:0 18px 38px -22px rgba(0,0,0,.6)}
.slide.heat .b1:hover{background:#EAF0FC}
.b2{border:1px solid rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.08);backdrop-filter:blur(6px)}
.b2:hover{border-color:#fff;background:rgba(255,255,255,.16);gap:.8rem}
.b1 svg,.b2 svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4}

/* idarəetmə: oxlar sağ-aşağıda cüt halda, zolaq göstəricilər mərkəzdə */
.hnav{position:absolute;bottom:clamp(.9rem,2.2vw,1.7rem);z-index:6;width:44px;height:44px;
  border-radius:50%;display:grid;place-items:center;cursor:pointer;color:#fff;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.26);backdrop-filter:blur(6px);
  transition:background .2s,transform .2s}
.hnav:hover{background:rgba(255,255,255,.26);transform:scale(1.07)}
.hnav svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2.4}
.hnav.prev{right:calc(clamp(1rem,4vw,3rem) + 54px)} .hnav.next{right:clamp(1rem,4vw,3rem)}
.dots{position:absolute;left:0;right:0;bottom:clamp(1.35rem,2.5vw,2.1rem);display:flex;gap:.5rem;
  justify-content:center;z-index:6}
.dots button{width:30px;height:4px;border:0;border-radius:99px;background:rgba(255,255,255,.32);
  cursor:pointer;padding:0;transition:.25s}
.dots button.on{background:#fff;width:52px}


/* ══ ümumi bölmə ══ */
section.sec{padding:clamp(2.8rem,5vw,4.4rem) 0}
section.sec.surface{background:var(--surface);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
/* Başlıqlar yumşaldıldı: əvvəlki böyük/qalın başlıq + mono, böyük hərfli,
   qırmızı tireli "eyebrow" cütü həm çox səsli idi, həm də hazır şablon
   təsiri verirdi. İndi kiçik, sakit etiket + orta çəkili başlıq. */
.head{max-width:58ch;margin-bottom:clamp(1.5rem,2.6vw,2.1rem)}
.head .kick{display:inline-block;color:var(--navy);font-size:.84rem;font-weight:600;
  letter-spacing:0;text-transform:none;margin-bottom:.35rem;opacity:.9}
.head .kick i{display:none}
.head h2{font-size:clamp(1.32rem,1.05rem + .9vw,1.85rem);font-weight:700;letter-spacing:-.015em;color:var(--ink)}
.head p{margin:.55rem 0 0;color:var(--mute);font-size:.95rem}

/* ══ iki iqlim (kateqoriya girişi) ══ */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:1.15rem}
.duo .card{position:relative;overflow:hidden;border-radius:20px;padding:clamp(1.4rem,2.6vw,2.1rem);
  border:1px solid var(--line);display:flex;flex-direction:column;gap:1rem;min-height:330px}
.duo .card{background:var(--ground)}
.duo .card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px}
.duo .cool::before{background:var(--navy)} .duo .heat::before{background:var(--red)}
.duo .cool,.duo .heat{background:var(--ground)}
.duo .card .tag{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.72rem;
  letter-spacing:.1em;text-transform:uppercase}
.duo .cool .tag{color:var(--navy)} .duo .heat .tag{color:var(--red)}
.duo .card .tag svg{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.duo .card h3{font-size:clamp(1.12rem,.95rem + .55vw,1.35rem);font-weight:600}
.duo .card>p{margin:0;color:var(--mute);font-size:.93rem;max-width:40ch}
.duo .subs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.15rem .7rem}
.duo .subs a{display:flex;align-items:center;gap:.55rem;padding:.22rem 0;font-size:.875rem;color:var(--ink);opacity:.9}
.duo .subs a i [opacity]{opacity:.7!important}
.duo .subs a i{width:48px;height:48px;border-radius:14px;flex:none;display:grid;place-items:center;
  background:var(--tint);color:#8E9AAF;opacity:0;transform:scale(.45) rotate(-20deg);
  transition:opacity .4s ease,transform .55s cubic-bezier(.2,1.5,.35,1),background .2s,color .2s}
.duo .subs a i svg{width:32px;height:32px;stroke-width:2.05}
.duo.in .subs a i{opacity:1;transform:none;transition-delay:var(--d),var(--d),0s,0s}
.duo .cool .subs a:hover i{background:var(--chill);color:var(--navy);transform:scale(1.16) rotate(-6deg)}
.duo .heat .subs a:hover i{background:var(--warm);color:var(--red);transform:scale(1.16) rotate(6deg)}
@media (prefers-reduced-motion:reduce){.duo .subs a i{opacity:1;transform:none;transition:none}}
.duo .cool .subs a:hover{color:var(--navy);opacity:1} .duo .heat .subs a:hover{color:var(--red);opacity:1}
.duo .more{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.9rem}
.duo .cool .more{color:var(--navy)} .duo .heat .more{color:var(--red)}
.duo .more svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.6;transition:transform .2s}
.duo .more:hover svg{transform:translateX(4px)}
.duo .ghost{position:absolute;right:-58px;bottom:-58px;width:260px;opacity:.055;pointer-events:none;z-index:0}
.duo .ghost svg{width:100%;height:auto}
.duo .cool .ghost{color:var(--navy)} .duo .heat .ghost{color:var(--red)}

/* ══ məhsul kartları ══════════════════════════════════════════════
   Şəkil sahəsi GERÇƏK FOTO üçün hazırlanıb: 4:3 çərçivə, neytral fon,
   incə daxili kənar. Foto gələnə qədər məhsulun xətt rəsmi durur və
   küncdə "foto gözlənilir" qeydi var — beləliklə boş görünmür, amma
   saxta foto da təqlid etmir. */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
@media (max-width:980px){ .grid{grid-template-columns:repeat(2,1fr)} }
.pcard{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;
  opacity:0;transform:translateY(20px);
  background:var(--ground);display:flex;flex-direction:column;
  transition:opacity .5s ease,transform .55s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .25s}
.pcard.pc-in{opacity:1;transform:none;transition-delay:calc(var(--i,0) * 80ms)}
.pcard.pc-in:hover{border-color:#C9D2E2;transform:translateY(-3px);box-shadow:0 18px 40px -30px rgba(19,26,36,.45);transition-delay:0s}
@media (prefers-reduced-motion:reduce){ .pcard{opacity:1;transform:none;transition:none} }
.pcard .ph{position:relative;aspect-ratio:4/3;display:block;background:var(--ground);
  border-bottom:1px solid var(--line-2);overflow:hidden}
.pcard .ph::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(19,26,36,.02)}
.pcard .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:2%;
  transition:opacity .35s ease,transform .5s cubic-bezier(.2,.8,.3,1)}
.pcard .ph .im2{opacity:0;transform:scale(1.03)}
.pcard:hover .ph .im1{opacity:0;transform:scale(.985)}
.pcard:hover .ph .im2{opacity:1;transform:none}
.pcard .ph .dots{position:absolute;right:.7rem;bottom:.6rem;z-index:3;display:flex;gap:.25rem}
.pcard .ph .dots i{width:5px;height:5px;border-radius:50%;background:var(--line);transition:.25s}
.pcard .ph .dots i:first-child{background:#B6C0D2}
.pcard:hover .ph .dots i:first-child{background:var(--line)}
.pcard:hover .ph .dots i:last-child{background:var(--navy)}
.pcard .ph .ldr{position:absolute;inset:0;z-index:4;display:grid;place-items:center;gap:.55rem;
  align-content:center;background:var(--tint-2);color:var(--navy);
  transition:opacity .4s ease,visibility .4s}
.pcard .ph.ready .ldr{opacity:0;visibility:hidden}
.pcard .ph .ldr svg{width:42px;height:42px}
.pcard .ph .ldr .bar{width:64px;height:3px;border-radius:3px;background:#DCE3EE;overflow:hidden;position:relative}
.pcard .ph .ldr .bar::after{content:"";position:absolute;left:-40%;top:0;bottom:0;width:40%;
  border-radius:3px;background:var(--navy);animation:ldr-run 1.15s ease-in-out infinite}
@keyframes ldr-run{0%{left:-40%}100%{left:100%}}
.pcard .ph .ldr .flow{animation:fab-flow 1.5s ease-in-out infinite}
.pcard .ph .ldr .flow-2{animation-delay:.18s} .pcard .ph .ldr .flow-3{animation-delay:.36s}
.pcard .cap{display:block;padding:.5rem 1rem 0;font-family:var(--mono);font-size:.68rem;
  letter-spacing:.02em;color:var(--faint);line-height:1.45}

.pcard .ph svg{width:58%;height:auto;color:#9AA6BC;transition:transform .35s,color .25s}
.pcard.cool:hover .ph svg{color:var(--navy);transform:scale(1.04)}
.pcard.warm:hover .ph svg{color:var(--red);transform:scale(1.04)}
.pcard .ph .badge{position:absolute;left:.65rem;top:.65rem;z-index:2;font-size:.7rem;font-weight:600;
  padding:.22rem .55rem;border-radius:6px;background:var(--ground);border:1px solid var(--line);color:var(--ink-2)}
.pcard .ph .soon{position:absolute;right:.65rem;bottom:.6rem;z-index:2;font-size:.66rem;color:var(--faint)}
.pcard .bd{padding:.55rem 1rem 1.05rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.pcard .gr{font-size:.76rem;color:var(--faint)}
.pcard h3{font-size:.98rem;font-weight:600;line-height:1.32;color:var(--ink)}
.pcard .sp{display:flex;flex-wrap:wrap;gap:.28rem}
.pcard .sp span{font-family:var(--mono);font-size:.68rem;padding:.18rem .42rem;border-radius:5px;
  background:var(--tint);color:var(--mute)}


/* ══ qiymət sorğusu modalı ═════════════════════════════════════════
   Ortada açılan forma — kateqoriya seçimi alt kateqoriyanı süzgəcdən
   keçirir. Bütün seçimlər DB-dəki kateqoriya ağacından gələcək. */
.qm{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:1.1rem}
.qm[hidden]{display:none!important}
.qm-bd{position:absolute;inset:0;background:rgba(19,26,36,.52);backdrop-filter:blur(3px);
  animation:qm-fade .22s ease}
.qm-card{position:relative;z-index:2;width:min(560px,100%);max-height:92vh;overflow:auto;
  background:var(--ground);border-radius:20px;border:1px solid var(--line);
  box-shadow:0 40px 90px -40px rgba(19,26,36,.6);padding:clamp(1.4rem,3vw,2rem);
  animation:qm-in .3s cubic-bezier(.2,.9,.3,1)}
.qm-card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;border-radius:20px 20px 0 0;
  background:linear-gradient(90deg,var(--navy) 0 62%,var(--red) 62% 100%)}
@keyframes qm-fade{from{opacity:0}to{opacity:1}}
@keyframes qm-in{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.qm-x{position:absolute;right:.85rem;top:.85rem;width:34px;height:34px;border-radius:10px;border:1px solid var(--line);
  background:var(--ground);color:var(--mute);display:grid;place-items:center;cursor:pointer;transition:.16s}
.qm-x svg{width:17px;height:17px}
.qm-x:hover{background:var(--tint);color:var(--ink);border-color:#C9D2E2}
.qm-hd{margin:0 2.4rem .25rem 0}
.qm-k{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
.qm-hd h3{margin:.35rem 0 0;font-size:clamp(1.12rem,1rem + .5vw,1.35rem);font-weight:600}
.qm-hd p{margin:.45rem 0 0;font-size:.9rem;color:var(--mute)}
.qm-f{margin-top:1.25rem;display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.qm-f .f2{grid-column:1/-1}
.qm-f label{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.qm-f label span{font-size:.78rem;font-weight:600;color:var(--ink-2)}
.qm-f input,.qm-f select,.qm-f textarea{font:inherit;font-size:.9rem;color:var(--ink);
  padding:.62rem .7rem;border:1px solid var(--line);border-radius:10px;background:var(--ground);
  width:100%;transition:border-color .16s,box-shadow .16s}
.qm-f textarea{resize:vertical;min-height:72px}
.qm-f select:disabled{color:var(--faint);background:var(--tint)}
.qm-f input:focus,.qm-f select:focus,.qm-f textarea:focus{outline:0;border-color:var(--navy);
  box-shadow:0 0 0 3px var(--chill)}
.qm-f input:user-invalid,.qm-f select:user-invalid{border-color:var(--red);box-shadow:0 0 0 3px var(--warm)}
.qm-go{grid-column:1/-1;margin-top:.2rem;border:0;cursor:pointer;font:inherit;font-size:.95rem;font-weight:600;
  padding:.8rem 1rem;border-radius:11px;background:var(--red);color:#fff;
  box-shadow:0 14px 30px -16px rgba(227,30,36,.7);transition:background .18s,transform .18s}
.qm-go:hover{background:#C9171D;transform:translateY(-2px)}
.qm-ok{grid-column:1/-1;margin:.2rem 0 0;font-size:.86rem;font-weight:600;color:var(--navy);
  background:var(--chill);border-radius:10px;padding:.6rem .75rem;text-align:center}
@media (max-width:520px){ .qm-f{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){ .qm-bd,.qm-card{animation:none} }

/* ══ axtarış ═══════════════════════════════════════════════════════
   Başlıqdakı düymə yumşaq bir panel açır; nəticələr yazdıqca canlı
   qruplanır (kateqoriya · alt kateqoriya · məhsul). Enter və ya
   nəticəyə klik tam nəticələr səhifəsini açır. */
.sbtn{width:42px;height:42px;flex:none;border-radius:12px;border:1px solid var(--line);
  background:var(--ground);color:var(--ink-2);display:grid;place-items:center;cursor:pointer;
  transition:background .18s,color .18s,border-color .18s,transform .18s}
.sbtn svg{width:19px;height:19px}
.sbtn:hover{background:var(--chill);color:var(--navy);border-color:#C3D2EA;transform:translateY(-2px)}

.sov{position:fixed;inset:0;z-index:210;padding:clamp(.8rem,5vh,4.5rem) 1rem 1rem;
  display:grid;align-items:start;justify-items:center}
.sov[hidden]{display:none!important}
.sov-bd{position:absolute;inset:0;background:rgba(19,26,36,.45);backdrop-filter:blur(4px);animation:qm-fade .22s ease}
.sov-card{position:relative;z-index:2;width:min(700px,100%);background:var(--ground);
  border:1px solid var(--line);border-radius:22px;overflow:hidden;
  box-shadow:0 44px 100px -46px rgba(19,26,36,.62);
  animation:sov-in .32s cubic-bezier(.2,.9,.3,1)}
@keyframes sov-in{from{opacity:0;transform:translateY(-14px) scale(.985)}to{opacity:1;transform:none}}
.sov-in{display:flex;align-items:center;gap:.8rem;padding:.95rem 1.1rem;border-bottom:1px solid var(--line-2)}
.sov-in .mg{width:22px;height:22px;flex:none;color:var(--navy)}
.sov-in input{flex:1;min-width:0;font:inherit;font-size:1.06rem;color:var(--ink);border:0;outline:0;background:none;
  padding:.25rem 0;-webkit-appearance:none}
.sov-in input::-webkit-search-cancel-button{display:none}
.sov-in input::placeholder{color:var(--faint)}
.sov-in .esc{flex:none;font-family:var(--mono);font-size:.68rem;letter-spacing:.05em;color:var(--mute);
  border:1px solid var(--line);background:var(--tint);border-radius:7px;padding:.24rem .5rem;cursor:pointer;transition:.16s}
.sov-in .esc:hover{background:var(--ground);color:var(--ink);border-color:#C9D2E2}

.sov-res{max-height:min(56vh,520px);overflow:auto;padding:.5rem .5rem .2rem;scrollbar-width:thin}
.sov-g{padding:.45rem .6rem .1rem}
.sov-g b{display:block;font-family:var(--mono);font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--faint);margin-bottom:.2rem}
.sov-r{display:flex;align-items:center;gap:.75rem;padding:.5rem .6rem;border-radius:12px;cursor:pointer;
  transition:background .15s,transform .15s}
.sov-r:hover,.sov-r.sel{background:var(--tint)}
.sov-r.sel{box-shadow:inset 2px 0 0 var(--navy)}
.sov-r .ic{width:38px;height:38px;flex:none;border-radius:11px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy);overflow:hidden}
.sov-r.heat .ic{background:var(--warm);color:var(--red)}
.sov-r .ic svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:2.05}
.sov-r .ic img{width:100%;height:100%;object-fit:contain;background:#fff}
.sov-r .tx{min-width:0;flex:1}
.sov-r .tx i{display:block;font-style:normal;font-size:.94rem;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sov-r .tx em{display:block;font-style:normal;font-size:.76rem;color:var(--faint);margin-top:.1rem}
.sov-r mark{background:var(--chill);color:var(--navy);border-radius:3px;padding:0 .1em}
.sov-r.heat mark{background:var(--warm);color:var(--red)}
.sov-r .go{flex:none;width:15px;height:15px;color:var(--faint);transition:transform .18s,color .18s}
.sov-r:hover .go,.sov-r.sel .go{color:var(--navy);transform:translateX(3px)}

.sov-empty{padding:1.1rem 1.2rem 1.4rem}
.sov-empty b{display:block;font-family:var(--mono);font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--faint);margin-bottom:.6rem}
.sov-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.sov-chips button{font:inherit;font-size:.82rem;color:var(--ink-2);cursor:pointer;
  border:1px solid var(--line);background:var(--ground);border-radius:999px;padding:.36rem .8rem;transition:.16s}
.sov-chips button:hover{background:var(--chill);border-color:#C3D2EA;color:var(--navy)}
.sov-none{padding:1.6rem 1.2rem;text-align:center;color:var(--mute);font-size:.92rem}
.sov-none strong{color:var(--ink)}
.sov-ft{display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  padding:.6rem 1.1rem;border-top:1px solid var(--line-2);background:var(--tint);
  font-size:.78rem;color:var(--faint)}
.sov-ft kbd{font-family:var(--mono);font-size:.68rem;background:var(--ground);border:1px solid var(--line);
  border-radius:5px;padding:.1rem .38rem;color:var(--mute)}
.sov-ft .all{font-weight:600;color:var(--navy);cursor:pointer;background:none;border:0;font-size:.8rem;font-family:inherit}
.sov-ft .all:hover{text-decoration:underline}

/* ── nəticələr səhifəsi ── */
.spage{padding:clamp(2rem,5vw,3.4rem) 0 clamp(2.6rem,6vw,4.4rem)}
.spage[hidden]{display:none!important}
.sp-back{display:inline-flex;align-items:center;gap:.35rem;font-size:.85rem;font-weight:600;color:var(--mute);
  margin-bottom:1.2rem;transition:color .18s}
.sp-back svg{width:15px;height:15px}
.sp-back:hover{color:var(--navy)}
.sp-hd h1{margin:.35rem 0 0;font-size:clamp(1.5rem,1.2rem + 1.4vw,2.2rem);font-weight:600;letter-spacing:-.015em}
.sp-hd h1 span{color:var(--navy)}
.sp-hd p{margin:.5rem 0 0;color:var(--mute);font-size:.95rem}
.sp-tabs{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.4rem 0 1.6rem}
.sp-tabs button,.sp-tabs a{font:inherit;font-size:.85rem;cursor:pointer;border:1px solid var(--line);background:var(--ground);
  color:var(--ink-2);border-radius:999px;padding:.42rem .95rem;transition:.16s}
.sp-tabs button:hover,.sp-tabs a:hover{border-color:#C3D2EA;background:var(--chill);color:var(--navy)}
.sp-tabs button.on,.sp-tabs a.on{background:var(--navy);border-color:var(--navy);color:#fff}
.sp-tabs button.on span,.sp-tabs a.on span{opacity:.7}
.sp-sec{margin-bottom:2.2rem}
.sp-sec>b{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--faint);margin-bottom:.8rem}
.sp-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.7rem}
.sp-tile{display:flex;align-items:center;gap:.7rem;padding:.8rem .9rem;border:1px solid var(--line);
  border-radius:14px;background:var(--ground);transition:border-color .2s,transform .2s,box-shadow .25s}
.sp-tile:hover{border-color:#C9D2E2;transform:translateY(-3px);box-shadow:0 18px 38px -30px rgba(19,26,36,.45)}
.sp-tile .ic{width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy)}
.sp-tile.heat .ic{background:var(--warm);color:var(--red)}
.sp-tile .ic svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2.05}
.sp-tile span{font-size:.9rem;font-weight:600;color:var(--ink);min-width:0}
.sp-tile mark{background:var(--chill);color:var(--navy);border-radius:3px;padding:0 .1em}
.sp-tile.heat mark{background:var(--warm);color:var(--red)}
.spage .pcard mark{background:var(--chill);color:var(--navy);border-radius:3px;padding:0 .1em}
.spage .pcard.warm mark{background:var(--warm);color:var(--red)}
.sp-none{padding:3rem 1rem;text-align:center}
.sp-none svg{width:74px;height:74px;color:var(--line);margin-bottom:1rem}
.sp-none p{margin:0;color:var(--mute)}
@media (max-width:560px){ .sbtn{width:38px;height:38px} }
@media (prefers-reduced-motion:reduce){ .sov-bd,.sov-card{animation:none} }

/* ══ brendlər ══════════════════════════════════════════════════════
   Loqolar admin paneldən yüklənir; hamısı eyni 300×84 kətana
   normalizə olunduğu üçün tək ölçü qaydası bütün plitələrdə
   eyni optik ölçü verir. Qrup rəngi (mavi = soyutma, qırmızı =
   isitmə) yalnız üzərinə gələndə görünür. */
.brands{display:grid;grid-template-columns:repeat(6,1fr);gap:.75rem}
@media (max-width:1080px){ .brands{grid-template-columns:repeat(4,1fr)} }
@media (max-width:640px){ .brands{grid-template-columns:repeat(2,1fr)} }
.brand{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.35rem;min-height:104px;padding:1rem .6rem;border:1px solid var(--line);border-radius:14px;
  background:var(--ground);transition:border-color .2s,transform .22s,box-shadow .22s}
.brand:hover{transform:translateY(-3px);box-shadow:0 18px 38px -28px rgba(19,26,36,.5)}
.brand.cool:hover{border-color:var(--navy)} .brand.heat:hover{border-color:var(--red)}
.brand .lg{display:grid;place-items:center;width:100%;height:48px}
.brand .lg img{width:86%;height:auto;max-width:158px;object-fit:contain;
  filter:grayscale(.4);opacity:.92;transition:filter .25s,opacity .25s,transform .3s}
.brand:hover .lg img{filter:none;opacity:1;transform:scale(1.06)}
.brand .tp{font-size:.72rem;color:var(--faint);opacity:0;transform:translateY(3px);transition:.22s}
.brand:hover .tp{opacity:1;transform:none}
.brand::after{content:"";position:absolute;left:1.1rem;right:1.1rem;bottom:0;height:2px;border-radius:2px;
  transform:scaleX(0);transition:transform .25s}
.brand.cool::after{background:var(--navy)} .brand.heat::after{background:var(--red)}
.brand:hover::after{transform:scaleX(1)}

/* ══ referans lentı ══ */
/* 8 referans → 4×2 tam blok: auto-fit-də sonuncu tək qalıb boş zolaq yaradırdı */
.refs{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
.ref{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:16px;
  background:var(--ground);padding:1.15rem 1rem 1.3rem;display:flex;flex-direction:column;
  align-items:center;gap:.7rem;text-align:center;isolation:isolate;
  opacity:0;transform:translateY(26px);
  transition:opacity .55s ease,transform .6s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .3s}
.refs.in .ref{opacity:1;transform:none;transition-delay:calc(var(--i) * 70ms)}
.ref .ic{position:relative;z-index:2;width:52px;height:52px;border-radius:15px;display:grid;place-items:center;
  background:var(--tint);color:#8B97AD;
  transform:scale(.5) rotate(-14deg);opacity:0;
  transition:transform .6s cubic-bezier(.2,1.45,.35,1),opacity .45s ease,background .25s,color .25s}
.refs.in .ref .ic{transform:none;opacity:1;transition-delay:calc(var(--i) * 70ms + 120ms)}
.ref .ic svg{width:31px;height:31px}
.ref .nm{position:relative;z-index:2;font-size:.92rem;font-weight:600;color:var(--ink-2);transition:color .2s}
.ref .ghost{position:absolute;right:-36px;bottom:-36px;width:128px;opacity:.05;z-index:1;pointer-events:none;
  transition:opacity .35s,transform .5s}
.ref .ghost svg{width:100%;height:auto;stroke-width:.8}
.ref .bar{position:absolute;left:0;right:0;bottom:0;height:3px;z-index:3;
  transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.3,1)}
.ref.cool .bar{background:var(--navy)} .ref.heat .bar{background:var(--red)}
.ref:hover{transform:translateY(-5px);border-color:#C9D2E2;box-shadow:0 22px 44px -30px rgba(19,26,36,.5)}
.ref:hover .bar{transform:scaleX(1)}
.ref:hover .ghost{opacity:.1;transform:translate(-8px,-8px) scale(1.06)}
.ref.cool:hover .ic{background:var(--chill);color:var(--navy);transform:scale(1.1) rotate(-5deg)}
.ref.heat:hover .ic{background:var(--warm);color:var(--red);transform:scale(1.1) rotate(5deg)}
.ref.cool:hover .nm{color:var(--navy)} .ref.heat:hover .nm{color:var(--red)}
@media (prefers-reduced-motion:reduce){
  .ref,.ref .ic{opacity:1!important;transform:none!important;transition:none}
}

/* ══ layihələr ══ */
/* Layihə kartları da ağ: tünd gradient yerinə incə tonlu şəkil sahəsi
   və üstündə nazik marka zolağı — sayt boyu eyni kurumsal dil. */
.projs{display:grid;grid-template-columns:1.35fr 1fr;gap:1.1rem}
.proj{position:relative;overflow:hidden;border-radius:16px;min-height:280px;display:flex;align-items:flex-end;
  padding:1.25rem;background:var(--tint);border:1px solid var(--line);
  transition:border-color .2s,transform .25s,box-shadow .25s}
.proj:hover{border-color:var(--navy);transform:translateY(-3px);box-shadow:var(--shadow)}
.proj::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--navy)}
.proj.alt::before{background:var(--red)}
.proj img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.proj:hover img{transform:scale(1.04)}
.proj::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(11,17,28,.88) 0%,rgba(11,17,28,.35) 42%,rgba(11,17,28,.05) 70%)}
.proj .pat{display:none}
.proj .tx{position:relative;z-index:2}
.proj .tx .mono{color:rgba(255,255,255,.78);display:block;margin-bottom:.3rem}
.proj h3{font-size:1.08rem;font-weight:600;margin-bottom:.25rem;color:#fff}
.proj p{margin:0;font-size:.86rem;color:rgba(255,255,255,.8)}
.projs .stack{display:grid;gap:1.1rem}
.projs .stack .proj{min-height:0;flex:1}

/* ══ niyə biz ══ */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:1.15rem}
.stat{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:18px;
  padding:1.5rem 1.35rem 1.45rem;background:var(--ground);
  opacity:0;transform:translateY(30px);
  transition:opacity .6s ease,transform .72s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .3s}
.stats.in .stat{opacity:1;transform:none;transition-delay:calc(var(--i) * 110ms)}
.stat:hover{border-color:#C9D2E2;box-shadow:0 22px 46px -32px rgba(19,26,36,.5)}
.stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  transform:scaleY(0);transform-origin:top;
  transition:transform .85s cubic-bezier(.2,.8,.3,1)}
.stat:nth-child(odd)::before{background:linear-gradient(180deg,var(--navy),rgba(40,71,149,0))}
.stat:nth-child(even)::before{background:linear-gradient(180deg,var(--red),rgba(227,30,36,0))}
.stats.in .stat::before{transform:scaleY(1);transition-delay:calc(var(--i) * 110ms + 240ms)}
.stat .ic{position:relative;width:64px;height:64px;border-radius:19px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy);margin-bottom:1rem;
  opacity:0;transform:scale(.5) translateY(10px);
  transition:transform .7s cubic-bezier(.2,1.5,.35,1),opacity .5s ease,background .25s}
.stats.in .stat .ic{opacity:1;transform:none;transition-delay:calc(var(--i) * 110ms + 150ms)}
.stat:nth-child(even) .ic{background:var(--warm);color:var(--red)}
.stat .ic::after{content:"";position:absolute;inset:-22%;border-radius:50%;z-index:0;
  background:radial-gradient(circle,currentColor 0%,transparent 68%);opacity:.09;
  transition:opacity .3s,transform .5s}
.stat:hover .ic::after{opacity:.17;transform:scale(1.12)}
.stat .ic svg{position:relative;z-index:1;width:34px;height:34px;stroke:currentColor;fill:none;stroke-width:1.7}
.stats.in .stat .ic svg{animation:stat-float 3.6s ease-in-out infinite;
  animation-delay:calc(var(--i) * .42s + 1.1s)}
@keyframes stat-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.stat:hover .ic{transform:translateY(-3px) scale(1.04)}
@media (prefers-reduced-motion:reduce){
  .stat,.stat .ic{opacity:1!important;transform:none!important;transition:none}
  .stat::before{transform:scaleY(1)}
  .stats.in .stat .ic svg{animation:none}
}
.stat b{display:block;font-family:var(--disp);font-size:1.06rem;font-weight:600;letter-spacing:-.01em}
.stat span{display:block;font-size:.87rem;color:var(--mute);margin-top:.2rem}

/* ══ bloq ══ */
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.1rem}
.post{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--ground);display:flex;flex-direction:column}
.post .ph{aspect-ratio:16/9;background:var(--tint);overflow:hidden;border-bottom:1px solid var(--line-2)}
.post .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.post:hover .ph img{transform:scale(1.04)}
.post .ph svg{width:46%;opacity:.75}
.post .bd{padding:1rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.post time{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;color:var(--faint)}
.post h3{font-size:1rem;font-weight:600;line-height:1.34}
.post p{margin:0;font-size:.875rem;color:var(--mute)}
.post .go{margin-top:auto;display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.84rem;color:var(--navy)}
.post .go svg{width:14px;height:14px;flex:none;stroke:currentColor;fill:none;stroke-width:2.6}

/* ══ CTA ══ */
.cta-band{position:relative;overflow:hidden;border-radius:20px;padding:clamp(1.8rem,4vw,2.6rem);
  background:var(--ground);border:1px solid var(--line);box-shadow:var(--shadow);color:var(--ink);
  display:flex;flex-wrap:wrap;gap:1.4rem;align-items:center;justify-content:space-between}
/* rəng yalnız incə vurğu: sol kənarda marka zolağı */
.cta-band::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,var(--navy),var(--red))}
.cta-band::after{content:"";position:absolute;right:-70px;top:-70px;width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle,var(--tint),transparent 70%)}
.cta-band .tx{position:relative;z-index:2;max-width:52ch}
.cta-band h2{font-size:clamp(1.2rem,1.05rem + .6vw,1.55rem);font-weight:600}
.cta-band p{margin:.5rem 0 0;color:var(--mute);font-size:.95rem}
.cta-band .acts{position:relative;z-index:2}
.cta-band .b1{background:var(--red);color:#fff;border:0;cursor:pointer;font:inherit;
  box-shadow:0 14px 30px -16px rgba(227,30,36,.7)}
.cta-band .b1:hover{background:var(--red-deep)}


/* ══ footer — AÇIQ variant ══════════════════════════════════════
   Tünd laciverd zolaq götürüldü: sayt yuxarıdan aşağıya ağ qalır,
   marka rəngi yalnız başlıq xətlərində, ikonlarda və düymələrdə. */
footer.site{background:var(--surface);color:var(--mute);border-top:1px solid var(--line)}
footer.site .top{padding:clamp(2.6rem,5vw,3.8rem) 0 2.2rem;display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1.25fr;gap:2rem}
footer.site .brand img{height:74px;width:auto;margin-bottom:1.15rem}
footer.site .brand p{margin:0 0 1.2rem;font-size:.9rem;color:var(--mute);max-width:34ch}
.soc{display:flex;gap:.5rem}
.soc a{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:var(--ink-2);
  background:var(--ground);border:1px solid var(--line);transition:.18s}
.soc a:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.soc svg{width:16px;height:16px;fill:currentColor}
.soc svg[stroke]{fill:none;stroke:currentColor}
.soc svg[stroke] [fill="currentColor"]{fill:currentColor}
footer.site h4{font-size:.78rem;font-family:var(--mono);letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink);margin-bottom:1rem;display:flex;align-items:center;gap:.6rem}
footer.site h4::before{content:"";width:16px;height:2px;background:var(--red);flex:none;border-radius:2px}
footer.site h4::after{content:"";height:1px;flex:1;background:var(--line)}
footer.site ul{list-style:none;margin:0;padding:0;display:grid;gap:.52rem}
footer.site ul a{font-size:.9rem;color:var(--ink-2)}
footer.site ul a:hover{color:var(--navy)}
.fcontact{display:grid;gap:.85rem}
.fcontact a,.fcontact div{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem;color:var(--ink-2)}
.fcontact svg{width:16px;height:16px;flex:none;margin-top:.18rem;stroke:var(--navy);fill:none;stroke-width:1.9}
.fcontact a:hover{color:var(--navy)}
footer.site .bottom{border-top:1px solid var(--line);background:var(--ground)}
footer.site .bottom .wrap{display:flex;flex-wrap:wrap;gap:.8rem 1.5rem;align-items:center;
  justify-content:space-between;padding-top:1.15rem;padding-bottom:1.15rem}
footer.site .bottom p{margin:0;font-size:.86rem;color:var(--mute);display:flex;align-items:center;gap:.42rem;flex-wrap:wrap}
footer.site .bottom p a{display:inline-flex;align-items:center}
/* FalconX imzası: real SVG loqo, açıq fonda tam kontrastlı (mavi #095489).
   Real saytda src = /assets/img/falconx-logo.svg?v=… olacaq. */
footer.site .bottom p img{height:26px;width:auto;display:block}
footer.site .bottom p a{display:inline-flex;align-items:center;padding:0 .15rem;
  transition:opacity .18s}
footer.site .bottom p a:hover{opacity:.72}


/* ══ üzən düymələr: yuxarı qalx (klima temalı — yuxarı üfürən hava
   axını) + WhatsApp. Yuxarı düyməsi yalnız bir ekran aşağı düşəndə çıxır. */
.fab{position:fixed;right:clamp(.9rem,2vw,1.4rem);bottom:clamp(.9rem,2vw,1.4rem);z-index:80;
  display:flex;flex-direction:column;gap:.6rem;align-items:center}
.fab a,.fab button{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;border:0;
  cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}
.fab .up{background:var(--ground);border:1px solid var(--line);color:var(--navy);
  box-shadow:0 14px 30px -18px rgba(19,26,36,.5);opacity:0;visibility:hidden;transform:translateY(10px)}
.fab .up.on{opacity:1;visibility:visible;transform:none}
.fab .up:hover{background:var(--chill);border-color:var(--navy);transform:translateY(-3px)}
.fab .up{width:68px;height:68px;border-radius:20px}
.fab .up svg{width:36px;height:36px}
.fab .up .flow{animation:fab-flow 2.4s ease-in-out infinite}
.fab .up .flow-2{animation-delay:.3s} .fab .up .flow-3{animation-delay:.6s}
@keyframes fab-flow{0%,100%{opacity:.25;transform:translateY(2px)}50%{opacity:1;transform:translateY(-2px)}}
.fab .wa{background:#25D366;color:#fff;box-shadow:0 14px 30px -16px rgba(37,211,102,.95)}
.fab .wa:hover{background:#1FBA59;transform:translateY(-3px)}
.fab .wa svg{width:28px;height:28px;fill:currentColor}
@media (prefers-reduced-motion:reduce){.fab .up .flow{animation:none;opacity:.8}}


/* ══ responsive ══ */
@media (max-width:1080px){
  nav.main{display:none}
  .burger{display:grid;place-items:center;margin-left:auto;width:44px;height:44px;border-radius:10px;
    border:1px solid var(--line);background:var(--ground)}
  .burger svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:2}
  .hd .cta span{display:none}
  footer.site .top{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .slide-in{grid-template-columns:1fr}
  .slide-bg::after{background:linear-gradient(90deg,rgba(9,17,34,.92) 0%,rgba(9,17,34,.78) 58%,rgba(9,17,34,.5) 100%)}
  .hnav{display:none}
  .duo,.projs{grid-template-columns:1fr}
  .projs .stack{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){ .refs{grid-template-columns:repeat(2,1fr)} .ref .ghost{display:none} }
@media (max-width:620px){
  .duo .subs{grid-template-columns:1fr}
  .projs .stack{grid-template-columns:1fr}
  footer.site .top{grid-template-columns:1fr}
  .topbar .adr{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ══ daxili səhifələr (kataloq, detal, siyahılar) ═══════════════════ */
.wrap.narrow{max-width:820px}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:.82rem;color:var(--faint);margin-bottom:1.1rem}
.crumbs a{color:var(--mute);transition:color .16s}
.crumbs a:hover{color:var(--navy)}
.crumbs .sep{opacity:.5}
.muted{color:var(--mute);font-size:.95rem}

.cat-hd{display:flex;align-items:center;gap:1.1rem}
.cat-hd .cat-ic{width:72px;height:72px;flex:none;border-radius:20px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy)}
.cat-hd.heat .cat-ic{background:var(--warm);color:var(--red)}
.cat-hd .cat-ic svg{width:38px;height:38px;stroke:currentColor;fill:none;stroke-width:2}

.brand-hd{display:flex;align-items:center;gap:1.3rem}
.brand-hd .bl{width:190px;flex:none;border:1px solid var(--line);border-radius:16px;
  background:var(--ground);padding:.9rem 1rem;display:grid;place-items:center}
.brand-hd .bl img{width:100%;height:auto}

/* məhsul detalı */
.pdetail{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(1.4rem,3vw,2.6rem);
  align-items:start}
.pd-media .pd-main{position:relative;aspect-ratio:4/3;border:1px solid var(--line);border-radius:18px;
  background:var(--ground);overflow:hidden}
.pd-media .pd-main img{width:100%;height:100%;object-fit:contain;padding:2%}
.pd-cap{margin:.6rem 0 0;font-family:var(--mono);font-size:.72rem;color:var(--faint)}
.pd-thumbs{display:flex;gap:.6rem;margin-top:.9rem;flex-wrap:wrap}
.pd-thumbs .th{width:92px;height:70px;border:1px solid var(--line);border-radius:12px;overflow:hidden;
  background:var(--ground);display:grid;place-items:center}
.pd-thumbs .th img{width:100%;height:100%;object-fit:contain;padding:6%}
.pd-info .gr{font-size:.8rem;color:var(--faint)}
.pd-info h1{margin:.3rem 0 0;font-size:clamp(1.4rem,1.1rem + 1.2vw,2rem);font-weight:600;letter-spacing:-.015em}
.pd-specs{margin-top:1.5rem;border:1px solid var(--line);border-radius:16px;padding:1.1rem 1.2rem;background:var(--ground)}
.pd-specs b{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--faint);margin-bottom:.7rem}
.pd-specs ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.pd-specs li{font-family:var(--mono);font-size:.76rem;padding:.32rem .65rem;border-radius:8px;
  background:var(--tint);color:var(--ink-2)}
.pd-cta{margin-top:1.5rem;display:inline-flex;align-items:center;gap:.5rem;border:0;cursor:pointer;
  font:inherit;font-size:.95rem;font-weight:600;padding:.85rem 1.35rem;border-radius:12px;
  background:var(--red);color:#fff;box-shadow:0 14px 30px -16px rgba(227,30,36,.7);transition:.18s}
.pd-cta:hover{background:#C9171D;transform:translateY(-2px)}
.pd-cta svg{width:15px;height:15px}
.pd-pdf{margin-left:.7rem;font-size:.85rem;font-weight:600;color:var(--navy)}
@media (max-width:780px){ .pdetail{grid-template-columns:1fr} }

/* yazı / layihə detalı */
.post-hero{margin:1.6rem 0;border-radius:18px;overflow:hidden;border:1px solid var(--line)}
.post-hero img{width:100%;height:auto;display:block}
.rich{font-size:.98rem;line-height:1.75;color:var(--ink-2);max-width:72ch}
.rich h2{font-size:1.3rem;font-weight:600;margin:1.8rem 0 .6rem}
.rich h3{font-size:1.1rem;font-weight:600;margin:1.4rem 0 .5rem}
.rich p{margin:0 0 1rem}
.rich ul,.rich ol{margin:0 0 1rem 1.2rem}
.rich li{margin-bottom:.35rem}
.rich a{color:var(--navy);text-decoration:underline}

/* layihə ızgarası */
.prj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.1rem}
.prj-grid .proj{position:relative;border-radius:18px;overflow:hidden;min-height:260px;display:block}
.prj-grid .proj img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.spage .sp-hd{margin-bottom:2.2rem}
.spage .sp-hd+.sp-sec{margin-top:.4rem}
.cat-hd{margin-bottom:2.4rem}
.cat-hd div p{margin:.45rem 0 0}

/* anasayfada bloq — 4 kart bir sırada */

/* brend qrupları */
.bgrp>b{display:flex;align-items:center;gap:.6rem}
.bgrp>b .cnt{font-family:var(--mono);font-size:.66rem;padding:.1rem .4rem;border-radius:6px;
  background:var(--tint);color:var(--mute);letter-spacing:0}
.bgrp.cool>b{color:var(--navy)} .bgrp.heat>b{color:var(--red)}
.spage .brands{grid-template-columns:repeat(6,1fr)}
@media (max-width:1080px){ .spage .brands{grid-template-columns:repeat(4,1fr)} }
@media (max-width:640px){ .spage .brands{grid-template-columns:repeat(2,1fr)} }

/* ══ məhsul detalı — qalereya + texniki cədvəl ══════════════════════ */
.pd .pd-main .shot{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:2%;
  opacity:0;visibility:hidden;transition:opacity .3s}
.pd .pd-main .shot.on{opacity:1;visibility:visible}
.pd .pd-main{background:var(--ground)}
.pd-thumbs .th{padding:0;cursor:pointer;background:var(--ground);border:1px solid var(--line);
  border-radius:12px;overflow:hidden;width:92px;height:70px;display:grid;place-items:center;transition:.18s}
.pd-thumbs .th img{position:static;width:100%;height:100%;object-fit:contain;padding:6%}
.pd-thumbs .th:hover{border-color:#C9D2E2}
.pd .pd-thumbs .th.on{border-color:var(--navy);box-shadow:0 0 0 2px var(--chill)}
.pd.heat .pd-thumbs .th.on{border-color:var(--red);box-shadow:0 0 0 2px var(--warm)}
.pd-chips{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.9rem}
.pd-chips span{font-family:var(--mono);font-size:.72rem;padding:.28rem .6rem;border-radius:7px;
  background:var(--chill);color:var(--navy)}
.pd.heat .pd-chips span{background:var(--warm);color:var(--red)}
.pd-lead{margin-top:1.1rem;font-size:.95rem}
.pd-tech{margin-top:2.8rem;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--ground)}
.pd-tech>b{display:block;padding:1rem 1.2rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--faint);border-bottom:1px solid var(--line-2);background:var(--tint)}
.pd-tech table{width:100%;border-collapse:collapse;font-size:.92rem}
.pd-tech tr+tr{border-top:1px solid var(--line-2)}
.pd-tech th{width:42%;text-align:left;font-weight:600;color:var(--ink-2);padding:.8rem 1.2rem;vertical-align:top}
.pd-tech td{color:var(--mute);padding:.8rem 1.2rem}
.pd-tech tr:nth-child(even){background:#FCFDFE}
@media (max-width:620px){ .pd-tech th{width:50%} .pd-tech th,.pd-tech td{padding:.65rem .8rem;font-size:.86rem} }

/* ══ məhsul şəkli — böyüdülmüş baxış ════════════════════════════════ */
.pd .pd-main{cursor:zoom-in}
.lb{position:fixed;inset:0;z-index:240;display:grid;place-items:center;padding:clamp(.8rem,4vw,3rem)}
.lb[hidden]{display:none!important}
.lb-bd{position:absolute;inset:0;background:rgba(19,26,36,.86);backdrop-filter:blur(4px);
  animation:qm-fade .2s ease;cursor:zoom-out}
.lb-fig{position:relative;z-index:2;max-width:min(1100px,92vw);max-height:86vh;
  background:#fff;border-radius:18px;padding:1.2rem;display:grid;place-items:center;
  animation:sov-in .28s cubic-bezier(.2,.9,.3,1)}
.lb-fig img{max-width:100%;max-height:76vh;width:auto;height:auto;object-fit:contain;display:block}
.lb-x{position:absolute;top:clamp(.7rem,2vw,1.4rem);right:clamp(.7rem,2vw,1.4rem);z-index:4;
  width:48px;height:48px;border-radius:14px;border:0;cursor:pointer;display:grid;place-items:center;
  background:#fff;color:var(--ink);box-shadow:0 12px 30px -12px rgba(0,0,0,.55);transition:.16s}
.lb-x svg{width:22px;height:22px}
.lb-x:hover{background:var(--red);color:#fff;transform:rotate(90deg)}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:52px;height:52px;
  border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;background:#fff;color:var(--ink);
  box-shadow:0 12px 30px -12px rgba(0,0,0,.5);transition:.16s}
.lb-nav svg{width:22px;height:22px}
.lb-nav:hover{background:var(--navy);color:#fff}
.lb-prev{left:clamp(.6rem,2.5vw,2rem)} .lb-next{right:clamp(.6rem,2.5vw,2rem)}
.lb-cnt{position:absolute;bottom:clamp(.8rem,3vw,1.6rem);left:50%;transform:translateX(-50%);z-index:4;
  font-family:var(--mono);font-size:.75rem;color:#fff;background:rgba(0,0,0,.42);
  padding:.3rem .7rem;border-radius:999px}
@media (max-width:560px){ .lb-nav{width:42px;height:42px} .lb-fig{padding:.7rem} }
@media (prefers-reduced-motion:reduce){ .lb-bd,.lb-fig{animation:none} }

/* anasayfa bloq — enli ekranda hər zaman 4 sütun */
.sec .posts{grid-template-columns:repeat(4,1fr)}
.sec .posts .post h3{font-size:.95rem;line-height:1.35}
.sec .posts .post p{font-size:.85rem}
@media (max-width:1180px){ .sec .posts{grid-template-columns:repeat(2,1fr)} }

/* ══ HAQQIMIZDA ═════════════════════════════════════════════════════
   Loqo rəngləri: lacivərd = soyutma, qırmızı = isitmə.
   Hərəkət scroll ilə bir dəfə işə düşür, sonra sakitləşir. */
.ab-hero{position:relative;overflow:hidden;padding:clamp(1.4rem,3vw,2.2rem) 0 clamp(1.4rem,3vw,2.4rem);
  background:linear-gradient(180deg,var(--chill) 0%,rgba(237,243,252,0) 78%)}
.ab-blob{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none;z-index:0}
.ab-blob.b1{width:420px;height:420px;left:-120px;top:-120px;background:rgba(40,71,149,.16);
  animation:ab-float 18s ease-in-out infinite}
.ab-blob.b2{width:340px;height:340px;right:-90px;top:120px;background:rgba(227,30,36,.12);
  animation:ab-float 22s ease-in-out infinite reverse}
@keyframes ab-float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(30px,26px) scale(1.08)}}
.ab-hero .wrap{position:relative;z-index:1}
.ab-hero-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(1.6rem,4vw,3.4rem);align-items:center}
.ab-hero h1{margin:.5rem 0 0;font-size:clamp(2rem,1.4rem + 2.6vw,3.4rem);font-weight:700;
  letter-spacing:-.025em;line-height:1.08}
.ab-hero h1 span{display:inline-block;opacity:0;transform:translateY(22px);
  animation:ab-word .7s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--w) * 110ms + 120ms)}
@keyframes ab-word{to{opacity:1;transform:none}}
.ab-lead{margin:1.1rem 0 0;font-size:clamp(1rem,.95rem + .25vw,1.14rem);color:var(--mute);max-width:52ch;
  opacity:0;animation:ab-word .7s ease forwards .5s}
.ab-acts{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem;opacity:0;
  animation:ab-word .7s ease forwards .7s}
.ab-acts .b1{display:inline-flex;align-items:center;gap:.5rem;border:0;cursor:pointer;font:inherit;
  font-size:.95rem;font-weight:600;padding:.85rem 1.35rem;border-radius:12px;background:var(--red);color:#fff;
  box-shadow:0 14px 30px -16px rgba(227,30,36,.7);transition:.18s}
.ab-acts .b1:hover{background:#C9171D;transform:translateY(-2px)}
.ab-acts .b1 svg{width:15px;height:15px}
.ab-acts .b2{display:inline-flex;align-items:center;padding:.85rem 1.3rem;border-radius:12px;
  border:1px solid var(--line);background:var(--ground);font-weight:600;font-size:.95rem;transition:.18s}
.ab-acts .b2:hover{border-color:var(--navy);color:var(--navy)}

/* hava axını diaqramı */
.ab-art svg{width:100%;height:auto;max-width:420px;margin-inline:auto;display:block;color:var(--navy)}
.ab-art .bld{opacity:0;stroke-dasharray:900;stroke-dashoffset:900;
  animation:ab-draw 1.6s ease forwards .3s, ab-show .1s forwards .3s}
@keyframes ab-draw{to{stroke-dashoffset:0}} @keyframes ab-show{to{opacity:1}}
.ab-art .unit{fill:none}
.ab-art .unit.cool{stroke:var(--navy)} .ab-art .unit.heat{stroke:var(--red)}
.ab-art .air{fill:none}
.ab-art .air.cool path{stroke:var(--navy);animation:ab-air 2.8s ease-in-out infinite}
.ab-art .air.heat path{stroke:var(--red);animation:ab-air 3.2s ease-in-out infinite}
.ab-art .air path:nth-child(2){animation-delay:.35s} .ab-art .air path:nth-child(3){animation-delay:.7s}
@keyframes ab-air{0%,100%{opacity:.15;transform:translateY(0)}50%{opacity:1;transform:translateY(4px)}}
.ab-art .dot{fill:var(--navy);opacity:.35;animation:ab-pulse 3.4s ease-in-out infinite}
.ab-art .dot.d2{fill:var(--red);animation-delay:.9s} .ab-art .dot.d3{animation-delay:1.7s}
@keyframes ab-pulse{0%,100%{opacity:.2;r:2}50%{opacity:.8;r:4}}
@media (max-width:900px){ .ab-hero-in{grid-template-columns:1fr} .ab-art{order:-1;max-width:320px} }

/* mətn bloku */
.ab-body{max-width:74ch;opacity:0;transform:translateY(20px);
  transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.3,1)}
.ab-body.in{opacity:1;transform:none}
.ab-body p{margin-bottom:1.1rem}

/* rəqəmlər */
.ab-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.ab-stat{border:1px solid var(--line);border-radius:18px;background:var(--ground);padding:1.6rem 1.3rem;
  opacity:0;transform:translateY(24px);
  transition:opacity .55s ease,transform .65s cubic-bezier(.2,.8,.3,1),box-shadow .3s}
.ab-stats.in .ab-stat{opacity:1;transform:none;transition-delay:calc(var(--i) * 90ms)}
.ab-stat:hover{box-shadow:0 22px 46px -32px rgba(19,26,36,.45)}
.ab-stat b{font-size:clamp(2rem,1.5rem + 1.8vw,2.9rem);font-weight:700;letter-spacing:-.02em;color:var(--navy);
  font-variant-numeric:tabular-nums}
.ab-stat:nth-child(even) b{color:var(--red)}
.ab-stat em{font-style:normal;font-size:1.4rem;font-weight:700;color:inherit;opacity:.55}
.ab-stat span{display:block;margin-top:.5rem;font-size:.88rem;color:var(--mute)}
@media (max-width:860px){ .ab-stats{grid-template-columns:repeat(2,1fr)} }

/* xidmət kartları */
.ab-serv{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.ab-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:18px;
  background:var(--ground);padding:1.6rem 1.35rem;opacity:0;transform:translateY(26px);
  transition:opacity .55s ease,transform .65s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .3s}
.ab-serv.in .ab-card{opacity:1;transform:none;transition-delay:calc(var(--i) * 100ms)}
.ab-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;transform:scaleY(0);
  transform-origin:top;transition:transform .7s cubic-bezier(.2,.8,.3,1)}
.ab-card:nth-child(odd)::before{background:linear-gradient(180deg,var(--navy),rgba(40,71,149,0))}
.ab-card:nth-child(even)::before{background:linear-gradient(180deg,var(--red),rgba(227,30,36,0))}
.ab-serv.in .ab-card::before{transform:scaleY(1);transition-delay:calc(var(--i) * 100ms + 220ms)}
.ab-card:hover{border-color:#C9D2E2;box-shadow:0 22px 46px -32px rgba(19,26,36,.5)}
.ab-card .ic{width:56px;height:56px;border-radius:17px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy);margin-bottom:1rem;transition:transform .4s}
.ab-card:nth-child(even) .ic{background:var(--warm);color:var(--red)}
.ab-card .ic svg{width:30px;height:30px}
.ab-card:hover .ic{transform:translateY(-3px) scale(1.05)}
.ab-card h3{font-size:1.02rem;font-weight:600;margin-bottom:.5rem}
.ab-card p{margin:0;font-size:.9rem;color:var(--mute);line-height:1.6}
@media (max-width:1080px){ .ab-serv{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){ .ab-serv{grid-template-columns:1fr} }

/* addımlar */
.ab-steps{display:flex;flex-direction:column;gap:clamp(1.6rem,4vw,3rem)}
.ab-step{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(1.2rem,3vw,2.6rem);align-items:center;
  opacity:0;transform:translateX(-30px);
  transition:opacity .6s ease,transform .75s cubic-bezier(.2,.8,.3,1)}
.ab-step.alt{transform:translateX(30px)}
.ab-step.alt .ph{order:2}
.ab-steps.in .ab-step{opacity:1;transform:none;transition-delay:calc(var(--i) * 130ms)}
.ab-step .ph{border:1px solid var(--line);border-radius:18px;background:var(--ground);
  aspect-ratio:4/3;overflow:hidden;display:grid;place-items:center}
.ab-step .ph img{width:100%;height:100%;object-fit:contain;padding:5%;transition:transform .6s}
.ab-step:hover .ph img{transform:scale(1.05)}
.ab-step .n{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.ab-step h3{margin:.45rem 0 .6rem;font-size:clamp(1.15rem,1rem + .6vw,1.5rem);font-weight:600}
.ab-step p{margin:0;color:var(--mute);font-size:.96rem;line-height:1.7;max-width:56ch}
@media (max-width:820px){ .ab-step,.ab-step.alt{grid-template-columns:1fr;transform:translateY(24px)}
  .ab-step.alt .ph{order:0} }

/* brend lenti */
.marq{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marq-row{display:flex;gap:1rem;width:max-content;animation:marq 90s linear infinite}
.marq:hover .marq-row{animation-play-state:paused}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marq .mb{flex:none;width:150px;height:66px;border:1px solid var(--line);border-radius:14px;
  background:var(--ground);display:grid;place-items:center;padding:.5rem .7rem}
.marq .mb img{max-width:100%;height:auto;filter:grayscale(.45);opacity:.85;transition:.25s}
.marq .mb:hover img{filter:none;opacity:1}
@media (prefers-reduced-motion:reduce){
  .ab-blob,.ab-art .air path,.ab-art .dot,.marq-row{animation:none}
  .ab-hero h1 span,.ab-lead,.ab-acts{opacity:1;transform:none;animation:none}
  .ab-body,.ab-stat,.ab-card,.ab-step{opacity:1;transform:none;transition:none}
}

/* ══ İNSAN RESURSLARI ═══════════════════════════════════════════════ */
.hr-art svg{color:var(--navy)}
.hr-art .ring{animation:hr-spin 26s linear infinite;transform-origin:160px 150px}
.hr-art .ring.r2{animation-duration:18s;animation-direction:reverse}
@keyframes hr-spin{to{transform:rotate(360deg)}}
.hr-art .node{color:var(--navy);animation:hr-bob 4s ease-in-out infinite}
.hr-art .node.n2{color:var(--red);animation-delay:.6s}
.hr-art .node.n3{animation-delay:1.2s} .hr-art .node.n4{color:var(--red);animation-delay:1.8s}
@keyframes hr-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.hr-art .core{color:var(--red);animation:hr-pulse 3s ease-in-out infinite}
@keyframes hr-pulse{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}

.hr-jobs{display:flex;flex-direction:column;gap:.9rem}
.hr-job{border:1px solid var(--line);border-radius:18px;background:var(--ground);overflow:hidden;
  opacity:0;transform:translateY(22px);
  transition:opacity .55s ease,transform .65s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .3s}
.hr-jobs.in .hr-job{opacity:1;transform:none;transition-delay:calc(var(--i) * 90ms)}
.hr-job:hover{border-color:#C9D2E2;box-shadow:0 20px 44px -32px rgba(19,26,36,.45)}
.hr-job.open{border-color:var(--navy)}
.hr-top{display:flex;align-items:flex-start;gap:1.2rem;padding:1.4rem 1.5rem}
.hr-tx{flex:1;min-width:0}
.hr-tx h3{font-size:1.08rem;font-weight:600;margin-bottom:.35rem}
.hr-tx p{margin:0;color:var(--mute);font-size:.92rem;line-height:1.6;max-width:62ch}
.hr-meta{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.8rem}
.hr-meta span{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--mono);
  font-size:.7rem;color:var(--faint);letter-spacing:.02em}
.hr-meta svg{width:14px;height:14px}
.hr-btns{display:flex;flex-direction:column;gap:.5rem;flex:none}
.hr-more,.hr-app{font:inherit;font-size:.85rem;font-weight:600;cursor:pointer;border-radius:10px;
  padding:.55rem 1rem;transition:.16s;display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.hr-more{border:1px solid var(--line);background:var(--ground);color:var(--ink-2)}
.hr-more:hover{border-color:var(--navy);color:var(--navy)}
.hr-more svg{width:14px;height:14px;transition:transform .25s}
.hr-job.open .hr-more svg{transform:rotate(180deg)}
.hr-app{border:0;background:var(--red);color:#fff;box-shadow:0 10px 22px -12px rgba(227,30,36,.8)}
.hr-app:hover{background:#C9171D;transform:translateY(-1px)}
.hr-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.8,.3,1)}
.hr-body>div{overflow:hidden;padding:0 1.5rem}
.hr-job.open .hr-body{grid-template-rows:1fr}
.hr-job.open .hr-body>div{padding-bottom:1.5rem}
.hr-body .rich h3{font-size:.82rem;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--red);margin:1.2rem 0 .5rem}
.hr-body .rich ul{margin-left:1.1rem}
.hr-body .rich li{font-size:.92rem;color:var(--mute);margin-bottom:.3rem}
@media (max-width:760px){ .hr-top{flex-direction:column} .hr-btns{flex-direction:row;width:100%} }

/* CV forması */
.cv-f{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;margin-top:1.6rem}
.cv-f .f2{grid-column:1/-1}
.cv-f label{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.cv-f label>span:first-child{font-size:.8rem;font-weight:600;color:var(--ink-2)}
.cv-f input,.cv-f select,.cv-f textarea{font:inherit;font-size:.92rem;color:var(--ink);
  padding:.68rem .75rem;border:1px solid var(--line);border-radius:11px;background:var(--ground);width:100%;
  transition:border-color .16s,box-shadow .16s}
.cv-f textarea{resize:vertical;min-height:96px}
.cv-f input:focus,.cv-f select:focus,.cv-f textarea:focus{outline:0;border-color:var(--navy);
  box-shadow:0 0 0 3px var(--chill)}
.cv-file{position:relative}
.cv-file input[type=file]{position:absolute;inset:auto 0 0 0;height:86px;opacity:0;cursor:pointer;z-index:2}
.cv-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;
  height:86px;border:1.5px dashed var(--line);border-radius:12px;background:var(--tint);transition:.18s}
.cv-file:hover .cv-drop{border-color:var(--navy);background:var(--chill)}
.cv-drop b{font-size:.9rem;font-weight:600;color:var(--ink-2)}
.cv-drop em{font-style:normal;font-family:var(--mono);font-size:.7rem;color:var(--faint)}
.cv-f .qm-go{grid-column:1/-1}
@media (max-width:560px){ .cv-f{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){ .hr-art .ring,.hr-art .node,.hr-art .core{animation:none}
  .hr-job{opacity:1;transform:none} }

/* ══ mobil menyu ════════════════════════════════════════════════════ */
.mnav{position:fixed;inset:0;z-index:220;display:none}
.mnav.on{display:block}
.mnav-bd{position:absolute;inset:0;background:rgba(19,26,36,.5);backdrop-filter:blur(3px);
  animation:qm-fade .22s ease}
.mnav-p{position:absolute;right:0;top:0;bottom:0;width:min(400px,90vw);background:var(--ground);
  box-shadow:-24px 0 60px -30px rgba(19,26,36,.6);display:flex;flex-direction:column;
  animation:mnav-in .3s cubic-bezier(.2,.9,.3,1)}
@keyframes mnav-in{from{transform:translateX(100%)}to{transform:none}}
.mnav-hd{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1rem 1.1rem;border-bottom:1px solid var(--line-2)}
.mnav-hd img{height:44px;width:auto}
.mnav-x{width:40px;height:40px;border-radius:11px;border:1px solid var(--line);background:var(--ground);
  color:var(--ink-2);display:grid;place-items:center;cursor:pointer;transition:.16s}
.mnav-x svg{width:18px;height:18px}
.mnav-x:hover{background:var(--red);border-color:var(--red);color:#fff}
.mnav-b{flex:1;overflow-y:auto;padding:.5rem 0 1rem}
.mnav-b a,.mnav-b button{display:flex;align-items:center;gap:.7rem;width:100%;text-align:left;
  padding:.85rem 1.1rem;font:inherit;font-size:.98rem;font-weight:600;color:var(--ink);
  background:none;border:0;cursor:pointer;transition:background .15s}
.mnav-b a:hover,.mnav-b button:hover{background:var(--tint)}
.mnav-b .grp>button{justify-content:space-between}
.mnav-b .grp>button svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.4;
  transition:transform .25s;flex:none}
.mnav-b .grp.open>button svg{transform:rotate(180deg)}
.mnav-b .sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s cubic-bezier(.2,.8,.3,1)}
.mnav-b .grp.open .sub{grid-template-rows:1fr}
.mnav-b .sub>div{overflow:hidden}
.mnav-b .sub a{padding-left:2.6rem;font-size:.92rem;font-weight:500;color:var(--ink-2)}
.mnav-b .sub a i{width:28px;height:28px;flex:none;border-radius:9px;display:grid;place-items:center;
  background:var(--tint);color:#8E9AAF;margin-left:-1.6rem}
.mnav-b .sub a i svg{width:18px;height:18px;stroke-width:2}
.mnav-b .hd2{padding:.9rem 1.1rem .3rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--faint)}
.mnav-ft{border-top:1px solid var(--line-2);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.6rem}
.mnav-ft .cta{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:0;cursor:pointer;
  font:inherit;font-weight:600;padding:.8rem 1rem;border-radius:11px;background:var(--red);color:#fff}
.mnav-ft .lang{display:flex;gap:.4rem;justify-content:center;background:none;border:0;padding:0}
.mnav-ft .lang a{justify-content:center;padding:.5rem .9rem;border:1px solid var(--line);border-radius:999px;
  font-size:.85rem;width:auto}
.mnav-ft .lang a.on{background:var(--navy);border-color:var(--navy);color:#fff}
body.mnav-open{overflow:hidden}
@media (min-width:1081px){ .mnav{display:none!important} }

/* Haqqımızda: hero ilə mətn arasındakı boşluq daraldılır */
.ab-hero + .sec{padding-top:clamp(1.2rem,2.5vw,2rem)}
.ab-lead{margin-bottom:0}
.hr-hero .ab-acts{margin-top:1.6rem}

/* məhsul səhifəsi — WhatsApp sifariş düyməsi */
.pd-cta.wa{background:#25D366;box-shadow:0 14px 30px -16px rgba(37,211,102,.95);text-decoration:none}
.pd-cta.wa:hover{background:#1FBA59}
.pd-cta.wa svg{width:19px;height:19px}

/* ══ BLOQ / XƏBƏR siyahısı ══════════════════════════════════════════ */
.pl-hero{padding-bottom:clamp(1rem,2.5vw,1.8rem)}
.pl-hero.news .ab-blob.b1{background:rgba(227,30,36,.14)}
.pl-hero.news .ab-blob.b2{background:rgba(40,71,149,.12)}
.pl-hd h1{margin:.3rem 0 0;font-size:clamp(1.9rem,1.4rem + 2.2vw,3rem);font-weight:700;letter-spacing:-.025em}
.pl-hd h1 span{display:inline-block;opacity:0;transform:translateY(20px);
  animation:ab-word .65s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--w) * 100ms + 100ms)}
.pl-hero + .pl{padding-top:clamp(1rem,2.5vw,1.8rem)}

.pl-lead{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.2rem,3vw,2.4rem);
  align-items:center;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--ground);
  transition:border-color .2s,box-shadow .3s,transform .3s}
.pl-lead:hover{border-color:#C9D2E2;transform:translateY(-3px);box-shadow:0 26px 54px -34px rgba(19,26,36,.5)}
.pl-lead .ph{aspect-ratio:16/10;overflow:hidden;background:var(--tint)}
.pl-lead .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.pl-lead:hover .ph img{transform:scale(1.04)}
.pl-lead .tx{padding:clamp(1.2rem,3vw,2.2rem) clamp(1.2rem,3vw,2.4rem) clamp(1.2rem,3vw,2.2rem) 0}
.pl-lead .date{font-family:var(--mono);font-size:.7rem;letter-spacing:.11em;color:var(--faint)}
.pl-lead h2{margin:.55rem 0 .7rem;font-size:clamp(1.25rem,1.05rem + .9vw,1.8rem);font-weight:600;
  letter-spacing:-.015em;line-height:1.25}
.pl-lead p{margin:0;color:var(--mute);font-size:.98rem;line-height:1.65;max-width:56ch}
.pl-lead .go{display:inline-flex;align-items:center;gap:.4rem;margin-top:1.1rem;font-weight:600;font-size:.9rem;
  color:var(--navy)}
.pl.news .pl-lead .go{color:var(--red)}
.pl-lead .go svg{width:14px;height:14px;transition:transform .2s}
.pl-lead:hover .go svg{transform:translateX(4px)}
@media (max-width:820px){ .pl-lead{grid-template-columns:1fr} .pl-lead .tx{padding:0 1.3rem 1.5rem} }

.pl-grid{margin-top:1.2rem;grid-template-columns:repeat(3,1fr)}
.pl-grid .post{opacity:0;transform:translateY(22px);
  transition:opacity .55s ease,transform .65s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .3s}
.pl-grid.in .post{opacity:1;transform:none;transition-delay:calc(var(--i) * 90ms)}
.pl.news .post .go{color:var(--red)}
.pl.news .post .date{color:var(--red);opacity:.8}
@media (max-width:1080px){ .pl-grid{grid-template-columns:repeat(2,1fr)} }

/* ══ KATEQORİYA / ALT KATEQORİYA ════════════════════════════════════ */
.cat-hero.heat .ab-blob.b1{background:rgba(227,30,36,.15)}
.cat-hero.heat .ab-blob.b2{background:rgba(40,71,149,.10)}
.cat-hero{padding-bottom:clamp(1.4rem,3vw,2.4rem)}
.cat-hero h1{margin:.4rem 0 0;font-size:clamp(1.9rem,1.4rem + 2.2vw,3rem);font-weight:700;letter-spacing:-.025em}
.cat-hero h1 span{display:inline-block;opacity:0;transform:translateY(20px);
  animation:ab-word .65s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--w) * 100ms + 100ms)}
.cat-badges{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem;opacity:0;
  animation:ab-word .6s ease forwards .55s}
.cat-badges span{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--mute);
  background:var(--ground);border:1px solid var(--line);border-radius:999px;padding:.42rem .95rem}
.cat-badges b{font-size:.95rem;color:var(--navy)}
.cat-hero.heat .cat-badges b{color:var(--red)}

/* hero ikonu — genişlənən halqalar */
.cat-art{position:relative;display:grid;place-items:center;min-height:230px}
.cat-art .ic{position:relative;z-index:2;width:118px;height:118px;border-radius:34px;display:grid;
  place-items:center;background:var(--ground);border:1px solid var(--line);color:var(--navy);
  box-shadow:0 22px 50px -30px rgba(19,26,36,.45)}
.cat-hero.heat .cat-art .ic{color:var(--red)}
.cat-art .ic svg{width:62px;height:62px;stroke:currentColor;fill:none;stroke-width:1.8}
.cat-art .ring{position:absolute;border-radius:50%;border:1.5px solid var(--navy);opacity:0;
  animation:cat-ring 3.6s ease-out infinite}
.cat-hero.heat .cat-art .ring{border-color:var(--red)}
.cat-art .ring.r2{animation-delay:1.2s} .cat-art .ring.r3{animation-delay:2.4s}
@keyframes cat-ring{0%{width:120px;height:120px;opacity:.5}100%{width:300px;height:300px;opacity:0}}

/* alt kateqoriya plitələri */
.cat-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
.cat-tile{display:flex;align-items:center;gap:.85rem;padding:1rem 1.1rem;border:1px solid var(--line);
  border-radius:16px;background:var(--ground);opacity:0;transform:translateY(20px);
  transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .3s}
.cat-tiles.in .cat-tile{opacity:1;transform:none;transition-delay:calc(var(--i) * 55ms)}
.cat-tile:hover{border-color:#C9D2E2;transform:translateY(-3px);box-shadow:0 18px 38px -30px rgba(19,26,36,.45)}
.cat-tile .ic{width:44px;height:44px;flex:none;border-radius:13px;display:grid;place-items:center;
  background:var(--tint);color:#8E9AAF;transition:.22s}
.cat-tile .ic svg{width:27px;height:27px;stroke:currentColor;fill:none;stroke-width:2.05}
.cat-sec.cool .cat-tile:hover .ic{background:var(--chill);color:var(--navy)}
.cat-sec.heat .cat-tile:hover .ic{background:var(--warm);color:var(--red)}
.cat-tile .nm{flex:1;min-width:0;font-size:.93rem;font-weight:600;color:var(--ink)}
.cat-tile .go{flex:none;width:15px;height:15px;color:var(--faint);transition:.2s}
.cat-tile .go svg{width:15px;height:15px}
.cat-tile:hover .go{transform:translateX(3px);color:var(--navy)}
.cat-sec.heat .cat-tile:hover .go{color:var(--red)}
@media (max-width:1080px){ .cat-tiles{grid-template-columns:repeat(2,1fr)} }

/* SEO mətni — qatlanır */
.cat-rich{max-height:280px;overflow:hidden;position:relative;
  transition:max-height .5s cubic-bezier(.2,.8,.3,1)}
.cat-rich::after{content:"";position:absolute;left:0;right:0;bottom:0;height:110px;
  background:linear-gradient(180deg,rgba(255,255,255,0),var(--ground));transition:opacity .3s}
.cat-rich.open{max-height:4000px}
.cat-rich.open::after{opacity:0}
.cat-more{display:inline-flex;align-items:center;gap:.45rem;margin-top:.9rem;font:inherit;font-size:.9rem;
  font-weight:600;color:var(--navy);background:none;border:0;cursor:pointer;padding:.4rem 0}
.cat-more svg{width:15px;height:15px;transition:transform .25s}
.cat-more.open svg{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){
  .cat-art .ring{animation:none;opacity:0}
  .cat-hero h1 span,.cat-badges{opacity:1;transform:none;animation:none}
  .cat-tile{opacity:1;transform:none} }

/* brend kartında məhsul sayı */
.brand .cnt{position:absolute;top:.5rem;right:.6rem;font-family:var(--mono);font-size:.62rem;
  min-width:20px;height:20px;padding:0 .3rem;border-radius:999px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy)}
.brand.heat .cnt{background:var(--warm);color:var(--red)}

/* ══ 404 — səhifə tapılmadı ═════════════════════════════════════════ */
.nf{position:relative;overflow:hidden;padding:clamp(2rem,5vw,3.6rem) 0 clamp(2.8rem,6vw,4.6rem);
  background:linear-gradient(180deg,var(--chill) 0%,rgba(237,243,252,0) 70%)}
.nf-bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(420px 420px at 12% -10%,rgba(40,71,149,.16),transparent 70%),
    radial-gradient(360px 360px at 92% 22%,rgba(227,30,36,.12),transparent 70%)}
.nf .wrap{position:relative;z-index:1}
.nf-in{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(1.4rem,4vw,3.2rem);align-items:center}

/* 4 0 4 — ortadakı sıfır fırlanan fan olur */
.nf-art{position:relative;display:flex;align-items:center;justify-content:center;gap:clamp(.2rem,1.2vw,.7rem);
  min-height:230px;order:-1}
.nf-art .d{font-family:var(--mono);font-size:clamp(4.2rem,3rem + 7vw,8.4rem);font-weight:600;line-height:1;
  color:var(--navy);letter-spacing:-.04em;opacity:0;transform:translateY(26px);
  animation:ab-word .7s cubic-bezier(.2,.8,.3,1) forwards}
.nf-art .d1{animation-delay:.05s} .nf-art .d0{animation-delay:.18s} .nf-art .d2{animation-delay:.31s}
.nf-art .d0{position:relative;width:clamp(4.4rem,3.2rem + 7vw,8.6rem);height:clamp(4.4rem,3.2rem + 7vw,8.6rem);
  display:grid;place-items:center;border-radius:50%;background:var(--ground);
  border:1px solid var(--line);box-shadow:0 24px 54px -32px rgba(19,26,36,.5)}
.nf-art .fan{display:grid;place-items:center;width:64%;height:64%;color:var(--red);
  animation:nf-spin 9s linear infinite}
.nf-art .fan svg{width:100%;height:100%;stroke:currentColor;fill:none}
@keyframes nf-spin{to{transform:rotate(360deg)}}
.nf-art .ring{position:absolute;border-radius:50%;border:1.5px solid var(--navy);opacity:0;
  animation:cat-ring 4s ease-out infinite}
.nf-art .ring.r2{animation-delay:2s}

.nf-tx .kick{display:inline-flex;align-items:center;gap:.5rem;color:var(--red);font-family:var(--mono);
  font-size:.8rem;font-weight:600;letter-spacing:.14em}
.nf-tx .kick i{width:22px;height:2px;background:currentColor;border-radius:2px}
.nf h1{margin:.55rem 0 0;font-size:clamp(1.9rem,1.4rem + 2.4vw,3.1rem);font-weight:700;
  letter-spacing:-.025em;line-height:1.1}
.nf h1 span{display:inline-block;opacity:0;transform:translateY(22px);
  animation:ab-word .7s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--w) * 110ms + 320ms)}
.nf-lead{margin:.9rem 0 0;font-size:clamp(.98rem,.94rem + .2vw,1.1rem);color:var(--mute);max-width:50ch;
  opacity:0;animation:ab-word .6s ease forwards .62s}

.nf-search{margin-top:1.5rem;display:flex;align-items:center;gap:.5rem;max-width:520px;
  background:var(--ground);border:1px solid var(--line);border-radius:14px;padding:.35rem .35rem .35rem .9rem;
  box-shadow:0 18px 40px -34px rgba(19,26,36,.5);opacity:0;
  animation:ab-word .6s ease forwards .72s;transition:border-color .2s,box-shadow .3s}
.nf-search:focus-within{border-color:#C2CEE6;box-shadow:0 20px 44px -30px rgba(40,71,149,.5)}
.nf-search>svg{width:18px;height:18px;flex:none;color:var(--faint)}
.nf-search input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:.93rem;color:var(--ink);
  padding:.6rem 0;outline:none}
.nf-search input::placeholder{color:var(--faint)}
.nf-search button{flex:none;border:0;cursor:pointer;font:inherit;font-size:.88rem;font-weight:600;color:#fff;
  background:var(--navy);border-radius:11px;padding:.62rem 1.1rem;transition:background .2s,transform .18s}
.nf-search button:hover{background:var(--navy-deep);transform:translateY(-1px)}

.nf-cta{margin-top:1.3rem;display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.2rem;
  opacity:0;animation:ab-word .6s ease forwards .82s}
.nf-home{display:inline-flex;align-items:center;gap:.55rem;font-size:.94rem;font-weight:600;color:#fff;
  background:var(--red);border-radius:12px;padding:.8rem 1.35rem;
  box-shadow:0 18px 38px -24px rgba(227,30,36,.8);transition:background .2s,transform .2s,box-shadow .25s}
.nf-home svg{width:18px;height:18px}
.nf-home:hover{background:var(--red-deep);transform:translateY(-2px);
  box-shadow:0 22px 44px -22px rgba(227,30,36,.85)}
.nf-alt{display:inline-flex;align-items:center;gap:.4rem;font-size:.92rem;font-weight:600;color:var(--navy)}
.nf-alt svg{width:15px;height:15px;transition:transform .2s}
.nf-alt:hover svg{transform:translateX(4px)}

.nf-links{margin-top:clamp(2rem,5vw,3.2rem);padding-top:clamp(1.4rem,3vw,2rem);border-top:1px solid var(--line)}
.nf-lh{display:block;font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--faint);margin-bottom:.9rem}
.nf-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}
.nf-grid a{display:flex;align-items:center;gap:.8rem;padding:.95rem 1.05rem;background:var(--ground);
  border:1px solid var(--line);border-radius:16px;opacity:0;transform:translateY(18px);
  animation:ab-word .55s cubic-bezier(.2,.8,.3,1) forwards;
  animation-delay:calc(var(--i) * 80ms + .9s);transition:border-color .2s,transform .22s,box-shadow .3s}
.nf-grid a:hover{border-color:#C9D2E2;transform:translateY(-3px);box-shadow:0 18px 38px -30px rgba(19,26,36,.45)}
.nf-grid i{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;
  background:var(--tint);color:#8E9AAF;transition:.22s}
.nf-grid i svg{width:22px;height:22px}
.nf-grid a:hover i{background:var(--chill);color:var(--navy)}
.nf-grid b{flex:1;min-width:0;font-size:.92rem;font-weight:600;color:var(--ink)}
.nf-grid a>svg{flex:none;width:15px;height:15px;color:var(--faint);transition:.2s}
.nf-grid a:hover>svg{color:var(--navy);transform:translateX(3px)}

@media (max-width:900px){
  .nf-in{grid-template-columns:1fr;text-align:left}
  .nf-art{order:0;min-height:auto;margin-bottom:.4rem;justify-content:flex-start}
  .nf-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .nf-search button{padding:.62rem .85rem} }
@media (prefers-reduced-motion:reduce){
  .nf-art .ring,.nf-art .fan{animation:none;opacity:0}
  .nf-art .fan{opacity:1}
  .nf h1 span,.nf-lead,.nf-search,.nf-cta,.nf-grid a,.nf-art .d{opacity:1;transform:none;animation:none} }

/* ══ ƏLAQƏ ══════════════════════════════════════════════════════════ */
.ct-hero .ab-hero-in{align-items:center}
.ct-quick{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem;
  opacity:0;animation:ab-word .6s ease forwards .6s}
.ct-btn{display:inline-flex;align-items:center;gap:.55rem;font-size:.93rem;font-weight:600;
  border-radius:12px;padding:.78rem 1.25rem;transition:background .2s,color .2s,transform .2s,box-shadow .25s,border-color .2s}
.ct-btn svg{width:18px;height:18px;flex:none}
.ct-btn.navy{background:var(--navy);color:#fff;box-shadow:0 18px 38px -26px rgba(40,71,149,.9)}
.ct-btn.navy:hover{background:var(--navy-deep);transform:translateY(-2px)}
.ct-btn.wa{background:#25D366;color:#fff;box-shadow:0 18px 38px -26px rgba(37,211,102,.9)}
.ct-btn.wa:hover{background:#1DAF52;transform:translateY(-2px)}
.ct-btn.ghost{background:var(--ground);color:var(--navy);border:1px solid var(--line)}
.ct-btn.ghost:hover{border-color:#C2CEE6;transform:translateY(-2px)}

/* hero qrafikası — yayılan siqnal halqaları */
.ct-art{position:relative;display:grid;place-items:center;min-height:290px}
.ct-art .cw{position:absolute;border-radius:50%;border:1.6px solid var(--navy);opacity:0;
  animation:ct-wave 4.2s ease-out infinite}
.ct-art .cw.w2{animation-delay:1.4s} .ct-art .cw.w3{animation-delay:2.8s}
@keyframes ct-wave{0%{width:110px;height:110px;opacity:.55}100%{width:330px;height:330px;opacity:0}}
.ct-art .cpin{position:relative;z-index:2;width:110px;height:110px;border-radius:34px;display:grid;
  place-items:center;background:var(--ground);border:1px solid var(--line);color:var(--red);
  box-shadow:0 24px 54px -30px rgba(19,26,36,.5);animation:ct-pin 3.4s ease-in-out infinite}
.ct-art .cpin svg{width:56px;height:56px;stroke-width:1.5}
@keyframes ct-pin{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.ct-art .cbub{position:absolute;z-index:3;width:52px;height:52px;border-radius:16px;display:grid;
  place-items:center;background:var(--ground);border:1px solid var(--line);color:var(--navy);
  box-shadow:0 16px 34px -24px rgba(19,26,36,.5);animation:ct-float 5.5s ease-in-out infinite}
.ct-art .cbub svg{width:24px;height:24px}
.ct-art .cbub.b1{left:6%;top:16%}
.ct-art .cbub.b2{right:8%;top:30%;animation-delay:1.1s}
.ct-art .cbub.b3{right:18%;bottom:12%;color:#25D366;animation-delay:2.2s}
@keyframes ct-float{0%,100%{transform:translate(0,0)}50%{transform:translate(4px,-12px)}}

/* əlaqə kartları */
.ct-sec{padding-top:clamp(1.6rem,3.5vw,2.6rem)}
.ct-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem}
.ct-cards>*{display:flex;align-items:flex-start;gap:.9rem;padding:1.15rem 1.2rem;background:var(--ground);
  border:1px solid var(--line);border-radius:18px;opacity:0;transform:translateY(22px);
  transition:opacity .55s ease,transform .6s cubic-bezier(.2,.8,.3,1),border-color .2s,box-shadow .3s}
.ct-cards.in>*{opacity:1;transform:none;transition-delay:calc(var(--i) * 90ms)}
a.ct-card:hover{border-color:#C9D2E2;transform:translateY(-4px);box-shadow:0 20px 44px -32px rgba(19,26,36,.5)}
.ct-card .ic{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy);transition:.22s}
.ct-card .ic svg{width:24px;height:24px}
a.ct-card:hover .ic{background:var(--navy);color:#fff}
.ct-card .tx{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.ct-card b{font-size:.76rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--faint)}
.ct-card em{font-style:normal;font-size:.98rem;font-weight:600;color:var(--ink);line-height:1.35;word-break:break-word}
.ct-card i{font-style:normal;font-size:.8rem;color:var(--mute);margin-top:.15rem}

/* forma + yan panel */
.ct-grid{display:grid;grid-template-columns:1fr;max-width:760px;margin:0 auto}
.ct-grid>*{opacity:0;transform:translateY(24px);
  transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.3,1)}
.ct-grid.in>*{opacity:1;transform:none}
.ct-fwrap{text-align:center}
.ct-fwrap .kick{display:inline-flex;align-items:center;gap:.5rem;color:var(--navy);font-size:.82rem;
  font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.ct-fwrap .kick i{width:22px;height:2px;background:currentColor;border-radius:2px}
.ct-fwrap h2{margin:.5rem 0 0;font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);font-weight:700;letter-spacing:-.02em}
.ct-ftext{margin:.6rem auto 1.5rem;color:var(--mute);font-size:.96rem;max-width:52ch}
.ct-f{text-align:left;background:var(--ground);border:1px solid var(--line);border-radius:20px;padding:clamp(1.1rem,2.5vw,1.6rem);
  box-shadow:0 24px 54px -44px rgba(19,26,36,.55)}

.ct-panel{background:var(--navy);color:#fff;border-radius:20px;padding:clamp(1.2rem,2.6vw,1.7rem);
  box-shadow:0 26px 58px -38px rgba(40,71,149,.9)}
.ct-pk{display:block;font-size:.76rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.62)}
.ct-panel h3{margin:.45rem 0 0;font-size:1.22rem;font-weight:700;letter-spacing:-.015em;color:#fff}
.ct-list{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-direction:column;gap:.7rem}
.ct-list li{display:flex;align-items:flex-start;gap:.6rem;font-size:.92rem;color:rgba(255,255,255,.9);line-height:1.45}
.ct-list svg{flex:none;width:17px;height:17px;margin-top:.15rem;color:#8FB5FF}
.ct-pact{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.ct-pact .ct-btn.ghost{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:#fff}
.ct-pact .ct-btn.ghost:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.45)}
.ct-hours{display:flex;align-items:center;gap:.75rem;margin-top:.85rem;padding:.95rem 1.1rem;
  background:var(--ground);border:1px solid var(--line);border-radius:16px}
.ct-hours svg{flex:none;width:24px;height:24px;color:var(--red)}
.ct-hours span{display:flex;flex-direction:column;font-size:.92rem;color:var(--ink)}
.ct-hours b{font-size:.74rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--faint)}

/* xəritə */
.ct-mapsec{padding:clamp(2rem,5vw,3.4rem) 0 0}
.ct-maphd{text-align:center;margin-bottom:1.3rem}
.ct-maphd .kick{display:inline-flex;align-items:center;gap:.5rem;color:var(--red);font-size:.82rem;
  font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.ct-maphd .kick i{width:22px;height:2px;background:currentColor;border-radius:2px}
.ct-maphd h2{margin:.5rem 0 0;font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);font-weight:700;letter-spacing:-.02em}
.ct-maphd p{margin:.55rem 0 0;display:inline-flex;align-items:center;gap:.4rem;color:var(--mute);font-size:.95rem}
.ct-maphd p svg{width:17px;height:17px;color:var(--red)}
.ct-map{position:relative;height:clamp(300px,42vw,460px);border-top:1px solid var(--line);
  background:var(--tint)}
.ct-map iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.25) contrast(1.02);
  transition:filter .35s}
.ct-map:hover iframe{filter:none}

@media (max-width:1080px){ .ct-cards{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .ct-art{min-height:220px}
  .ct-art .cpin{width:88px;height:88px;border-radius:26px} .ct-art .cpin svg{width:44px;height:44px} }
@media (prefers-reduced-motion:reduce){
  .ct-art .cw{animation:none;opacity:0}
  .ct-art .cpin,.ct-art .cbub{animation:none}
  .ct-quick,.ct-cards>*,.ct-grid>*{opacity:1;transform:none;animation:none} }

/* ══ BREND SƏHİFƏSİ ═════════════════════════════════════════════════ */
.br-hero .ab-blob.b1{background:rgba(40,71,149,.16)}
.br-hero .ab-blob.b2{background:rgba(40,71,149,.10)}
.br-hero.heat .ab-blob.b1{background:rgba(227,30,36,.15)}
.br-hero.heat .ab-blob.b2{background:rgba(40,71,149,.10)}
.br-hero-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(1.4rem,4vw,3rem);align-items:center}
.br-tx .kick{display:inline-flex;align-items:center;gap:.5rem;color:var(--navy);font-size:.8rem;
  font-weight:600;letter-spacing:.13em;text-transform:uppercase}
.br-hero.heat .br-tx .kick{color:var(--red)}
.br-tx .kick i{width:22px;height:2px;background:currentColor;border-radius:2px}
.br-hero h1{margin:.55rem 0 0;font-size:clamp(2rem,1.4rem + 2.6vw,3.2rem);font-weight:700;
  letter-spacing:-.03em;line-height:1.08}
.br-hero h1 span{display:inline-block;opacity:0;transform:translateY(22px);
  animation:ab-word .7s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--w) * 110ms + 120ms)}
.br-lead{margin:.9rem 0 0;color:var(--mute);font-size:clamp(.96rem,.93rem + .2vw,1.06rem);max-width:48ch;
  opacity:0;animation:ab-word .6s ease forwards .5s}
.br-acts{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem;opacity:0;
  animation:ab-word .6s ease forwards .62s}
.br-btn{display:inline-flex;align-items:center;gap:.5rem;font-size:.94rem;font-weight:600;
  border-radius:12px;padding:.8rem 1.3rem;transition:.2s}
.br-btn svg{width:15px;height:15px}
.br-btn.solid{background:var(--navy);color:#fff;box-shadow:0 18px 38px -26px rgba(40,71,149,.9)}
.br-btn.solid:hover{background:var(--navy-deep);transform:translateY(-2px);gap:.75rem}
.br-hero.heat .br-btn.solid{background:var(--red);box-shadow:0 18px 38px -26px rgba(227,30,36,.9)}
.br-hero.heat .br-btn.solid:hover{background:var(--red-deep)}
.br-btn.ghost{background:var(--ground);border:1px solid var(--line);color:var(--ink)}
.br-btn.ghost:hover{border-color:var(--navy);color:var(--navy);transform:translateY(-2px)}

/* loqo kartı — genişlənən halqalarla */
.br-logo{position:relative;display:grid;place-items:center;min-height:240px}
.br-logo .card{position:relative;z-index:2;display:grid;place-items:center;width:min(300px,84%);
  padding:1.8rem 1.6rem;background:var(--ground);border:1px solid var(--line);border-radius:24px;
  box-shadow:0 26px 58px -34px rgba(19,26,36,.5)}
.br-logo .card img{max-width:100%;height:auto;object-fit:contain}
.br-logo .ring{position:absolute;border-radius:50%;border:1.5px solid var(--navy);opacity:0;
  animation:cat-ring 4s ease-out infinite}
.br-hero.heat .br-logo .ring{border-color:var(--red)}
.br-logo .ring.r2{animation-delay:2s}

/* təsvir */
.br-body{padding-top:clamp(1.6rem,3.5vw,2.6rem)}
.br-rich{font-size:1.02rem;line-height:1.72;color:var(--ink-2)}
.br-rich p{margin:0 0 1rem}
.br-rich p:first-child{font-size:1.1rem;color:var(--ink)}
.br-rich p:last-child{margin:0;padding:1.1rem 1.25rem;background:var(--chill);border-radius:16px;
  border-left:3px solid var(--navy)}
.br-hero.heat ~ .br-body .br-rich p:last-child{background:var(--warm);border-left-color:var(--red)}
.br-rich b{color:var(--ink);font-weight:700}

/* digər brendlər zolağı */
.br-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:.7rem}
.br-chip{display:grid;place-items:center;padding:.9rem .8rem;background:var(--ground);
  border:1px solid var(--line);border-radius:14px;opacity:0;transform:translateY(16px);
  animation:ab-word .5s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--i) * 55ms + .1s);
  transition:border-color .2s,transform .2s,box-shadow .3s}
.br-chip:hover{border-color:#C9D2E2;transform:translateY(-3px);box-shadow:0 16px 34px -28px rgba(19,26,36,.5)}
.br-chip img{max-width:100%;height:auto;filter:grayscale(1);opacity:.66;transition:.22s}
.br-chip:hover img{filter:none;opacity:1}

@media (max-width:900px){ .br-hero-in{grid-template-columns:1fr} .br-logo{min-height:170px;order:-1}
  .br-strip{grid-template-columns:repeat(3,1fr)} }
@media (max-width:560px){ .br-strip{grid-template-columns:repeat(2,1fr)} }
@media (prefers-reduced-motion:reduce){
  .br-logo .ring{animation:none;opacity:0}
  .br-hero h1 span,.br-lead,.br-acts,.br-chip{opacity:1;transform:none;animation:none} }

/* ══ OBYEKTLƏR (referanslar) ════════════════════════════════════════ */
.rf-hero-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(1.4rem,4vw,3rem);align-items:center}
.rf-hero .kick{display:inline-flex;align-items:center;gap:.5rem;color:var(--navy);font-size:.8rem;
  font-weight:600;letter-spacing:.13em;text-transform:uppercase}
.rf-hero .kick i{width:22px;height:2px;background:currentColor;border-radius:2px}
.rf-hero h1{margin:.55rem 0 0;font-size:clamp(1.9rem,1.4rem + 2.4vw,3rem);font-weight:700;letter-spacing:-.028em}
.rf-hero h1 span{display:inline-block;opacity:0;transform:translateY(22px);
  animation:ab-word .7s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--w) * 110ms + 120ms)}
.rf-icons{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem}
.rf-ic{display:grid;place-items:center;aspect-ratio:1;border-radius:18px;background:var(--ground);
  border:1px solid var(--line);color:var(--navy);opacity:0;transform:translateY(16px) scale(.94);
  animation:ab-word .55s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--i) * 70ms + .3s)}
.rf-ic.heat{color:var(--red)}
.rf-ic svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.8}

.rf-list{display:flex;flex-direction:column;gap:clamp(1rem,2.4vw,1.6rem)}
.rf-row{display:grid;grid-template-columns:minmax(0,.34fr) minmax(0,.66fr);gap:clamp(1rem,2.5vw,2rem);
  align-items:center;padding:clamp(1rem,2.4vw,1.5rem);background:var(--ground);border:1px solid var(--line);
  border-radius:22px;opacity:0;transform:translateY(24px);
  transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.3,1),box-shadow .3s,border-color .2s}
.rf-list.in .rf-row{opacity:1;transform:none;transition-delay:calc(var(--i) * 80ms)}
.rf-row:hover{border-color:#C9D2E2;box-shadow:0 24px 52px -38px rgba(19,26,36,.5)}
.rf-head{display:flex;align-items:center;gap:.9rem}
.rf-head .ic{flex:none;width:60px;height:60px;border-radius:18px;display:grid;place-items:center;
  background:var(--chill);color:var(--navy);transition:.22s}
.rf-row.heat .rf-head .ic{background:var(--warm);color:var(--red)}
.rf-head .ic svg{width:32px;height:32px;stroke:currentColor;fill:none;stroke-width:1.8}
.rf-head h2{margin:0;font-size:clamp(1.1rem,1rem + .5vw,1.4rem);font-weight:700;letter-spacing:-.015em}
.rf-head p{margin:.2rem 0 0;font-size:.86rem;color:var(--mute)}
.rf-prj{display:grid;grid-template-columns:minmax(0,.44fr) minmax(0,.56fr);gap:1rem;align-items:center}
.rf-prj .ph{position:relative;display:block;aspect-ratio:3/2;border-radius:16px;overflow:hidden;background:var(--tint)}
.rf-prj .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.rf-prj:hover .ph img{transform:scale(1.05)}
.rf-prj .mono{font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;color:var(--faint)}
.rf-prj h3{margin:.3rem 0 0;font-size:1.02rem;font-weight:700;line-height:1.3;color:var(--ink)}
.rf-prj p{margin:.35rem 0 0;font-size:.87rem;color:var(--mute);line-height:1.5}
.rf-prj .go{display:inline-flex;align-items:center;gap:.4rem;margin-top:.6rem;font-size:.85rem;
  font-weight:600;color:var(--navy)}
.rf-row.heat .rf-prj .go{color:var(--red)}
.rf-prj .go svg{width:14px;height:14px;transition:transform .2s}
.rf-prj:hover .go svg{transform:translateX(4px)}
.rf-empty{display:grid;place-items:center;min-height:110px;border:1px dashed var(--line);border-radius:16px;
  color:var(--faint);font-size:.9rem}

.rf-cta{margin-top:clamp(1.4rem,3vw,2.2rem);display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:1rem;padding:clamp(1.1rem,2.6vw,1.7rem);border-radius:22px;
  background:var(--chill);border:1px solid #D9E4F6}
.rf-cta b{display:block;font-size:1.08rem;color:var(--ink)}
.rf-cta p{margin:.3rem 0 0;font-size:.92rem;color:var(--mute);max-width:56ch}

/* ══ LAYİHƏLƏR ══════════════════════════════════════════════════════ */
.pj-hero .kick{display:inline-flex;align-items:center;gap:.5rem;color:var(--navy);font-size:.8rem;
  font-weight:600;letter-spacing:.13em;text-transform:uppercase}
.pj-hero .kick i{width:22px;height:2px;background:currentColor;border-radius:2px}
.pj-hero h1{margin:.55rem 0 0;font-size:clamp(1.9rem,1.4rem + 2.4vw,3rem);font-weight:700;letter-spacing:-.028em}
.pj-hero h1 span{display:inline-block;opacity:0;transform:translateY(22px);
  animation:ab-word .7s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--w) * 110ms + 120ms)}

.pj-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.4rem}
.pj-filter button{display:inline-flex;align-items:center;gap:.45rem;font:inherit;font-size:.88rem;
  font-weight:600;color:var(--mute);background:var(--ground);border:1px solid var(--line);
  border-radius:999px;padding:.5rem 1rem;cursor:pointer;transition:.2s}
.pj-filter button svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9}
.pj-filter button:hover{border-color:#C9D2E2;color:var(--ink)}
.pj-filter button.on{background:var(--navy);border-color:var(--navy);color:#fff}

.pj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.8rem,2vw,1.2rem)}
.pj{display:flex;flex-direction:column;background:var(--ground);border:1px solid var(--line);
  border-radius:20px;overflow:hidden;opacity:0;transform:translateY(22px);
  animation:ab-word .6s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--i) * 80ms + .1s);
  transition:border-color .2s,transform .25s,box-shadow .3s}
.pj:hover{border-color:#C9D2E2;transform:translateY(-4px);box-shadow:0 24px 52px -36px rgba(19,26,36,.5)}
.pj .ph{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;background:var(--tint)}
.pj .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.pj:hover .ph img{transform:scale(1.05)}
.pj .obj{position:absolute;left:.7rem;top:.7rem;display:inline-flex;align-items:center;gap:.35rem;
  font-size:.74rem;font-weight:600;padding:.35rem .7rem;border-radius:999px;
  background:rgba(255,255,255,.92);color:var(--navy);backdrop-filter:blur(6px)}
.pj.heat .obj{color:var(--red)}
.pj .obj svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.pj .tx{display:flex;flex-direction:column;padding:1rem 1.1rem 1.15rem;flex:1}
.pj .mono{font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;color:var(--faint)}
.pj h3{margin:.35rem 0 0;font-size:1.02rem;font-weight:700;line-height:1.32;color:var(--ink)}
.pj p{margin:.4rem 0 0;font-size:.87rem;color:var(--mute);line-height:1.5}
.pj .go{display:inline-flex;align-items:center;gap:.4rem;margin-top:auto;padding-top:.8rem;
  font-size:.85rem;font-weight:600;color:var(--navy)}
.pj.heat .go{color:var(--red)}
.pj .go svg{width:14px;height:14px;transition:transform .2s}
.pj:hover .go svg{transform:translateX(4px)}

/* tək layihə */
.pj-obj{display:inline-flex;align-items:center;gap:.45rem;font-size:.82rem;font-weight:600;
  padding:.42rem .95rem;border-radius:999px;background:var(--chill);color:var(--navy)}
.pj-one.heat .pj-obj{background:var(--warm);color:var(--red)}
.pj-obj svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9}
.pj-one h1{margin:.7rem 0 .3rem;font-size:clamp(1.7rem,1.3rem + 2vw,2.6rem);font-weight:700;letter-spacing:-.025em}
.pj-meta{font-family:var(--mono);font-size:.76rem;color:var(--faint)}
.pj-shot{margin-top:-1.2rem;border-radius:22px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 30px 66px -44px rgba(19,26,36,.55);aspect-ratio:16/9;background:var(--tint)}
.pj-shot img{width:100%;height:100%;object-fit:cover}
.pj-body{padding-top:clamp(1.6rem,3.5vw,2.4rem)}

@media (max-width:1080px){ .pj-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:900px){
  .rf-hero-in{grid-template-columns:1fr} .rf-icons{grid-template-columns:repeat(8,1fr)}
  .rf-row{grid-template-columns:1fr} }
@media (max-width:620px){
  .rf-icons{grid-template-columns:repeat(4,1fr)}
  .rf-prj{grid-template-columns:1fr} .pj-grid{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){
  .rf-hero h1 span,.pj-hero h1 span,.rf-ic,.pj{opacity:1;transform:none;animation:none}
  .rf-row{opacity:1;transform:none} }

/* Scroll-canlanma yalnız JS onu "silahlandırdıqdan" sonra gizlədir —
   JS gecikərsə və ya işləməzsə məzhmun boş qalmır, dərhal görünür. */
.stats:not(.arm) .stat,
.refs:not(.arm) .ref,
.refs:not(.arm) .ref .ic,
.duo:not(.arm) .subs a i{opacity:1;transform:none}

/* ══ MOBİL və TABLET ════════════════════════════════════════════════
   Tablet (≤1080px) artıq burger menyuya keçir; aşağıdakı qaydalar həmin
   görünüşü davam etdirir — kartlar iki sütun, mətnlər kənardan nəfəs alır. */
@media (max-width:1080px){
  /* üst zolaqda yalnız dil seçimi qalır */
  .topbar .wrap{justify-content:flex-end;gap:.6rem;min-height:36px}
  .topbar a[href^="tel"],.topbar a[href^="mailto"],.topbar .adr{display:none}
  .topbar .sp{margin:0}
  /* başlıqda "Qiymət al" yığcam düymə qrupuna yer verir */
  .hd .cta{display:none}
  .hd{gap:.55rem;min-height:76px}
  header.site.stuck .hd{min-height:62px}
  .hd .sbtn,.burger{width:42px;height:42px;border-radius:12px}
  .burger{margin-left:0}
  .hd .logo{margin-right:auto}
  footer.site .top{grid-template-columns:repeat(2,1fr);gap:1.6rem 1.4rem}
  footer.site .brand{grid-column:1 / -1}
}

@media (max-width:820px){
  /* kənar boşluq — yazılar kənara yapışmasın */
  .wrap{padding-left:1.25rem;padding-right:1.25rem}
  .wrap.narrow{padding-left:1.25rem;padding-right:1.25rem}

  /* kart şəbəkələri: məhsul, bloq, xəbər, kateqoriya plitələri — ikili */
  .grid,.sec .posts,.posts,.pl-grid,.cat-tiles,.ct-cards,.nf-grid,.stats{
    grid-template-columns:repeat(2,1fr);gap:.7rem}
  .brands,.spage .brands{grid-template-columns:repeat(3,1fr)}

  /* iki sütunda oxunaqlı qalması üçün kart daxili ölçüləri kiçilir */
  .pcard .bd{padding:.5rem .7rem .8rem;gap:.35rem}
  .pcard .cap{padding:.45rem .7rem 0;font-size:.63rem}
  .pcard h3{font-size:.88rem;line-height:1.28}
  .pcard .gr{font-size:.7rem}
  .pcard .sp span{font-size:.62rem;padding:.15rem .35rem}
  .pcard .ph .badge{left:.45rem;top:.45rem;font-size:.63rem;padding:.18rem .42rem}
  .post .bd,.pl-grid .post .bd{padding:.75rem .8rem .9rem}
  .post h3{font-size:.92rem;line-height:1.3}
  .post p{font-size:.82rem}
  .stat{padding:1rem .85rem}
  .stat b{font-size:.95rem}
  .stat span{font-size:.82rem}
  .stat .ic{width:42px;height:42px}
  .stat .ic svg{width:24px;height:24px}
  .cat-tile{padding:.8rem .75rem;gap:.6rem}
  .cat-tile .nm{font-size:.85rem}
  .cat-tile .ic{width:38px;height:38px}
  .cat-tile .ic svg{width:22px;height:22px}
  .ct-card{padding:.9rem .85rem;gap:.65rem}
  .ct-card em{font-size:.88rem}
  .ct-card .ic{width:38px;height:38px}
  .ct-card .ic svg{width:20px;height:20px}

  /* alt hissə: hər sətir ayrıca və ortada */
  footer.site .bottom .wrap{flex-direction:column;align-items:center;justify-content:center;
    text-align:center;gap:.55rem;padding-top:1.1rem;padding-bottom:1.1rem}
  footer.site .bottom p{justify-content:center;width:100%;text-align:center;
    font-size:.8rem;gap:.3rem;line-height:1.5}
  footer.site .bottom p img{height:20px}
  footer.site .brand img{height:60px;margin-bottom:.9rem}
  footer.site .brand p{max-width:none}
}

@media (max-width:520px){
  .grid,.sec .posts,.posts,.pl-grid,.cat-tiles,.ct-cards,.nf-grid,.stats{gap:.6rem}
  footer.site .bottom p{font-size:.74rem}
  footer.site .bottom p img{height:18px}
  .brands,.spage .brands{grid-template-columns:repeat(2,1fr)}
  .pcard h3{font-size:.84rem}
  .hd .logo img{height:40px}
}