/* ============================================================
   ASP design uplift v3.1 — layered on asp.css
   starfield atmosphere · 3D tilt · magnetic CTAs · preloader ·
   scroll progress · word-stagger H2 · back-to-top · details
   All effects gated by prefers-reduced-motion at the bottom.
   ============================================================ */

/* ---- page atmosphere: stars canvas sits above html bg, under body ---- */
html.asp-atmos{background:linear-gradient(180deg,var(--abyss) 0%,var(--deep) 34%,var(--navy) 72%,var(--deep) 100%);min-height:100%}
body.asp-atmos{background:transparent !important}
#stars-canvas{position:fixed;inset:0;z-index:-1;pointer-events:none}

/* ---- gold scroll progress ---- */
.asp-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:120;pointer-events:none;
  background:linear-gradient(90deg,var(--gold),var(--gold2),var(--gold));
  transform-origin:0 50%;transform:scaleX(0);
  box-shadow:0 0 12px rgba(212,168,83,.55)}

/* ---- preloader (once per session, <1s) ---- */
.asp-pre{position:fixed;inset:0;z-index:200;background:linear-gradient(180deg,var(--abyss),var(--deep));
  display:grid;place-items:center;transition:opacity .55s ease,visibility .55s}
.asp-pre.done{opacity:0;visibility:hidden}
.asp-pre .ring{stroke:var(--gold);stroke-width:2.5;fill:none;stroke-dasharray:302;stroke-dashoffset:302;
  animation:aspDraw .8s cubic-bezier(.22,1,.36,1) .05s forwards}
.asp-pre .needle{stroke:var(--gold2);stroke-width:3;fill:none;stroke-linecap:round;stroke-dasharray:80;stroke-dashoffset:80;
  animation:aspDraw .5s cubic-bezier(.22,1,.36,1) .5s forwards}
.asp-pre .core{fill:var(--gold2);opacity:0;animation:aspCore .3s ease .85s forwards}
.asp-pre .word{grid-row:2;color:var(--muted);font-size:11px;letter-spacing:5px;text-transform:uppercase;margin-top:14px;
  opacity:0;animation:aspFade .45s ease .35s forwards}
.asp-pre svg{grid-row:1}
@keyframes aspDraw{to{stroke-dashoffset:0}}
@keyframes aspCore{to{opacity:1}}
@keyframes aspFade{to{opacity:.85}}

/* ---- 3D tilt + cursor glow ---- */
.tilt{transform-style:preserve-3d;will-change:transform;
  transition:transform .45s cubic-bezier(.22,1,.36,1)}
.tilt.tilting{transition:transform .08s linear}
.tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(233,196,120,.13),transparent 65%);
  opacity:0;transition:opacity .35s}
.tilt:hover::after{opacity:1}
.tilt .lift{transform:translateZ(26px)}

/* ---- magnetic buttons ---- */
.btn{transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s,background .3s,color .18s cubic-bezier(.4,0,.2,1)}

/* ---- subpage H2 word stagger (spans injected by uplift.js) ---- */
.sec-head h2 .uw{display:inline-block;opacity:0}
.sec-head.in h2 .uw{animation:aspWord .6s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(var(--i)*.08s)}
@keyframes aspWord{from{opacity:0;transform:translateY(18px) rotate(2deg)}to{opacity:1;transform:none}}
.sec-head h2{position:relative}
.sec-head.in h2::after{content:"";position:absolute;left:0;bottom:-10px;height:2px;width:64px;border-radius:2px;
  background:linear-gradient(90deg,var(--gold),transparent);
  transform:scaleX(0);transform-origin:0 50%;animation:aspLine .7s cubic-bezier(.22,1,.36,1) .35s forwards}
@keyframes aspLine{to{transform:scaleX(1)}}

/* ---- back-to-top compass ---- */
.asp-top{position:fixed;right:22px;bottom:22px;z-index:110;width:46px;height:46px;border-radius:50%;
  border:1px solid rgba(212,168,83,.45);background:rgba(10,31,71,.85);color:var(--gold2);font-size:19px;cursor:pointer;
  display:grid;place-items:center;opacity:0;transform:translateY(14px) scale(.85);pointer-events:none;
  transition:opacity .35s,transform .45s cubic-bezier(.34,1.56,.64,1),border-color .3s;backdrop-filter:blur(8px)}
.asp-top.show{opacity:1;transform:none;pointer-events:auto}
.asp-top:hover{border-color:var(--gold);box-shadow:0 0 22px rgba(212,168,83,.35)}
.asp-top i{font-style:normal;animation:aspSpinHint 7s linear infinite}
@keyframes aspSpinHint{to{transform:rotate(360deg)}}

/* ---- micro-luxury ---- */
::selection{background:var(--gold);color:#0a1a3d}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#071226}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#8a6c34,var(--gold));border-radius:6px;border:2px solid #071226}
::-webkit-scrollbar-thumb:hover{background:var(--gold2)}
html{scroll-behavior:smooth}

/* images/cards never jitter on load */
.ucard,.sch-card,.mcard{backface-visibility:hidden}

/* ---- reduced motion: everything above goes quiet ---- */
@media (prefers-reduced-motion: reduce){
  .asp-pre{display:none}
  #stars-canvas{display:none}
  .tilt,.tilt.tilting{transition:none !important;transform:none !important}
  .tilt::after{display:none}
  .sec-head h2 .uw{opacity:1}
  .sec-head.in h2 .uw{animation:none}
  .sec-head.in h2::after{animation:none;transform:scaleX(1)}
  .asp-top{transition:opacity .3s}
  .asp-top i{animation:none}
  .btn{transition:color .18s}
  html{scroll-behavior:auto}
}


/* ---- v3.2: trilingual brand lockup — EN left · compass center · AR right · slogan beneath ---- */
nav .nav-in{height:58px;padding:0 18px;gap:16px}
.hero{padding-top:88px}
.brand,.topnav .nb{display:grid;grid-template-columns:auto auto auto;align-items:center;column-gap:12px;
  text-decoration:none;line-height:1.18;padding:5px 0;margin:0}
.b-en{justify-self:end;color:#fff;font-weight:800;font-size:14px;letter-spacing:.2px;white-space:nowrap}
.b-logo{width:42px;height:42px;display:inline-block;background-size:contain;background-repeat:no-repeat;
  background-position:center;animation:spin 48s linear infinite;filter:drop-shadow(0 0 8px rgba(212,168,83,.35))}
.b-ar{justify-self:start;color:var(--gold2);font-weight:700;font-size:13.5px;white-space:nowrap;direction:rtl}
.b-slogan{grid-column:1/-1;justify-self:center;text-align:center;font-size:8px;letter-spacing:2.6px;
  text-transform:uppercase;color:var(--muted);white-space:nowrap;margin-top:1px}
.b-slogan .ar{font-size:10px;letter-spacing:0;text-transform:none;color:var(--gold);opacity:.92;margin-left:7px}
@media(max-width:900px){.b-ar{display:none}.brand,.topnav .nb{grid-template-columns:auto auto;column-gap:9px}}


/* ---- v3.3: hero flanked lockup — EN left · big compass center · AR right ---- */
.hero-lockup{display:flex;align-items:center;justify-content:center;
  gap:clamp(20px,3.4vw,44px);flex-wrap:nowrap;width:100%}
.hero-lockup .emblem{
  width:clamp(160px,16vw,240px);height:clamp(160px,16vw,240px);margin-bottom:0;flex:0 0 auto;
  translate:none;filter:none;
}
.hero-lockup .emblem::before{
  content:"";position:absolute;inset:8%;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(212,168,83,.34) 0%,rgba(212,168,83,.1) 46%,transparent 72%);
  box-shadow:0 14px 36px rgba(0,0,0,.4);
}
.hero-lockup .emblem .cimg,
.emblem-spin{
  position:relative;z-index:1;width:100%;height:100%;
  background-size:100% 100%;
  background-position:center;
  animation:spin 38s linear infinite;
  filter:none;
  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform:translateZ(0);
  transform-origin:50% 50%;
}
.hero-lockup .emblem-seal{
  width:clamp(220px,28vw,340px);height:clamp(220px,28vw,340px);
  border-radius:50%;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.45);
}
.hero-lockup .emblem-seal::before{display:none}
.hero-lockup .emblem-seal img{
  width:100%;height:100%;display:block;object-fit:cover;
  border-radius:50%;
}
@media(max-width:880px){
  .hero-lockup{flex-direction:column;gap:20px}
  .hero-lockup .emblem{width:200px;height:200px}
  .hero-lockup .emblem-seal{width:220px;height:220px}
  .hero-lockup h1,.hero-lockup .ar-name{text-align:center;white-space:normal}
}

/* ============================================================
   v4 — THE JOURNEY RENOVATION
   gold rail that draws with scroll · constellation map ·
   scholarship cycle-ribbons · orbital tools ring
   ============================================================ */

/* ---- 1. the journey rail ---- */
#journey-svg{position:absolute;top:0;left:0;width:100%;pointer-events:none;z-index:0}
.jr-line{stroke:url(#jrGrad);stroke-width:2;fill:none;stroke-linecap:round}
.jr-node{fill:#22345e;stroke:rgba(212,168,83,.45);stroke-width:1.5;transition:fill .5s,filter .5s}
.jr-node.passed{fill:var(--gold);filter:drop-shadow(0 0 6px rgba(212,168,83,.8))}
.jr-start{fill:var(--gold2)}
.jr-pulse{fill:none;stroke:rgba(212,168,83,.5);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:jrPulse 2.4s ease-out infinite}
@keyframes jrPulse{from{transform:scale(1);opacity:.55}to{transform:scale(6.5);opacity:0}}
@media(max-width:1100px){.jr-line{stroke-width:1.5}.jr-node{r:3.5}}

/* ---- 2. constellation map (universities) ---- */
.uni-map-wrap{
  position:relative;overflow:hidden;margin-bottom:16px;border-radius:22px;
  border:1px solid rgba(212,168,83,.32);
  background:
    radial-gradient(ellipse 70% 55% at 52% 42%,rgba(24,56,112,.38),transparent 68%),
    radial-gradient(ellipse 40% 36% at 78% 22%,rgba(212,168,83,.09),transparent 62%),
    #041226;
  box-shadow:inset 0 0 90px rgba(0,0,0,.45),0 22px 48px rgba(0,0,0,.28);
}
.uni-map-wrap::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(ellipse at center,transparent 46%,rgba(1,17,43,.55) 100%);
}
.uni-map-chrome{
  position:relative;z-index:3;display:flex;justify-content:space-between;align-items:flex-end;
  gap:12px;padding:14px 18px 0;pointer-events:none;
}
.uni-map-hint{
  font-size:11.5px;letter-spacing:.6px;color:var(--muted);line-height:1.45;text-transform:none;
}
.uni-map-hint b{color:var(--gold2);letter-spacing:.4px}
.uni-map-hint .ar{color:var(--gold);margin-left:6px;font-size:12.5px}
.uni-map-legend{
  display:inline-flex;align-items:center;gap:8px;font-size:11px;color:var(--faint);white-space:nowrap;
}
.uni-map-legend i{
  width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff,#e9c478 42%,rgba(212,168,83,.15) 70%);
  box-shadow:0 0 10px rgba(233,196,120,.55);
}
#uni-map{display:block;width:100%;height:520px;cursor:crosshair;position:relative;z-index:2}
.uni-tip{
  position:absolute;z-index:5;pointer-events:none;min-width:132px;
  background:rgba(6,18,42,.92);border:1px solid rgba(212,168,83,.45);
  border-radius:12px;padding:8px 12px;backdrop-filter:blur(10px);
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}
.uni-tip b{display:block;color:#fff;font-size:13px}
.uni-tip em{display:block;font-style:normal;color:var(--gold2);font-size:11px;margin-top:2px}
.uni-map-hud{
  position:absolute;z-index:4;left:16px;bottom:16px;
  min-width:220px;max-width:min(320px,78%);
  background:rgba(5,16,38,.88);border:1px solid rgba(212,168,83,.4);
  border-radius:16px;padding:14px 16px 13px;backdrop-filter:blur(14px);
  box-shadow:0 16px 36px rgba(0,0,0,.35);
}
.uni-hud-k{font-size:10px;letter-spacing:1.8px;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.uni-map-hud b{display:block;color:#fff;font-size:20px;letter-spacing:-.3px;line-height:1.2}
.uni-map-hud .ar{display:block;color:var(--gold2);font-size:15px;margin-top:2px}
.uni-map-hud em{display:block;font-style:normal;color:var(--muted);font-size:13px;margin:8px 0 10px}
.uni-map-hud a{color:var(--gold2);font-size:13px;font-weight:700}
.uni-map-hud a:hover{color:#fff}
.uni-rose{
  position:absolute;right:16px;bottom:16px;z-index:3;width:52px;height:52px;pointer-events:none;
  border:1px solid rgba(212,168,83,.28);border-radius:50%;opacity:.55;
  background:radial-gradient(circle at 50% 50%,rgba(212,168,83,.08),transparent 70%);
}
.uni-rose::before,.uni-rose::after{
  content:"";position:absolute;left:50%;top:50%;background:rgba(212,168,83,.55);
}
.uni-rose::before{width:1px;height:28px;transform:translate(-50%,-50%)}
.uni-rose::after{width:28px;height:1px;transform:translate(-50%,-50%)}
.uni-rose span{
  position:absolute;top:3px;left:50%;transform:translateX(-50%);
  font-size:8px;letter-spacing:1px;color:var(--gold2);font-weight:800;
}
@media(max-width:700px){
  #uni-map{height:380px}
  .uni-map-chrome{flex-direction:column;align-items:flex-start;gap:6px;padding:12px 14px 0}
  .uni-map-legend{white-space:normal}
  .uni-rose{display:none}
  .uni-map-hud{left:12px;right:12px;bottom:12px;max-width:none;min-width:0}
}

/* ---- 3. scholarship mission ribbons ---- */
.ribbon{display:flex;gap:2px;margin:10px 0 4px;position:relative;height:26px}
.ribbon i{flex:1;background:rgba(193,204,222,.1);border-radius:2px;position:relative;transition:background .3s}
.ribbon i.on{background:linear-gradient(180deg,var(--gold),#b8923f)}
.ribbon i.now{outline:1.5px solid #fff;outline-offset:1.5px}
.r-months{display:flex;gap:2px;margin-bottom:10px}
.r-months s{flex:1;text-align:center;font-size:7.5px;color:var(--faint,#8fa0bd);text-decoration:none;letter-spacing:.4px}
.r-months s.now{color:#fff;font-weight:700}
.st{display:inline-block;font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;border-radius:10px;
  padding:2.5px 9px;margin-left:8px;vertical-align:1.5px}
.st.open{color:#7be3a5;border:1px solid rgba(123,227,165,.4)}
.st.soon{color:var(--gold2);border:1px solid rgba(233,196,120,.4)}

/* ---- v4.2 tools bento: flagship tile + numbered tiles + phase spotlight ---- */
.phase-bar{display:flex;justify-content:center;flex-wrap:wrap;position:relative;margin:26px 0 6px}
.phase-bar::before{content:"";position:absolute;top:50%;left:10%;right:10%;
  border-top:1.5px dashed rgba(212,168,83,.22)}
.phase{position:relative;z-index:1;display:flex;align-items:center;gap:11px;margin:8px;
  background:rgba(10,31,71,.92);border:1px solid rgba(212,168,83,.25);border-radius:14px;
  padding:10px 16px;cursor:pointer;font-family:inherit;transition:all .3s var(--ease-out)}
.phase i{font-style:normal;font-size:10px;letter-spacing:1.5px;color:var(--gold);
  border:1px solid rgba(212,168,83,.4);border-radius:50%;width:27px;height:27px;display:grid;place-items:center;transition:all .3s}
.phase b{display:block;color:#fff;font-size:13.5px;text-align:left}
.phase span{font-size:11px;color:var(--muted);display:block;text-align:left}
.phase em{font-style:normal;font-size:10.5px;color:var(--gold2);background:rgba(212,168,83,.12);padding:2px 8px;border-radius:10px}
.phase:hover{border-color:var(--gold);transform:translateY(-2px)}
.phase.on{background:rgba(212,168,83,.16);border-color:var(--gold);box-shadow:0 0 26px rgba(212,168,83,.28)}
.phase.on i{background:var(--gold);color:#0a1a3d;border-color:var(--gold)}
@media(max-width:700px){.phase span{display:none}.phase-bar::before{display:none}}

#tools .tools-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:14px;counter-reset:tool}
#tools .tcard{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:8px;
  background:rgba(255,255,255,.045);border:1px solid rgba(212,168,83,.2);border-radius:16px;padding:20px;margin:0;
  counter-increment:tool;cursor:pointer;
  transition:transform .35s var(--ease-out),border-color .3s,background .3s,box-shadow .3s,opacity .3s}
#tools .tcard::after{content:counter(tool,decimal-leading-zero);position:absolute;top:14px;right:16px;
  font-size:10px;letter-spacing:1.5px;color:rgba(212,168,83,.6);font-weight:700}
#tools .tcard .ic{width:46px;height:46px;display:grid;place-items:center;flex:0 0 auto;
  background:rgba(212,168,83,.1);border:1px solid rgba(212,168,83,.22);border-radius:12px;
  transition:transform .3s var(--ease-out),background .3s}
#tools .tcard .ic svg{width:22px;height:22px}
#tools .tcard b{font-size:15.5px;color:#fff;line-height:1.3}
#tools .tcard .ar{font-size:12px;color:var(--gold2)}
#tools .tcard p{font-size:12.3px;color:var(--muted);line-height:1.6;margin:0}
#tools .tcard:hover{transform:translateY(-4px);border-color:var(--gold);background:rgba(255,255,255,.07);
  box-shadow:0 14px 34px rgba(0,0,0,.35)}
#tools .tcard:hover .ic{background:rgba(212,168,83,.18);transform:scale(1.07)}
/* flagship tile — the directory */
#tools .tcard:nth-child(1){grid-column:span 2;grid-row:span 2;justify-content:center;gap:11px;
  background:radial-gradient(420px 320px at 85% 12%,rgba(212,168,83,.14),transparent 62%),rgba(255,255,255,.05)}
#tools .tcard:nth-child(1)::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(1.5px 1.5px at 16% 28%,rgba(233,196,120,.55),transparent 60%),
    radial-gradient(1.2px 1.2px at 30% 74%,rgba(214,226,247,.4),transparent 60%),
    radial-gradient(1.7px 1.7px at 10% 84%,rgba(233,196,120,.35),transparent 60%),
    radial-gradient(1.2px 1.2px at 44% 18%,rgba(214,226,247,.35),transparent 60%),
    radial-gradient(1.3px 1.3px at 24% 48%,rgba(233,196,120,.3),transparent 60%)}
#tools .tcard:nth-child(1) .ic{width:66px;height:66px;border-radius:16px}
#tools .tcard:nth-child(1) .ic svg{width:32px;height:32px}
#tools .tcard:nth-child(1) b{font-size:23px}
#tools .tcard:nth-child(1) .ar{font-size:14.5px}
#tools .tcard:nth-child(1) p{font-size:14px;max-width:34ch}
#tools .tcard:nth-child(1)::after{font-size:12px;top:18px;right:20px}
/* phase spotlight */
#tools.phase-on .tcard.fold{display:none}
#tools .tcard.star{border-color:var(--gold);background:rgba(212,168,83,.1);box-shadow:0 0 34px rgba(212,168,83,.28)}
#tools .tcard.star .ic{background:rgba(212,168,83,.22)}
@media(max-width:1079px){#tools .tools-grid{grid-template-columns:repeat(2,1fr)}
  #tools .tcard:nth-child(1){grid-column:span 2;grid-row:auto}}
@media(max-width:640px){#tools .tools-grid{grid-template-columns:1fr}
  #tools .tcard:nth-child(1){grid-column:auto}}

/* RM: quiet everything */
@media (prefers-reduced-motion: reduce){
  .jr-node{transition:none}
  .uni-map-wrap::before{display:none}
  .phase,#tools .tcard,#tools .tcard .ic{transition:none}
}


/* ---- v5.3 back + home icon pair (subpage topnavs) ---- */
.navtools{display:flex;gap:7px;margin-right:8px}
.iconbtn{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;
  background:rgba(255,255,255,.05);border:1px solid rgba(212,168,83,.3);color:var(--muted);
  font-size:14px;cursor:pointer;text-decoration:none;transition:all .2s;line-height:1;font-family:inherit}
.iconbtn:hover{color:var(--gold2);border-color:var(--gold);transform:translateY(-1px)}
@media(max-width:640px){.navtools{margin-right:2px}.iconbtn{width:29px;height:29px;font-size:13px}}

/* ===== v5.5 mobile hardening ===== */
@media(max-width:880px){
  .topnav{flex-wrap:wrap;gap:5px 13px;padding:8px 15px}
  .topnav .nb{font-size:13.5px}
  .topnav .navtools{margin-right:4px}
  .topnav a.nl{font-size:12.5px}
}
canvas{max-width:100%}
#uni-map{width:100%}
select.sel{max-width:100%}
.sch-dest{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:bottom}

/* ===== v5.7 password eye (tool modals + reset page) ===== */
.field{position:relative}
.peye{position:absolute;right:9px;bottom:9px;background:none;border:none;color:var(--muted);font-size:15px;cursor:pointer;padding:3px;line-height:1;opacity:.75;z-index:2}
.peye:hover{opacity:1}
.peye.on{color:var(--gold2);opacity:1}
[dir="rtl"] .peye{right:auto;left:9px}


/* ===== v6.40 / v6.53 mobile: no overlapping type, room under wrapped nav ===== */
@media(max-width:720px){
  html{scroll-padding-top:176px}
  nav .nav-in{flex-wrap:wrap;height:auto!important;min-height:56px;padding:10px 12px}
  nav .nav-in .brand{flex:1 1 100%;justify-content:center}
  nav .nav-links{
    width:100%;margin-left:0!important;margin-right:0!important;
    justify-content:center;flex-wrap:wrap;gap:6px 10px;font-size:12px;line-height:1.2
  }
  nav .navauth{gap:8px}
  header.hero,
  .hero:has(.hero-lockup){
    min-height:0!important;height:auto!important;
    padding-top:176px!important;padding-bottom:24px!important
  }
  .page,main.page,.wrap,.capp,.hubwrap,.rwrap,.box{
    padding-top:176px!important
  }
  .hero-lockup .emblem,
  .hero-lockup .emblem-seal{
    width:min(196px,68vw)!important;height:min(196px,68vw)!important
  }
  .slogan{flex-direction:column;gap:6px;letter-spacing:1.4px;padding:0 10px;text-align:center}
  .slogan .ar{letter-spacing:0;font-size:13px}
  .kicker{flex-wrap:wrap;row-gap:4px}
  .cta-row{width:100%;padding:0 8px}
  .cta-row .btn{flex:1 1 160px;justify-content:center}
  .stats{gap:18px 28px}
  .cs-head{flex-wrap:wrap;row-gap:8px}
  .cs-live{margin-left:0}
  .cs-sim{display:none}
  .cs-sub{flex-direction:column;align-items:flex-start;gap:4px}
  .demo-in input{min-width:0;flex:1 1 100%}
  .fsearch{min-width:0;width:100%}
  .filters{align-items:stretch}
  .filters .sel{width:100%}
  .u-row{flex-wrap:wrap}
  .u-row .ar{flex:1 1 100%;margin-left:0}
  .sch-meta{flex-wrap:wrap;gap:6px}
  .phase-bar{gap:0}
  .uni-map-hint{
    position:static!important;display:block;padding:0;
    letter-spacing:.4px;text-transform:none;white-space:normal;line-height:1.45
  }
  .sch-top{flex-wrap:wrap}
  .sch-dest{white-space:normal;max-width:100%}
  h1,h2,.hero-lockup h1,.hero-lockup .ar-name,.sub,.s-sub{overflow-wrap:anywhere;white-space:normal}
  .dl{grid-template-columns:1fr!important}
  .dl dt{padding-bottom:0;border-bottom:none}
  .cbar{flex-wrap:wrap;justify-content:center;bottom:12px;max-width:calc(100vw - 16px)}
  .covbox{padding:18px;max-height:88dvh}
  table.ctab td:first-child{white-space:normal}
  .ad-kit{overflow:hidden;max-width:100%}
  .free-stamp,
  .hero>.free-stamp,
  html.lang-ar .free-stamp,
  html.lang-ar .hero>.free-stamp,
  html[dir="rtl"] .free-stamp,
  html[dir="rtl"] .hero>.free-stamp{
    position:relative!important;top:auto!important;right:auto!important;left:auto!important;bottom:auto!important;
    display:flex;justify-content:center;width:100%;margin:12px auto 4px;
    transform:rotate(-8deg) scale(.82)!important;transform-origin:center center;filter:none;z-index:3
  }
  html.lang-ar .free-stamp,
  html.lang-ar .hero>.free-stamp,
  html[dir="rtl"] .free-stamp,
  html[dir="rtl"] .hero>.free-stamp{
    transform:rotate(8deg) scale(.82)!important
  }
}
@media(max-width:720px){
  .asp-top{bottom:88px;right:12px}
}
@media(max-width:420px){
  .b-en{font-size:12.5px}
  .nav-links{gap:6px 8px!important;font-size:11.5px}
  .cs-head .cs-free{order:3}
  .hero-lockup .emblem,
  .hero-lockup .emblem-seal{width:168px!important;height:168px!important}
  .cta-row .btn{flex:1 1 100%}
}

/* ===== v664 fail-safe: word-stagger must never leave H2s invisible ===== */
@keyframes uwForce{to{opacity:1}}
.sec-head:not(.in) h2 .uw{animation:uwForce .3s 3.5s forwards}