/* ===== WORDPRESS THEME SHIELD & RESET ===== */
header.wp-block-template-part,
footer.wp-block-template-part,
.wp-site-blocks > header,
.wp-site-blocks > footer,
.wp-block-navigation {
  display: none !important;
}

html, body {
  margin: 0 !important;
  padding: 0 !important;
  background: #070F1C !important;
  overflow-x: hidden;
}

/* ===== REVEAL & SECTION VISIBILITY GUARANTEE ===== */
.reveal {
  opacity: 1;
  transform: none;
  transition: opacity .7s cubic-bezier(.2, .8, .2, 1), transform .7s cubic-bezier(.2, .8, .2, 1);
}
.js .reveal:not(.in) {
  opacity: 0;
  transform: translateY(24px);
}
.reveal.in {
  opacity: 1 !important;
  transform: none !important;
}

/* ===== MOBILE DRAWER & DESKTOP ISOLATION ===== */
.drawer {
  position: fixed;
  inset-block-start: 0;
  height: 100dvh;
  width: min(88vw, 360px);
  z-index: 110;
  background: linear-gradient(200deg, var(--ink2), var(--ink));
  padding: 2rem 1.6rem;
  overflow-y: auto;
  transition: transform .35s cubic-bezier(.7, 0, .2, 1);
}
html[dir="rtl"] .drawer {
  right: 0 !important;
  left: auto !important;
  border-left: 1px solid var(--line);
  border-right: none;
  transform: translateX(105%);
}
html[dir="rtl"] .drawer.open {
  transform: translateX(0) !important;
}
html[dir="ltr"] .drawer {
  left: 0 !important;
  right: auto !important;
  border-right: 1px solid var(--line);
  border-left: none;
  transform: translateX(-105%);
}
html[dir="ltr"] .drawer.open {
  transform: translateX(0) !important;
}

.scrim {
  position: fixed;
  inset: 0;
  z-index: 105;
  background: rgba(3, 8, 16, .75);
  backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}
.scrim.on {
  opacity: 1;
  visibility: visible;
}

/* Strict Desktop Isolation */
@media (min-width: 1081px) {
  .drawer, .burger, .scrim {
    display: none !important;
  }
  nav.main {
    display: flex !important;
  }
}
@media (max-width: 1080px) {
  nav.main {
    display: none !important;
  }
  .burger {
    display: grid !important;
  }
}

.qt-author {
  display: flex;
  align-items: center;
  gap: .8rem;
  margin-block-start: 1rem;
}


/* ============ LOCAL TAJAWAL FONT SYSTEM (WORDPRESS HOSTED) ============ */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/tajawal-400.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFC;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/tajawal-latin-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/tajawal-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/tajawal-700.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFC;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/tajawal-latin-700.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('fonts/tajawal-800.woff2') format('woff2');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('fonts/tajawal-900.woff2') format('woff2');
}

/* ============ TOKENS ============ */
:root{
  --ink:#070F1C; --ink2:#0B1728; --ink3:#0F2138;
  --ind900:#12294D; --ind700:#1B3E74; --ind500:#2C5FA8; --ind300:#6E9BD6; --ind100:#C7DAF2;
  --ecru:#F4F0E8; --sand:#E4DACB; --paper:#FBF9F5;
  --copper:#C08A3E; --selvedge:#D0492F; --mint:#3FA796;
  --txt:#EAF0F8; --muted:#93A6BF; --line:rgba(199,218,242,.14);
  --r-s:8px; --r-m:14px; --r-l:22px; --r-xl:32px;
  --maxw:1280px;
  --ff-ar:'Tajawal',-apple-system,BlinkMacSystemFont,'Segoe UI',Tahoma,sans-serif;
  --ff-en:'Tajawal','Space Grotesk',sans-serif;
  --ff:var(--ff-ar);
  --shadow:0 30px 60px -30px rgba(0,0,0,.7);
  --twill:repeating-linear-gradient(115deg,rgba(255,255,255,.055) 0 1px,transparent 1px 3px),repeating-linear-gradient(65deg,rgba(0,0,0,.30) 0 1px,transparent 1px 4px);
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
html[lang="en"]{--ff:var(--ff-en)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body,button,input,select,textarea{
  margin:0;background:var(--ink);color:var(--txt);font-family:var(--ff) !important;
  font-size:16px;line-height:1.75;overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--selvedge);color:#fff}
:focus-visible{outline:2px solid var(--ind300);outline-offset:3px;border-radius:4px}
.wrap{width:min(100% - 2.5rem,var(--maxw));margin-inline:auto}
.skip{position:absolute;inset-block-start:-100px;inset-inline-start:1rem;z-index:999;background:var(--selvedge);color:#fff;padding:.7rem 1.2rem;border-radius:0 0 var(--r-s) var(--r-s);transition:.25s}
.skip:focus{inset-block-start:0}

/* grain overlay */
.grain{position:fixed;inset:0;z-index:9;pointer-events:none;opacity:.045;background-image:var(--noise);mix-blend-mode:overlay}

/* ============ HEADER ============ */
#prog{position:fixed;inset-block-start:0;inset-inline-start:0;height:3px;width:0;z-index:120;
  background:linear-gradient(90deg,var(--selvedge),var(--copper),var(--ind300));box-shadow:0 0 14px rgba(208,73,47,.6)}
header{position:fixed;inset-inline:0;inset-block-start:0;z-index:100;transition:.35s;
  background:linear-gradient(180deg,rgba(7,15,28,.92),rgba(7,15,28,0));backdrop-filter:blur(0px)}
header.stuck{background:rgba(7,15,28,.86);backdrop-filter:blur(16px) saturate(140%);border-block-end:1px solid var(--line)}
header.stuck::after{content:"";position:absolute;inset-block-end:-1px;inset-inline:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--selvedge) 20%,var(--selvedge) 32%,var(--ecru) 32%,var(--ecru) 40%,transparent)}
.bar{display:flex;align-items:center;gap:1.4rem;height:78px;transition:.35s}
header.stuck .bar{height:64px}
.brand{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.brand .mk{width:42px;height:42px;border-radius:10px;background:linear-gradient(150deg,var(--ind700),var(--ink3));
  display:grid;place-items:center;border:1px solid var(--line);position:relative;overflow:hidden}
.brand .mk::after{content:"";position:absolute;inset-block-end:5px;inset-inline:6px;height:2px;background:var(--selvedge);border-radius:2px}
.brand b{font-size:1.18rem;letter-spacing:.14em;line-height:1;font-weight:700}
.brand span{display:block;font-size:.56rem;letter-spacing:.34em;color:var(--muted);margin-block-start:.3rem}
nav.main{margin-inline-start:auto;display:flex;align-items:center;gap:.2rem}
html[dir="rtl"] nav.main{margin-inline-start:auto}
nav.main a{position:relative;padding:.55rem .8rem;font-size:.86rem;font-weight:500;color:#CBD8EA;border-radius:8px;transition:.2s;white-space:nowrap}
nav.main a:hover{color:#fff;background:rgba(110,155,214,.12)}
nav.main a.on{color:#fff}
nav.main a.on::before{content:"";position:absolute;inset-block-end:2px;inset-inline:50%;translate:-50% 0;width:18px;height:2px;background:var(--selvedge);border-radius:2px}
.tools{display:flex;align-items:center;gap:.55rem}
.lang{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:rgba(255,255,255,.04)}
.lang button{background:0;border:0;padding:.34rem .7rem;font-size:.72rem;font-weight:600;letter-spacing:.06em;color:var(--muted);cursor:pointer;transition:.2s}
.lang button.on{background:var(--ecru);color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:.55rem;border:0;cursor:pointer;border-radius:999px;padding:.72rem 1.4rem;
  font-weight:600;font-size:.85rem;letter-spacing:.02em;transition:.28s;position:relative;overflow:hidden;white-space:nowrap}
.btn.p{background:linear-gradient(120deg,var(--ind500),var(--ind700));color:#fff;box-shadow:0 10px 30px -12px rgba(44,95,168,.9)}
.btn.p:hover{translate:0 -2px;box-shadow:0 18px 40px -14px rgba(44,95,168,1)}
.btn.g{background:transparent;color:#fff;border:1px solid var(--line)}
.btn.g:hover{border-color:var(--ind300);background:rgba(110,155,214,.1)}
.btn.s{background:var(--selvedge);color:#fff}
.btn.s:hover{filter:brightness(1.1);translate:0 -2px}
.btn.ec{background:var(--ecru);color:var(--ink)}
.btn.ec:hover{translate:0 -2px;box-shadow:0 14px 30px -14px rgba(244,240,232,.55)}
.burger{display:none;width:44px;height:40px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.04);cursor:pointer;place-items:center}
.burger i{display:block;width:18px;height:2px;background:#fff;border-radius:2px;transition:.3s}
.burger i+i{margin-block-start:4px}
.burger.x i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.x i:nth-child(2){opacity:0}
.burger.x i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset-block-start:0;inset-inline-end:0;height:100dvh;width:min(88vw,360px);z-index:110;
  background:linear-gradient(200deg,var(--ink2),var(--ink));border-inline-start:1px solid var(--line);
  padding:6rem 1.6rem 2rem;translate:105% 0;transition:translate .45s cubic-bezier(.7,0,.2,1);overflow-y:auto}
html[dir="ltr"] .drawer{translate:-105% 0;inset-inline-end:auto;inset-inline-start:0;border-inline-start:0;border-inline-end:1px solid var(--line)}
.drawer.open{translate:0 0}
.drawer a{display:block;padding:.85rem .2rem;border-block-end:1px solid var(--line);font-weight:500}
.drawer a:hover{color:var(--ind300);padding-inline-start:.7rem}
.scrim{position:fixed;inset:0;z-index:105;background:rgba(3,8,16,.7);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.35s}
.scrim.on{opacity:1;visibility:visible}

/* ============ HERO ============ */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding-block:8rem 4rem;overflow:hidden;isolation:isolate}
.hero .bg{position:absolute;inset:0;z-index:-2;background:
  radial-gradient(120% 90% at 80% 0%,rgba(44,95,168,.42),transparent 60%),
  radial-gradient(90% 70% at 10% 100%,rgba(208,73,47,.16),transparent 60%),
  linear-gradient(180deg,#0A1A31,#070F1C 70%)}
.hero .bg::before{content:"";position:absolute;inset:0;background-image:var(--twill);opacity:.5}
.hero .bg::after{content:"";position:absolute;inset:0;background-image:var(--noise);opacity:.07}
.warp{position:absolute;inset:0;z-index:-1;overflow:hidden;opacity:.5}
.warp i{position:absolute;inset-block-start:-10%;height:120%;width:1px;background:linear-gradient(180deg,transparent,rgba(199,218,242,.5),transparent);animation:warp 7s linear infinite}
@keyframes warp{0%{opacity:0;transform:translateY(-14%)}20%{opacity:1}100%{opacity:0;transform:translateY(14%)}}
.selv{position:absolute;z-index:-1;width:2px;background:repeating-linear-gradient(180deg,var(--selvedge) 0 14px,#F4F0E8 14px 20px);opacity:.75;inset-block:8%}
.selv.a{inset-inline-start:6%;animation:float 9s ease-in-out infinite}
.selv.b{inset-inline-end:9%;animation:float 11s ease-in-out infinite reverse}
@keyframes float{50%{transform:translateY(-26px)}}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ind100);
  border:1px solid var(--line);border-radius:999px;padding:.4rem .95rem;background:rgba(110,155,214,.08);margin-block-end:1.4rem}
.eyebrow b{width:7px;height:7px;border-radius:50%;background:var(--selvedge);box-shadow:0 0 0 4px rgba(208,73,47,.2);animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 9px rgba(208,73,47,0)}}
h1{font-size:clamp(2.5rem,6.4vw,5.2rem);line-height:1.06;margin:0 0 1.3rem;font-weight:700;letter-spacing:-.02em}
h1 .ln{display:block;overflow:hidden}
h1 .ln>span{display:block;transform:translateY(110%);animation:rise .95s cubic-bezier(.2,.9,.25,1) forwards}
h1 .ln:nth-child(2)>span{animation-delay:.14s}
h1 .ln:nth-child(3)>span{animation-delay:.28s}
@keyframes rise{to{transform:none}}
.h1 em{font-style:normal;color:var(--ind300);position:relative}
.h1 em::after{content:"";position:absolute;inset-inline:0;inset-block-end:.08em;height:.08em;background:var(--selvedge);border-radius:2px}
.lead{font-size:clamp(1rem,1.35vw,1.12rem);color:#B9C8DC;max-width:56ch;margin:0 0 2rem}
.cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-block-end:2.6rem}
.stats{display:grid;grid-template-columns:repeat(4,auto);gap:1.6rem;border-block-start:1px solid var(--line);padding-block-start:1.5rem;justify-content:start}
.stat b{display:block;font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:700;color:#fff;line-height:1;font-family:var(--ff-en)}
.stat span{font-size:.7rem;letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
/* hero visual — stacked fabric layers */
.stack{position:relative;aspect-ratio:4/5;max-height:74vh;margin-inline:auto;width:100%}
.layer{position:absolute;inset:0;border-radius:var(--r-l);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.layer::after{content:"";position:absolute;inset:0;background-image:var(--noise);opacity:.16;mix-blend-mode:overlay}
.layer::before{content:"";position:absolute;inset:0;background-image:var(--twill)}
.l1{background:linear-gradient(140deg,#1B3E74,#0C1A2E);inset:6% 14% 22% 4%;rotate:-5deg;animation:sway 12s ease-in-out infinite}
.l2{background:linear-gradient(140deg,#2C5FA8,#12294D);inset:16% 4% 12% 16%;rotate:4deg;animation:sway 14s ease-in-out infinite reverse}
.l3{background:linear-gradient(150deg,#4E7FBF,#1B3E74);inset:30% 20% 4% 20%;rotate:-1.5deg;animation:sway 16s ease-in-out infinite}
@keyframes sway{50%{transform:translateY(-14px) rotate(1deg)}}
.stack .tagx{position:absolute;z-index:5;background:rgba(7,15,28,.8);backdrop-filter:blur(8px);border:1px solid var(--line);
  border-radius:12px;padding:.6rem .9rem;font-size:.7rem;letter-spacing:.08em;color:var(--ind100)}
.tagx.t1{inset-block-start:4%;inset-inline-end:2%}
.tagx.t2{inset-block-end:16%;inset-inline-start:-4%}
.tagx b{display:block;color:#fff;font-size:.95rem;font-family:var(--ff-en)}
.scrollcue{position:absolute;inset-block-end:1.6rem;inset-inline-start:50%;translate:-50% 0;font-size:.62rem;letter-spacing:.3em;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:.6rem}
.scrollcue i{width:1px;height:44px;background:linear-gradient(180deg,var(--selvedge),transparent);animation:cue 2.2s ease-in-out infinite}
@keyframes cue{50%{transform:scaleY(.4);opacity:.4}}

/* ============ MARQUEE ============ */
.mq{border-block:1px solid var(--line);background:linear-gradient(90deg,#0A1728,#0D2038,#0A1728);padding:.95rem 0;overflow:hidden;position:relative}
.mq::before,.mq::after{content:"";position:absolute;inset-block:0;width:90px;z-index:2;pointer-events:none}
.mq::before{inset-inline-start:0;background:linear-gradient(90deg,#0A1728,transparent)}
.mq::after{inset-inline-end:0;background:linear-gradient(270deg,#0A1728,transparent)}
.mq .track{display:flex;gap:2.6rem;width:max-content;animation:slide 34s linear infinite}
.mq span{display:inline-flex;align-items:center;gap:.7rem;font-size:.76rem;letter-spacing:.22em;color:#9FB6D2;text-transform:uppercase;font-weight:600}
.mq span::before{content:"";width:6px;height:6px;background:var(--copper);rotate:45deg}
@keyframes slide{to{transform:translateX(-50%)}}
html[dir="rtl"] .mq .track{animation-name:slideR}
@keyframes slideR{to{transform:translateX(50%)}}

/* ============ SECTION SHELL ============ */
section{position:relative;padding-block:clamp(4.5rem,8vw,8rem)}
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-block-end:3rem;flex-wrap:wrap}
.snum{font-family:var(--ff-en);font-size:.72rem;letter-spacing:.3em;color:var(--selvedge);font-weight:700;display:block;margin-block-end:.7rem}
h2{font-size:clamp(1.85rem,3.6vw,3rem);line-height:1.18;margin:0;font-weight:700;letter-spacing:-.01em}
h3{font-size:1.12rem;margin:0 0 .5rem;font-weight:600;letter-spacing:-.01em}
.sub{color:var(--muted);max-width:60ch;margin:.9rem 0 0;font-size:.98rem}
.hr{height:1px;background:linear-gradient(90deg,var(--selvedge),var(--line) 40%,transparent);margin-block-start:1.4rem}
.light{background:linear-gradient(180deg,var(--paper),#EFEAE0);color:#0C1A2E}
.light h2,.light h3{color:#0A1526}
.light .sub,.light p{color:#4A5A70}
.light .snum{color:var(--selvedge)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ============ ABOUT ============ */
.grid2{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,4vw,4rem);align-items:center}
.pillbox{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-block-start:1.8rem}
.pill{border:1px solid var(--line);border-radius:var(--r-m);padding:1.2rem;background:rgba(255,255,255,.03);transition:.3s}
.pill:hover{border-color:rgba(110,155,214,.4);background:rgba(110,155,214,.07);translate:0 -4px}
.pill .ic{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(140deg,var(--ind500),var(--ind900));margin-block-end:.8rem}
.pill p{margin:0;font-size:.86rem;color:var(--muted)}
.mill{border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;background:linear-gradient(160deg,#0C1B30,#08111F);position:relative;box-shadow:var(--shadow)}
.mill::after{content:"";position:absolute;inset:0;background-image:var(--noise);opacity:.08;pointer-events:none}
.mill svg{width:100%;height:auto;display:block}
.mill .cap{position:absolute;inset-block-end:0;inset-inline:0;padding:1.1rem 1.3rem;background:linear-gradient(0deg,rgba(7,15,28,.94),transparent);font-size:.76rem;letter-spacing:.14em;color:var(--ind100);text-transform:uppercase}
.tline{margin-block-start:3rem;border-block-start:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.tline .ev{padding-block-start:1.3rem;position:relative}
.tline .ev::before{content:"";position:absolute;inset-block-start:-5px;inset-inline-start:0;width:9px;height:9px;border-radius:50%;background:var(--selvedge);box-shadow:0 0 0 4px rgba(208,73,47,.18)}
.tline b{font-family:var(--ff-en);font-size:1.3rem;color:#fff;display:block;line-height:1}
.tline p{margin:.5rem 0 0;font-size:.84rem;color:var(--muted)}

/* ============ PROCESS ============ */
.proc{display:grid;grid-template-columns:.9fr 1.1fr;gap:2.4rem;align-items:start}
.steps{display:flex;flex-direction:column;gap:.55rem}
.step{display:flex;gap:1rem;align-items:center;text-align:start;background:rgba(255,255,255,.03);border:1px solid var(--line);
  border-radius:var(--r-m);padding:.95rem 1.1rem;cursor:pointer;transition:.3s;width:100%}
.step:hover{background:rgba(110,155,214,.09);translate:4px 0}
html[dir="rtl"] .step:hover{translate:-4px 0}
.step[aria-selected="true"]{background:linear-gradient(100deg,rgba(44,95,168,.28),rgba(44,95,168,.06));border-color:rgba(110,155,214,.5)}
.step .no{font-family:var(--ff-en);font-size:.78rem;font-weight:700;color:var(--ind300);width:26px;flex-shrink:0}
.step .t{font-weight:600;font-size:.95rem}
.step .d{font-size:.76rem;color:var(--muted)}
.panel{border:1px solid var(--line);border-radius:var(--r-l);background:linear-gradient(160deg,rgba(18,41,77,.5),rgba(8,17,31,.6));
  padding:clamp(1.5rem,3vw,2.4rem);position:relative;overflow:hidden;min-height:340px}
.panel::before{content:"";position:absolute;inset:0;background-image:var(--twill);opacity:.35;pointer-events:none}
.panel>*{position:relative;z-index:2}
.panel .art{width:100%;height:170px;border-radius:var(--r-m);margin-block-end:1.4rem;display:grid;place-items:center;
  background:radial-gradient(70% 100% at 50% 0%,rgba(110,155,214,.24),transparent),rgba(7,15,28,.5);border:1px solid var(--line)}
.panel ul{margin:.9rem 0 0;padding-inline-start:1.1rem;color:var(--muted);font-size:.9rem}
.panel ul li{margin-block-end:.35rem}
.fade{animation:fade .5s ease}
@keyframes fade{from{opacity:0;transform:translateY(10px)}}

/* ============ FABRIC FINDER ============ */
.ff{border:1px solid var(--line);border-radius:var(--r-xl);background:rgba(255,255,255,.025);padding:clamp(1.1rem,2.4vw,1.8rem);margin-block-end:2.2rem}
.tabs{display:flex;gap:.45rem;flex-wrap:wrap;margin-block-end:1.3rem}
.tab{border:1px solid var(--line);background:transparent;border-radius:999px;padding:.5rem 1.05rem;font-size:.82rem;font-weight:600;color:var(--muted);cursor:pointer;transition:.25s}
.tab:hover{color:#fff;border-color:rgba(110,155,214,.5)}
.tab.on{background:var(--ecru);color:var(--ink);border-color:var(--ecru)}
.filters{display:grid;grid-template-columns:1.4fr repeat(3,1fr) auto;gap:.8rem;align-items:end}
.fld{display:flex;flex-direction:column;gap:.4rem}
.fld label{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
.fld input,.fld select{background:rgba(7,15,28,.65);border:1px solid var(--line);border-radius:10px;padding:.72rem .85rem;font-size:.88rem;transition:.25s;width:100%}
.fld input:focus,.fld select:focus{border-color:var(--ind300);box-shadow:0 0 0 3px rgba(110,155,214,.16);outline:0}
.fld select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236E9BD6' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left .9rem center;background-size:11px}
html[dir="ltr"] .fld select{background-position:right .9rem center}
.resbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-block:1.6rem;flex-wrap:wrap}
.resbar p{margin:0;font-size:.84rem;color:var(--muted)}
.resbar b{color:#fff;font-family:var(--ff-en)}
.grid-f{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:1.1rem}
.card{border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.012));
  transition:.35s cubic-bezier(.2,.8,.2,1);position:relative}
.card:hover{translate:0 -7px;border-color:rgba(110,155,214,.42);box-shadow:0 26px 50px -26px rgba(0,0,0,.85)}
.swatch{height:175px;position:relative;overflow:hidden;background:var(--sw,#1B3E74)}
.swatch .fab-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.8,.2,1);z-index:1}
.card:hover .swatch .fab-img{transform:scale(1.08)}
.swatch .sw-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,15,28,.1) 0%,rgba(7,15,28,.65) 100%);z-index:2;pointer-events:none}
.swatch::before{content:"";position:absolute;inset:0;background-image:var(--twill);opacity:var(--op,.35);z-index:2;pointer-events:none}
.swatch::after{content:"";position:absolute;inset:0;background-image:var(--noise);opacity:.12;mix-blend-mode:overlay;z-index:2;pointer-events:none}
.swatch .sl{position:absolute;inset-block-end:14px;inset-inline-start:-8px;width:calc(100% + 16px);height:3px;
  background:repeating-linear-gradient(90deg,var(--selvedge) 0 10px,#F4F0E8 10px 14px);opacity:.9;z-index:3}
.swatch .code{position:absolute;inset-block-start:.75rem;inset-inline-start:.85rem;z-index:4;font-family:var(--ff-en);font-size:.7rem;letter-spacing:.14em;
  background:rgba(7,15,28,.85);border:1px solid var(--line);border-radius:6px;padding:.2rem .5rem;color:var(--ind100);backdrop-filter:blur(4px)}
.swatch .oz{position:absolute;inset-block-start:.75rem;inset-inline-end:.85rem;z-index:4;font-family:var(--ff-en);font-weight:700;font-size:.95rem;color:#fff;
  background:rgba(18,52,102,.8);border:1px solid rgba(110,155,214,.35);border-radius:6px;padding:.2rem .5rem;backdrop-filter:blur(4px);text-shadow:0 2px 10px rgba(0,0,0,.6)}
.card .body{padding:1rem 1.1rem 1.2rem}
.card .body h3{font-size:1rem;margin-block-end:.55rem}
.chips{display:flex;gap:.35rem;flex-wrap:wrap;margin-block-end:.85rem}
.chip{font-size:.65rem;letter-spacing:.08em;padding:.2rem .55rem;border-radius:999px;background:rgba(110,155,214,.14);color:var(--ind100);border:1px solid rgba(110,155,214,.24)}
.chip.st{background:rgba(208,73,47,.14);color:#F0A795;border-color:rgba(208,73,47,.3)}
.spec{display:flex;justify-content:space-between;gap:.6rem;font-size:.76rem;padding-block:.35rem;border-block-start:1px dashed var(--line);color:var(--muted)}
.spec b{color:#DCE7F5;font-weight:500;text-align:end}
.card .act{display:flex;gap:.5rem;margin-block-start:1rem}
.card .act button{flex:1;justify-content:center;font-size:.76rem;padding:.6rem .5rem}
.empty{grid-column:1/-1;text-align:center;padding:3.4rem 1rem;border:1px dashed var(--line);border-radius:var(--r-m);color:var(--muted)}

/* ============ SERVICES BENTO ============ */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
.bx{border-radius:var(--r-l);padding:clamp(1.3rem,2.4vw,1.9rem);border:1px solid rgba(12,26,46,.12);background:#fff;
  transition:.35s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;grid-column:span 2}
.bx:hover{translate:0 -6px;box-shadow:0 28px 48px -28px rgba(10,21,38,.4);border-color:rgba(44,95,168,.4)}
.bx.big{grid-column:span 3;background:linear-gradient(150deg,var(--ind900),var(--ink2));color:#fff;border-color:transparent}
.bx.big h3,.bx.big p{color:#fff}
.bx.big p{color:#B9C8DC}
.bx.wide{grid-column:span 6;display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center;
  background:linear-gradient(120deg,#12294D,#1B3E74 60%,#2C5FA8);color:#fff;border-color:transparent}
.bx.wide h3,.bx.wide p{color:#fff}
.bx.wide p{color:#D5E2F2}
.bx .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;margin-block-end:1rem;
  background:linear-gradient(140deg,rgba(44,95,168,.14),rgba(208,73,47,.1));border:1px solid rgba(44,95,168,.2)}
.bx.big .ic,.bx.wide .ic{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2)}
.bx p{margin:0;font-size:.88rem;color:#4A5A70}
.bx ul{margin:.9rem 0 0;padding-inline-start:1.1rem;font-size:.84rem;color:#4A5A70}
.bx.big ul,.bx.wide ul{color:#C3D3E8}
.bx .num{position:absolute;inset-block-start:.9rem;inset-inline-end:1.1rem;font-family:var(--ff-en);font-size:2.6rem;font-weight:700;opacity:.08;line-height:1}

/* ============ SUSTAIN ============ */
.sus{background:linear-gradient(180deg,#07111F,#08201F 55%,#07111F)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-block-end:2.6rem}
.kpi{border:1px solid rgba(63,167,150,.25);border-radius:var(--r-m);padding:1.4rem;background:rgba(63,167,150,.06);position:relative;overflow:hidden}
.kpi::before{content:"";position:absolute;inset-block-start:0;inset-inline:0;height:2px;background:linear-gradient(90deg,var(--mint),transparent)}
.kpi b{font-family:var(--ff-en);font-size:clamp(1.7rem,3vw,2.4rem);display:block;line-height:1;color:#fff;font-weight:700}
.kpi span{font-size:.78rem;color:#9FC6BE;display:block;margin-block-start:.5rem}
.bars{display:flex;flex-direction:column;gap:1.15rem}
.bar-l{font-size:.82rem;color:#B9C8DC;display:flex;justify-content:space-between;margin-block-end:.45rem}
.bar-l b{font-family:var(--ff-en);color:#fff}
.track2{height:7px;border-radius:99px;background:rgba(255,255,255,.09);overflow:hidden}
.track2 i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--mint),var(--ind300));transition:width 1.6s cubic-bezier(.2,.8,.2,1)}
.certs{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:.85rem;margin-block-start:2.6rem}
.cert{border:1px solid var(--line);border-radius:var(--r-m);padding:1.15rem .9rem;text-align:center;background:rgba(255,255,255,.03);transition:.3s}
.cert:hover{border-color:var(--mint);background:rgba(63,167,150,.09);translate:0 -4px}
.cert .bd{width:44px;height:44px;margin:0 auto .7rem;border-radius:50%;display:grid;place-items:center;
  border:2px dashed rgba(63,167,150,.55);color:var(--mint);font-family:var(--ff-en);font-size:.62rem;font-weight:700;letter-spacing:.02em}
.cert b{display:block;font-size:.84rem;font-family:var(--ff-en);letter-spacing:.04em}
.cert span{font-size:.7rem;color:var(--muted)}
.pil{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-block-start:2.4rem}
.pil .p{border-inline-start:2px solid var(--mint);padding-inline-start:1rem}
.pil h3{font-size:.98rem;color:#fff}
.pil p{margin:0;font-size:.84rem;color:var(--muted)}

/* ============ TEAM ============ */
.teamg{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.tm{border:1px solid var(--line);border-radius:var(--r-m);padding:1.5rem 1.2rem;background:rgba(255,255,255,.03);transition:.35s;text-align:center}
.tm:hover{translate:0 -6px;border-color:rgba(110,155,214,.45);background:rgba(110,155,214,.07)}
.av{width:74px;height:74px;margin:0 auto 1rem;border-radius:50%;display:grid;place-items:center;font-family:var(--ff-en);font-weight:700;font-size:1.15rem;color:#fff;
  background:linear-gradient(150deg,var(--ind500),var(--ind900));border:1px solid var(--line);position:relative}
.av::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px dashed rgba(208,73,47,.45)}
.tm p{margin:0;font-size:.82rem;color:var(--muted)}
.tm b{font-size:.98rem}

/* ============ GLOBE ============ */
.globewrap{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.globe{max-width:430px;margin-inline:auto;width:100%}
.globe .spin{animation:rot 46s linear infinite;transform-origin:160px 160px}
@keyframes rot{to{transform:rotate(360deg)}}
.globe .dash{stroke-dasharray:6 8;animation:dash 3.4s linear infinite}
@keyframes dash{to{stroke-dashoffset:-56}}
.globe .dot{animation:blip 2.6s ease-in-out infinite}
@keyframes blip{50%{r:6;opacity:.35}}
.mkts{display:flex;flex-direction:column;gap:.7rem;margin-block-start:1.6rem}
.mkt{display:flex;align-items:center;gap:.9rem;border:1px solid var(--line);border-radius:12px;padding:.75rem 1rem;background:rgba(255,255,255,.03);transition:.3s}
.mkt:hover{border-color:rgba(110,155,214,.45);translate:4px 0}
html[dir="rtl"] .mkt:hover{translate:-4px 0}
.mkt i{width:8px;height:8px;border-radius:50%;background:var(--copper);flex-shrink:0;box-shadow:0 0 0 4px rgba(192,138,62,.16)}
.mkt b{font-size:.9rem;font-weight:600}
.mkt span{margin-inline-start:auto;font-family:var(--ff-en);font-size:.78rem;color:var(--muted)}

/* ============ QUOTES / NEWS ============ */
.qg{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.qt{border:1px solid var(--line);border-radius:var(--r-l);padding:1.7rem;background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.01));transition:.35s}
.qt:hover{translate:0 -6px;border-color:rgba(110,155,214,.4)}
.qt .qm{font-family:var(--ff-en);font-size:3rem;line-height:.6;color:var(--selvedge);opacity:.55}
.qt p{font-size:.92rem;color:#CBD8EA}
.qt footer{display:flex;align-items:center;gap:.7rem;margin-block-start:1.1rem;border-block-start:1px solid var(--line);padding-block-start:1rem}
.qt footer b{font-size:.84rem}
.qt footer span{font-size:.72rem;color:var(--muted);display:block}
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.nw{border-radius:var(--r-l);overflow:hidden;border:1px solid rgba(12,26,46,.12);background:#fff;transition:.35s}
.nw:hover{translate:0 -7px;box-shadow:0 30px 50px -30px rgba(10,21,38,.4)}
.nw .th{height:170px;position:relative;overflow:hidden;background:var(--nth,#1B3E74)}
.nw .th .nw-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.8,.2,1);z-index:1}
.nw:hover .th .nw-img{transform:scale(1.08)}
.nw .th .th-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,21,38,.08) 0%,rgba(10,21,38,.65) 100%);z-index:2;pointer-events:none}
.nw .th::before{content:"";position:absolute;inset:0;background-image:var(--twill);opacity:.35;z-index:2;pointer-events:none}
.nw .th::after{content:"";position:absolute;inset:0;background-image:var(--noise);opacity:.12;mix-blend-mode:overlay;z-index:2;pointer-events:none}
.nw .th .cat{position:absolute;inset-block-end:.8rem;inset-inline-start:.9rem;z-index:4;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  background:var(--ecru);color:var(--ink);border-radius:999px;padding:.25rem .7rem;font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.nw .bd{padding:1.2rem 1.3rem 1.5rem}
.nw time{font-size:.72rem;color:#7A8AA0;font-family:var(--ff-en);letter-spacing:.06em}
.nw h3{font-size:1.02rem;margin:.4rem 0 .5rem;color:#0A1526;line-height:1.45}
.nw p{margin:0;font-size:.85rem;color:#4A5A70}
.nw a{display:inline-flex;align-items:center;gap:.4rem;margin-block-start:.9rem;font-size:.8rem;font-weight:700;color:var(--ind500)}
.nw a:hover{gap:.7rem}

/* ============ FAQ ============ */
.faq{max-width:900px;margin-inline:auto}
details{border:1px solid var(--line);border-radius:var(--r-m);background:rgba(255,255,255,.03);margin-block-end:.7rem;overflow:hidden;transition:.3s}
details[open]{border-color:rgba(110,155,214,.42);background:rgba(110,155,214,.06)}
summary{list-style:none;cursor:pointer;padding:1.1rem 1.3rem;font-weight:600;font-size:.95rem;display:flex;align-items:center;gap:1rem}
summary::-webkit-details-marker{display:none}
summary .pl{margin-inline-start:auto;width:22px;height:22px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;flex-shrink:0;transition:.3s}
details[open] summary .pl{rotate:135deg;background:var(--selvedge);border-color:var(--selvedge)}
summary .pl::before{content:"+";font-size:.9rem;line-height:1;color:var(--ind100)}
details .ans{padding:0 1.3rem 1.2rem;color:var(--muted);font-size:.9rem;margin-inline-end:2.4rem}

/* ============ CONTACT ============ */
.contact{background:linear-gradient(180deg,#070F1C,#0A1A31)}
.cgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:2.4rem;align-items:start}
.cinfo{display:flex;flex-direction:column;gap:.9rem}
.citem{display:flex;gap:1rem;border:1px solid var(--line);border-radius:var(--r-m);padding:1.15rem;background:rgba(255,255,255,.03);transition:.3s}
.citem:hover{border-color:rgba(110,155,214,.45);translate:4px 0;background:rgba(110,155,214,.06)}
html[dir="rtl"] .citem:hover{translate:-4px 0}
.citem .ic{width:42px;height:42px;border-radius:11px;flex-shrink:0;display:grid;place-items:center;background:linear-gradient(140deg,var(--ind500),var(--ind900))}
.citem b{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ind100);margin-block-end:.3rem}
.citem p,.citem a{margin:0;font-size:.9rem;color:#D6E2F1}
.citem a:hover{color:var(--selvedge)}
form.cf{border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(1.3rem,2.6vw,2rem);background:linear-gradient(160deg,rgba(18,41,77,.42),rgba(8,17,31,.55));position:relative;overflow:hidden}
form.cf::before{content:"";position:absolute;inset:0;background-image:var(--twill);opacity:.3;pointer-events:none}
form.cf>*{position:relative;z-index:2}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.hp{position:absolute;inset-inline-start:-9999px;width:1px;height:1px;opacity:0;overflow:hidden}
.fld2{display:flex;flex-direction:column;gap:.4rem;margin-block-end:.9rem}
.fld2 label{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.fld2 label .req{color:var(--selvedge)}
.fld2 input,.fld2 select,.fld2 textarea{background:rgba(7,15,28,.7);border:1px solid var(--line);border-radius:10px;padding:.78rem .9rem;font-size:.9rem;width:100%;transition:.25s}
.fld2 textarea{min-height:118px;resize:vertical}
.fld2 input:focus,.fld2 select:focus,.fld2 textarea:focus{border-color:var(--ind300);box-shadow:0 0 0 3px rgba(110,155,214,.16);outline:0}
.fld2.bad input,.fld2.bad select,.fld2.bad textarea{border-color:#E4694F;box-shadow:0 0 0 3px rgba(228,105,79,.14)}
.err{font-size:.72rem;color:#F0917C;min-height:0;display:none}
.fld2.bad .err{display:block}
.consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.78rem;color:var(--muted);margin-block-end:1.1rem}
.consent input{margin-block-start:.3rem;accent-color:var(--selvedge)}
.fnote{font-size:.72rem;color:var(--muted);margin-block-start:.9rem;display:flex;align-items:center;gap:.45rem}
.done{display:none;text-align:center;padding:2.4rem 1rem}
.done.on{display:block;animation:fade .5s}
.done .ck{width:64px;height:64px;margin:0 auto 1.1rem;border-radius:50%;display:grid;place-items:center;background:rgba(63,167,150,.16);border:1px solid rgba(63,167,150,.5)}

/* ============ FOOTER ============ */
footer.ft{background:#050B15;border-block-start:1px solid var(--line);padding-block:3.6rem 1.4rem;position:relative}
footer.ft::before{content:"";position:absolute;inset-block-start:-1px;inset-inline:0;height:3px;
  background:repeating-linear-gradient(90deg,var(--selvedge) 0 26px,#F4F0E8 26px 34px,var(--ind500) 34px 60px,#F4F0E8 60px 68px)}
.fgrid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:2rem;margin-block-end:2.6rem}
.fcol h4{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ind100);margin:0 0 1.1rem}
.fcol a{display:block;font-size:.86rem;color:var(--muted);padding-block:.32rem;transition:.22s}
.fcol a:hover{color:#fff;padding-inline-start:.4rem}
.nl{display:flex;gap:.5rem;margin-block-start:1rem}
.nl input{flex:1;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:999px;padding:.7rem 1rem;font-size:.85rem}
.nl input:focus{outline:0;border-color:var(--ind300)}
.soc{display:flex;gap:.5rem;margin-block-start:1.2rem}
.soc a{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);display:grid;place-items:center;color:var(--muted);transition:.28s}
.soc a:hover{background:var(--ecru);color:var(--ink);border-color:var(--ecru);translate:0 -3px}
.fbot{border-block-start:1px solid var(--line);padding-block-start:1.3rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.78rem;color:var(--muted)}
.fbot nav{display:flex;gap:1.2rem;flex-wrap:wrap}
.fbot a:hover{color:#fff}

/* ============ FLOATERS / MODAL ============ */
.floats{position:fixed;inset-block-end:1.4rem;inset-inline-end:1.4rem;z-index:90;display:flex;flex-direction:column;gap:.6rem;align-items:flex-end}
.wa{width:54px;height:54px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 14px 34px -12px rgba(37,211,102,.8);transition:.3s}
.wa:hover{transform:scale(1.08)}
.totop{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:rgba(7,15,28,.85);backdrop-filter:blur(8px);
  display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transition:.3s;color:#fff}
.totop.on{opacity:1;visibility:visible}
.totop:hover{background:var(--selvedge);border-color:var(--selvedge)}
.modal{position:fixed;inset:0;z-index:130;display:grid;place-items:center;padding:1.2rem;opacity:0;visibility:hidden;transition:.3s}
.modal.on{opacity:1;visibility:visible}
.modal .bd2{width:min(560px,100%);max-height:86dvh;overflow-y:auto;background:linear-gradient(165deg,#0D1E36,#070F1C);border:1px solid var(--line);
  border-radius:var(--r-xl);padding:1.8rem;transform:translateY(20px) scale(.97);transition:.35s cubic-bezier(.2,.8,.2,1);box-shadow:var(--shadow)}
.modal.on .bd2{transform:none}
.modal .bd2::before{content:"";display:block;height:3px;border-radius:3px;margin:-1.8rem -1.8rem 1.6rem;
  background:repeating-linear-gradient(90deg,var(--selvedge) 0 18px,#F4F0E8 18px 24px)}
.modal .x{position:absolute;inset-block-start:1rem;inset-inline-end:1rem;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05);cursor:pointer;color:#fff}
.modal .pos{position:relative}
.toast{position:fixed;inset-block-end:1.4rem;inset-inline-start:1.4rem;z-index:140;background:#0D1E36;border:1px solid rgba(63,167,150,.5);
  border-radius:12px;padding:.9rem 1.2rem;font-size:.86rem;display:flex;gap:.6rem;align-items:center;transform:translateY(140%);transition:.45s cubic-bezier(.2,.8,.2,1)}
.toast.on{transform:none}

/* ============ RESPONSIVE ============ */
@media(max-width:1080px){
  nav.main{display:none}.burger{display:grid}
  .hero .wrap,.grid2,.proc,.globewrap,.cgrid{grid-template-columns:1fr}
  .stack{max-height:none;aspect-ratio:5/4;margin-block-start:1rem}
  .bento{grid-template-columns:repeat(4,1fr)}.bx{grid-column:span 2}.bx.big{grid-column:span 4}.bx.wide{grid-column:span 4;grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}.teamg,.qg,.news{grid-template-columns:repeat(2,1fr)}
  .filters{grid-template-columns:1fr 1fr}
  .tline{grid-template-columns:1fr 1fr}
  .fgrid{grid-template-columns:1fr 1fr}
  .btn.hideSm{display:none}
}
@media(max-width:680px){
  .stats{grid-template-columns:1fr 1fr;gap:1rem}
  .bento{grid-template-columns:1fr}.bx,.bx.big,.bx.wide{grid-column:span 1}
  .teamg,.qg,.news,.pil,.fgrid,.frow,.pillbox{grid-template-columns:1fr}
  .filters{grid-template-columns:1fr}
  .tline{grid-template-columns:1fr}
  .selv{display:none}
  .hero{padding-block-start:7rem}
  .cta .btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  h1 .ln>span{transform:none}
}
@media print{header,.floats,.mq,.grain{display:none}body{background:#fff;color:#000}}

/* KB Denim image enhancements */
.stack .layer { background-size:cover; background-position:center; }
.stack .l1 { background-image:linear-gradient(135deg,rgba(7,15,28,.28),rgba(18,41,77,.72)),url("https://images.unsplash.com/photo-1542272604-787c3835535d?auto=format&fit=crop&w=1000&q=82"); }
.stack .l2 { background-image:linear-gradient(135deg,rgba(7,15,28,.25),rgba(18,41,77,.62)),url("https://images.unsplash.com/photo-1551488831-00ddcb6c6bd3?auto=format&fit=crop&w=1000&q=82"); }
.stack .l3 { background-image:linear-gradient(135deg,rgba(7,15,28,.15),rgba(18,41,77,.5)),url("https://images.unsplash.com/photo-1598554747436-c9293d6a588f?auto=format&fit=crop&w=1000&q=82"); }
.mill { background-image:linear-gradient(180deg,rgba(7,15,28,.18),rgba(7,15,28,.72)),url("https://images.unsplash.com/photo-1567789884554-0b844b597180?auto=format&fit=crop&w=1200&q=82"); background-size:cover;background-position:center; }
@media (prefers-reduced-motion: reduce) { .stack .layer { animation:none!important; } }

/* Additional WordPress content pages */
.kbdenim-content-page { background:var(--ink); color:var(--txt); min-height:60vh; }
.kbdenim-content-page .kbdenim-page-hero { padding:10rem 0 5rem; background:radial-gradient(70% 100% at 80% 0%,rgba(44,95,168,.38),transparent 65%),linear-gradient(180deg,#0A1A31,#070F1C); }
.kbdenim-content-page .kbdenim-page-hero .wrap { max-width:var(--maxw); margin-inline:auto; }
.kbdenim-content-page .kbdenim-page-hero h1 { margin:1rem 0; }
.kbdenim-content-page .kbdenim-page-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.1rem; }
.kbdenim-content-page .kbdenim-page-card { padding:1.5rem; border:1px solid var(--line); border-radius:var(--r-l); background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.015)); }
.kbdenim-content-page .kbdenim-page-card p { color:var(--muted); margin-bottom:0; }
body.kbdenim-wp-page { background:var(--ink); color:var(--txt); }
body.kbdenim-wp-page #page, body.kbdenim-wp-page .site, body.kbdenim-wp-page main { max-width:none; }
.kbdenim-site { color:var(--txt); background:var(--ink); }
.kbdenim-site .hero .stack .layer { background-repeat:no-repeat; }
.kbdenim-site .stack .layer::before { opacity:.45; }
@media(max-width:680px) { .kbdenim-content-page .kbdenim-page-hero { padding:8rem 0 3rem; } }