/* SOLID Concrete — Brand Guidelines · option 2 */
@font-face{font-family:"Thmanyah Sans";src:url(fonts/thmanyahsans-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Thmanyah Sans";src:url(fonts/thmanyahsans-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Thmanyah Sans";src:url(fonts/thmanyahsans-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Thmanyah Sans";src:url(fonts/thmanyahsans-Black.woff2) format("woff2");font-weight:900;font-display:swap}

:root{
  --ink:#141412;--ink2:#1D1D1B;--paper:#ECEBE7;--white:#FFFFFF;--or:#E5652C;--grey:#EFEFEF;
  --ease:cubic-bezier(.16,1,.3,1);--ease2:cubic-bezier(.65,0,.35,1);
  --pad:clamp(20px,4.2vw,72px);--max:1520px;--r:18px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:"Thmanyah Sans",system-ui,sans-serif;font-weight:400;background:var(--ink);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
body.is-loading{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
svg use{pointer-events:none}
::selection{background:var(--or);color:var(--ink)}
:focus-visible{outline:2px solid var(--or);outline-offset:3px}
[lang="ar"],.ar{font-family:"Thmanyah Sans",Tahoma,sans-serif}

.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--pad);position:relative}
.t-dark{background:var(--ink);color:#F3F2EE;--mute:#9C9B96;--line:#2E2E2B;--card:#1D1D1B;--card2:#262624}
.t-light{background:var(--paper);color:var(--ink);--mute:#6B6A66;--line:#D2D1CB;--card:#F7F6F3;--card2:#E2E1DC}
.t-white{background:#FFFFFF;color:var(--ink);--mute:#6B6A66;--line:#E3E2DE;--card:#F4F3F0;--card2:#EAE9E5}
.t-orange{background:var(--or);color:var(--ink);--mute:#5A2810;--line:#C9581F;--card:#EC7C47;--card2:#D95C22}
section,footer{position:relative}

.kicker,.st-label,.lbl{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:0}
.st-label{display:flex;align-items:center;gap:8px}
.st-label svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.st-body{font-size:clamp(16px,1.25vw,19px);line-height:1.6;color:var(--mute);margin:0;max-width:52ch}
.note{font-size:14px;line-height:1.6;color:var(--mute);margin:0}
.note b{color:inherit}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}

/* ---------- reveal ---------- */
[data-rv]{opacity:0;transform:translateY(40px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
[data-rv].in{opacity:1;transform:none}
.split .ch{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--ease);transition-delay:calc(var(--i) * 32ms)}
.split .wd{display:inline-block;overflow:hidden;vertical-align:top;white-space:nowrap;padding:.04em 0 .24em;margin:-.04em 0 -.24em}
.split.in .ch,.loaded .hero .split .ch{transform:none}

/* ---------- loader ---------- */
.loader{position:fixed;inset:0;z-index:200;background:var(--ink);color:#F3F2EE;display:grid;place-items:center;transition:clip-path 1.1s var(--ease2);clip-path:inset(0 0 0 0)}
.loaded .loader{clip-path:inset(0 0 100% 0)}
.loader.gone{display:none}
.loader-logo{width:min(64vw,420px)}
.loader-foot{position:absolute;left:var(--pad);right:var(--pad);bottom:32px;display:flex;justify-content:space-between;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#9C9B96}
.loader-num b{font-weight:500;color:#F3F2EE;font-variant-numeric:tabular-nums}
.loader-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--or);transform-origin:0 50%;transform:scaleX(0)}

/* ---------- logo animation ---------- */
.logo-svg{display:block;width:100%;height:auto;overflow:visible}
.logo-anim .m{fill:transparent;stroke:var(--or);stroke-width:.7;stroke-dasharray:420;stroke-dashoffset:420}
.logo-anim .w{fill:var(--wc,#F3F2EE);opacity:0;transform-box:fill-box;transform-origin:50% 100%;transform:translateY(40%)}
.logo-anim.play .m{animation:m-draw 1.2s var(--ease2) .1s forwards,m-fill .6s ease 1.05s forwards}
.logo-anim.play .w{animation:w-in .8s var(--ease) calc(1.05s + var(--i) * 38ms) forwards}
@keyframes m-draw{to{stroke-dashoffset:0}}
@keyframes m-fill{to{fill:var(--or);stroke-width:0}}
@keyframes w-in{to{opacity:1;transform:none}}
.logo-svg.static .m{fill:var(--or)}
.logo-svg.static .w{fill:#F3F2EE}

/* ---------- cursor ---------- */
.cursor{display:none}
@media (hover:hover) and (pointer:fine){
  .has-cursor,.has-cursor a,.has-cursor button,.has-cursor [data-cursor]{cursor:none}
  .has-cursor input[type=range]{cursor:none}
  .has-cursor .tester-text{cursor:text}
  .cursor{display:block;position:fixed;left:0;top:0;z-index:300;pointer-events:none}
  .cursor-dot{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--or);transition:opacity .2s}
  .cursor-ring{position:absolute;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;border:1px solid rgba(229,101,44,.7);display:grid;place-items:center;transition:width .45s var(--ease),height .45s var(--ease),margin .45s var(--ease),background .3s,border-color .3s}
  .cursor-ring em{font-style:normal;font-size:12px;line-height:1.4;font-weight:700;letter-spacing:.06em;color:var(--ink);opacity:0;transform:scale(.6);transition:opacity .25s,transform .45s var(--ease);white-space:nowrap}
  .cursor.is-label .cursor-ring{width:84px;height:84px;margin:-42px 0 0 -42px;background:var(--or);border-color:var(--or)}
  .cursor.is-label .cursor-ring em{opacity:1;transform:none}
  .cursor.is-label .cursor-dot{opacity:0}
  .cursor.is-hover .cursor-ring{width:56px;height:56px;margin:-28px 0 0 -28px}
  .cursor.is-down .cursor-ring{transform:scale(.85)}
  .cursor.is-text .cursor-ring{width:3px;height:34px;margin:-17px 0 0 -1.5px;border-radius:2px;background:var(--or)}
  .cursor.is-hidden{opacity:0}
}

/* ---------- chrome ---------- */
.progress{position:fixed;left:0;top:0;right:0;height:2px;z-index:60;pointer-events:none}
.progress i{display:block;height:100%;background:var(--or);transform-origin:0 50%;transform:scaleX(0)}
.bar{position:fixed;top:14px;left:14px;right:14px;z-index:70;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;transform:translateY(-120%);transition:transform 1s var(--ease) .5s}
.loaded .bar{transform:none}
.bar>*{pointer-events:auto}
.pill{height:46px;padding:0 20px;border-radius:999px;background:rgba(20,20,18,.78);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);color:#F3F2EE;border:1px solid rgba(255,255,255,.08);display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:500;transition:background .3s,transform .5s var(--ease)}
.pill:hover{background:rgba(20,20,18,.92)}
.pill.ghost{background:rgba(20,20,18,.5)}
.bar-logo{padding:0 20px}
.bar-logo .logo-svg{width:118px}
.bar-end{display:flex;gap:8px}
.lang-toggle{padding:0 16px 0 14px;gap:8px}
.lang-toggle svg,.menu-lang svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .8s var(--ease)}
.lang-toggle:hover svg,.menu-lang:hover svg{transform:rotate(180deg)}
.lang-toggle span{font-weight:700;font-size:13px;letter-spacing:.04em}
.menu-lang{display:inline-flex;align-items:center;gap:10px;color:#F3F2EE}
.bar-now{position:absolute;left:50%;transform:translateX(-50%);pointer-events:none}
.bar-now .pill{gap:10px;font-size:13px;padding:0 18px;height:40px}
.bar-now b{color:var(--or);font-weight:500;font-variant-numeric:tabular-nums}
.now-clip{display:inline-block;overflow:hidden;height:1.3em;line-height:1.3em;vertical-align:middle}
.now-clip span{display:block;transition:transform .5s var(--ease)}
.now-clip.swap span{transform:translateY(-110%);transition:none}
.burger{width:18px;height:10px;position:relative;display:inline-block}
.burger b{position:absolute;left:0;right:0;height:1.5px;background:currentColor;border-radius:2px;transition:transform .5s var(--ease),top .5s var(--ease)}
.burger b:first-child{top:1px}.burger b:last-child{top:8px}
.menu-open .burger b:first-child{top:4.5px;transform:rotate(45deg)}
.menu-open .burger b:last-child{top:4.5px;transform:rotate(-45deg)}

/* ---------- menu ---------- */
.menu{position:fixed;inset:0;z-index:65;background:var(--ink);color:#F3F2EE;clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease2);visibility:hidden}
.menu-open .menu{clip-path:inset(0 0 0 0);visibility:visible}
.menu-in{height:100%;display:grid;grid-template-columns:1.2fr 1fr;gap:var(--pad);padding:96px var(--pad) 32px;max-width:var(--max);margin:0 auto}
.menu-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:center}
.menu-list li{overflow:hidden}
.menu-list a{display:flex;align-items:baseline;gap:18px;padding:.08em 0;font-size:clamp(34px,5.4vh,72px);font-weight:900;letter-spacing:-.03em;line-height:1.02;color:#5E5D59;transform:translateY(110%);transition:transform .9s var(--ease),color .3s}
.menu-open .menu-list a{transform:none;transition-delay:calc(.25s + var(--d) * 45ms),0s}
.menu-list a em{font-style:normal;font-size:14px;font-weight:500;letter-spacing:.08em;color:var(--or);width:28px}
.menu-list a:hover,.menu-list a.on{color:#F3F2EE}
.menu-side{display:flex;flex-direction:column;justify-content:center;gap:24px}
.menu-preview{position:relative;aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;background:var(--ink2);opacity:0;transform:scale(.94);transition:opacity .8s var(--ease) .35s,transform 1s var(--ease) .35s}
.menu-open .menu-preview{opacity:1;transform:none}
.mp{position:absolute;inset:0;display:grid;place-items:center;opacity:0;clip-path:inset(100% 0 0 0);transition:clip-path .8s var(--ease),opacity 0s .8s}
.mp.is-on{opacity:1;clip-path:inset(0 0 0 0);transition:clip-path .8s var(--ease),opacity 0s;z-index:1}
.mp img{width:100%;height:100%;object-fit:cover}
.mp-or{position:absolute;inset:0;background:var(--or);display:grid;place-items:center}
.mp-or svg{width:56%;fill:var(--ink)}
.mp-type{position:absolute;inset:0;background:#F3F2EE;color:var(--ink);display:flex;align-items:center;justify-content:center;gap:.2em;font-size:clamp(80px,12vw,200px);font-weight:900;letter-spacing:-.04em}
.mp-type i{font-style:normal;color:var(--or)}
.mp-col{position:absolute;inset:0;display:grid;grid-template-columns:3fr 2fr 1fr 1fr}
.mp-col i:nth-child(1){background:#1D1D1B}.mp-col i:nth-child(2){background:#EFEFEF}.mp-col i:nth-child(3){background:#fff}.mp-col i:nth-child(4){background:var(--or)}
.menu-meta{display:flex;justify-content:space-between;gap:16px;font-size:15px;color:#9C9B96}
.menu-meta a:hover{color:var(--or)}

/* ---------- buttons, segs, chips ---------- */
.btn{display:inline-flex;align-items:center;gap:14px;height:58px;padding:0 26px;border-radius:999px;background:var(--ink);color:#F3F2EE;font-size:16px;font-weight:700;transition:background .3s,color .3s;white-space:nowrap}
.t-dark .btn{background:var(--or);color:var(--ink)}
.t-orange .btn{background:var(--ink);color:#F3F2EE}
.btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s var(--ease)}
.btn:hover svg{transform:translateY(3px)}
.btn .btn-meta{font-size:12px;font-weight:500;letter-spacing:.06em;opacity:.65}
.btn.small{height:40px;padding:0 16px;font-size:13px;gap:8px}
.btn.small svg{width:16px;height:16px}
.btn.ghost{background:transparent;color:inherit;border:1px solid var(--line)}
.btn.big{height:clamp(64px,7vw,96px);padding:0 clamp(26px,3vw,44px);font-size:clamp(18px,2vw,30px);gap:20px}
.btn.big svg{width:28px;height:28px}
.btn.big:hover svg{transform:translate(3px,-3px)}
.mag{will-change:transform}

.seg{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:var(--card2);position:relative}
.seg.wrapx{flex-wrap:wrap;border-radius:16px}
.seg button{height:36px;padding:0 14px;border-radius:999px;font-size:13.5px;font-weight:500;color:var(--mute);transition:background .35s var(--ease),color .3s}
.seg button:hover{color:inherit}
.t-dark .seg button:hover{color:#F3F2EE}
.seg button[aria-pressed="true"]{background:var(--ink);color:#F3F2EE}
.t-dark .seg button[aria-pressed="true"]{background:#F3F2EE;color:var(--ink)}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chips button{width:42px;height:42px;border-radius:50%;background:var(--c);background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);position:relative;transition:transform .4s var(--ease)}
.chips button.ph{background-color:#333}
.chips button:hover{transform:scale(1.08)}
.chips button[aria-pressed="true"]::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1.5px solid var(--or)}
.tog{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:500;cursor:pointer;user-select:none}
.tog input{position:absolute;opacity:0;pointer-events:none}
.tog i{width:40px;height:24px;border-radius:999px;background:var(--card2);position:relative;transition:background .3s}
.tog i::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .45s var(--ease)}
.tog input:checked+i{background:var(--or)}
.tog input:checked+i::after{transform:translateX(16px)}
.tog input:focus-visible+i{outline:2px solid var(--or);outline-offset:2px}
.range{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent}
.range::-webkit-slider-runnable-track{height:2px;background:var(--line)}
.range::-moz-range-track{height:2px;background:var(--line)}
.range::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--or);margin-top:-10px;box-shadow:0 0 0 6px rgba(229,101,44,.18)}
.range::-moz-range-thumb{width:22px;height:22px;border:0;border-radius:50%;background:var(--or)}
.badge{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.06em;background:var(--ink);color:#F3F2EE}

/* ---------- hero ---------- */
.hero{min-height:100svh;overflow:hidden;display:flex;align-items:flex-end}
.hero-grid{position:absolute;inset:0;pointer-events:none}
.hero-grid i{position:absolute;top:0;bottom:0;width:1px;background:#D2D1CB;transform-origin:50% 0;transform:scaleY(0);transition:transform 1.6s var(--ease2)}
.hero-grid i:nth-child(1){left:var(--pad)}.hero-grid i:nth-child(2){left:26%}.hero-grid i:nth-child(3){left:50%}.hero-grid i:nth-child(4){left:74%}.hero-grid i:nth-child(5){right:var(--pad)}
.hero-grid b{position:absolute;left:0;right:0;height:1px;background:#D2D1CB;transform-origin:0 50%;transform:scaleX(0);transition:transform 1.6s var(--ease2)}
.hero-grid b:nth-of-type(1){top:96px}.hero-grid b:nth-of-type(2){top:42%}.hero-grid b:nth-of-type(3){bottom:34%}
.loaded .hero-grid i,.loaded .hero-grid b{transform:none}
.hero-grid i:nth-child(2),.hero-grid b:nth-of-type(2){transition-delay:.1s}.hero-grid i:nth-child(3){transition-delay:.18s}.hero-grid i:nth-child(4),.hero-grid b:nth-of-type(3){transition-delay:.26s}.hero-grid i:nth-child(5){transition-delay:.34s}
.hero-blocks{position:absolute;inset:0;pointer-events:none}
.hb{position:absolute;display:block;transition:clip-path 1.3s var(--ease2),translate .9s var(--ease);clip-path:inset(0 0 100% 0);will-change:transform}
.loaded .hb{clip-path:inset(0 0 0 0)}
.hb-or{left:50%;top:96px;width:24%;height:calc(42% - 96px);background:var(--or);transition-delay:.35s}
.hb-ph{left:74%;top:96px;width:calc(26% - var(--pad));height:calc(66% - 96px);overflow:hidden;transition-delay:.5s}
.hb-ph img{width:100%;height:100%;object-fit:cover;scale:1.25;transition:scale 2.2s var(--ease) .5s}
.loaded .hb-ph img{scale:1}
.hb-ink{left:50%;top:42%;width:12%;height:24%;background:var(--ink);transition-delay:.62s}
.hb-line{left:26%;top:96px;width:48%;height:calc(66% - 96px);display:grid;place-items:center;transition-delay:.2s}
.mk-outline{width:100%;height:auto;fill:none;stroke:var(--or);overflow:visible}
.mk-outline polygon{vector-effect:non-scaling-stroke;stroke-width:1.5px}
.hb-line .mk-outline{width:92%;stroke:var(--ink);opacity:.3}
.hero-copy{position:relative;width:100%;max-width:none;padding:0 var(--pad) 40px}
.hero-eyebrow{display:flex;gap:28px;margin:0 0 22px;font-size:13px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#6B6A66;opacity:0;transition:opacity 1s .9s}
.loaded .hero-eyebrow{opacity:1}
.hero-title{margin:0;font-size:clamp(64px,13.2vw,250px);font-weight:900;letter-spacing:-.055em;line-height:.8}
.hero-title .ln{display:block;overflow:hidden;padding:.02em 0 .06em}
.hero-title em{font-style:normal;color:var(--or)}
.hero .split .ch{transition-delay:calc(.45s + var(--i) * 40ms)}
.hero-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:26px;border-top:1px solid #D2D1CB;padding-top:22px;opacity:0;transform:translateY(20px);transition:opacity 1s var(--ease) 1.1s,transform 1s var(--ease) 1.1s}
.loaded .hero-foot{opacity:1;transform:none}
.hero-foot p{margin:0;font-size:clamp(17px,1.5vw,22px);line-height:1.45;max-width:36ch}
.scroll-cue{display:inline-flex;align-items:center;gap:14px;font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.scroll-cue i{width:46px;height:46px;border-radius:50%;border:1px solid var(--ink);position:relative;overflow:hidden}
.scroll-cue i::before,.scroll-cue i::after{content:"";position:absolute;left:50%;top:50%;width:1.5px;height:16px;background:var(--ink);transform:translate(-50%,-50%)}
.scroll-cue i::after{animation:cue 2s var(--ease) infinite;background:var(--or)}
@keyframes cue{0%{transform:translate(-50%,-200%)}60%,100%{transform:translate(-50%,120%)}}

/* ---------- idea / fill text ---------- */
.idea{padding:clamp(120px,18vw,260px) 0}
.idea .kicker{margin-bottom:36px}
.fill-text{margin:0;font-size:clamp(34px,5.4vw,92px);font-weight:900;line-height:1.02;letter-spacing:-.035em;max-width:17ch}
.fill-text.big{max-width:20ch;margin:clamp(40px,6vw,90px) 0 clamp(80px,10vw,140px)}
.fill-text .fw{color:var(--fo,#34342F);transition:color .45s ease}
.t-light .fill-text .fw,.t-white .fill-text .fw{--fo:#CFCEC8}
.fill-text .fw.on{color:inherit}
.fill-text .hl .fw.on{color:var(--or)}
.fill-text .sq{display:inline-block;width:.72em;height:.72em;border-radius:.1em;background:var(--c);vertical-align:-.04em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transform:scale(0) rotate(-45deg);transition:transform .7s var(--ease)}
.fill-text .sq.on{transform:none}

/* ---------- index / bento ---------- */
.index{padding:clamp(90px,10vw,150px) 0}
.index-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:28px}
.index-note{margin:0;color:var(--mute);font-size:15px}
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(200px,17vw,270px);gap:10px;grid-template-areas:"str logo logo type" "str col img img" "gfx voice img img" "dl dl dl dl"}
.tile{position:relative;border-radius:var(--r);overflow:hidden;padding:22px 24px;display:flex;flex-direction:column;justify-content:space-between;isolation:isolate;transition:transform .7s var(--ease)}
.tile:hover{transform:scale(.985)}
.tile em{font-style:normal;font-size:13px;font-weight:500;letter-spacing:.1em;opacity:.7}
.tile b{font-size:clamp(24px,2.4vw,40px);font-weight:900;letter-spacing:-.03em;line-height:1;position:relative;z-index:2}
.tile>em{position:absolute;right:22px;top:22px}
.tl-str{grid-area:str;background:#252D3A;background:var(--ink);color:#F3F2EE}
.tl-net{position:absolute;left:10%;right:10%;bottom:14%;width:80%;height:auto;overflow:visible}
.tl-net path{fill:none;stroke:#5E5D59;stroke-width:1.2;stroke-dasharray:300;stroke-dashoffset:0;transition:stroke .4s}
.tl-net circle{fill:#F3F2EE;transition:transform .7s var(--ease),fill .4s;transform-box:fill-box;transform-origin:center}
.tl-net rect{fill:var(--or);transition:transform .7s var(--ease);transform-box:fill-box;transform-origin:center}
.tl-str:hover .tl-net path{stroke:var(--or);animation:dash 1.2s var(--ease2)}
.tl-str:hover .tl-net circle{transform:scale(1.5)}
.tl-str:hover .tl-net rect{transform:rotate(45deg) scale(1.3)}
@keyframes dash{from{stroke-dashoffset:300}to{stroke-dashoffset:0}}
.tl-logo{grid-area:logo;background:var(--or);color:var(--ink)}
.tl-mark{position:absolute;right:7%;bottom:14%;width:44%}
.tl-mark svg{width:100%;fill:var(--ink);overflow:visible}
.tl-mark .pa,.tl-mark .pb{transition:transform .9s var(--ease)}
.tl-logo:hover .pa{transform:translate(-10px,-8px)}
.tl-logo:hover .pb{transform:translate(12px,8px)}
.tl-type{grid-area:type;background:#FFFFFF}
.tl-aa{position:absolute;right:18px;bottom:10px;font-size:clamp(70px,8vw,130px);font-weight:900;letter-spacing:-.05em;line-height:1.15;height:1.15em;overflow:hidden;text-align:right}
.tl-aa span{display:block;height:1.15em;transition:transform .8s var(--ease)}
.tl-aa .ar{color:var(--or)}
.tl-type:hover .tl-aa span{transform:translateY(-100%)}
.tl-col{grid-area:col;background:var(--card2)}
.tl-stripes{position:absolute;left:0;right:0;bottom:0;height:52%;display:flex}
.tl-stripes i{flex:1;transition:flex .8s var(--ease)}
.tl-stripes i:nth-child(1){background:var(--ink);flex:3}.tl-stripes i:nth-child(2){background:#EFEFEF}.tl-stripes i:nth-child(3){background:#fff}.tl-stripes i:nth-child(4){background:var(--or)}
.tl-col:hover .tl-stripes i:nth-child(1){flex:1}.tl-col:hover .tl-stripes i:nth-child(4){flex:3}
.tl-img{grid-area:img;color:#F3F2EE}
.tl-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;transition:transform 1.4s var(--ease)}
.tl-img::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(20,20,18,.45),rgba(20,20,18,0) 45%)}
.tl-img:hover img{transform:scale(1.07)}
.tl-img b{order:-1}
.tl-gfx{grid-area:gfx;background:var(--ink);color:#F3F2EE}
.tl-cut{position:absolute;inset:0;z-index:0}
.tl-cut i{position:absolute;bottom:0;height:46%;width:60%;background:var(--or);clip-path:polygon(28% 0,100% 0,72% 100%,0 100%);transition:transform .9s var(--ease)}
.tl-cut i:first-child{right:-12%}
.tl-cut i:last-child{right:-40%;background:#3A3A36}
.tl-gfx:hover .tl-cut i:first-child{transform:translateX(-22%)}
.tl-gfx:hover .tl-cut i:last-child{transform:translateX(-30%)}
.tl-voice{grid-area:voice;background:#FFFFFF}
.tl-q{position:absolute;right:18px;bottom:-.28em;font-size:clamp(110px,11vw,190px);font-weight:900;color:var(--or);line-height:1;letter-spacing:-.05em;transition:letter-spacing .8s var(--ease)}
.tl-voice:hover .tl-q{letter-spacing:.08em}
.tl-dl{grid-area:dl;background:var(--ink);color:#F3F2EE;flex-direction:row;align-items:center;justify-content:flex-start;gap:28px}
.tl-dl>em{position:static;order:-1}
.tl-dl .tl-sub{color:#9C9B96;font-size:15px;margin-left:auto;margin-right:90px}
.tl-arrow{position:absolute;right:22px;top:50%;width:62px;height:62px;margin-top:-31px;border-radius:50%;background:var(--or);color:var(--ink);display:grid;place-items:center;transition:transform .7s var(--ease)}
.tl-arrow svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tl-dl:hover .tl-arrow{transform:rotate(-90deg) scale(1.08)}

/* ---------- chapter frame ---------- */
.chapter{padding:clamp(110px,12vw,190px) 0 clamp(100px,11vw,170px)}
.chapter::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,var(--line) 1px,transparent 1px);background-size:25% 100%;background-position:0 0;opacity:.45;mask-image:linear-gradient(to bottom,#000,transparent 480px);-webkit-mask-image:linear-gradient(to bottom,#000,transparent 480px)}
.chead{display:grid;grid-template-columns:minmax(80px,1fr) 3fr;grid-template-areas:"num title" ". lead";column-gap:var(--pad);row-gap:clamp(28px,3vw,48px);margin-bottom:clamp(80px,9vw,140px);position:relative}
.chead-num{grid-area:num;font-size:clamp(18px,1.6vw,24px);font-weight:500;color:var(--or);padding-top:.6em;font-variant-numeric:tabular-nums}
.t-orange .chead-num{color:var(--ink)}
.chead>div{grid-area:title}
.chead .kicker{margin-bottom:14px}
.chead-title{margin:0;font-size:clamp(46px,8.4vw,170px);font-weight:900;letter-spacing:-.055em;line-height:.84}
.chead-lead{grid-area:lead;margin:0;font-size:clamp(20px,2.1vw,34px);line-height:1.3;letter-spacing:-.01em;max-width:34ch;font-weight:400}
.chead-lead b{font-weight:700}

/* ---------- strategy ---------- */
.statement{display:grid;grid-template-columns:1fr 3fr;gap:var(--pad);padding:clamp(40px,5vw,72px) 0;border-top:1px solid var(--line)}
.statement .st-label{padding-top:1.2em}
.st-big{margin:0 0 28px;font-size:clamp(40px,5.6vw,96px);font-weight:900;letter-spacing:-.04em;line-height:.95;max-width:14ch}
.statement .st-body{grid-column:2}
.promise{border-top:1px solid var(--line);padding:clamp(40px,5vw,72px) 0}
.promise-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}
.promise-stage{display:grid;min-height:clamp(190px,21vw,340px);align-items:center;border-radius:var(--r);background:var(--card);padding:clamp(18px,2vw,30px) clamp(24px,4vw,64px);overflow:hidden}
.pr{grid-area:1/1;margin:0;font-size:clamp(46px,7.6vw,138px);font-weight:900;letter-spacing:-.045em;line-height:1;opacity:0;transform:translateY(40%);filter:blur(8px);transition:opacity .7s var(--ease),transform .9s var(--ease),filter .7s}
.pr span{color:var(--or)}
.pr-ar{letter-spacing:0;text-align:right;line-height:1.5;font-size:clamp(38px,6vw,108px)}
.pr.is-on{opacity:1;transform:none;filter:none}
.promise-note{margin:18px 0 0;color:var(--mute);font-size:15px}
.pillars{border-top:1px solid var(--line);padding-top:clamp(40px,5vw,72px)}
.pillars-head{display:grid;grid-template-columns:1fr 3fr;gap:var(--pad);margin-bottom:32px}
.pillar-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.pillar-list li{position:relative;display:grid;grid-template-columns:1fr 1.6fr 1.4fr;gap:var(--pad);align-items:center;padding:clamp(20px,2.4vw,34px) 0;border-bottom:1px solid var(--line);overflow:hidden;isolation:isolate}
.pillar-list li::before{content:"";position:absolute;inset:0;background:var(--or);z-index:-1;transform:scaleY(0);transform-origin:50% 100%;transition:transform .6s var(--ease)}
.pillar-list li:hover::before{transform:none}
.pillar-list li:hover{color:var(--ink)}
.pillar-list em{font-style:normal;font-size:14px;color:var(--or);transition:color .3s;padding-left:4px}
.pillar-list li:hover em,.pillar-list li:hover span{color:var(--ink)}
.pillar-list b{font-size:clamp(26px,3.2vw,52px);font-weight:900;letter-spacing:-.035em;line-height:1;transition:transform .6s var(--ease)}
.pillar-list li:hover b{transform:translateX(14px)}
.pillar-list span{color:var(--mute);font-size:clamp(15px,1.2vw,18px);transition:color .3s}
.areweb{margin-top:clamp(70px,8vw,120px)}
.areweb-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px}
.switch{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:var(--card2)}
.switch button{position:relative;z-index:1;height:42px;padding:0 22px;font-size:15px;font-weight:700;color:var(--mute);transition:color .4s}
.switch button[aria-pressed="true"]{color:var(--ink)}
.switch i{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:#F3F2EE;transition:transform .6s var(--ease),background .4s}
.switch[data-v="not"] i{transform:translateX(100%);background:var(--or)}
.areweb-lists{display:grid;border-radius:var(--r);overflow:hidden}
.areweb-lists ul{grid-area:1/1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.areweb-lists li{background:var(--card);border-radius:14px;padding:clamp(22px,2.6vw,38px);font-size:clamp(19px,2vw,30px);font-weight:700;letter-spacing:-.02em;line-height:1.15;min-height:clamp(120px,11vw,170px);display:flex;align-items:flex-end;transition:opacity .5s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--k) * 60ms)}
.areweb-lists .not li{background:#2A1A12;color:#F3C9B4;text-decoration:line-through;text-decoration-color:var(--or);text-decoration-thickness:2px}
.areweb-lists[data-v="are"] .not li,.areweb-lists[data-v="not"] .are li{opacity:0;transform:translateY(24px);pointer-events:none;transition-delay:0s}

/* ---------- logo ---------- */
.anatomy{display:grid;grid-template-columns:2fr 1fr;gap:10px;margin-bottom:10px}
.anatomy-stage{border-radius:var(--r);background:var(--ink);display:grid;place-items:center;padding:clamp(40px,8vw,120px) clamp(24px,6vw,100px);min-height:clamp(320px,34vw,520px)}
.anatomy-stage .logo-anim{width:100%;max-width:640px}
.anatomy-stage .m,.anatomy-stage .w{transition:opacity .5s var(--ease)}
.anatomy-stage.focus-m .w,.anatomy-stage.focus-w .m{opacity:.12!important}
.anatomy-side{border-radius:var(--r);background:var(--card);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;gap:10px}
.anatomy-side .st-label{margin-bottom:auto}
.anat{text-align:start;display:grid;grid-template-columns:36px 1fr;gap:4px 12px;padding:18px;border-radius:14px;transition:background .35s}
.anat:hover,.anat.on{background:var(--card2)}
.anat em{grid-row:span 2;font-style:normal;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#F3F2EE;font-size:13px;font-weight:700;transition:background .3s}
.anat:hover em{background:var(--or);color:var(--ink)}
.anat b{font-size:22px;font-weight:900;letter-spacing:-.02em}
.anat span{color:var(--mute);font-size:14px;line-height:1.5}

.lab{display:grid;grid-template-columns:2fr 1fr;gap:10px}
.lab-stage{position:relative;border-radius:var(--r);min-height:clamp(400px,40vw,620px);display:grid;place-items:center;overflow:hidden;transition:background-color .6s var(--ease);background-color:#fff;--gl:rgba(20,20,18,.08)}
.lab-stage[data-bg="grey"]{background-color:#EFEFEF}
.lab-stage[data-bg="black"]{background-color:var(--ink);--gl:rgba(255,255,255,.08)}
.lab-stage[data-bg="orange"]{background-color:var(--or);--gl:rgba(20,20,18,.12)}
.lab-stage[data-bg="photo"]{background-color:#222;--gl:rgba(255,255,255,.1)}
.lab-stage::before{content:"";position:absolute;inset:0;background:url(img/wall.jpg) center/cover;opacity:0;transition:opacity .6s}
.lab-stage[data-bg="photo"]::before{opacity:1;box-shadow:inset 0 0 0 2000px rgba(11,11,10,.42)}
.lab-stage.grid::after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--gl) 1px,transparent 1px),linear-gradient(90deg,var(--gl) 1px,transparent 1px);background-size:32px 32px;background-position:center}
.lab-art{position:relative;z-index:1;width:min(56%,520px);display:grid;place-items:center;transition:width .6s var(--ease)}
.lab-art[data-l="vertical-logo"]{width:min(34%,300px)}
.lab-art[data-l="logo-mark"]{width:min(34%,320px)}
.lab-art[data-l="logotype"]{width:min(40%,360px)}
.lab-art[data-l="badge"],.lab-art[data-l="badge-2"]{width:min(34%,300px)}
.lab-art img{width:100%;height:auto;transition:opacity .35s,transform .7s var(--ease)}
.lab-art img.swap{opacity:0;transform:scale(.96)}
.lab-art::after{content:"";position:absolute;inset:calc(var(--x,20px) * -1);border:1px dashed var(--or);opacity:0;transform:scale(.9);transition:opacity .4s,transform .6s var(--ease);pointer-events:none}
.lab-stage.space .lab-art::after{opacity:1;transform:none}
.lab-verdict{position:absolute;left:18px;bottom:18px;z-index:2;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;font-size:13px;font-weight:700;background:#F3F2EE;color:var(--ink);box-shadow:0 4px 18px rgba(0,0,0,.12);transition:background .3s,color .3s}
.lab-verdict::before{content:"";width:8px;height:8px;border-radius:50%;background:#2F9E5B}
.lab-verdict.warn{background:var(--ink);color:#F3F2EE}
.lab-verdict.warn::before{background:var(--or)}
.lab-tag{position:absolute;right:18px;top:18px;z-index:2;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:8px 12px;border-radius:999px;background:rgba(20,20,18,.7);color:#F3F2EE}
.lab-panel{border-radius:var(--r);background:var(--card);padding:clamp(22px,2.4vw,32px);display:flex;flex-direction:column;gap:24px}
.lab-group{display:flex;flex-direction:column;gap:12px}
.lab-group.row{flex-direction:row;gap:24px;flex-wrap:wrap}
.fmts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fmt{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:14px;background:var(--card2);transition:background .3s,color .3s,transform .5s var(--ease)}
.fmt b{font-size:18px;font-weight:900;display:flex;justify-content:space-between;align-items:center}
.fmt b svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fmt span{font-size:12px;color:var(--mute)}
.fmt:hover{background:var(--ink);color:#F3F2EE}
.fmt:hover span{color:#9C9B96}
.lab-panel .all{margin-top:auto;font-size:14px;font-weight:700;display:inline-flex;gap:8px;align-items:center}
.lab-panel .all:hover{color:var(--or)}

.split2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.minsize,.rules-card{border-radius:var(--r);background:var(--card);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;gap:18px}
.ms-stage{height:clamp(200px,18vw,260px);border-radius:14px;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 0 1px transparent;transition:box-shadow .3s}
.ms-stage img{width:220px;max-width:92%;transition:width .08s linear}
.ms-stage.low{box-shadow:inset 0 0 0 2px var(--or)}
.ms-read{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.ms-read b{font-size:34px;font-weight:900;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
#msMsg{font-size:14px;font-weight:700}
#msMsg.low{color:#C2410C}
.cs-stage{border-radius:14px;background:#EFEFEF;display:grid;place-items:center;padding:24px;height:clamp(200px,18vw,260px)}
.cs-stage svg{width:100%;max-height:100%}

.misuse{margin-top:clamp(70px,8vw,120px)}
.misuse-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:24px}
.misuse-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mis{margin:0;border-radius:var(--r);overflow:hidden;background:var(--card)}
.mis-stage{position:relative;aspect-ratio:16/10;background:#fff;display:grid;place-items:center;overflow:hidden}
.mis-stage img{width:52%;transition:transform .8s var(--ease),filter .8s var(--ease),opacity .6s}
.mis figcaption{display:flex;align-items:center;gap:10px;padding:16px 18px;font-size:15px;font-weight:700}
.mis-x,.mis-ok{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;transition:transform .5s var(--ease),opacity .3s}
.mis-x{background:#C2410C;color:#fff}
.mis-ok{background:#2F9E5B;color:#fff;position:absolute;opacity:0;transform:scale(.4) rotate(-90deg)}
.mis figcaption{position:relative}
.mis-x svg,.mis-ok svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
.mis:hover .mis-x{opacity:0;transform:scale(.4) rotate(90deg)}
.mis:hover .mis-ok{opacity:1;transform:none}
.mis-recolour img{filter:hue-rotate(160deg) saturate(1.4)}
.mis-stretch img{transform:scaleX(1.45) scaleY(.8)}
.mis-rotate img{transform:rotate(-14deg)}
.mis-shadow img{filter:drop-shadow(6px 8px 3px rgba(0,0,0,.45)) blur(.3px)}
.mis-fade .mis-stage{background:#D9D8D3}.mis-fade img{opacity:.28}
.mis-crowd .crowd-a,.mis-crowd .crowd-b{position:absolute;font-weight:900;color:var(--ink);transition:transform .8s var(--ease),opacity .5s}
.mis-crowd .crowd-a{left:22%;top:28%;font-size:15px;background:#FACC15;padding:2px 8px;transform:rotate(-8deg)}
.mis-crowd .crowd-b{right:20%;bottom:28%;font-size:13px;font-weight:500}
.mis:hover img{transform:none;filter:none;opacity:1}
.mis-fade:hover .mis-stage{background:#fff}
.mis-crowd:hover .crowd-a{transform:translate(-90px,-50px) rotate(-8deg);opacity:0}
.mis-crowd:hover .crowd-b{transform:translate(80px,50px);opacity:0}
.mis-stage{transition:background .6s}

/* ---------- typography ---------- */
.weights{border-radius:var(--r);background:var(--ink);color:#F3F2EE;padding:clamp(22px,2.6vw,36px);overflow:hidden;position:relative;--mute:#9C9B96;--line:#2E2E2B}
.wt-top{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.wt-now{font-size:15px;color:#9C9B96}
.wt-now b{color:var(--or);font-weight:700}
.wt-spec{display:flex;justify-content:space-between;align-items:center;gap:4vw;padding:clamp(30px,4vw,60px) 0 clamp(40px,5vw,80px);min-height:clamp(240px,26vw,420px)}
.wt-en,.wt-ar{margin:0;font-size:clamp(64px,11vw,200px);line-height:1;letter-spacing:-.05em;font-weight:900;transition:font-weight .3s;white-space:nowrap}
.wt-ar{color:var(--or);letter-spacing:0;line-height:1.45}
.wt-scale{position:relative;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #2E2E2B;padding-top:14px}
.wt-scale span{font-size:13px;color:#6F6E6A;transition:color .3s}
.wt-scale span.on{color:#F3F2EE}
.wt-scale i{position:absolute;top:-1px;left:0;height:2px;width:25%;background:var(--or);transition:transform .5s var(--ease)}
.tester{margin-top:10px;border-radius:var(--r);background:var(--card);padding:clamp(22px,2.6vw,36px)}
.tester-bar{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;padding-bottom:22px;border-bottom:1px solid var(--line)}
.tester-bar .size{display:flex;align-items:center;gap:12px;min-width:220px;flex:1;max-width:340px}
.tester-bar output{font-size:13px;color:var(--mute);width:30px;font-variant-numeric:tabular-nums}
.tester-text{margin:0;padding:clamp(30px,4vw,60px) 0 10px;font-size:88px;font-weight:900;line-height:1.05;letter-spacing:-.035em;outline:none;min-height:1.4em;overflow-wrap:anywhere;caret-color:var(--or)}
.tester-text[dir="rtl"]{letter-spacing:0}
.tester-hint{margin:0;font-size:13px;color:var(--mute)}
.glyphs{margin-top:10px;display:grid;grid-template-columns:1fr 2fr;gap:10px}
.glyph-big{border-radius:var(--r);background:var(--or);color:var(--ink);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(22px,2.6vw,36px);min-height:360px;position:relative;overflow:hidden}
.glyph-big b{font-size:clamp(180px,22vw,340px);font-weight:900;line-height:.9;letter-spacing:-.04em;flex:1;display:grid;place-items:center}
.glyph-big .lbl{color:var(--ink);opacity:.7;order:-1}
.glyph-big b.pop{animation:pop .5s var(--ease)}
@keyframes pop{from{transform:scale(.8);opacity:.3}}
.glyph-grid{border-radius:var(--r);background:var(--card);display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));padding:12px;gap:2px;align-content:start}
.glyph-grid button{aspect-ratio:1;border-radius:10px;font-size:22px;font-weight:700;display:grid;place-items:center;transition:background .2s,color .2s}
.glyph-grid button:hover,.glyph-grid button.on{background:var(--ink);color:#F3F2EE}
.scale{margin-top:clamp(70px,8vw,120px)}
.scale .st-label{margin-bottom:20px}
.sc-row{display:grid;grid-template-columns:1fr 3fr;gap:var(--pad);align-items:center;padding:clamp(18px,2vw,30px) 0;border-top:1px solid var(--line)}
.sc-meta{font-size:13px;line-height:1.6;color:var(--mute)}
.sc-row p{margin:0;letter-spacing:-.02em;line-height:1.05}
.sc-s1{font-size:clamp(48px,6.6vw,96px);font-weight:900;letter-spacing:-.045em!important}
.sc-s2{font-size:clamp(32px,3.9vw,56px);font-weight:900;letter-spacing:-.035em!important}
.sc-s3{font-size:clamp(22px,2.1vw,30px);font-weight:700}
.sc-s4{font-size:17px;line-height:1.6!important;letter-spacing:0!important;max-width:60ch}
.sc-s5{font-size:13px;font-weight:500;letter-spacing:.14em!important}
.res{margin-top:clamp(60px,7vw,100px);display:flex;justify-content:space-between;align-items:center;gap:24px;padding:clamp(24px,3vw,40px);border-radius:var(--r);background:var(--card)}
.res .st-label{margin-bottom:8px}

/* ---------- colour ---------- */
.sw-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.swatches{display:flex;gap:10px;height:clamp(420px,42vw,620px)}
.swatch{flex:1;position:relative;border-radius:var(--r);background:var(--c);color:var(--t);text-align:start;padding:clamp(18px,2vw,28px);display:flex;flex-direction:column;overflow:hidden;transition:flex 1s var(--ease)}
.swatch:first-child{flex:1.6}.swatch:nth-child(2){flex:1.6;box-shadow:inset 0 0 0 1px #2E2E2B}
.swatches:hover .swatch{flex:.8}
.swatches .swatch:hover{flex:2.4}
.sw-name{font-size:clamp(22px,2vw,32px);font-weight:900;letter-spacing:-.02em;line-height:1}
.sw-role{font-size:13px;margin-top:8px;opacity:.7}
.sw-val{margin-top:auto;font-size:clamp(22px,2.4vw,40px);font-weight:700;letter-spacing:-.01em;white-space:nowrap;font-variant-numeric:tabular-nums}
.sw-val.flip{animation:flip .5s var(--ease)}
@keyframes flip{from{transform:translateY(40%);opacity:0}}
.sw-pan{font-size:13px;opacity:.7;margin-top:6px;white-space:nowrap}
.swatch::after{content:attr(data-copied);position:absolute;right:18px;top:18px;font-size:12px;font-weight:700;padding:6px 10px;border-radius:999px;background:var(--t);color:var(--c);opacity:0;transform:translateY(-8px);transition:opacity .3s,transform .5s var(--ease)}
.swatch.copied::after{opacity:1;transform:none}
.balance{margin-top:clamp(70px,8vw,120px)}
.balance .st-label{margin-bottom:18px}
.bal-bar{display:flex;height:clamp(90px,9vw,130px);border-radius:var(--r);overflow:hidden;margin-bottom:16px}
.bal-bar i{width:0;background:var(--c);display:flex;align-items:flex-end;padding:14px 16px;font-style:normal;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;transition:width 1.6s var(--ease2)}
.balance.in .bal-bar i{width:var(--w)}
.bal-bar i:nth-child(2){transition-delay:.15s}.bal-bar i:nth-child(3){transition-delay:.3s}
.cc{margin-top:10px;display:grid;grid-template-columns:2fr 1fr;gap:10px}
.cc-stage{border-radius:var(--r);min-height:clamp(340px,32vw,480px);display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,4vw,64px);background:#141412;color:#E5652C;transition:background .6s var(--ease),color .6s var(--ease);box-shadow:inset 0 0 0 1px #2E2E2B}
.cc-aa{margin:0;font-size:clamp(110px,15vw,240px);font-weight:900;line-height:.9;letter-spacing:-.05em}
.cc-line{margin:14px 0 0;font-size:clamp(18px,1.6vw,24px);font-weight:500}
.cc-panel{border-radius:var(--r);background:var(--card);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;gap:12px}
.cc-panel .st-label{margin-bottom:12px}
.cc-panel .chips{margin-bottom:12px}
.cc-out{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:18px}
.cc-out b{font-size:clamp(34px,3.4vw,52px);font-weight:900;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.t-dark .badge{background:#F3F2EE;color:var(--ink)}
.badge.fail{background:#C2410C;color:#fff}
.badge.mid{background:var(--or);color:var(--ink)}

/* ---------- imagery ---------- */
.principles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.principles li{border-radius:var(--r);background:var(--card);padding:clamp(20px,2.2vw,30px);display:flex;flex-direction:column;gap:12px;min-height:240px}
.principles em{font-style:normal;font-size:13px;color:var(--or);font-weight:500}
.principles b{font-size:clamp(20px,1.8vw,26px);font-weight:900;letter-spacing:-.02em;line-height:1.05;margin-top:auto}
.principles span{color:var(--mute);font-size:15px;line-height:1.5}
.pin{height:400vh}
.pin-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:24px}
.pin-head{display:flex;justify-content:space-between;align-items:baseline;max-width:none}
.pin-count{margin:0;font-size:15px;color:var(--mute);font-variant-numeric:tabular-nums}
.pin-count b{color:var(--ink);font-weight:700}
.pin-track{display:flex;gap:14px;padding:0 var(--pad);will-change:transform;width:max-content}
.shot{position:relative;margin:0;height:min(64vh,640px);aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;flex:none;background:#ccc}
.shot.sq{aspect-ratio:1}
.shot img{width:100%;height:100%;object-fit:cover;transform:scale(1.12) translateX(var(--px,0));transition:transform .2s linear}
.shot::after{content:"";position:absolute;inset:auto 0 0 0;height:40%;background:linear-gradient(to top,rgba(11,11,10,.6),transparent);pointer-events:none}
.shot figcaption{position:absolute;z-index:1;left:18px;bottom:16px;right:80px;display:flex;gap:12px;align-items:baseline;color:#F3F2EE;font-size:15px;font-weight:500;text-shadow:0 1px 16px rgba(0,0,0,.5)}
.shot figcaption span{font-size:12px;color:var(--or);font-weight:700}
.shot-dl{position:absolute;z-index:2;right:16px;bottom:16px;width:48px;height:48px;border-radius:50%;background:#F3F2EE;color:var(--ink);display:grid;place-items:center;transform:scale(.8);opacity:0;transition:transform .5s var(--ease),opacity .3s,background .3s}
.shot-dl svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.shot:hover .shot-dl,.shot-dl:focus-visible{transform:none;opacity:1}
.shot-dl:hover{background:var(--or)}
.pin-end{flex:none;height:min(64vh,640px);aspect-ratio:3/4;border-radius:var(--r);background:var(--ink);color:#F3F2EE;padding:28px;display:flex;flex-direction:column;position:relative;transition:background .4s}
.pin-end:hover{background:var(--or);color:var(--ink)}
.pin-end span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.pin-end b{margin-top:auto;font-size:clamp(34px,3.4vw,56px);font-weight:900;letter-spacing:-.04em;line-height:.95}
.pin-end em{font-style:normal;font-size:13px;opacity:.7;margin-top:14px}
.pin-end svg{position:absolute;right:26px;top:26px;width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pin-bar{height:2px;max-width:none}
.pin-bar::before{content:"";position:absolute;left:var(--pad);right:var(--pad);height:2px;background:var(--line)}
.pin-bar i{position:absolute;left:var(--pad);right:var(--pad);height:2px;background:var(--ink);transform-origin:0 50%;transform:scaleX(0)}
.avoid-sec{padding:0 0 clamp(100px,11vw,170px)}
.avoid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.av{border-radius:var(--r);padding:clamp(24px,3vw,44px)}
.av.use{background:var(--card)}
.av.no{background:var(--ink);color:#F3F2EE;--mute:#9C9B96}
.av .st-label{margin-bottom:22px}
.av.use .st-label{color:#2F7A4B}
.av.no .st-label{color:var(--or)}
.av ul{list-style:none;margin:0;padding:0}
.av li{padding:16px 0;border-top:1px solid var(--line);font-size:clamp(17px,1.5vw,22px);font-weight:500;line-height:1.3}
.av.no li{border-color:#2E2E2B}

/* ---------- graphics ---------- */
.cut-scene{position:absolute;left:0;right:0;top:0;height:min(100vh,900px);overflow:hidden;pointer-events:none}
.cut{position:absolute;display:block;height:34%;width:70%;clip-path:polygon(20% 0,100% 0,80% 100%,0 100%);will-change:transform}
.c1{right:-30%;top:8%;background:#D45B22}
.c2{right:-46%;top:45%;background:#F08A5A}
.c3{left:-40%;bottom:-6%;background:#CF5820}
#graphics .wrap{z-index:1}
.rules{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}
.rules li{padding:clamp(24px,3vw,40px) clamp(0px,2vw,28px) clamp(24px,3vw,40px) 0;border-bottom:1px solid var(--ink);display:flex;flex-direction:column;gap:10px}
.rules li:not(:nth-child(3n)){border-right:1px solid var(--ink)}
.rules li:not(:nth-child(3n+1)){padding-left:clamp(16px,2vw,28px)}
.rules em{font-style:normal;font-size:13px;font-weight:700}
.rules b{font-size:clamp(24px,2.6vw,42px);font-weight:900;letter-spacing:-.03em;line-height:1;margin-top:clamp(20px,3vw,50px)}
.rules span{font-size:16px;line-height:1.5;color:#3B1A0A;max-width:32ch}
.outline-scene{position:relative;height:clamp(560px,72vw,1000px);margin:clamp(80px,9vw,140px) 0;background:var(--ink);color:#F3F2EE;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:0 var(--pad)}
.os-mark{position:absolute;left:-12%;top:50%;width:130%;transform:translateY(-50%);will-change:transform}
.os-mark .mk-outline{stroke:#4A4A45}
.os-text{position:relative;margin:0;font-size:clamp(46px,7.4vw,130px);font-weight:900;letter-spacing:-.045em;line-height:.95;max-width:1520px;margin-inline:auto;width:100%}
.os-text span{color:var(--or)}
.os-cap{position:absolute;left:var(--pad);bottom:28px;margin:0;font-size:13px;color:#9C9B96}
.motion{display:grid;grid-template-columns:2fr 1fr;gap:10px}
.motion-stage{position:relative;border-radius:var(--r);background:var(--ink);min-height:clamp(320px,30vw,460px);display:grid;place-items:center;padding:clamp(30px,6vw,90px)}
.motion-stage .logo-anim{width:100%;max-width:560px}
.motion-stage .btn{position:absolute;right:18px;bottom:18px;color:#F3F2EE;border-color:#3A3A36}
.motion-side{border-radius:var(--r);background:var(--card);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;gap:16px}
.motion-side .st-body{color:var(--ink)}
.curve{width:100%;margin-top:auto;overflow:visible}
.curve-grid{stroke:var(--line);stroke-width:1;fill:none;stroke-dasharray:4 4}
.curve-line{fill:none;stroke:var(--ink);stroke-width:2.5;stroke-dasharray:260;stroke-dashoffset:260;transition:stroke-dashoffset 1.6s var(--ease2) .2s}
.motion.in .curve-line{stroke-dashoffset:0}
.curve circle{fill:var(--ink)}

/* ---------- voice ---------- */
.traits{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--pad);align-items:center}
.trait-list{list-style:none;margin:0;padding:0}
.trait-list li{font-size:clamp(46px,7vw,124px);font-weight:900;letter-spacing:-.05em;line-height:.92;color:#CFCEC8;cursor:default;transition:color .4s,transform .7s var(--ease);width:max-content;max-width:100%}
.trait-list li.on{color:var(--ink);transform:translateX(clamp(10px,2vw,30px))}
.trait-list li.on::before{content:"";display:inline-block;width:.34em;height:.34em;background:var(--or);margin-right:.18em;vertical-align:.18em;clip-path:polygon(30% 0,100% 0,70% 100%,0 100%)}
.trait-desc{margin:0;font-size:clamp(22px,2.3vw,36px);line-height:1.25;letter-spacing:-.015em;font-weight:500;min-height:4em;transition:opacity .3s}
.trait-desc.swap{opacity:0}
.say{margin-top:clamp(80px,9vw,140px)}
.say .st-label{margin-bottom:20px}
.say-row{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--pad);align-items:baseline;padding:clamp(18px,2vw,28px) 0;border-top:1px solid var(--line)}
.say-row b{font-size:clamp(22px,2.2vw,34px);font-weight:900;letter-spacing:-.025em;line-height:1.05}
.say-row s{position:relative;text-decoration:none;color:var(--mute);font-size:clamp(17px,1.4vw,20px);width:max-content;max-width:100%}
.say-row s::after{content:"";position:absolute;left:-2px;right:-2px;top:55%;height:2px;background:var(--or);transform:scaleX(0);transform-origin:0 50%;transition:transform .8s var(--ease2) .3s}
.say.in s::after{transform:none}
.say-row:nth-child(3) s::after{transition-delay:.45s}.say-row:nth-child(4) s::after{transition-delay:.6s}.say-row:nth-child(5) s::after{transition-delay:.75s}.say-row:nth-child(6) s::after{transition-delay:.9s}
.say-row span{color:var(--mute);font-size:15px}
.tone{margin-top:clamp(80px,9vw,140px)}
.tone-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.tone-tabs button{height:44px;padding:0 20px;border-radius:999px;border:1px solid var(--line);font-size:15px;font-weight:500;transition:background .3s,color .3s,border-color .3s}
.tone-tabs button[aria-selected="true"]{background:var(--ink);color:#F3F2EE;border-color:var(--ink)}
.tone-stage{display:grid;border-radius:var(--r);background:var(--ink);color:#F3F2EE;min-height:clamp(300px,28vw,440px);overflow:hidden}
.tone-card{grid-area:1/1;padding:clamp(26px,4vw,64px);display:flex;flex-direction:column;justify-content:center;gap:18px;opacity:0;transform:translateY(30px);transition:opacity .5s,transform .8s var(--ease);pointer-events:none}
.tone-card.is-on{opacity:1;transform:none;pointer-events:auto}
.tone-card .lbl{color:var(--or)}
.tone-card p{margin:0;font-size:clamp(30px,4.4vw,72px);font-weight:900;letter-spacing:-.035em;line-height:1}
.tone-card p.ar,.tone-card p.en{font-size:clamp(24px,3vw,48px);letter-spacing:0;line-height:1.45;color:#9C9B96}
.tone-card p.ar{text-align:right}
.tone-card p.en{text-align:start;letter-spacing:-.02em;line-height:1.1}

/* ---------- downloads ---------- */
.dl-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.dl-row{position:relative;display:grid;grid-template-columns:60px 1.3fr 1.3fr 140px 60px;gap:20px;align-items:center;padding:clamp(18px,2vw,28px) 0;border-bottom:1px solid var(--line);isolation:isolate;transition:padding .6s var(--ease),color .3s}
.dl-row::before{content:"";position:absolute;inset:0 calc(var(--pad) * -1);background:var(--ink);z-index:-1;transform:scaleY(0);transform-origin:50% 100%;transition:transform .5s var(--ease)}
.dl-row:hover{color:#F3F2EE;padding-left:18px}
.dl-row:hover::before{transform:none}
.dl-row em{font-style:normal;font-size:13px;color:var(--or);font-weight:700}
.dl-row b{font-size:clamp(22px,2.4vw,38px);font-weight:900;letter-spacing:-.03em;line-height:1}
.dl-d,.dl-s{font-size:14px;color:var(--mute);transition:color .3s}
.dl-row:hover .dl-d,.dl-row:hover .dl-s{color:#9C9B96}
.dl-s{text-align:right;font-variant-numeric:tabular-nums}
.dl-ic{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;justify-self:end;transition:background .3s,border-color .3s,color .3s,transform .5s var(--ease)}
.dl-ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.dl-row:hover .dl-ic{background:var(--or);border-color:var(--or);color:var(--ink);transform:rotate(-12deg)}
.dl-preview{position:fixed;left:0;top:0;width:320px;aspect-ratio:4/3;border-radius:14px;overflow:hidden;pointer-events:none;z-index:40;background:var(--ink2);opacity:0;transform:scale(.6);transition:opacity .3s,transform .5s var(--ease);box-shadow:0 30px 60px rgba(0,0,0,.25)}
.dl-preview.show{opacity:1;transform:scale(1)}
.dl-preview .mp{clip-path:none;transition:opacity .25s}
.dl-preview .mp.is-on{clip-path:none}

/* ---------- footer ---------- */
.foot{padding:clamp(100px,11vw,170px) 0 28px;overflow:hidden}
.foot-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}
.foot-ask{margin:14px 0 0;font-size:clamp(46px,7vw,120px);font-weight:900;letter-spacing:-.05em;line-height:.9}
.foot-logo{margin:clamp(80px,10vw,160px) 0 clamp(40px,5vw,70px)}
.foot-bottom{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:24px;align-items:end;border-top:1px solid #2E2E2B;padding-top:24px;font-size:14px;color:#9C9B96}
.legal{display:flex;gap:14px;align-items:center;line-height:1.6}
.legal img{width:34px;height:34px;opacity:.8}
.foot-links{display:flex;gap:24px}
.foot-links a:hover{color:var(--or)}
.foot-copy{margin:0;text-align:right}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:26px;z-index:90;transform:translate(-50%,calc(100% + 60px));background:#F3F2EE;color:var(--ink);padding:14px 22px;border-radius:999px;font-size:14px;font-weight:700;box-shadow:0 20px 40px rgba(0,0,0,.25);transition:transform .6s var(--ease)}
.toast.show{transform:translate(-50%,0)}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .bento{grid-template-columns:repeat(2,1fr);grid-template-areas:"str logo" "str type" "col img" "gfx img" "voice voice" "dl dl"}
  .anatomy,.lab,.cc,.motion,.glyphs{grid-template-columns:1fr}
  .principles{grid-template-columns:1fr 1fr}
  .dl-row{grid-template-columns:44px 1fr 110px 52px}
  .dl-d{display:none}
  .bar-now{display:none}
  .menu-in{grid-template-columns:1fr}
  .menu-side .menu-preview{display:none}
  .menu-side{justify-content:flex-end}
}
@media (max-width:760px){
  :root{--r:14px}
  .hide-sm{display:none}
  .bar{top:10px;left:10px;right:10px}
  .pill{height:42px;padding:0 16px}
  .bar-logo .logo-svg{width:100px}
  .hero-eyebrow{flex-wrap:wrap;gap:6px 16px;font-size:11px}
  .hb-or{left:50%;width:50%;top:80px;height:22%}
  .hb-ph{left:0;top:calc(80px + 22%);width:50%;height:24%}
  .hb-ink{left:50%;top:calc(80px + 22%);width:25%;height:12%}
  .hb-line{left:0;width:100%;top:80px;height:46%}
  .hero-grid i:nth-child(2),.hero-grid i:nth-child(4){display:none}
  .hero-foot{flex-direction:column;align-items:flex-start}
  .bento{grid-template-columns:1fr 1fr;grid-auto-rows:180px;grid-template-areas:"logo logo" "str type" "str col" "img img" "img img" "gfx voice" "dl dl"}
  .tile{padding:18px}
  .tl-dl{flex-direction:column;align-items:flex-start;justify-content:space-between}
  .tl-dl .tl-sub{margin:0;padding-right:70px;font-size:13px}
  .chead{grid-template-columns:1fr;grid-template-areas:"num" "title" "lead";row-gap:18px;margin-bottom:70px}
  .chead-num{padding-top:0}
  .chead-title{font-size:12.4vw}
  .statement,.pillars-head{grid-template-columns:1fr;gap:14px}
  .statement .st-body{grid-column:auto}
  .statement .st-label{padding-top:0}
  .promise-top,.areweb-top,.sw-top,.misuse-head{flex-direction:column;align-items:flex-start}
  .pillar-list li{grid-template-columns:34px 1fr;gap:6px 12px}
  .pillar-list span{grid-column:2}
  .areweb-lists ul{grid-template-columns:1fr}
  .split2,.misuse-grid,.principles,.avoid{grid-template-columns:1fr}
  .misuse-grid{grid-template-columns:1fr 1fr}
  .mis figcaption{font-size:13px;padding:12px}
  .fmts{grid-template-columns:1fr 1fr}
  .wt-spec{flex-direction:column;align-items:flex-start;gap:0}
  .wt-ar{align-self:flex-end}
  .tester-text{font-size:48px}
  .glyph-grid{grid-template-columns:repeat(auto-fill,minmax(44px,1fr))}
  .glyph-big{min-height:260px}
  .sc-row{grid-template-columns:1fr;gap:8px}
  .res{flex-direction:column;align-items:flex-start}
  .btn{white-space:normal;height:auto;min-height:56px;padding:12px 22px}
  .swatches{flex-direction:column;height:auto}
  .swatch,.swatch:first-child,.swatch:nth-child(2){flex:none;min-height:150px}
  .swatches:hover .swatch,.swatches .swatch:hover{flex:none}
  .bal-bar i span{display:none}
  .pin{height:auto}
  .pin-sticky{position:relative;height:auto;padding:10px 0 70px}
  .pin-track{overflow-x:auto;width:auto;scroll-snap-type:x mandatory;padding-bottom:10px;transform:none!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .pin-track::-webkit-scrollbar{display:none}
  .shot,.pin-end{height:auto;width:84vw;scroll-snap-align:center}
  .shot.sq{width:70vw}
  .shot-dl{opacity:1;transform:none;width:42px;height:42px}
  .pin-bar{display:none}
  .rules{grid-template-columns:1fr}
  .rules li{border-right:0!important;padding-left:0!important}
  .traits{grid-template-columns:1fr;gap:24px}
  .say-row{grid-template-columns:1fr;gap:6px}
  .dl-row{grid-template-columns:34px 1fr 48px;gap:12px}
  .dl-s{display:none}
  .dl-row b{font-size:21px}
  .foot-bottom{grid-template-columns:1fr}
  .foot-copy{text-align:start}
  .menu-list a{font-size:clamp(30px,9vw,46px)}
  .menu-meta{flex-direction:column}
}

/* ================= Arabic / RTL ================= */
[dir="rtl"] *{letter-spacing:0!important}
[dir="rtl"] .hero-title{font-size:clamp(64px,12vw,220px);line-height:1.12}
[dir="rtl"] .hero-title .ln{padding:.1em 0 .24em}
[dir="rtl"] .split .wd{padding:.14em 0 .34em;margin:-.14em 0 -.34em}
[dir="rtl"] .chead-title{line-height:1.22}
[dir="rtl"] .chead-lead{line-height:1.6}
[dir="rtl"] .fill-text{line-height:1.42}
[dir="rtl"] .st-big{line-height:1.3}
[dir="rtl"] .pr-en{font-size:clamp(40px,6.6vw,120px)}
[dir="rtl"] .pillar-list b,[dir="rtl"] .rules b,[dir="rtl"] .principles b,[dir="rtl"] .dl-row b,[dir="rtl"] .pin-end b,[dir="rtl"] .sw-name,[dir="rtl"] .tile b,[dir="rtl"] .anat b{line-height:1.35}
[dir="rtl"] .areweb-lists li,[dir="rtl"] .say-row b,[dir="rtl"] .av li{line-height:1.5}
[dir="rtl"] .trait-list li{line-height:1.35}
[dir="rtl"] .trait-desc{line-height:1.6}
[dir="rtl"] .tone-card p{line-height:1.45}
[dir="rtl"] .os-text,[dir="rtl"] .foot-ask{line-height:1.3}
[dir="rtl"] .menu-list a{line-height:1.4;font-size:clamp(30px,4.8vh,64px)}
[dir="rtl"] .sc-row p{line-height:1.5}
[dir="rtl"] .cc-aa{line-height:1.35}
[dir="rtl"] .tester-text{line-height:1.6}
[dir="rtl"] .kicker,[dir="rtl"] .st-label,[dir="rtl"] .lbl{font-size:13.5px}
[dir="rtl"] .progress i,[dir="rtl"] .loader-bar,[dir="rtl"] .pin-bar i{transform-origin:100% 50%}
[dir="rtl"] .hero-grid b{transform-origin:100% 50%}
@media (min-width:761px){
  [dir="rtl"] .hb-or{left:26%}
  [dir="rtl"] .hb-ph{left:var(--pad)}
  [dir="rtl"] .hb-ink{left:38%}
}
[dir="rtl"] .tile>em{right:auto;left:22px}
[dir="rtl"] .tl-mark{right:auto;left:7%}
[dir="rtl"] .tl-aa{right:auto;left:18px;text-align:left}
[dir="rtl"] .tl-q{right:auto;left:18px}
[dir="rtl"] .tl-arrow{right:auto;left:22px}
[dir="rtl"] .tl-dl .tl-sub{margin-left:90px;margin-right:auto}
[dir="rtl"] .pillar-list em{padding-left:0;padding-right:4px}
[dir="rtl"] .pillar-list li:hover b{transform:translateX(-14px)}
[dir="rtl"] .switch i{left:auto;right:4px}
[dir="rtl"] .switch[data-v="not"] i{transform:translateX(-100%)}
[dir="rtl"] .tog i::after{left:auto;right:3px}
[dir="rtl"] .tog input:checked+i::after{transform:translateX(-16px)}
[dir="rtl"] .lab-verdict{left:auto;right:18px}
[dir="rtl"] .lab-tag{right:auto;left:18px}
[dir="rtl"] .wt-scale i{left:auto;right:0}
[dir="rtl"] .shot figcaption{left:80px;right:18px}
[dir="rtl"] .shot-dl{right:auto;left:16px}
[dir="rtl"] .pin-end svg{right:auto;left:26px}
[dir="rtl"] .motion-stage .btn{right:auto;left:18px}
[dir="rtl"] .os-mark{left:auto;right:-12%}
[dir="rtl"] .os-cap{left:auto;right:var(--pad)}
[dir="rtl"] .trait-list li.on{transform:translateX(calc(clamp(10px,2vw,30px) * -1))}
[dir="rtl"] .trait-list li.on::before{margin-right:0;margin-left:.18em}
[dir="rtl"] .say-row s::after{transform-origin:100% 50%}
[dir="rtl"] .dl-row:hover{padding-left:0;padding-right:18px}
[dir="rtl"] .dl-s{text-align:left}
[dir="rtl"] .foot-copy{text-align:left}
[dir="rtl"] .scroll-cue i::before,[dir="rtl"] .scroll-cue i::after{left:50%}
[dir="rtl"] .btn.big svg{transform:scaleX(-1)}
[dir="rtl"] .btn.big:hover svg{transform:scaleX(-1) translate(3px,-3px)}
[dir="rtl"] .mono,[dir="rtl"] .sw-val,[dir="rtl"] .cc-out b,[dir="rtl"] .ms-read b{direction:ltr;unicode-bidi:isolate}
@media (max-width:760px){
  [dir="rtl"] .chead-title{font-size:13vw}
  [dir="rtl"] .menu-list a{font-size:clamp(28px,8.4vw,42px)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
  [data-rv]{opacity:1;transform:none}
  .split .ch{transform:none}
  html{scroll-behavior:auto}
}