/* ==========================================================================
   CORTEX NATIONAL — Design System v8 "Industrial White"
   Derived from the company stationery: graphite logo, chamfered octagon,
   hazard-stripe band, thin red frame. No gradients, no glow, no round pills.
   ========================================================================== */
@font-face{font-family:"CX";src:url(fonts/tajawal-arabic-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX";src:url(fonts/tajawal-arabic-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX";src:url(fonts/tajawal-arabic-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX";src:url(fonts/tajawal-arabic-800-normal.woff2) format("woff2");font-weight:800;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX";src:url(fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:"CX";src:url(fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:"CX";src:url(fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2");font-weight:600 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:"CX Display";src:url(fonts/montserrat-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:"CX Display";src:url(fonts/montserrat-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:"CX Display";src:url(fonts/montserrat-latin-700-normal.woff2) format("woff2");font-weight:700 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:"CX Display";src:url(fonts/tajawal-arabic-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX Display";src:url(fonts/tajawal-arabic-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX Display";src:url(fonts/tajawal-arabic-800-normal.woff2) format("woff2");font-weight:800;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX Mono";src:url(fonts/tajawal-arabic-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX Mono";src:url(fonts/tajawal-arabic-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"CX Mono";src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"CX Mono";src:url(fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2");font-weight:500 600;font-display:swap}

:root{
  /* colour — taken from the logo & letterhead */
  --ink:#16191D;
  --navy:#16191D;
  --navy-2:#22262B;       /* carbon — raised dark surface */
  --navy-3:#2E3339;       /* iron — dark borders / hover */
  --paper:#F4F5F6;        /* concrete */
  --paper-2:#ECEEF0;      /* concrete, recessed */
  --white:#FFFFFF;
  --steel:#5B636D;        /* steel — secondary text on light */
  --steel-2:#8A929B;
  --steel-3:#B4B9BF;      /* aluminium — secondary text on dark */
  --line:#E2E5E8;
  --line-2:#CDD2D7;
  --line-d:rgba(255,255,255,.11);
  --red:#C8102E;          /* letterhead frame red — CTAs & markers only */
  --red-h:#A50D26;
  --red-soft:#FBE7EA;
  --ok:#2E7D4F;
  --wa:#1F9D57;

  --f:"CX",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
  --f-cond:"CX Display","CX",system-ui,sans-serif;
  --f-disp:"CX Display","CX",system-ui,sans-serif;
  --f-display:"CX Display","CX",system-ui,sans-serif;
  --hatch:repeating-linear-gradient(-45deg,currentColor 0 7px,transparent 7px 14px);
  --f-mono:"CX Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --t-xs:12.5px; --t-sm:14px; --t-md:16.5px; --t-lg:18.5px;
  --h1:clamp(32px,4.4vw,56px); --h2:clamp(26px,2.9vw,38px); --h3:clamp(18px,1.6vw,21px);

  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;--s10:128px;
  --gut:clamp(16px,3.2vw,40px);
  --max:1320px;
  --r:4px;
  --cut:10px;            /* chamfer — same 45° cut as the logo */
  --hd:72px;
  --ease:cubic-bezier(.2,.7,.1,1);
}

/* ---------- Base */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 16px)}
body{font-family:var(--f);font-size:var(--t-md);line-height:1.65;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
[lang=en] body{line-height:1.6}
img,svg,video,picture{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-weight:600;line-height:1.18;letter-spacing:-.01em;text-wrap:balance}
[lang=ar] h1,[lang=ar] h2,[lang=ar] h3{letter-spacing:0;line-height:1.35}
p{text-wrap:pretty}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
::selection{background:var(--navy);color:#fff}
.lat,.num,[dir=ltr]{font-family:var(--f)}
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.mono{font-family:var(--f-mono);letter-spacing:.02em}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:100;background:var(--red);color:#fff;padding:10px 16px;font-weight:600}
.skip:focus{top:12px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ---------- Layout */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sec{padding-block:clamp(56px,8vw,112px);position:relative}
.sec.tight{padding-block:clamp(40px,5vw,72px)}
.sec.white{background:var(--white)}
.sec.recess{background:var(--paper-2)}
.sec.dark{background:var(--navy);color:#fff}
.sec.ink{background:var(--ink);color:#fff}
.dark .muted,.ink .muted{color:var(--steel-3)}
.muted{color:var(--steel)}
.rule{border-top:1px solid var(--line)}
.dark .rule,.ink .rule{border-color:var(--line-d)}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2.2vw,32px)}
.c-5{grid-column:span 5}.c-6{grid-column:span 6}.c-7{grid-column:span 7}.c-4{grid-column:span 4}.c-8{grid-column:span 8}.c-3{grid-column:span 3}.c-9{grid-column:span 9}.c-12{grid-column:1/-1}
@media (max-width:1024px){.c-5,.c-6,.c-7,.c-4,.c-8,.c-3,.c-9{grid-column:1/-1}.g12{row-gap:clamp(36px,6vw,56px)}}

/* technical grid backdrop (used sparingly: hero, dark bands) */
.gridlines{position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(to right,rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:calc((min(100vw,var(--max)) - 2*var(--gut))/12) 100%,100% 96px;background-position:center top}

/* ---------- Section header: numbered index + title + ruler */
.sh{margin-bottom:clamp(28px,4vw,48px)}
.idx{display:flex;align-items:center;gap:12px;font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);margin-bottom:16px}
.idx b{font-weight:500;color:var(--red)}
.idx::after{content:"";flex:1;height:1px;background:repeating-linear-gradient(to right,var(--line-2) 0 1px,transparent 1px 8px);max-width:220px}
[dir=rtl] .idx::after{background:repeating-linear-gradient(to left,var(--line-2) 0 1px,transparent 1px 8px)}
.dark .idx,.ink .idx{color:var(--steel-3)}
.dark .idx::after,.ink .idx::after{background:repeating-linear-gradient(to right,rgba(255,255,255,.25) 0 1px,transparent 1px 8px)}
.sh h2{font-size:var(--h2);max-width:22ch}
.sh p{margin-top:14px;max-width:62ch;color:var(--steel);font-size:var(--t-lg)}
.dark .sh p,.ink .sh p{color:var(--steel-3)}
.sh.split{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}

/* ---------- Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border:1px solid transparent;border-radius:var(--r);font-weight:600;font-size:15px;line-height:1.2;cursor:pointer;transition:background .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease);white-space:nowrap}
.btn svg{width:18px;height:18px;flex:none}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-h)}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-3)}
.btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-line:hover{background:var(--ink);color:#fff}
.btn-ghost{border-color:rgba(255,255,255,.35);color:#fff;background:transparent}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn-wa{background:transparent;border-color:var(--wa);color:var(--wa)}
.btn-wa:hover{background:var(--wa);color:#fff}
.dark .btn-wa,.ink .btn-wa{border-color:#3BBF74;color:#7FDCA6}
.dark .btn-wa:hover,.ink .btn-wa:hover{background:#3BBF74;color:var(--ink)}
.btn-sm{min-height:40px;padding:0 16px;font-size:14px}
.btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:560px){.btns>.btn{flex:1 1 100%;white-space:normal;text-align:center;padding-block:10px}}
.lnk{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;color:var(--ink);border-bottom:1px solid currentColor;padding-bottom:2px;transition:color .18s}
.lnk:hover{color:var(--red)}
.lnk svg{width:15px;height:15px}
.dark .lnk,.ink .lnk{color:#fff}
[dir=rtl] .flip{transform:scaleX(-1)}

/* ---------- Header */
.ub{background:var(--ink);color:var(--steel-3);font-size:13px}
.ub .wrap{display:flex;justify-content:space-between;align-items:center;min-height:36px;gap:16px}
.ub a:hover{color:#fff}
.ub .r{display:flex;gap:20px;align-items:center}
.ub .loc{display:flex;align-items:center;gap:8px}
.ub .loc i{width:6px;height:6px;background:var(--red);display:inline-block}
.hd{position:sticky;top:0;z-index:50;background:rgba(244,242,237,.94);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line);transition:box-shadow .2s}
.hd.sc{box-shadow:0 1px 0 var(--line),0 8px 24px -18px rgba(10,20,34,.35)}
.hd .wrap{display:flex;align-items:center;gap:28px;height:var(--hd)}
.brand{display:flex;align-items:center;gap:12px;flex:none}
.brand .ic{width:38px;height:auto}
.brand .wd{width:96px;height:auto}
.brand small{display:block;font-size:11.5px;color:var(--steel);margin-top:3px;white-space:nowrap}
.nav{display:flex;gap:2px;margin-inline-start:auto}
.nav>li{position:relative}
.nav>li>a{display:flex;align-items:center;gap:6px;height:var(--hd);padding:0 12px;font-size:14.5px;font-weight:500;color:var(--ink);position:relative}
.nav>li>a::after{content:"";position:absolute;inset-inline:12px;bottom:-1px;height:2px;background:var(--red);transform:scaleX(0);transition:transform .2s var(--ease)}
.nav>li>a:hover::after,.nav>li>a.on::after,.nav>li:focus-within>a::after{transform:scaleX(1)}
.nav .caret{width:9px;height:9px;opacity:.55}
.mega{position:absolute;top:100%;inset-inline-start:-12px;min-width:520px;background:var(--white);border:1px solid var(--line);box-shadow:0 24px 48px -24px rgba(10,20,34,.35);padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:4px 28px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .16s,transform .16s var(--ease),visibility 0s .16s}
.nav>li:hover .mega,.nav>li:focus-within .mega{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.mega h5{grid-column:1/-1;font-family:var(--f-mono);font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--steel-2);padding-bottom:10px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.mega a{display:block;padding:9px 0;font-size:14.5px;border-bottom:1px solid transparent}
.mega a small{display:block;color:var(--steel);font-size:12.5px;margin-top:1px}
.mega a:hover b{color:var(--red)}
.mega b{font-weight:600}
.tools{display:flex;align-items:center;gap:10px}
.lang{font-size:13.5px;font-weight:600;padding:8px 10px;border:1px solid var(--line-2);border-radius:var(--r);min-width:44px;text-align:center}
.lang:hover{border-color:var(--ink)}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line-2);background:transparent;border-radius:var(--r);align-items:center;justify-content:center;cursor:pointer}
.burger svg{width:20px;height:20px}
.mnav{display:none}
@media (max-width:1180px){.nav{display:none}.burger{display:inline-flex}.hd .wrap{gap:12px}.tools{margin-inline-start:auto}}
@media (max-width:560px){.tools .btn-red{display:none}.brand small{display:none}.ub .hide-s{display:none}}
.mnav.open{display:block;position:fixed;inset:calc(var(--hd) + 36px) 0 0;background:var(--paper);overflow:auto;z-index:49;padding:8px var(--gut) 120px;border-top:1px solid var(--line)}
.hd.stuck~.mnav.open,.mnav.open.top{top:var(--hd)}
.mnav details{border-bottom:1px solid var(--line)}
.mnav summary,.mnav>a{display:flex;justify-content:space-between;align-items:center;padding:16px 0;font-size:17px;font-weight:600;cursor:pointer;list-style:none;border-bottom:1px solid var(--line)}
.mnav details summary{border-bottom:0}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary::after{content:"+";font-family:var(--f-mono);font-weight:400;color:var(--steel)}
.mnav details[open] summary::after{content:"−"}
.mnav details a{display:block;padding:10px 0;padding-inline-start:14px;color:var(--steel);font-size:15.5px;border-inline-start:1px solid var(--line)}
.mnav details div{padding-bottom:12px}
.mnav .btns{margin-top:22px}
.mnav .btns .btn{flex:1}

/* ---------- Hero */
.hero{background:var(--navy);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(24px,4vw,64px);align-items:center;padding-block:clamp(48px,7vw,104px) clamp(40px,5vw,72px)}
.hero h1{font-size:var(--h1);font-weight:600;letter-spacing:-.02em;max-width:15ch}
[lang=ar] .hero h1{max-width:13ch}
.hero h1 em{font-style:normal;color:var(--steel-3);font-weight:500}
.hero .lead{margin-top:22px;font-size:clamp(16.5px,1.4vw,19px);color:#D3D9E2;max-width:54ch}
.hero .btns{margin-top:32px}
.hero .meta{margin-top:40px;display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0;border-top:1px solid var(--line-d)}
.hero .meta div{padding:16px 28px 0 0;font-size:13.5px;color:var(--steel-3)}
[dir=rtl] .hero .meta div{padding:16px 0 0 28px}
.hero .meta b{display:block;color:#fff;font-weight:600;font-size:14.5px;margin-bottom:2px}
@media (max-width:1024px){.hero .wrap{grid-template-columns:1fr}.hero .fig .cap{margin-top:16px}}
@media (max-width:560px){.hero .fig .cap .dimx,.hero .dim{display:none}}
@media (max-width:560px){.hero .meta{grid-template-columns:1fr}.hero .meta div{padding:12px 0 0}.hero .btns .btn{flex:1 1 100%}}

/* figure with engineering corner marks + dimension annotations */
.fig{position:relative}
.fig .frame{position:relative;background:#fff;aspect-ratio:3/2;overflow:hidden}
.fig .frame img{width:100%;height:100%;object-fit:contain;padding:4%}
.fig .frame.cover img{object-fit:cover;padding:0}
.ticks4::before,.ticks4::after,.ticks4>.tk::before,.ticks4>.tk::after{content:"";position:absolute;width:14px;height:14px;border-color:var(--red);border-style:solid;z-index:2;pointer-events:none}
.ticks4::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.ticks4::after{top:-1px;right:-1px;border-width:2px 2px 0 0}
.ticks4>.tk::before{bottom:-1px;left:-1px;border-width:0 0 2px 2px}
.ticks4>.tk::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}
.dim{position:absolute;font-family:var(--f-mono);font-size:11.5px;color:var(--steel-3);display:flex;align-items:center;gap:8px;white-space:nowrap;direction:ltr}
.dim.h{left:0;right:0;bottom:-30px;justify-content:center}
.dim.h::before,.dim.h::after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--steel-2),var(--steel-2)) center/100% 1px no-repeat;border-inline:1px solid var(--steel-2);height:9px;background-size:100% 1px}
.fig .cap{margin-top:44px;display:flex;justify-content:space-between;gap:16px;font-size:12.5px;color:var(--steel-3);font-family:var(--f-mono);border-top:1px solid var(--line-d);padding-top:12px}
.fig .cap b{color:#fff;font-weight:500}

/* ---------- Capability strip (under hero) */
.cap-strip{background:var(--ink);color:#fff;border-top:1px solid var(--line-d)}
.cap-strip ol{display:grid;grid-template-columns:repeat(7,1fr)}
.cap-strip li{padding:18px 16px;border-inline-start:1px solid var(--line-d);font-size:14px;font-weight:500;display:flex;flex-direction:column;gap:2px}
.cap-strip li:first-child{border-inline-start:0;padding-inline-start:0}
.cap-strip li span{font-family:var(--f-mono);font-size:11px;color:var(--steel-2)}
@media (max-width:1024px){.cap-strip ol{grid-template-columns:repeat(4,1fr)}.cap-strip li:nth-child(5){border-inline-start:0;padding-inline-start:0}.cap-strip li{border-top:1px solid var(--line-d)}}
@media (max-width:560px){.cap-strip ol{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(var(--gut)*-1);padding-inline:var(--gut)}.cap-strip ol::-webkit-scrollbar{display:none}.cap-strip li{flex:0 0 auto;min-width:112px;scroll-snap-align:start;border-top:0;padding-block:14px}.cap-strip li:nth-child(5){border-inline-start:1px solid var(--line-d);padding-inline-start:16px}}

/* ---------- Statement (editorial) */
.stmt{font-size:clamp(22px,2.4vw,32px);line-height:1.45;font-weight:500;max-width:30ch}
[lang=en] .stmt{max-width:34ch;line-height:1.35}
.stmt span{color:var(--steel-2)}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);margin-top:clamp(36px,5vw,56px)}
.pillars>div{padding:22px 24px 0 0;border-inline-end:1px solid var(--line)}
[dir=rtl] .pillars>div{padding:22px 0 0 24px}
.pillars>div:last-child{border:0}
.pillars>div+div{padding-inline-start:24px}
.pillars h3{font-size:var(--h3);margin:10px 0 8px}
.pillars p{color:var(--steel);font-size:15px}
.pillars .k{font-family:var(--f-mono);font-size:12px;color:var(--red)}
@media (max-width:768px){.pillars{grid-template-columns:1fr}.pillars>div,.pillars>div+div{border:0;border-bottom:1px solid var(--line);padding:20px 0}}

/* ---------- Route list (5 entry paths — rows, not cards) */
.routes{border-top:1px solid var(--ink)}
.route{display:grid;grid-template-columns:72px minmax(0,1.4fr) minmax(0,1fr) 40px;align-items:center;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);transition:background .2s var(--ease),padding .2s var(--ease)}
.route .n{font-family:var(--f-mono);font-size:13px;color:var(--steel-2)}
.route b{font-size:clamp(18px,1.7vw,22px);font-weight:600}
.route small{color:var(--steel);font-size:15px}
.route svg{width:22px;height:22px;color:var(--steel-2);transition:transform .2s var(--ease),color .2s}
.route:hover{background:var(--white);padding-inline:16px}
.route:hover svg{color:var(--red);transform:translateX(4px)}
[dir=rtl] .route:hover svg{transform:scaleX(-1) translateX(4px)}
@media (max-width:768px){.route{grid-template-columns:44px 1fr 24px;gap:12px}.route small{grid-column:2/3}.route svg{grid-row:1/3;grid-column:3}}

/* ---------- Industry panels (4 sectors) */
.inds{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.ind{background:var(--white);display:flex;flex-direction:column;position:relative;min-height:100%}
.ind .im{aspect-ratio:4/3;overflow:hidden;background:#fff;border-bottom:1px solid var(--line)}
.ind .im img{width:100%;height:100%;object-fit:contain;padding:8%;transition:transform .5s var(--ease)}
.ind .im.cover img{object-fit:cover;padding:0}
.ind:hover .im img{transform:scale(1.035)}
.ind .bd{padding:20px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.ind .code{font-family:var(--f-mono);font-size:11.5px;color:var(--steel-2);letter-spacing:.06em}
.ind h3{font-size:var(--h3)}
.ind p{font-size:14.5px;color:var(--steel)}
.ind .mats{font-size:13px;color:var(--steel);border-top:1px solid var(--line);padding-top:12px;margin-top:auto}
.ind .go{display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:14.5px;padding-top:4px}
.ind .go svg{width:16px;height:16px;color:var(--red)}
@media (max-width:1100px){.inds{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.inds{grid-template-columns:1fr}.ind .im{aspect-ratio:16/9}}

/* ---------- Machine finder (advisor) */
.finder{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d)}
.finder .q{background:var(--navy-2);padding:clamp(20px,3vw,36px)}
.finder .s{background:var(--ink);padding:clamp(20px,3vw,32px);display:flex;flex-direction:column;gap:14px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:24px}
.steps i{height:3px;background:rgba(255,255,255,.14);transition:background .3s}
.steps i.on{background:var(--red)}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.fld{display:flex;flex-direction:column;gap:7px;min-width:0}
.fld.full,.fdiv,.dyn{grid-column:1/-1}
.fld label{font-size:13.5px;font-weight:600}
.fld .req{color:var(--red)}
.fld .hint{font-size:12.5px;color:var(--steel)}
input,select,textarea{width:100%;min-height:48px;padding:11px 14px;background:var(--white);border:1px solid var(--line-2);border-radius:var(--r);font-size:15.5px;transition:border-color .15s,box-shadow .15s;appearance:none;-webkit-appearance:none}
textarea{min-height:120px;resize:vertical}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23566273' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-inline-end:38px}
[dir=rtl] select{background-position:left 14px center}
input[type=file]{padding:10px;min-height:auto;font-size:14px;background:var(--paper)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(13,27,46,.12)}
input:disabled,select:disabled{opacity:.5;cursor:not-allowed}
.finder input,.finder select,.finder textarea{background-color:rgba(255,255,255,.04);border-color:rgba(255,255,255,.18);color:#fff}
.finder select option{color:var(--ink)}
.finder select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23B7BEC8' stroke-width='1.6'/%3E%3C/svg%3E")}
.finder input:focus,.finder select:focus{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.12)}
.finder input::placeholder{color:var(--steel-2)}
.fdiv{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--steel-3);padding-top:10px;border-top:1px dashed rgba(255,255,255,.16);margin-top:4px}
.dyn{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.dyn:empty{display:none}
.s h3{font-size:17px}
.s ul{font-size:14px;color:var(--steel-3);display:flex;flex-direction:column;gap:6px;min-height:40px}
.s ul li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed rgba(255,255,255,.12);padding-bottom:6px}
.s ul li b{color:#fff;font-weight:500;text-align:end}
.s ul li.em{border:0;color:var(--steel-2)}
.s form{display:flex;flex-direction:column;gap:10px}
.s .note{font-size:12.5px;color:var(--steel-2)}
.f-res{margin-top:28px}
.f-res .hd2{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;color:var(--steel-3);font-size:14px}
.f-res .hd2 h3{color:#fff;font-size:18px}
.recs{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d)}
.rec{background:var(--navy-2);display:flex;flex-direction:column}
.rec .im{background:#fff;aspect-ratio:16/10}
.rec .im img{width:100%;height:100%;object-fit:contain;padding:6%}
.rec .im.cover img{object-fit:cover;padding:0}
.rec .bd{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.rec .tag{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--steel-3)}
.rec.top .tag{color:#F08A84}
.rec h4{font-size:16px;font-weight:600}
.rec .why{font-size:12.5px;color:#9FDDB9}
.rec dl{font-size:13px;margin-top:auto}
.rec .bd .lnk{margin-top:6px;font-size:14px}
@media (max-width:1024px){.finder{grid-template-columns:1fr}.recs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.fg,.dyn{grid-template-columns:1fr}.recs{grid-template-columns:1fr}}

/* ---------- Spec list (dl) — technical, mono values */
.kv{display:grid;grid-template-columns:auto 1fr;font-size:14px}
.kv dt,.kv dd{padding:7px 0;border-bottom:1px solid var(--line)}
.kv dt{color:var(--steel);padding-inline-end:16px}
.kv dd{text-align:end;font-family:var(--f-mono);font-size:13.5px;font-weight:500;direction:ltr;unicode-bidi:isolate}
[lang=ar] .kv dd{text-align:left}
[lang=ar] .kv dd.ar{font-family:var(--f);direction:rtl;text-align:left}
.dark .kv dt,.ink .kv dt,.rec .kv dt{color:var(--steel-3);border-color:var(--line-d)}
.dark .kv dd,.ink .kv dd,.rec .kv dd{border-color:var(--line-d);color:#fff}

/* ---------- Machine card (catalog) */
.mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.mgrid.c4{grid-template-columns:repeat(4,1fr)}
.mc{background:var(--white);display:flex;flex-direction:column;position:relative}
.mc .im{aspect-ratio:3/2;background:#fff;overflow:hidden;position:relative;border-bottom:1px solid var(--line)}
.mc .im img{width:100%;height:100%;object-fit:contain;padding:6%;transition:transform .5s var(--ease)}
.mc .im.cover img{object-fit:cover;padding:0}
.mc:hover .im img{transform:scale(1.03)}
.mc .im .ph,.ph-box{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--paper-2);color:var(--steel);font-size:13px;font-family:var(--f-mono)}
.ph-box svg{width:56px;height:auto;opacity:.35}
.mc .lab{position:absolute;top:12px;inset-inline-start:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;background:var(--ink);color:#fff;padding:4px 8px}
.mc .bd{padding:18px 20px 20px;display:flex;flex-direction:column;gap:10px;flex:1}
.mc .ty{font-family:var(--f-mono);font-size:11.5px;color:var(--steel-2);letter-spacing:.04em;text-transform:uppercase}
[lang=ar] .mc .ty{font-family:var(--f);text-transform:none;font-size:12.5px;letter-spacing:0}
.mc h3{font-size:17.5px;font-weight:600}
.mc h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.mc h3 a:hover{color:var(--red)}
.mc p{font-size:14px;color:var(--steel)}
.mc .kv{margin-top:auto}
.mc .mf{display:flex;gap:10px;margin-top:6px;position:relative;z-index:2}
.mc .mf .btn{flex:1;min-height:42px;font-size:14px;padding:0 12px}
@media (max-width:1024px){.mgrid,.mgrid.c4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.mgrid,.mgrid.c4{grid-template-columns:1fr}}

/* ---------- Process flow (INPUT → PROCESS → MACHINE → OUTPUT) */
.flow{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);border-top:1px solid var(--ink);counter-reset:st}
.flow .st{position:relative;padding:22px 20px 22px 0;border-inline-end:1px solid var(--line)}
[dir=rtl] .flow .st{padding:22px 0 22px 20px}
.flow .st+.st{padding-inline-start:20px}
.flow .st:last-child{border-inline-end:0}
.flow .st::before{counter-increment:st;content:counter(st,decimal-leading-zero);display:block;font-family:var(--f-mono);font-size:12px;color:var(--red);margin-bottom:12px}
.flow .st::after{content:"";position:absolute;top:-4px;inset-inline-start:0;width:7px;height:7px;background:var(--ink)}
.flow .st+.st::after{inset-inline-start:-4px}
.flow .st b{display:block;font-size:16px;font-weight:600}
.flow .st small{display:block;color:var(--steel);font-size:13.5px;margin-top:6px}
.flow .st .m{display:block;margin-top:10px;font-size:13px;font-weight:600;color:var(--navy)}
.flow .st.io{background:repeating-linear-gradient(135deg,transparent 0 6px,rgba(13,27,46,.035) 6px 7px)}
.flow .st.io b{font-family:var(--f-mono);font-weight:500;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--steel)}
[lang=ar] .flow .st.io b{font-family:var(--f);font-size:13px;letter-spacing:0}
.flow .st.io small{color:var(--ink);font-size:15px;font-weight:600}
.dark .flow{border-color:#fff}.dark .flow .st{border-color:var(--line-d)}.dark .flow .st small{color:var(--steel-3)}.dark .flow .st .m{color:#fff}.dark .flow .st::after{background:#fff}
.ink .flow{border-color:#fff}.ink .flow .st{border-color:var(--line-d)}.ink .flow .st small{color:var(--steel-3)}.ink .flow .st .m{color:#fff}.ink .flow .st::after{background:#fff}
.dark .flow .st.io b{color:var(--steel-3)}.dark .flow .st.io small{color:#fff}.dark .flow .st.io{background:repeating-linear-gradient(135deg,transparent 0 6px,rgba(255,255,255,.04) 6px 7px)}
.ink .flow .st.io b{color:var(--steel-3)}.ink .flow .st.io small{color:#fff}.ink .flow .st.io{background:repeating-linear-gradient(135deg,transparent 0 6px,rgba(255,255,255,.04) 6px 7px)}
@media (max-width:1024px){.flow{grid-auto-flow:row;grid-auto-columns:auto;border-top:0;border-inline-start:1px solid var(--ink)}.flow .st,.flow .st+.st{padding:16px 0;padding-inline-start:24px;border-inline-end:0;border-bottom:1px solid var(--line)}.flow .st::after,.flow .st+.st::after{top:22px;inset-inline-start:-4px}.dark .flow{border-color:#fff}}

/* solution switcher (tabs) */
.tabs{display:flex;gap:0;border-bottom:1px solid var(--line-d);margin-bottom:28px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{background:transparent;border:0;border-bottom:2px solid transparent;padding:12px 18px 14px;font-weight:600;font-size:14.5px;color:var(--steel-3);cursor:pointer;white-space:nowrap;margin-bottom:-1px}
.tabs button[aria-selected=true]{color:#fff;border-color:var(--red)}
.tabs button:hover{color:#fff}
.tabp[hidden]{display:none}
.tabp .top{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:end;margin-bottom:28px}
.tabp .top p{color:var(--steel-3)}
@media (max-width:860px){.tabp .top{grid-template-columns:1fr}}

/* ---------- Split feature (image/text tension) */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:center}
.split.rev{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.split.rev>:first-child{order:2}
@media (max-width:1024px){.split,.split.rev{grid-template-columns:1fr}.split.rev>:first-child{order:0}}

/* parts mosaic on home */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d)}
.mosaic a{background:#fff;aspect-ratio:1;position:relative;overflow:hidden;display:block}
.mosaic a img{width:100%;height:100%;object-fit:contain;padding:12%;transition:transform .4s var(--ease)}
.mosaic a:hover img{transform:scale(1.06)}
.mosaic a span{position:absolute;inset-inline:0;bottom:0;padding:8px 10px;font-size:12px;font-weight:500;background:linear-gradient(transparent,rgba(255,255,255,.96) 40%);color:var(--ink);line-height:1.3}
@media (max-width:560px){.mosaic{grid-template-columns:repeat(2,1fr)}}
.idbox{border:1px solid var(--line-d);padding:22px;margin-top:28px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}
.idbox .ico{width:44px;height:44px;border:1px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}
.idbox .ico svg{width:22px;height:22px}
.idbox b{font-size:17px;display:block}
.idbox p{color:var(--steel-3);font-size:14.5px;margin-top:4px}

/* ---------- Lifecycle (service) — horizontal line with nodes */
.life{display:grid;grid-template-columns:repeat(7,1fr);position:relative;margin-top:8px}
.life::before{content:"";position:absolute;top:7px;inset-inline:0;height:1px;background:var(--line-2)}
.dark .life::before{background:rgba(255,255,255,.25)}
.life li{position:relative;padding-top:30px;padding-inline-end:16px}
.life li::before{content:"";position:absolute;top:2px;inset-inline-start:0;width:11px;height:11px;border:2px solid var(--ink);background:var(--paper)}
.dark .life li::before{border-color:#fff;background:var(--navy)}
.life li:first-child::before,.life li.hl::before{background:var(--red);border-color:var(--red)}
.life b{display:block;font-size:15.5px;font-weight:600}
.life small{display:block;font-size:13px;color:var(--steel);margin-top:4px}
.dark .life small{color:var(--steel-3)}
.life .n{font-family:var(--f-mono);font-size:11px;color:var(--steel-2);display:block;margin-bottom:4px}
@media (max-width:1024px){.life{grid-template-columns:1fr;padding-inline-start:4px}.life::before{top:0;bottom:0;inset-inline-start:9px;inset-inline-end:auto;width:1px;height:auto}.life li{padding:0 0 22px;padding-inline-start:36px}.life li::before{top:4px;inset-inline-start:4px}}

/* ---------- Facts (why Cortex) — table-like rows */
.facts{border-top:1px solid var(--ink)}
.fact{display:grid;grid-template-columns:56px minmax(0,4fr) minmax(0,6fr);gap:20px;padding:24px 0;border-bottom:1px solid var(--line);align-items:start}
.fact .ico{width:40px;height:40px;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;color:var(--navy)}
.fact .ico svg{width:20px;height:20px}
.fact b{font-size:18px;font-weight:600}
.fact p{color:var(--steel)}
@media (max-width:768px){.fact{grid-template-columns:48px 1fr}.fact p{grid-column:2}}

/* ---------- Guides list */
.glist{border-top:1px solid var(--ink)}
.glist a{display:grid;grid-template-columns:110px minmax(0,1fr) 24px;gap:20px;padding:20px 0;border-bottom:1px solid var(--line);align-items:center}
.glist .t{font-family:var(--f-mono);font-size:11.5px;color:var(--red);letter-spacing:.05em;text-transform:uppercase}
[lang=ar] .glist .t{font-family:var(--f);font-size:13px;letter-spacing:0;text-transform:none}
.glist b{font-size:17px;font-weight:600;display:block}
.glist small{color:var(--steel);font-size:14px;display:block;margin-top:2px}
.glist svg{width:18px;height:18px;color:var(--steel-2)}
.glist a:hover b{color:var(--red)}
@media (max-width:620px){.glist a{grid-template-columns:1fr 20px}.glist .t{grid-column:1/-1}}

/* ---------- Quote band (strong CTA with short form) */
.qband{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:start}
.qband h2{font-size:var(--h2)}
.qband .lead{color:var(--steel-3);margin-top:14px;font-size:17px;max-width:44ch}
.qband .ct{margin-top:28px;display:flex;flex-direction:column;gap:10px;font-size:15px}
.qband .ct a{display:flex;gap:12px;align-items:center}
.qband .ct svg{width:18px;height:18px;color:var(--steel-3)}
.qform{background:var(--white);color:var(--ink);padding:clamp(20px,3vw,32px);position:relative}
.qform .fg{gap:14px 16px}
.qform .btns{margin-top:18px}
@media (max-width:1024px){.qband{grid-template-columns:1fr}}

/* ---------- Page hero (inner pages) */
.ph{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.ph .wrap{position:relative;padding-block:clamp(36px,5vw,64px) clamp(36px,5vw,56px)}
.ph h1{font-size:clamp(30px,3.8vw,48px);max-width:22ch;margin-top:14px}
.ph p{margin-top:14px;color:#D3D9E2;max-width:62ch;font-size:17px}
.ph .btns{margin-top:24px}
.ph .mats{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:22px;font-size:14px;color:var(--steel-3)}
.ph .mats span::before{content:"";display:inline-block;width:5px;height:5px;background:var(--red);margin-inline-end:8px;vertical-align:middle}
.crumb{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--steel-3)}
.crumb a:hover{color:#fff}
.crumb span{opacity:.5}
.crumb.lt{color:var(--steel)}
.crumb.lt a:hover{color:var(--ink)}

/* ---------- Product page (datasheet) */
.pd-top{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:start;padding-top:24px}
.pd-top .fig .frame{border:1px solid var(--line)}
.pd-top .fig .cap{color:var(--steel);border-color:var(--line)}
.pd-top .fig .cap b{color:var(--ink)}
.pd-top .note{font-size:12.5px;color:var(--steel);margin-top:10px}
.pd-h .ty{font-family:var(--f-mono);font-size:12px;color:var(--red);letter-spacing:.06em;text-transform:uppercase}
[lang=ar] .pd-h .ty{font-family:var(--f);letter-spacing:0;text-transform:none;font-size:13.5px;font-weight:600}
.pd-h h1{font-size:clamp(28px,3vw,40px);margin-top:10px}
.pd-h .lead{margin-top:14px;font-size:17px;color:var(--steel)}
.pd-h .kv{margin-top:22px;font-size:15px}
.pd-h .kv dd{font-size:14.5px}
.pd-h .btns{margin-top:24px}
.pd-h .btns .btn{flex:1 1 200px}
.pd-h .pnote{font-size:13px;color:var(--steel);margin-top:12px;padding-inline-start:12px;border-inline-start:2px solid var(--red)}
@media (max-width:1024px){.pd-top{grid-template-columns:1fr}}
.pd-nav{position:sticky;top:var(--hd);z-index:20;background:var(--paper);border-block:1px solid var(--line);margin-top:clamp(36px,5vw,56px)}
.pd-nav .wrap{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;align-items:center}
.pd-nav .wrap::-webkit-scrollbar{display:none}
.pd-nav a{padding:14px 16px;font-size:13.5px;font-weight:500;color:var(--steel);white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-1px}
.pd-nav a:first-child{padding-inline-start:0}
.pd-nav a .mono{font-size:11px;color:var(--steel-2);margin-inline-end:6px}
.pd-nav a.on,.pd-nav a:hover{color:var(--ink);border-color:var(--red)}
.pd-nav .btn{margin-inline-start:auto;flex:none}
@media (max-width:768px){.pd-nav .btn{display:none}}
.pd-sec{padding-block:clamp(40px,5vw,64px);border-bottom:1px solid var(--line)}
.pd-sec .row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(20px,4vw,56px)}
.pd-sec .row>h2{font-size:20px;font-weight:600}
.pd-sec .row>h2 .mono{display:block;font-size:12px;color:var(--red);font-weight:500;margin-bottom:6px}
@media (max-width:860px){.pd-sec .row{grid-template-columns:1fr}}
.feat{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;border-top:1px solid var(--line)}
.feat li{padding:12px 0;border-bottom:1px solid var(--line);padding-inline-start:22px;position:relative;font-size:15.5px}
.feat li::before{content:"";position:absolute;inset-inline-start:0;top:21px;width:10px;height:1px;background:var(--red)}
@media (max-width:620px){.feat{grid-template-columns:1fr}}
.spec{border-top:1px solid var(--ink);font-size:15px}
.spec tr{border-bottom:1px solid var(--line)}
.spec tr:nth-child(even){background:rgba(255,255,255,.55)}
.spec th{font-weight:500;color:var(--steel);text-align:start;padding:12px 16px 12px 0;width:42%;vertical-align:top}
[dir=rtl] .spec th{padding:12px 0 12px 16px}
.spec td{padding:12px 0;font-family:var(--f-mono);font-size:14px;font-weight:500;direction:ltr;unicode-bidi:isolate;text-align:start}
[dir=rtl] .spec td{text-align:right}
.spec td.ar{font-family:var(--f);direction:rtl;font-size:15px}
.tagrow{display:flex;flex-wrap:wrap;gap:8px}
.tag{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border:1px solid var(--line-2);font-size:13.5px;border-radius:var(--r);background:var(--white)}
a.tag:hover{border-color:var(--ink)}
.dark .tag{background:transparent;border-color:rgba(255,255,255,.22);color:#fff}
.after{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.after li{padding:18px 18px 18px 0;border-inline-end:1px solid var(--line)}
[dir=rtl] .after li{padding:18px 0 18px 18px}
.after li+li{padding-inline-start:18px}
.after li:last-child{border:0}
.after .n{font-family:var(--f-mono);font-size:11.5px;color:var(--red)}
.after b{display:block;font-size:15.5px;margin:6px 0 4px}
.after small{color:var(--steel);font-size:13.5px;display:block}
@media (max-width:860px){.after{grid-template-columns:1fr 1fr}.after li:nth-child(2){border:0}.after li:nth-child(3){padding-inline-start:0}.after li{border-bottom:1px solid var(--line)}}
@media (max-width:480px){.after{grid-template-columns:1fr}.after li,.after li+li{border-inline-end:0;padding-inline:0}}
.ptypes{display:grid;grid-template-columns:repeat(3,1fr);gap:0 24px;border-top:1px solid var(--line)}
.ptypes li{padding:11px 0;border-bottom:1px solid var(--line);font-size:14.5px}
@media (max-width:620px){.ptypes{grid-template-columns:1fr 1fr}}

/* working-area diagram */
.wad{background:var(--white);border:1px solid var(--line);padding:22px}
.wad svg{width:100%;height:auto}
.wad text{font-family:"CX Mono",monospace;font-size:11px;fill:#5B636D}
.wad .lb{font-family:var(--f);font-size:12.5px;fill:#16191D}

/* sticky mobile quote bar */
.qbar{display:none}
@media (max-width:860px){.qbar{display:flex;position:fixed;inset-inline:0;bottom:0;z-index:40;background:var(--ink);padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));gap:10px;box-shadow:0 -10px 24px -16px rgba(0,0,0,.5);transform:translateY(110%);transition:transform .25s var(--ease)}
.qbar.on{transform:none}.qbar .btn{flex:1;min-height:46px;font-size:14.5px}body.has-qbar{padding-bottom:72px}}

/* ---------- Spare parts */
.pfind{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin-bottom:16px}
.pfind input{background:var(--white)}
.pfind .cnt{font-family:var(--f-mono);font-size:13px;color:var(--steel);white-space:nowrap}
.pcats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.pcats button{min-height:38px;padding:0 14px;border:1px solid var(--line-2);background:var(--white);border-radius:var(--r);font-size:14px;cursor:pointer;font-weight:500}
.pcats button:hover{border-color:var(--ink)}
.pcats button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.pc{background:var(--white);display:flex;flex-direction:column;position:relative}
.pc .im{aspect-ratio:1;background:#fff;border-bottom:1px solid var(--line);overflow:hidden}
.pc .im img{width:100%;height:100%;object-fit:contain;padding:12%;transition:transform .4s var(--ease)}
.pc:hover .im img{transform:scale(1.05)}
.pc .bd{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px}
.pc .cat{font-size:12px;color:var(--red);font-weight:600}
.pc h3{font-size:15px;font-weight:600;line-height:1.4}
.pc h3 a::after{content:"";position:absolute;inset:0}
.pc small{font-size:12.5px;color:var(--steel)}
.pc[hidden]{display:none}
.empty{display:none;padding:28px;border:1px dashed var(--line-2);text-align:center;color:var(--steel);background:var(--white)}
.empty.on{display:block}
.fams{display:grid;grid-template-columns:repeat(4,1fr);gap:0 24px;border-top:1px solid var(--line-d)}
.fams div{padding:14px 0;border-bottom:1px solid var(--line-d)}
.fams b{display:block;font-size:15px}
.fams small{color:var(--steel-3);font-size:13px}
@media (max-width:860px){.fams{grid-template-columns:1fr 1fr}}
.svl{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d)}
.svl>div{background:var(--navy);padding:24px}
.svl .ico{width:40px;height:40px;border:1px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.svl .ico svg{width:20px;height:20px}
.svl b{font-size:16.5px;display:block}
.svl p{color:var(--steel-3);font-size:14.5px;margin-top:6px}
@media (max-width:860px){.svl{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.svl{grid-template-columns:1fr}}
.light-svl .svl{background:var(--line);border-color:var(--line)}
.light-svl .svl>div{background:var(--white)}
.light-svl .svl .ico{border-color:var(--line-2);color:var(--navy)}
.light-svl .svl p{color:var(--steel)}

/* ---------- Forms box */
.fbox{background:var(--white);border:1px solid var(--line);padding:clamp(20px,3vw,36px)}
.fbox h2{font-size:22px;margin-bottom:6px}
.fbox .sub{color:var(--steel);font-size:14.5px;margin-bottom:22px}
.fbox .btns{margin-top:22px}
.okmsg{border-inline-start:3px solid var(--ok);background:#E8F3EC;padding:12px 16px;font-weight:600}

/* contact */
.cgrid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,3vw,40px);align-items:start}
.crows{border-top:1px solid var(--ink)}
.crow{display:grid;grid-template-columns:40px 1fr;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.crow .ico{width:40px;height:40px;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;color:var(--navy)}
.crow .ico svg{width:18px;height:18px}
.crow small{display:block;color:var(--steel);font-size:13px}
.crow b{font-weight:600}
@media (max-width:1024px){.cgrid{grid-template-columns:1fr}}

/* FAQ */
.faq{border-top:1px solid var(--ink)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 0;font-weight:600;font-size:16.5px;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-mono);font-weight:400;color:var(--red);font-size:20px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq p{padding:0 0 18px;color:var(--steel);max-width:72ch}
.guide{border-top:1px solid var(--ink);padding-top:20px}
.guide h3{font-size:19px}
.guide ol{counter-reset:g;margin-top:12px}
.guide ol li{counter-increment:g;padding:10px 0;padding-inline-start:36px;border-bottom:1px solid var(--line);position:relative;font-size:15px;color:var(--steel)}
.guide ol li::before{content:counter(g,decimal-leading-zero);position:absolute;inset-inline-start:0;font-family:var(--f-mono);font-size:12px;color:var(--red);top:12px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.g2{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,3vw,40px)}
@media (max-width:1024px){.g3{grid-template-columns:1fr 1fr}}
@media (max-width:680px){.g3,.g2{grid-template-columns:1fr}}

/* comparison table (resources) */
.ctable{overflow-x:auto;border-top:1px solid var(--ink)}
.ctable table{min-width:720px;font-size:14.5px}
.ctable th,.ctable td{padding:12px 14px 12px 0;border-bottom:1px solid var(--line);text-align:start;vertical-align:top}
[dir=rtl] .ctable th,[dir=rtl] .ctable td{padding:12px 0 12px 14px}
.ctable thead th{font-family:var(--f-mono);font-size:12px;font-weight:500;color:var(--steel);letter-spacing:.04em}
[lang=ar] .ctable thead th{font-family:var(--f);font-size:13.5px;letter-spacing:0;font-weight:600}
.ctable tbody th{font-weight:600;width:22%}

/* legal pages */
.prose{max-width:76ch}
.prose h2{font-size:20px;margin:32px 0 10px}
.prose p,.prose li{color:#2D3846;margin-bottom:10px}
.prose ul{list-style:disc;padding-inline-start:22px}

/* ---------- Footer */
.ft{background:var(--ink);color:var(--steel-3);font-size:14.5px}
.ft .wrap{padding-block:clamp(48px,6vw,80px) 28px}
.ft .top{display:grid;grid-template-columns:minmax(0,4fr) repeat(4,minmax(0,2fr));gap:clamp(20px,3vw,40px)}
.ft .lg{width:110px;height:auto;margin-bottom:20px}
.ft .pos{color:#fff;font-size:16px;max-width:34ch;line-height:1.5}
.ft .addr{margin-top:20px;line-height:1.8}
.ft .addr a{color:#fff}
.ft h4{font-family:var(--f-mono);font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--steel-2);margin-bottom:14px}
[lang=ar] .ft h4{font-family:var(--f);font-size:13px;letter-spacing:0;text-transform:none;font-weight:600}
.ft ul{display:flex;flex-direction:column;gap:9px}
.ft a:hover{color:#fff}
.ft .soc{display:flex;gap:10px;margin-top:20px}
.ft .soc a{width:40px;height:40px;border:1px solid var(--line-d);display:flex;align-items:center;justify-content:center}
.ft .soc a:hover{border-color:#fff}
.ft .soc svg{width:18px;height:18px}
.ft .bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:clamp(36px,5vw,56px);padding-top:20px;border-top:1px solid var(--line-d);font-size:13px}
.ft .bot nav{display:flex;gap:18px;flex-wrap:wrap}
.ft .mark{font-family:var(--f-mono);font-size:11.5px;color:var(--steel-2);letter-spacing:.06em}
@media (max-width:1100px){.ft .top{grid-template-columns:1fr 1fr 1fr}.ft .top>:first-child{grid-column:1/-1}}
@media (max-width:560px){.ft .top{grid-template-columns:1fr 1fr}}

/* contextual WhatsApp (compact, not a floating bubble) */
.wa-tab{position:fixed;bottom:20px;inset-inline-end:20px;z-index:40;display:flex;align-items:center;gap:8px;background:var(--wa);color:#fff;padding:0 16px;height:44px;font-weight:600;font-size:14px;border-radius:var(--r);box-shadow:0 10px 24px -12px rgba(0,0,0,.45);transition:transform .2s var(--ease),opacity .2s}
.wa-tab svg{width:18px;height:18px}
.wa-tab:hover{background:#178249}
@media (max-width:860px){.wa-tab{display:none}}
.mbar{display:none}
@media (max-width:860px){.mbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;inset-inline:0;bottom:0;z-index:39;background:var(--ink);border-top:1px solid var(--line-d);padding-bottom:env(safe-area-inset-bottom)}
.mbar a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 4px 8px;font-size:11.5px;color:var(--steel-3)}
.mbar a svg{width:20px;height:20px}
.mbar a.wa{color:#7FDCA6}.mbar a.go{color:#fff;background:var(--red)}
body{padding-bottom:62px}body.has-qbar .mbar{display:none}}

/* reveal (subtle, precise) */
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.rv.in{opacity:1;transform:none}
.no-js .rv{opacity:1;transform:none}

/* utilities */
.mt-s{margin-top:var(--s4)}.mt-m{margin-top:var(--s6)}.mt-l{margin-top:var(--s7)}
.hide{display:none!important}
@media (max-width:768px){.hide-m{display:none!important}}
@media print{.ub,.hd,.ft,.mbar,.wa-tab,.qbar,.pd-nav{display:none!important}body{background:#fff}}

/* Arabic: never letter-space Arabic glyphs */
html[lang=ar] *{letter-spacing:0!important}
@media (max-width:620px){
#plist.mgrid.c4{grid-template-columns:repeat(2,1fr)}
#plist .pc .im img{padding:10%}
#plist .pc .bd{padding:12px}
#plist .pc h3{font-size:14px;line-height:1.4}
.pcats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gut)*-1);padding-inline:var(--gut)}
.pcats::-webkit-scrollbar{display:none}
.pcats button{flex:0 0 auto}
}

/* ==========================================================================
   v8 INDUSTRIAL WHITE — white & light-steel surfaces, graphite type,
   one signal red for actions. 4px radii, no chamfers, no stripes, no glow.
   ========================================================================== */
body{background:var(--white)}
h1,h2,h3,h4,.stmt{font-family:var(--f-display)}
h1{font-weight:800}
h2,h3,h4{font-weight:700}
[lang=en] h1{font-weight:700;letter-spacing:-.025em}
[lang=en] h2{letter-spacing:-.015em}
::selection{background:var(--red);color:#fff}
.gridlines,.ticks4::before,.ticks4::after,.ticks4>.tk::before,.ticks4>.tk::after{display:none}
.sec{background:var(--paper)}
.sec.white{background:var(--white)}
.sec.dark,.sec.ink{background:var(--navy)}

/* section kicker */
.sh h2{max-width:24ch}
.idx{font-family:var(--f);font-size:14px;letter-spacing:0;text-transform:none;font-weight:700;color:var(--red);gap:10px;margin-bottom:12px}
[lang=en] .idx{letter-spacing:.1em;text-transform:uppercase;font-size:12px}
.idx::before{content:"";width:22px;height:3px;background:var(--red);flex:none}
.idx::after,.idx b{display:none}
.dark .idx,.ink .idx{color:#FF6B7F}
.dark .idx::before,.ink .idx::before{background:#FF6B7F}

/* buttons */
.btn{border-radius:var(--r);font-weight:700}
.btn-line,.btn-wa{border-width:1.5px}
.btn-line{border-color:var(--ink);color:var(--ink)}
.dark .btn-line,.ink .btn-line{border-color:rgba(255,255,255,.5);color:#fff}
.dark .btn-line:hover,.ink .btn-line:hover{background:#fff;color:var(--ink)}

/* header */
.ub{background:var(--ink);font-size:12.5px}
.hd{background:rgba(255,255,255,.97);border-bottom:1px solid var(--line)}
.hd.sc{box-shadow:0 10px 30px -24px rgba(22,25,29,.5)}
.brand .ic{width:40px}
.brand .wd{width:104px}
.brand small{font-weight:500;color:var(--steel)}
.nav>li>a{font-weight:700;font-size:14.5px;color:var(--ink)}
[lang=en] .nav>li>a{font-weight:600}
.nav>li>a::after{height:3px;inset-inline:12px;bottom:0}
.nav .caret{transition:transform .2s var(--ease)}
.nav>li:hover .caret,.nav>li:focus-within .caret{transform:rotate(180deg)}
.lang{font-weight:700}

/* dropdown menus */
.mega{top:calc(100% - 1px);min-width:600px;padding:8px 0 0;border:1px solid var(--line);border-top:2px solid var(--red);border-radius:0 0 6px 6px;box-shadow:0 28px 56px -28px rgba(22,25,29,.4);display:grid;grid-template-columns:1fr 1fr;gap:0;overflow:hidden}
.mega h5{font-family:var(--f);font-size:12.5px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--steel);padding:10px 20px 8px;margin:0;border:0}
[lang=en] .mega h5{letter-spacing:.1em;text-transform:uppercase;font-size:11px}
.mega a{position:relative;padding:11px 20px;padding-inline-end:36px;border:0;border-radius:0;transition:background .15s}
.mega a::after{content:"";position:absolute;inset-inline-end:18px;top:50%;width:6px;height:6px;border-top:1.5px solid var(--line-2);border-inline-end:1.5px solid var(--line-2);transform:translateY(-50%) rotate(45deg);transition:border-color .15s,inset-inline-end .15s}
[dir=rtl] .mega a::after{transform:translateY(-50%) rotate(-135deg)}
.mega a:hover{background:var(--paper)}
.mega a:hover::after{border-color:var(--red);inset-inline-end:14px}
.mega a:hover b{color:var(--red)}
.mega b{font-weight:700;font-size:14.5px}
.mega a small{color:var(--steel);font-size:12.5px;margin-top:2px;line-height:1.45}
.mega .mega-foot{grid-column:1/-1;margin-top:8px;padding:13px 20px;background:var(--paper);border-top:1px solid var(--line);color:var(--ink);font-size:13.5px;font-weight:700}
.mega .mega-foot:hover{background:var(--paper-2);color:var(--red)}

/* mobile nav */
.mnav.open{background:var(--white)}
.mnav summary,.mnav>a{font-family:var(--f-display);font-weight:700}
.mnav summary::after{content:"";width:8px;height:8px;border-bottom:2px solid var(--ink);border-inline-end:2px solid var(--ink);transform:rotate(45deg);transition:transform .2s}
.mnav details[open] summary::after{content:"";transform:rotate(-135deg)}
.mnav details a{border-inline-start:2px solid var(--line);font-weight:500;color:var(--ink)}
.mnav details a:active{border-color:var(--red)}

/* ---------- Hero (light) */
.hero{background:var(--paper);color:var(--ink)}
.hero .wrap{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,4.5vw,64px);padding-block:clamp(44px,6vw,88px) clamp(40px,5vw,72px)}
.hero .eyebrow{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:var(--red);margin-bottom:18px}
[lang=en] .hero .eyebrow{letter-spacing:.1em;text-transform:uppercase;font-size:12px}
.hero .eyebrow::before{content:"";width:28px;height:3px;background:var(--red);flex:none}
.hero h1,[lang=ar] .hero h1{font-size:clamp(34px,4.1vw,54px);font-weight:800;line-height:1.25;max-width:none;color:var(--ink)}
[lang=en] .hero h1{line-height:1.08}
.hero .svcl{margin-top:16px;font-size:clamp(17px,1.55vw,21px);font-weight:700;color:var(--steel)}
.hero .svcl b{color:var(--red);font-weight:800;margin:0 8px}
.hero .lead{color:var(--steel);margin-top:20px;max-width:48ch;font-size:clamp(16.5px,1.3vw,18.5px);line-height:1.85}
[lang=en] .hero .lead{line-height:1.65}
.hero .btns{margin-top:30px}
.hero .fig .frame{background:#fff;border-radius:6px;aspect-ratio:4/3;box-shadow:0 30px 60px -40px rgba(22,25,29,.5);border:1px solid var(--line)}
.hero .fig .frame img{padding:6%}
.hero .fig .cap{margin-top:14px;padding-top:0;border:0;color:var(--steel);font-family:var(--f);font-size:13.5px}
.hero .fig .cap b{color:var(--ink);font-weight:700}
.hero .fig .cap a{color:var(--ink);font-weight:700}
.hero .fig .cap a:hover{color:var(--red)}
@media (max-width:1024px){.hero .wrap{grid-template-columns:1fr}.hero .fig{max-width:620px}}
@media (max-width:560px){.hero .btns .btn{flex:1 1 100%}}

/* trust strip */
.trust{background:var(--white);border-bottom:1px solid var(--line)}
.trust ul{display:grid;grid-template-columns:repeat(4,1fr)}
.trust li{display:flex;gap:14px;align-items:flex-start;padding:24px 22px;border-inline-start:1px solid var(--line)}
.trust li:first-child{border-inline-start:0;padding-inline-start:0}
.trust .ico{color:var(--red);flex:none;margin-top:2px}
.trust .ico svg{width:22px;height:22px}
.trust b{display:block;font-weight:700;font-size:16px;font-family:var(--f-display)}
.trust small{display:block;color:var(--steel);font-size:14px;margin-top:2px}
@media (max-width:1024px){.trust ul{grid-template-columns:1fr 1fr}.trust li:nth-child(3){border-inline-start:0;padding-inline-start:0}.trust li:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:560px){.trust li{padding:16px 12px;gap:10px}.trust li:nth-child(odd){padding-inline-start:0}.trust b{font-size:14.5px}.trust small{font-size:12.5px}.trust .ico svg{width:19px;height:19px}}

/* ---------- inner page header (light) */
.ph{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line)}
.ph p{color:var(--steel)}
.ph .mats{color:var(--steel)}
.crumb{color:var(--steel)}
.crumb a:hover{color:var(--red)}

/* statement & pillars */
.stmt{font-weight:500;font-size:clamp(21px,2.2vw,30px);line-height:1.6}
.stmt span{color:var(--steel)}
.pillars{border-top:2px solid var(--ink)}
.pillars .k{font-family:var(--f);font-weight:700;font-size:13.5px;color:var(--red)}

/* form controls */
select,input:not([type=checkbox]):not([type=radio]):not([type=file]),textarea{border-radius:var(--r)}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23C8102E' stroke-width='2'/%3E%3C/svg%3E");background-size:12px 8px;cursor:pointer}
select:focus,input:focus,textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(200,16,46,.12)}
.finder input:focus,.finder select:focus{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.14)}
.finder select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23FF6B7F' stroke-width='2'/%3E%3C/svg%3E")}
.fld label{font-weight:700}

/* cards & grids: rounded outer frame, red base line on hover */
.inds,.mgrid,.recs,.svl,.vals,.mosaic{border-radius:6px;overflow:hidden}
.finder{border-radius:6px;overflow:hidden}
.mc,.ind,.pc{position:relative}
.mc::after,.ind::after,.pc::after{content:"";position:absolute;inset-inline:0;bottom:0;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
[dir=rtl] .mc::after,[dir=rtl] .ind::after,[dir=rtl] .pc::after{transform-origin:right}
.mc:hover::after,.ind:hover::after,.pc:hover::after{transform:scaleX(1)}
.mc .lab{font-family:var(--f);font-weight:700;letter-spacing:0;background:var(--red);border-radius:3px}
.mc .ty,.ind .code{font-family:var(--f);font-weight:700;letter-spacing:0;text-transform:none;color:var(--steel)}
.ind .code{color:var(--red)}
.route .n,.life .n{font-family:var(--f-display)!important;font-weight:800;color:var(--red)}
.tag{border-radius:var(--r)}
.fig .frame{border-radius:6px}
.pd-top .fig .frame{border-radius:6px}
.qform{border-radius:6px}
.fbox,.wad,.empty{border-radius:6px}

/* tabs: light by default, dark variant inside dark bands */
.tabs{border-bottom:1px solid var(--line)}
.tabs button{color:var(--steel)}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected=true]{color:var(--ink);border-color:var(--red)}
.tabp .top p{color:var(--steel)}
.dark .tabs,.ink .tabs{border-color:var(--line-d)}
.dark .tabs button,.ink .tabs button{color:var(--steel-3)}
.dark .tabs button:hover,.dark .tabs button[aria-selected=true],.ink .tabs button:hover,.ink .tabs button[aria-selected=true]{color:#fff}
.flow .st.io{background:var(--paper)}
.sec:not(.white):not(.dark):not(.ink) .flow .st.io{background:var(--white)}

/* parts block on light */
.sec:not(.dark):not(.ink) .mosaic{background:var(--line);border-color:var(--line)}
.sec:not(.dark):not(.ink) .mosaic a span{background:linear-gradient(transparent,rgba(255,255,255,.97) 40%)}
.sec:not(.dark):not(.ink) .idbox{border-color:var(--line);background:var(--white);border-radius:6px}
.sec:not(.dark):not(.ink) .idbox .ico{border-color:var(--line-2);color:var(--red);border-radius:var(--r)}
.sec:not(.dark):not(.ink) .idbox p{color:var(--steel)}

/* about blocks */
.vals{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.vals>div{background:var(--white);padding:26px 24px}
.vals b{display:block;font-family:var(--f-display);font-size:18px;margin:12px 0 8px}
.vals p{color:var(--steel);font-size:15px}
.vals .ico{color:var(--red)}
.vals .ico svg{width:26px;height:26px}
@media (max-width:1024px){.vals{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.vals{grid-template-columns:1fr}}
.mv{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:2px solid var(--ink)}
.mv>div{padding:26px 0;padding-inline-end:32px}
.mv>div+div{padding-inline-start:32px;border-inline-start:1px solid var(--line)}
.mv h3{font-size:var(--h3);margin-bottom:10px}
.mv p{color:var(--steel);font-size:17px}
@media (max-width:860px){.mv{grid-template-columns:1fr}.mv>div+div{padding-inline-start:0;border-inline-start:0;border-top:1px solid var(--line)}}

/* footer: thin red rule, as on the letterhead frame */
.ft{background:var(--ink);border-top:3px solid var(--red)}
.ft .lg{width:120px}
.ft h4{font-family:var(--f-display);font-weight:700;color:#fff}
.ft .soc a{border-radius:var(--r)}
.legal-name{font-family:var(--f-display);font-weight:700;font-size:15px;color:var(--steel-3);margin-top:10px}
.ft .mark{font-family:var(--f);letter-spacing:0}
.sec.dark+.ft,.sec.ink+.ft{border-top-color:var(--red)}
.qband h2{max-width:16ch}
.qform .btns .btn{flex:1 1 200px}
.wa-tab{font-weight:700}
.rv{transition-duration:.7s}
.qform .btn-wa,.dark .qform .btn-wa,.ink .qform .btn-wa{border-color:var(--wa);color:var(--wa)}
.qform .btn-wa:hover,.dark .qform .btn-wa:hover{background:var(--wa);color:#fff}
