:root {
      --color-primary:    #0d29b6;
      --color-accent:     #e5f649;
      --color-mint:       #a6dccc;
      --color-light-blue: #6296f0;
      --color-dark:       #05050f;
      --color-darker:     #03030a;
      --color-white:      #ffffff;
      --color-off-white:  #eeeeff;
      --color-text:       #000000;
      --color-muted:      #444455;
      --font-display: 'Montserrat Black', sans-serif;
      --font-body:    'Rajdhani Bold', sans-serif;
      --font-arabic:  'Tajawal', sans-serif;
      --max-w: 1280px;
      --pad-v: 120px;
      --ease-out: cubic-bezier(.16,1,.3,1);
      --ease-spring: cubic-bezier(.34,1.4,.64,1);
    }

    @font-face { font-family:'Montserrat Black'; src:url('../fonts/Montserrat-Black.ttf') format('truetype'); font-weight:900; }
    @font-face { font-family:'Rajdhani Bold';    src:url('../fonts/rajdhani.bold.ttf')    format('truetype'); font-weight:700; }
    @font-face { font-family:'Rubik Black';      src:url('../fonts/Rubik-Black.ttf')      format('truetype'); font-weight:900; }
    @font-face { font-family:'Tajawal'; src:url('../fonts/Tajawal-Regular.ttf')   format('truetype'); font-weight:400; }
    @font-face { font-family:'Tajawal'; src:url('../fonts/Tajawal-Medium.ttf')    format('truetype'); font-weight:500; }
    @font-face { font-family:'Tajawal'; src:url('../fonts/Tajawal-Bold.ttf')      format('truetype'); font-weight:700; }
    @font-face { font-family:'Tajawal'; src:url('../fonts/Tajawal-ExtraBold.ttf') format('truetype'); font-weight:800; }
    @font-face { font-family:'Tajawal'; src:url('../fonts/Tajawal-Black.ttf')     format('truetype'); font-weight:900; }

    *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; font-size:16px; }
    body { font-family:var(--font-body); font-weight:700; color:var(--color-text); background:var(--color-white); overflow-x:hidden; line-height:1.6; }
    body.loading { overflow:hidden; }
    img { max-width:100%; display:block; }
    a   { text-decoration:none; color:inherit; }
    button { cursor:pointer; border:none; background:none; font-family:inherit; }
    ul { list-style:none; }
    .container { max-width:var(--max-w); margin:0 auto; padding:0 48px; }

    /* ── PRELOADER ────────────────────────────────────────── */
    #preloader {
      position:fixed; inset:0; z-index:9999;
      background:#06061a;
      display:flex; flex-direction:column;
      align-items:center; justify-content:center; gap:36px;
      transition:transform .9s cubic-bezier(.87,0,.13,1);
    }
    #preloader.done { transform:translateY(-100%); pointer-events:none; }

    .pre-logo {
      overflow:hidden; width:276px; height:70px;
      opacity:0; animation:pre-fade-in .6s ease .15s forwards;
    }
    .pre-logo img {
      width:390px; height:390px; max-width:none;
      position:relative; top:-155px; left:-56px;
      filter:invert(1) brightness(2);
    }
    @keyframes pre-fade-in {
      from { opacity:0; transform:translateY(10px); }
      to   { opacity:1; transform:translateY(0); }
    }

    .pre-bar {
      width:180px; height:1px;
      background:rgba(255,255,255,.1); overflow:hidden;
      opacity:0; animation:pre-fade-in .4s ease .5s forwards;
    }
    .pre-fill {
      height:100%; width:0%;
      background:var(--color-accent);
      transition:width .08s linear;
    }


    /* ── SCROLL PROGRESS ─────────────────────────────────── */
    #scroll-prog {
      position:fixed; top:0; left:0; height:2px;
      background:var(--color-accent); z-index:200;
      width:0%; pointer-events:none;
      transition:width .1s linear;
    }

    /* ── SCROLL REVEAL ────────────────────────────────────── */
    .reveal {
      opacity:0; transform:translateY(28px);
      transition:opacity .65s var(--ease-out), transform .65s var(--ease-out);
      will-change:opacity, transform;
    }
    .reveal.from-left  { transform:translateX(-32px); }
    .reveal.from-right { transform:translateX(32px); }
    .reveal.scale-in   { transform:scale(.95); }
    .reveal.in         { opacity:1; transform:none !important; }

    /* ── HERO ENTRANCE (triggered by body.loaded) ─────────── */
    .ha { opacity:0; }
    body.loaded .ha {
      animation:ha-up .85s var(--ease-out) var(--hd,0s) both;
    }
    @keyframes ha-up {
      from { opacity:0; transform:translateY(22px); }
      to   { opacity:1; transform:translateY(0); }
    }

    .pill-wrap { opacity:0; }
    body.loaded .pill-wrap {
      animation:pill-in .95s var(--ease-spring) var(--pd,0s) both;
    }
    @keyframes pill-in {
      from { opacity:0; transform:scale(.72) translateY(24px); }
      to   { opacity:1; transform:scale(1) translateY(0); }
    }

    /* hero decorative SVG fade in */
    .hero-deco-svg { opacity:0; }
    body.loaded .hero-deco-svg {
      animation:ha-up 1.4s var(--ease-out) var(--dd,.5s) both;
    }

    /* hero pills — stagger each pill from inside to corner */
    .pill-g { opacity:0; }
    .pills-visible .pill-g-1 { animation:pill-stagger 1.4s cubic-bezier(0.22,1,0.36,1) .35s both; }
    .pills-visible .pill-g-2 { animation:pill-stagger 1.4s cubic-bezier(0.22,1,0.36,1) .65s both; }
    .pills-visible .pill-g-3 { animation:pill-stagger 1.4s cubic-bezier(0.22,1,0.36,1) .95s both; }
    @keyframes pill-stagger {
      from { opacity:0; transform:translateX(70px); }
      to   { opacity:1; transform:translateX(0); }
    }



    /* one-time scan line */
    .hero-scan {
      position:absolute; top:0; left:0; right:0; height:1px;
      background:linear-gradient(90deg,transparent,rgba(166,220,204,.35),transparent);
      pointer-events:none; z-index:3; opacity:0;
    }
    body.loaded .hero-scan {
      animation:scan-once 2.8s var(--ease-out) .4s forwards;
    }
    @keyframes scan-once {
      0%   { top:0;    opacity:.5; }
      85%  { opacity:.5; }
      100% { top:100%; opacity:0; }
    }

    /* scroll hint */
    .scroll-hint {
      position:absolute; bottom:32px; left:48px;
      display:flex; align-items:center; gap:12px;
      font-family:var(--font-display); font-size:.62rem;
      letter-spacing:.18em; text-transform:uppercase;
      color:rgba(255,255,255,.28); z-index:3;
      opacity:0;
    }
    body.loaded .scroll-hint { animation:ha-up .6s var(--ease-out) 1.1s both; }
    .scroll-line {
      width:44px; height:1px;
      background:rgba(255,255,255,.15); overflow:hidden; position:relative;
    }
    .scroll-line::after {
      content:''; position:absolute; top:0; left:-100%;
      width:100%; height:100%; background:var(--color-accent);
      animation:scroll-slide 2.2s ease infinite 1.4s;
    }
    @keyframes scroll-slide { 0%,40% { left:-100%; } 80%,100% { left:100%; } }

    /* ── STAT POP ─────────────────────────────────────────── */
    .stat-num.counted { animation:stat-pop .5s cubic-bezier(.34,1.56,.64,1) forwards; }
    @keyframes stat-pop { 50% { transform:scale(1.15); } }

    /* ── PAGE-13 DECO FLOATS ──────────────────────────────── */
    .deco { position:absolute; pointer-events:none; z-index:1; overflow:visible; opacity:0; transition:opacity 1.4s ease var(--dd,.3s); }
    body.loaded .deco { opacity:1; }
    @keyframes float-a { 0%,100% { transform:translateY(0) rotate(0deg); } 50% { transform:translateY(-18px) rotate(1.2deg); } }
    @keyframes float-b { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-24px) rotate(-1.8deg); } }
    @keyframes float-c { 0%,100% { transform:translateY(0) scale(1); } 50% { transform:translateY(14px) scale(1.025); } }
    @keyframes float-d { 0%,100% { transform:translateX(0); } 50% { transform:translateX(-12px); } }
    .deco-pills-a { animation:float-a  9s ease-in-out infinite; }
    .deco-lines-a { animation:float-b 11s ease-in-out infinite 1.2s; }
    .deco-rings-a { animation:float-c 14s ease-in-out infinite 2.5s; }
    .deco-dots-a  { animation:float-d 12s ease-in-out infinite 4s; }
    .deco-pills-b { animation:float-b 13s ease-in-out infinite 0.8s; }
    .deco-lines-b { animation:float-c 16s ease-in-out infinite 3s; }
    .deco-rings-b { animation:float-a 18s ease-in-out infinite 5s; }
    .deco-dots-b  { animation:float-b 20s ease-in-out infinite 7s; }

    /* ── RULE SHINE ───────────────────────────────────────── */
    .rule {
      position:relative; overflow:hidden;
      width:52px; height:5px;
      background:var(--color-accent); margin-top:28px;
    }
    .rule::after {
      content:''; position:absolute; top:0; left:-60%;
      width:60%; height:100%;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);
      animation:rule-shine 3.5s ease infinite 1s;
    }
    @keyframes rule-shine { 60% { left:160%; } 100% { left:160%; } }

    /* ── CARD SHIMMER ─────────────────────────────────────── */
    .athlete-shimmer {
      position:absolute; inset:0; z-index:1; pointer-events:none;
      background:linear-gradient(110deg,transparent 35%,rgba(229,246,73,.09) 50%,transparent 65%);
      background-size:250% 100%; opacity:0; transition:opacity .3s;
    }
    .athlete-card:hover .athlete-shimmer { opacity:1; animation:card-shimmer 1.4s ease infinite; }
    @keyframes card-shimmer { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }


    /* ── NAV ──────────────────────────────────────────────── */
    #nav {
      position:fixed; top:0; left:0; right:0; z-index:100;
      background:rgba(0,8,32,.55);
      backdrop-filter:blur(12px);
      border-bottom:1px solid rgba(255,255,255,.08);
      transition:background .4s ease, backdrop-filter .4s ease, box-shadow .4s ease;
    }
    #nav.scrolled {
      background:rgba(0,8,32,.94);
      backdrop-filter:blur(18px) saturate(1.4);
      box-shadow:0 4px 24px rgba(0,0,0,.18);
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .nav-inner {
      display:flex; align-items:center; justify-content:space-between; height:88px;
    }
    .nav-logo { display:block; overflow:hidden; width:241px; height:58px; flex-shrink:0; }
    .nav-logo img {
      width:340px; height:340px; max-width:none;
      position:relative; top:-138px; left:-49px;
      filter:invert(1) brightness(2);
    }
    .nav-links { display:flex; align-items:center; gap:36px; }
    .nav-links a {
      color:rgba(255,255,255,.65);
      font-family:var(--font-display); font-weight:900; font-size:.78rem;
      letter-spacing:.08em; text-transform:uppercase;
      position:relative; transition:color .2s;
    }
    .nav-links a::after {
      content:''; position:absolute; bottom:-4px; left:0;
      width:0; height:2px; background:var(--color-accent); transition:width .25s;
    }
    .nav-links a:hover, .nav-links a.active { color:#fff; }
    .nav-links a:hover::after, .nav-links a.active::after { width:100%; }
    .nav-cta {
      background:var(--color-accent) !important; color:var(--color-text) !important;
      font-family:var(--font-display) !important; font-weight:900 !important;
      padding:10px 24px; transition:background .2s !important;
    }
    .nav-cta::after { display:none !important; }
    .nav-cta:hover { background:#c8dd00 !important; }
    .lang-toggle {
      display:flex; align-items:center; justify-content:center;
      height:34px; padding:0 14px;
      background:rgba(255,255,255,.1); color:#fff; cursor:pointer;
      font-family:var(--font-display); font-weight:900; font-size:.72rem; letter-spacing:.1em;
      border:1px solid rgba(255,255,255,.18);
      transition:background .2s, border-color .2s; flex-shrink:0;
    }
    .lang-toggle:hover { background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.4); }

    /* ── RTL ──────────────────────────────────────────────── */
    html[dir="rtl"] .mobile-nav    { text-align:right; }
    html[dir="rtl"] .hero-content  { text-align:right; }
    html[dir="rtl"] .about-right   { text-align:right; }
    html[dir="rtl"] .faq-q         { text-align:right; }
    html[dir="rtl"] .faq-a-inner   { text-align:right; }
    html[dir="rtl"] .athlete-info  { text-align:right; }
    html[dir="rtl"] .contact-info  { text-align:right; }
    html[dir="rtl"] .contact-form-col { text-align:right; }
    html[dir="rtl"] .meta-item     { direction:ltr; }
    html[dir="rtl"] .nav-logo,
    html[dir="rtl"] .foot-logo,
    html[dir="rtl"] .pre-logo      { direction:ltr; }
    html[dir="rtl"] .athlete-num           { left:auto; right:20px; }
    html[dir="rtl"] .athlete-card::before  { right:auto; left:-60px; }
    html[dir="rtl"] .nav-links a::after    { left:auto; right:0; }
    html[dir="rtl"] .scroll-hint          { left:auto; right:48px; }
    html[dir="rtl"] .hero-sub {
      border-left:none; border-right:3px solid var(--color-accent);
      padding-left:0; padding-right:20px;
    }
    html[dir="rtl"] .eyebrow::before { display:none; }
    html[dir="rtl"] .eyebrow::after  { content:''; display:block; width:32px; height:2px; background:var(--color-accent); }

    /* ── ARABIC FONT ──────────────────────────────────────── */
    html[lang="ar"], html[lang="ar"] * { font-family:var(--font-arabic) !important; letter-spacing:0 !important; }

    /* ── ARABIC LINE-HEIGHT FIXES ────────────────────────── */
    html[lang="ar"] .hero-h1    { line-height: 1.35; }
    html[lang="ar"] .section-h2 { line-height: 1.35; }
    html[lang="ar"] .about-h2   { line-height: 1.35; }
    html[lang="ar"] .team-h2    { line-height: 1.35; }
    html[lang="ar"] .stat-num   { line-height: 1.25; }
    html[lang="ar"] .impact-num { line-height: 1.25; }

    /* ── HAMBURGER ────────────────────────────────────────── */
    .hamburger { display:none; flex-direction:column; gap:5px; padding:6px; }
    .hamburger span { display:block; width:24px; height:2px; background:#fff; transition:all .3s; }
    .hamburger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
    .hamburger.open span:nth-child(2) { opacity:0; }
    .hamburger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
    .mobile-nav {
      display:none; flex-direction:column;
      background:rgba(0,8,32,.97); backdrop-filter:blur(20px);
      padding:24px 32px; gap:22px;
      border-top:1px solid rgba(255,255,255,.07);
    }
    .mobile-nav.open { display:flex; }
    .mobile-nav a { color:rgba(255,255,255,.78); font-weight:700; font-size:1.1rem; letter-spacing:.05em; text-transform:uppercase; transition:color .2s; }
    .mobile-nav a:hover { color:var(--color-accent); }

    /* ── HERO ─────────────────────────────────────────────── */
    #hero {
      min-height:100vh;
      background:linear-gradient(140deg,#06061a 0%,#0d29b6 55%,#6296f0 100%);
      position:relative; overflow:hidden; padding-top:88px;
    }
    .hero-slash {
      position:absolute; bottom:0; left:0; width:100%; height:3px;
      background:linear-gradient(90deg,var(--color-accent) 0%,rgba(229,246,73,.2) 65%,transparent 100%);
      animation:slash-expand 1.2s var(--ease-out) 2.6s both;
      transform-origin:left;
    }
    @keyframes slash-expand { from { transform:scaleX(0); } to { transform:scaleX(1); } }

    .hero-layout {
      display:grid; grid-template-columns:1fr;
      gap:60px; align-items:center;
      min-height:calc(100vh - 88px); padding:80px 0;
      position:relative; z-index:2;
    }
    .hero-content { max-width:620px; }

    .eyebrow {
      display:inline-flex; align-items:center; gap:12px;
      font-family:var(--font-display); font-weight:900; font-size:.74rem;
      letter-spacing:.18em; text-transform:uppercase;
      color:var(--color-mint); margin-bottom:28px;
    }
    .eyebrow::before { content:''; display:block; width:32px; height:2px; background:var(--color-accent); flex-shrink:0; }

    .hero-h1 {
      font-family:var(--font-display); font-weight:900;
      font-size:clamp(3rem,6.5vw,5.8rem);
      line-height:.95; letter-spacing:-.025em;
      color:#fff; margin-bottom:32px;
    }
    .hero-h1 em { color:var(--color-mint); font-style:normal; }

    .hero-sub {
      font-family:var(--font-body); font-size:clamp(1rem,1.3vw,1.08rem); font-weight:700;
      color:#fff; line-height:1.9;
      max-width:46ch; margin-bottom:44px;
      padding-left:20px; border-left:3px solid var(--color-accent);
    }

    .btn-row { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
    .btn-fill {
      display:inline-flex; align-items:center; gap:10px;
      background:var(--color-accent); color:var(--color-text);
      font-family:var(--font-display); font-weight:900; font-size:.85rem;
      letter-spacing:.07em; text-transform:uppercase;
      padding:16px 40px;
      transition:background .2s, transform .4s var(--ease-out);
    }
    .btn-fill:hover { background:#c8dd00; }
    .btn-ghost {
      display:inline-flex; align-items:center; gap:10px;
      border:2px solid rgba(255,255,255,.28); color:rgba(255,255,255,.85);
      font-family:var(--font-display); font-weight:900; font-size:.85rem;
      letter-spacing:.07em; text-transform:uppercase;
      padding:14px 36px;
      transition:border-color .2s, background .2s, color .2s, transform .4s var(--ease-out);
    }
    .btn-ghost:hover { border-color:#fff; color:#fff; background:rgba(255,255,255,.06); }

    .hero-stats {
      display:flex; margin-top:60px; padding-top:44px;
      border-top:1px solid rgba(255,255,255,.1);
    }
    .hero-stats > div {
      flex:1; padding-right:32px;
      border-right:1px solid rgba(255,255,255,.08);
    }
    .hero-stats > div:last-child { border-right:none; }
    .stat-num {
      font-family:var(--font-display); font-weight:900;
      font-size:2.6rem; color:var(--color-accent);
      line-height:1; margin-bottom:7px;
    }
    .stat-label {
      font-family:var(--font-display); font-weight:900;
      font-size:.62rem; letter-spacing:.18em; text-transform:uppercase;
      color:rgba(255,255,255,.8);
    }

    .hero-visual {
      position:relative; height:580px;
      display:flex; align-items:center; justify-content:center;
    }
    .hero-pills-svg { width:100%; height:100%; overflow:visible; }

    /* ── SHARED SECTION STYLES ────────────────────────────── */
    .section-tag {
      font-family:var(--font-display); font-weight:900; font-size:.7rem;
      letter-spacing:.2em; text-transform:uppercase;
      color:var(--color-mint); display:block; margin-bottom:12px;
    }
    .section-h2 {
      font-family:var(--font-display); font-weight:900;
      font-size:clamp(2.2rem,4.5vw,3.8rem);
      line-height:1.02; letter-spacing:-.022em; color:var(--color-text); margin-top:8px;
    }
    .section-head {
      display:flex; align-items:flex-end; justify-content:space-between;
      gap:24px; flex-wrap:wrap; margin-bottom:64px;
    }

    /* ── ABOUT ────────────────────────────────────────────── */
    #about { padding:var(--pad-v) 0; background:#fff; position:relative; overflow:hidden; }
    .about-num {
      position:absolute; right:-20px; top:-60px;
      font-family:var(--font-display); font-weight:900;
      font-size:clamp(180px,22vw,260px);
      color:rgba(13,41,182,.038);
      line-height:1; letter-spacing:-.04em;
      user-select:none; pointer-events:none; z-index:0;
      transform:translateX(40px); opacity:0;
      transition:opacity 1.4s ease, transform 1.4s var(--ease-out);
    }
    .about-num.in { opacity:1; transform:translateX(0); }
    .about-grid {
      display:grid; grid-template-columns:440px 1fr;
      gap:100px; align-items:start; position:relative; z-index:1;
    }
    .about-h2 {
      font-family:var(--font-display); font-weight:900;
      font-size:clamp(2.6rem,5vw,4.4rem);
      line-height:1.01; letter-spacing:-.025em; color:var(--color-text);
    }
    .about-h2 em { color:var(--color-primary); font-style:normal; }
    .about-right { display:flex; flex-direction:column; gap:24px; padding-top:6px; }
    .body-text { font-family:var(--font-body); font-size:1.06rem; font-weight:700; line-height:1.88; color:var(--color-muted); }
    .value-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px 24px; margin-top:12px; }
    .value-item {
      display:flex; align-items:center; gap:10px;
      font-weight:700; font-size:.9rem; color:var(--color-text);
      transition:color .2s;
    }
    .value-item::before {
      content:''; display:block; flex-shrink:0;
      width:8px; height:8px; background:var(--color-accent);
      transition:transform .3s var(--ease-spring);
    }
    .value-item:hover { color:var(--color-primary); }
    .value-item:hover::before { transform:rotate(45deg) scale(1.3); }

    /* ── ATHLETES ─────────────────────────────────────────── */
    #athletes { padding:var(--pad-v) 0; background:#6296f0; position:relative; overflow:hidden; }
    #athletes .section-tag { color:var(--color-primary); }
    #athletes .section-h2  { color:#fff; }
    .athletes-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
    .athlete-card {
      position:relative; background:var(--color-primary);
      aspect-ratio:3/4; overflow:hidden;
      will-change:transform;
      transition:box-shadow .4s ease;
    }
    .athlete-card:hover { box-shadow:0 32px 64px rgba(0,0,0,.55); }
    .athlete-card::before {
      content:''; position:absolute; bottom:-60px; right:-60px;
      width:220px; height:220px; background:var(--color-accent);
      transform:rotate(45deg); opacity:.13; transition:opacity .4s;
    }
    .athlete-card:hover::before { opacity:.24; }
    .athlete-card::after {
      content:''; position:absolute; top:0; left:0; right:0;
      height:3px; background:var(--color-accent);
    }
    .athlete-silhouette {
      position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding-bottom:80px;
    }
    .athlete-silhouette svg { width:50%; opacity:.17; }
    .athlete-num {
      position:absolute; top:20px; left:20px;
      font-family:var(--font-display); font-weight:900;
      font-size:1.5rem; color:var(--color-mint); line-height:1; opacity:.6;
    }
    .athlete-photo-tag {
      position:absolute; top:50%; left:50%;
      transform:translate(-50%,-50%) translateY(-16px);
      display:flex; flex-direction:column; align-items:center; gap:10px;
      color:rgba(255,255,255,.22); font-weight:700; font-size:.68rem;
      letter-spacing:.14em; text-transform:uppercase; text-align:center; pointer-events:none;
    }
    .athlete-photo-tag svg { opacity:.28; }
    .athlete-info {
      position:absolute; bottom:0; left:0; right:0; padding:20px 22px 22px;
      background:linear-gradient(to top,rgba(0,8,32,.95) 0%,rgba(0,8,32,.5) 70%,transparent 100%);
      z-index:2;
    }
    .athlete-sport {
      font-family:var(--font-display); font-weight:900; font-size:.64rem;
      letter-spacing:.18em; text-transform:uppercase; color:var(--color-mint); margin-bottom:5px;
    }
    .athlete-name { font-family:var(--font-display); font-weight:900; font-size:1.1rem; color:#fff; line-height:1.2; }
    .athlete-overlay {
      position:absolute; inset:0; background:rgba(0,42,189,.82);
      display:flex; align-items:center; justify-content:center;
      opacity:0; transition:opacity .35s ease; z-index:3;
    }
    .athlete-card:hover .athlete-overlay { opacity:1; }
    .athlete-cta {
      display:inline-flex; align-items:center; gap:10px;
      background:var(--color-accent); color:var(--color-text);
      font-weight:900; font-size:.78rem; letter-spacing:.09em; text-transform:uppercase;
      padding:13px 24px; transform:translateY(12px);
      transition:transform .35s var(--ease-out), background .2s;
    }
    .athlete-card:hover .athlete-cta { transform:translateY(0); }
    .athlete-cta:hover { background:#c8dd00; }

    /* ── CONTACT ──────────────────────────────────────────── */
    #contact { padding:var(--pad-v) 0; background:var(--color-off-white); position:relative; overflow:hidden; }
    #contact .section-tag { color:var(--color-primary); }
    #contact .section-h2  { color:var(--color-text); }
    .contact-header { margin-bottom:72px; }
    .contact-grid { display:grid; grid-template-columns:1fr 1.45fr; gap:80px; align-items:start; }
    .contact-info { display:flex; flex-direction:column; gap:36px; }
    .contact-info-body { font-family:var(--font-body); font-size:1.06rem; font-weight:700; line-height:1.85; color:var(--color-muted); }
    .contact-meta { display:flex; flex-direction:column; gap:16px; }
    .meta-item { display:flex; align-items:center; gap:14px; font-weight:700; font-size:.9rem; color:var(--color-text); }
    .meta-icon {
      width:36px; height:36px; flex-shrink:0;
      background:var(--color-primary); display:flex; align-items:center; justify-content:center;
      transition:background .2s, transform .3s var(--ease-spring);
    }
    .meta-item:hover .meta-icon { background:var(--color-accent); transform:scale(1.1) rotate(6deg); }
    .meta-item:hover .meta-icon svg { color:var(--color-text); }
    .meta-icon svg { color:#fff; transition:color .2s; }
    .meta-item a.meta-icon { display:flex; align-items:center; justify-content:center; }
    .meta-item a.meta-icon:hover { background:var(--color-accent); transform:scale(1.1) rotate(6deg); }
    .meta-item a.meta-icon:hover svg { color:var(--color-text); }
    .form { display:flex; flex-direction:column; gap:16px; }
    .form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
    .fg { display:flex; flex-direction:column; gap:8px; }
    .fg label { font-weight:700; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--color-text); }
    .fg input, .fg textarea {
      font-family:var(--font-body); font-size:1rem; font-weight:700;
      color:var(--color-text); background:#fff;
      border:2px solid rgba(13,41,182,.1); padding:14px 18px;
      outline:none; resize:none;
      transition:border-color .25s, box-shadow .25s, transform .25s var(--ease-out);
    }
    .fg input:focus, .fg textarea:focus {
      border-color:var(--color-primary); transform:translateY(-1px);
      box-shadow:0 6px 20px rgba(13,41,182,.1);
    }
    .submit-btn {
      display:flex; align-items:center; justify-content:center; gap:10px;
      background:var(--color-primary); color:#fff;
      font-family:var(--font-display); font-weight:900;
      font-size:.9rem; letter-spacing:.08em; text-transform:uppercase;
      padding:18px 52px; margin-top:8px; width:100%;
      transition:background .25s, transform .4s var(--ease-out), color .25s;
      position:relative; overflow:hidden;
    }
    .submit-btn::before {
      content:''; position:absolute; inset:0;
      background:var(--color-accent);
      transform:scaleX(0); transform-origin:left;
      transition:transform .4s var(--ease-out); z-index:0;
    }
    .submit-btn:hover::before { transform:scaleX(1); }
    .submit-btn:hover { color:var(--color-text); transform:translateY(-2px); }
    .submit-btn > * { position:relative; z-index:1; }

    /* ── FAQ ──────────────────────────────────────────────── */
    #faq { padding:var(--pad-v) 0; background:#6296f0; position:relative; overflow:hidden; }
    #faq .section-tag { color:var(--color-primary); }
    #faq .section-h2  { color:#fff; }
    .faq-head { margin-bottom:64px; }
    .faq-list { max-width:860px; margin:0 auto; display:flex; flex-direction:column; gap:2px; }
    .faq-item {
      background:rgba(0,0,0,.06);
      border-left:3px solid transparent;
      transition:background .25s, border-color .25s;
    }
    .faq-item.open { background:rgba(0,0,0,.12); border-left-color:var(--color-accent); }
    .faq-q {
      display:flex; align-items:center; justify-content:space-between; gap:24px;
      padding:22px 28px; cursor:pointer;
      color:rgba(255,255,255,.9); font-family:var(--font-display); font-weight:900;
      font-size:.92rem; line-height:1.5; user-select:none; transition:color .2s;
    }
    .faq-item.open .faq-q { color:#fff; }
    .faq-icon {
      width:26px; height:26px; min-width:26px;
      border:2px solid rgba(255,255,255,.35);
      display:flex; align-items:center; justify-content:center;
      color:var(--color-accent); transition:all .3s var(--ease-spring); flex-shrink:0;
    }
    .faq-item.open .faq-icon { background:var(--color-accent); border-color:var(--color-accent); color:var(--color-text); transform:rotate(45deg); }
    .faq-a { max-height:0; overflow:hidden; transition:max-height .42s ease; }
    .faq-item.open .faq-a { max-height:300px; }
    .faq-a-inner { padding:0 28px 24px; font-family:var(--font-body); font-size:.98rem; font-weight:700; color:#fff; line-height:1.88; }

    /* ── FOOTER ───────────────────────────────────────────── */
    footer { background:linear-gradient(140deg,#06061a 0%,#0d29b6 55%,#6296f0 100%); padding:48px 0; border-top:1px solid rgba(255,255,255,.055); }
    .foot { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:24px; }
    .foot-logo { display:block; overflow:hidden; width:154px; height:40px; }
    .foot-logo img { width:218px; height:218px; max-width:none; position:relative; top:-90px; left:-31px; filter:invert(1) brightness(2); }
    .foot-copy { font-size:.8rem; color:rgba(255,255,255,.28); }
    .foot-links { display:flex; gap:28px; }
    .foot-links a { font-size:.8rem; font-weight:700; color:rgba(255,255,255,.35); letter-spacing:.07em; text-transform:uppercase; transition:color .2s; }
    .foot-links a:hover { color:var(--color-accent); }
    #siteBanner { display:none; padding:11px 48px; text-align:center; font-size:.88rem; font-weight:700; position:relative; z-index:9998; letter-spacing:.02em; }
    #gallery { padding:var(--pad-v) 0; background:var(--color-off-white); display:none; }
    .gal-site-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; margin-top:56px; }
    .gal-site-item { border-radius:8px; overflow:hidden; aspect-ratio:4/3; }
    .gal-site-item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease-out); }
    .gal-site-item:hover img { transform:scale(1.04); }
    .foot-social { display:flex; gap:10px; align-items:center; }
    .foot-social a { width:34px; height:34px; border-radius:6px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.5); font-size:.82rem; transition:all .2s; text-decoration:none; }
    .foot-social a:hover { background:rgba(255,255,255,.16); color:#fff; border-color:rgba(255,255,255,.22); }


    /* ── WHY A CIRCLE ────────────────────────────────────── */
    #why {
      padding:var(--pad-v) 0;
      background:linear-gradient(160deg,#06061a 0%,#0d29b6 55%,#1a2fe0 100%);
      position:relative; overflow:hidden;
    }
    #why .section-tag { color:var(--color-mint); }
    .why-header { text-align:center; margin-bottom:80px; }
    .why-h2 {
      font-family:var(--font-display); font-weight:900;
      font-size:clamp(2.4rem,5vw,4rem);
      line-height:1.02; letter-spacing:-.022em; color:#fff; margin-top:10px;
    }
    .why-h2 em { color:var(--color-accent); font-style:normal; }

    .why-layout {
      display:grid; grid-template-columns:1fr 360px 1fr;
      gap:0 64px; align-items:center;
    }
    .why-col { display:flex; flex-direction:column; gap:44px; justify-content:center; }
    .why-left { align-items:flex-end; }
    .why-right { align-items:flex-start; }

    .why-item {
      max-width:290px; padding-top:18px;
      border-top:1px solid rgba(255,255,255,.07);
    }
    .why-left .why-item { text-align:right; }
    .why-right .why-item { text-align:left; }

    .why-num {
      display:block;
      font-family:var(--font-display); font-weight:900;
      font-size:.56rem; letter-spacing:.28em;
      color:rgba(229,246,73,.38); margin-bottom:8px;
    }
    .why-tag {
      font-family:var(--font-display); font-weight:900;
      font-size:.68rem; letter-spacing:.15em; text-transform:uppercase;
      color:var(--color-accent); margin-bottom:9px;
      display:flex; align-items:center; gap:7px;
    }
    .why-left .why-tag { justify-content:flex-end; }
    .why-icon { width:15px; height:15px; flex-shrink:0; color:var(--color-mint); opacity:.85; }
    .why-body { font-size:.87rem; font-weight:700; line-height:1.8; color:#fff; }

    .why-center { display:flex; align-items:center; justify-content:center; padding:60px; }
    .why-orb {
      position:relative; width:340px; height:340px;
      display:flex; align-items:center; justify-content:center;
    }
    @keyframes why-rotate { to { transform:rotate(360deg); } }
    .why-mark {
      position:relative; z-index:2; width:340px; height:291px;
      filter:drop-shadow(0 0 22px rgba(229,246,73,.38));
      animation:why-rotate 30s linear infinite;
      transform-origin:center; will-change:transform;
    }
    .why-center-txt {
      position:absolute; bottom:-8px; left:50%; transform:translateX(-50%);
      white-space:nowrap; text-align:center; z-index:3;
      font-family:var(--font-display); font-weight:900;
      font-size:.48rem; letter-spacing:.32em; text-transform:uppercase;
      color:rgba(255,255,255,.22); line-height:1.8;
    }

    /* ── RESPONSIVE ───────────────────────────────────────── */
    @media (max-width:1100px) {
      .hero-layout   { grid-template-columns:1fr 360px; gap:40px; }
      .about-grid    { grid-template-columns:1fr; gap:56px; }
      .contact-grid  { grid-template-columns:1fr; gap:52px; }
      .athletes-grid { grid-template-columns:repeat(2,1fr); }
      /* scale down large decorative SVGs on tablet */
      .pill-svg[style*="width:420px"] { width:260px !important; height:260px !important; }
      .why-layout { grid-template-columns:1fr 220px 1fr; gap:0 36px; }
      .why-item { max-width:240px; }
    }
    @media (max-width:768px) {
      :root { --pad-v:72px; }
      .container      { padding:0 24px; }
      .nav-links      { display:none; }
      .hamburger      { display:flex; }
      .nav-logo { width:190px; height:46px; }
      .nav-logo img { width:270px; height:270px; top:-110px; left:-39px; }
      .hero-layout    { grid-template-columns:1fr; padding:52px 0 64px; }
      .hero-visual    { display:none; }
      .hero-content   { max-width:100%; }
      .hero-sub       { max-width:100%; }
      .about-grid     { grid-template-columns:1fr; gap:44px; }
      .value-grid     { grid-template-columns:1fr 1fr; }
      .athletes-grid  { grid-template-columns:1fr 1fr; gap:12px; }
      .form-row       { grid-template-columns:1fr; }
      .section-head   { flex-direction:column; align-items:flex-start; margin-bottom:44px; }
      .hero-stats     { flex-wrap:wrap; margin-top:44px; padding-top:32px; }
      .hero-stats > div {
        flex:0 0 50%; padding:14px 0;
        border-right:none;
        border-bottom:1px solid rgba(255,255,255,.08);
      }
      .hero-stats > div:last-child { border-bottom:none; }
      .stat-num       { font-size:2.2rem; }
      .foot           { flex-direction:column; align-items:flex-start; gap:20px; }
      .foot-links     { flex-wrap:wrap; gap:16px; }
      .contact-header { margin-bottom:48px; }
      .faq-head       { margin-bottom:44px; }
      /* watermark number — shrink so it doesn't cause horizontal overflow */
      .about-num { font-size:clamp(100px,28vw,160px); right:-10px; }
      /* why section — stack vertically on mobile */
      .why-layout { grid-template-columns:1fr; gap:48px; justify-items:center; }
      .why-center { order:-1; }
      .why-left { align-items:flex-start; }
      .why-left .why-item { text-align:left; }
      .why-left .why-tag { justify-content:flex-start; }
      .why-item { max-width:100%; width:100%; }
      .why-header { margin-bottom:52px; }
      .why-orb { width:260px; height:260px; }
      .why-mark { width:260px; height:222px; }
      /* Arabic RTL fix for why section on mobile */
      html[lang="ar"] .why-left .why-item { text-align:right; }
      html[lang="ar"] .why-left .why-tag  { justify-content:flex-end; }
      html[lang="ar"] .why-left           { align-items:flex-end; }
    }
    @media (max-width:480px) {
      :root           { --pad-v:56px; }
      .container      { padding:0 18px; }
      .hero-h1        { font-size:2.6rem; }
      .about-h2       { font-size:2.2rem; }
      .btn-fill, .btn-ghost { width:100%; justify-content:center; }
      .btn-row        { flex-direction:column; }
      .athletes-grid  { grid-template-columns:1fr 1fr; gap:8px; }
      .value-grid     { grid-template-columns:1fr; }
      .stat-num       { font-size:2rem; }
      .hero-stats > div { flex:0 0 50%; }
      .faq-q          { font-size:.85rem; padding:18px 20px; }
      .faq-a-inner    { padding:0 20px 20px; }
      .foot-links     { gap:12px; }
      .nav-inner      { height:64px; }
      #hero           { padding-top:64px; }
      .nav-logo { width:155px; height:37px; }
      .nav-logo img { width:220px; height:220px; top:-90px; left:-32px; }
    }
    @media (prefers-reduced-motion:reduce) {
      *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
      .ha { opacity:1 !important; }
      .pill-wrap { opacity:1 !important; }
    }

    /* ── VISION / MISSION (about redesign) ─────────────────── */
    .vm-grid { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
    .vm-card {
      background:#fff; border-top:4px solid var(--color-primary);
      padding:44px 40px;
      box-shadow:0 4px 32px rgba(13,41,182,.07);
      transition:box-shadow .3s ease, transform .4s var(--ease-out);
    }
    .vm-card:hover { box-shadow:0 20px 60px rgba(13,41,182,.13); transform:translateY(-4px); }
    .vm-tag {
      font-family:var(--font-display); font-weight:900;
      font-size:1.1rem; letter-spacing:.14em; text-transform:uppercase;
      color:var(--color-primary); margin-bottom:6px;
    }
    .vm-sub {
      font-family:var(--font-display); font-weight:900; font-size:.72rem;
      letter-spacing:.1em; text-transform:uppercase; color:var(--color-muted);
    }
    .vm-body {
      font-family:var(--font-body); font-size:1.03rem; font-weight:700;
      line-height:1.85; color:var(--color-muted); margin-top:20px;
    }

    /* ── STORY SECTION ──────────────────────────────────────── */
    #story {
      padding:var(--pad-v) 0;
      background:linear-gradient(160deg,#06061a 0%,#0d29b6 60%,#1a2fe0 100%);
      position:relative; overflow:hidden;
    }
    #story .section-tag { color:var(--color-mint); }
    .story-h2 {
      font-family:var(--font-display); font-weight:900;
      font-size:clamp(2.2rem,4.5vw,3.8rem);
      line-height:1.02; letter-spacing:-.022em; color:#fff; margin-top:8px;
    }
    .story-h2 em { color:var(--color-accent); font-style:normal; }
    .story-timeline {
      display:grid; grid-template-columns:repeat(5,1fr);
      gap:0; margin-top:80px; position:relative;
    }
    .story-timeline::before {
      content:''; position:absolute; top:27px; left:28px; right:28px; height:2px;
      background:linear-gradient(90deg,var(--color-accent) 0%,rgba(229,246,73,.15) 100%);
      z-index:0;
    }
    .story-step { position:relative; padding:72px 28px 0; }
    .story-step-num {
      position:absolute; top:0; left:28px;
      width:56px; height:56px;
      background:var(--color-accent); color:var(--color-text);
      font-family:var(--font-display); font-weight:900; font-size:1.3rem;
      display:flex; align-items:center; justify-content:center; z-index:1;
    }
    .story-step-title {
      font-family:var(--font-display); font-weight:900; font-size:.68rem;
      letter-spacing:.14em; text-transform:uppercase; color:var(--color-accent);
      margin-bottom:12px;
    }
    .story-step-body {
      font-family:var(--font-body); font-size:.92rem; font-weight:700;
      color:rgba(255,255,255,.7); line-height:1.75;
    }

    /* ── SERVICES FOR ATHLETES ──────────────────────────────── */
    #services-athletes {
      padding:var(--pad-v) 0; background:#fff; position:relative; overflow:hidden;
    }
    #services-athletes .section-tag { color:var(--color-primary); }
    .services-layout {
      display:grid; grid-template-columns:1fr 320px; gap:80px; align-items:start; margin-top:64px;
    }
    .services-cards { display:flex; flex-direction:column; }
    .service-card {
      display:grid; grid-template-columns:72px 1fr;
      border-bottom:1px solid rgba(13,41,182,.08);
      padding:28px 0; transition:padding-left .25s;
      cursor:default;
    }
    .service-card:hover { padding-left:8px; }
    .service-num {
      font-family:var(--font-display); font-weight:900; font-size:2rem;
      color:var(--color-accent); line-height:1;
      -webkit-text-stroke:1px rgba(13,41,182,.2);
    }
    .service-title {
      font-family:var(--font-display); font-weight:900; font-size:.74rem;
      letter-spacing:.14em; text-transform:uppercase; color:var(--color-primary);
      margin-bottom:8px;
    }
    .service-body {
      font-family:var(--font-body); font-size:.95rem; font-weight:700;
      color:var(--color-muted); line-height:1.75;
    }
    .services-sidebar {
      background:var(--color-accent); padding:40px 36px; position:sticky; top:120px;
    }
    .sidebar-title {
      font-family:var(--font-display); font-weight:900; font-size:.7rem;
      letter-spacing:.2em; text-transform:uppercase; color:var(--color-text); margin-bottom:28px;
    }
    .sidebar-list { display:flex; flex-direction:column; gap:16px; }
    .sidebar-item {
      display:flex; align-items:center; gap:12px;
      font-family:var(--font-display); font-weight:900; font-size:.78rem;
      letter-spacing:.06em; text-transform:uppercase; color:var(--color-text);
    }
    .sidebar-item::before {
      content:''; display:block; width:8px; height:8px;
      background:var(--color-primary); flex-shrink:0;
    }

    /* ── SERVICES FOR BRANDS ─────────────────────────────────── */
    #services-brands {
      padding:var(--pad-v) 0; background:var(--color-primary); position:relative; overflow:hidden;
    }
    #services-brands .section-tag { color:var(--color-mint); }
    #services-brands .section-h2  { color:#fff; }
    .brands-intro {
      font-family:var(--font-display); font-weight:900; font-size:.82rem;
      color:rgba(255,255,255,.45); letter-spacing:.1em; text-transform:uppercase;
      max-width:38ch; margin-top:8px;
    }
    .brands-services-list { display:flex; flex-direction:column; margin-top:64px; }
    .brand-service-item {
      display:grid; grid-template-columns:88px 1fr;
      padding:28px 0; border-bottom:1px solid rgba(255,255,255,.08);
    }
    .brand-service-item:last-child { border-bottom:none; }
    .brand-svc-num {
      font-family:var(--font-display); font-weight:900; font-size:2rem;
      color:var(--color-accent); line-height:1; padding-top:3px;
    }
    .brand-svc-title {
      font-family:var(--font-display); font-weight:900; font-size:.74rem;
      letter-spacing:.14em; text-transform:uppercase; color:var(--color-accent); margin-bottom:6px;
    }
    .brand-svc-body {
      font-family:var(--font-body); font-size:.95rem; font-weight:700;
      color:rgba(255,255,255,.65); line-height:1.75;
    }

    /* ── CIRCLE PROFILES & SPORTS TAGS ──────────────────────── */
    .circle-meta { margin-bottom:64px; }
    .circle-meta-label {
      font-family:var(--font-display); font-weight:900; font-size:.66rem;
      letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.38);
      margin-bottom:14px;
    }
    .circle-tags { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:32px; }
    .circle-tag {
      background:var(--color-primary); color:#fff;
      font-family:var(--font-display); font-weight:900; font-size:.68rem;
      letter-spacing:.1em; text-transform:uppercase; padding:10px 20px;
    }
    .circle-tag.sport { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.15); }

    /* ── TEAM SECTION ────────────────────────────────────────── */
    #team {
      padding:var(--pad-v) 0; background:var(--color-off-white); position:relative; overflow:hidden;
    }
    #team .section-tag { color:var(--color-primary); }
    .team-intro-grid {
      display:grid; grid-template-columns:420px 1fr; gap:80px; align-items:start;
    }
    .team-h2 {
      font-family:var(--font-display); font-weight:900;
      font-size:clamp(2.8rem,5vw,4.4rem);
      line-height:.98; letter-spacing:-.025em; color:var(--color-text); margin-top:10px;
    }
    .team-h2 em { color:var(--color-primary); font-style:normal; }
    .team-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
    .team-card {
      background:#fff; overflow:hidden;
      border-top:4px solid var(--color-accent);
      transition:box-shadow .3s ease, transform .4s var(--ease-out);
    }
    .team-card:hover { box-shadow:0 24px 60px rgba(13,41,182,.13); transform:translateY(-4px); }
    .team-card-photo {
      width:100%; aspect-ratio:3/2;
      background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-light-blue) 100%);
      display:flex; align-items:center; justify-content:center;
      overflow:hidden;
    }
    .team-card-photo svg { width:64px; opacity:.2; }
    .team-card-photo img { width:100%; height:100%; object-fit:cover; object-position:center 10%; display:block; }
    .team-card-body { padding:32px 28px; }
    .team-role {
      display:inline-flex;
      background:var(--color-primary); color:#fff;
      font-family:var(--font-display); font-weight:900; font-size:.62rem;
      letter-spacing:.12em; text-transform:uppercase;
      padding:6px 14px; margin-bottom:14px;
    }
    .team-name {
      font-family:var(--font-display); font-weight:900;
      font-size:1.25rem; letter-spacing:-.01em; color:var(--color-text);
    }
    .team-name em { color:var(--color-primary); font-style:normal; }
    .team-rule { width:36px; height:3px; background:var(--color-accent); margin:12px 0 16px; }
    .team-bio {
      font-family:var(--font-body); font-size:.95rem; font-weight:700;
      color:var(--color-muted); line-height:1.8;
    }

    /* ── IMPACT SECTION ──────────────────────────────────────── */
    #impact {
      padding:var(--pad-v) 0;
      background:linear-gradient(140deg,#06061a 0%,#0d29b6 60%,#6296f0 100%);
      position:relative; overflow:hidden;
    }
    #impact .section-tag { color:var(--color-mint); }
    #impact .section-h2  { color:#fff; }
    .impact-body {
      font-family:var(--font-body); font-size:1.06rem; font-weight:700;
      color:rgba(255,255,255,.62); line-height:1.9; max-width:56ch; margin:24px 0 72px;
    }
    .impact-grid {
      display:grid; grid-template-columns:repeat(4,1fr); gap:2px;
    }
    .impact-stat {
      background:rgba(255,255,255,.04); padding:36px 28px;
      border-left:2px solid transparent;
      transition:background .25s, border-color .25s;
    }
    .impact-stat:hover { background:rgba(255,255,255,.08); border-left-color:var(--color-accent); }
    .impact-num {
      font-family:var(--font-display); font-weight:900;
      font-size:2.2rem; color:var(--color-accent); line-height:1; margin-bottom:8px;
    }
    .impact-desc {
      font-family:var(--font-body); font-size:.88rem; font-weight:700;
      color:rgba(255,255,255,.5); line-height:1.6;
    }

    /* ── RESPONSIVE ADDITIONS ─────────────────────────────────── */
    @media (max-width:1100px) {
      .vm-grid         { grid-template-columns:1fr; }
      .story-timeline  { grid-template-columns:1fr 1fr; }
      .story-timeline::before { display:none; }
      .services-layout { grid-template-columns:1fr; }
      .services-sidebar { position:static; }
      .team-intro-grid { grid-template-columns:1fr; gap:48px; }
      .impact-grid     { grid-template-columns:repeat(2,1fr); }
    }
    @media (max-width:768px) {
      .story-timeline  { grid-template-columns:1fr; }
      .team-grid       { grid-template-columns:1fr; max-width:420px; }
      .impact-grid     { grid-template-columns:1fr 1fr; }
      .athletes-grid   { grid-template-columns:repeat(2,1fr); }
    }
    @media (max-width:480px) {
      .impact-grid     { grid-template-columns:1fr; }
    }