:root{
    --navy:#1B2B49;
    --navy-2:#233657;
    --orange:#F15F23;
    --teal:#45BB8A;
    --white:#FFFFFF;
    --ink:#14181F;
    --ink-soft:#5B6472;
    --line:#E7E9EE;
    --paper:#F7F8FA;
    --radius:14px;
    --maxw:1180px;
    --ease:cubic-bezier(.22,.9,.32,1);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Alexandria', sans-serif;
    color:var(--ink);
    background:var(--white);
    line-height:1.6;
    overflow-x:hidden;
  }
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
  section{position:relative;}

  /* ---------- utility: the signature slash, echoing the AR logo mark ---------- */
  .slash{
    display:inline-block;
    width:10px; height:22px;
    background:var(--orange);
    transform:skewX(-18deg);
    border-radius:2px;
    flex-shrink:0;
  }
  [dir="rtl"] .slash{transform:skewX(18deg);}
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:13px; font-weight:600; letter-spacing:.04em;
    color:var(--navy); text-transform:uppercase;
    margin-bottom:18px;
  }
  .eyebrow .slash{width:8px; height:16px;}

  h1,h2,h3,h4{font-weight:800; color:var(--navy); line-height:1.15;}
  h2{font-size:clamp(28px,4vw,42px); margin-bottom:14px;}
  h3{font-size:20px;}
  p{color:var(--ink-soft);}
  .lede{font-size:clamp(15px,1.6vw,18px); max-width:640px;}

  .btn{
    display:inline-flex; align-items:center; gap:10px;
    padding:15px 28px; border-radius:100px;
    font-weight:700; font-size:15px;
    transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s;
    white-space:nowrap;
  }
  .btn-primary{background:var(--orange); color:var(--white); box-shadow:0 10px 24px -8px rgba(241,95,35,.55);}
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 14px 30px -8px rgba(241,95,35,.65);}
  .btn-ghost{background:transparent; color:var(--navy); border:1.5px solid var(--navy);}
  .btn-ghost:hover{background:var(--navy); color:var(--white);}
  .btn-teal{background:var(--teal); color:var(--white); box-shadow:0 10px 24px -8px rgba(69,187,138,.5);}
  .btn-teal:hover{transform:translateY(-2px);}

  /* ---------- header ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(255,255,255,.85);
    backdrop-filter:saturate(180%) blur(14px);
    border-bottom:1px solid var(--line);
  }
  header .wrap{
    display:flex; align-items:center; justify-content:space-between;
    height:78px;
  }
  .brand{display:flex; align-items:center; gap:10px;}
  .brand img{height:34px; width:auto;}
  nav.main-nav ul{display:flex; align-items:center; gap:34px;}
  nav.main-nav a{font-weight:500; font-size:14.5px; color:var(--navy); position:relative; padding:6px 0;}
  nav.main-nav a::after{
    content:''; position:absolute; bottom:0; right:0; left:auto; width:0; height:2px; background:var(--orange);
    transition:width .25s var(--ease);
  }
  [dir="ltr"] nav.main-nav a::after{right:auto; left:0;}
  nav.main-nav a:hover::after{width:100%;}
  .header-actions{display:flex; align-items:center; gap:14px;}
  .lang-toggle{
    border:1.5px solid var(--line); border-radius:100px;
    padding:8px 16px; font-size:13px; font-weight:700; color:var(--navy);
    cursor:pointer; background:var(--white); transition:all .2s;
  }
  .lang-toggle:hover{border-color:var(--navy);}
  .burger{display:none; width:26px; height:20px; position:relative; cursor:pointer; border:0; background:none;}
  .burger span{position:absolute; right:0; left:0; height:2.5px; background:var(--navy); border-radius:2px;}
  .burger span:nth-child(1){top:0;} .burger span:nth-child(2){top:8.5px;} .burger span:nth-child(3){top:17px;}

  /* ---------- hero ---------- */
  .hero{
    padding:96px 0 110px;
    background:
      radial-gradient(900px 480px at 85% -10%, rgba(69,187,138,.10), transparent 60%),
      radial-gradient(700px 420px at -5% 20%, rgba(241,95,35,.08), transparent 55%);
  }
  .hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:center;}
  .hero h1{
    font-size:clamp(36px,5.4vw,64px);
    letter-spacing:-.01em;
  }
  .hero h1 em{
    font-style:normal; color:var(--orange);
    position:relative;
  }
  .hero p.lede{margin:22px 0 34px; font-size:clamp(16px,1.8vw,19px);}
  .hero-actions{display:flex; flex-wrap:wrap; gap:16px;}

  .hero-grid.has-photo{grid-template-columns:1fr .55fr .85fr;}
  .hero-photo{border-radius:24px; overflow:hidden; align-self:stretch;}
  .hero-photo img{width:100%; height:100%; object-fit:cover; min-height:280px;}
  @media (max-width:1180px){ .hero-grid.has-photo{grid-template-columns:1fr; } }

  .hero-panel{
    background:var(--navy);
    border-radius:28px;
    padding:40px 34px;
    color:var(--white);
    position:relative;
    overflow:hidden;
  }
  .hero-panel::before{
    content:'';
    position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(241,95,35,.22), transparent 55%);
  }
  .hero-panel-inner{position:relative; z-index:1;}
  .hero-quote{font-size:19px; font-weight:600; line-height:1.55; margin-bottom:26px;}
  .hero-quote .slash{margin-inline-end:8px;}
  .stat-row{display:grid; grid-template-columns:1fr 1fr; gap:22px 18px; border-top:1px solid rgba(255,255,255,.16); padding-top:26px;}
  .stat{}
  .stat b{display:block; font-size:clamp(26px,2.6vw,34px); color:var(--white); font-weight:800;}
  .stat span{font-size:12.5px; color:rgba(255,255,255,.7); font-weight:500;}

  .shorts-head{display:flex; align-items:center; gap:10px; margin:44px 0 22px; font-weight:700; color:var(--navy); font-size:15px;}
  .shorts-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:18px;}
  .short-card{
    border-radius:16px; overflow:hidden; background:var(--navy); position:relative;
    aspect-ratio:9/16; display:flex; align-items:flex-end;
  }
  .short-card::before{content:''; position:absolute; inset:0; background:linear-gradient(160deg, rgba(69,187,138,.4), rgba(27,43,73,.9));}
  .short-card .video-play{width:44px; height:44px;}
  .short-card .video-label{font-size:12.5px; padding:14px;}
  @media (max-width:980px){ .shorts-grid{grid-template-columns:repeat(3,1fr);} }
  @media (max-width:720px){ .shorts-grid{grid-template-columns:repeat(2,1fr);} }

  /* ---------- custom sections ---------- */
  .custom-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
  .custom-card{background:var(--white); border:1px solid var(--line); border-radius:18px; padding:26px; overflow:hidden;}
  .custom-card-image{border-radius:12px; overflow:hidden; margin-bottom:16px; aspect-ratio:16/10;}
  .custom-card-image img{width:100%; height:100%; object-fit:cover;}
  .custom-card h3{margin-bottom:8px; font-size:17px;}
  .custom-card p{font-size:14px;}
  @media (max-width:980px){ .custom-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:720px){ .custom-grid{grid-template-columns:1fr;} }

  /* ---------- section shell ---------- */
  .section{padding:100px 0;}
  .section.alt{background:var(--paper);}
  .section-head{max-width:640px; margin-bottom:56px;}
  [dir="rtl"] .section-head, [dir="ltr"] .section-head{margin-inline-start:0;}

  /* ---------- about ---------- */
  .about-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:start;}
  .about-card{
    background:var(--navy); color:var(--white); border-radius:24px; padding:36px;
    position:relative; overflow:hidden;
  }
  .about-card::after{
    content:''; position:absolute; width:220px; height:220px; border-radius:50%;
    background:radial-gradient(circle, rgba(69,187,138,.35), transparent 70%);
    top:-80px; inset-inline-end:-80px;
  }
  .about-card h3{color:var(--white); font-size:22px; margin-bottom:10px;}
  .about-card p{color:rgba(255,255,255,.78); font-size:14.5px;}
  .pillar{display:flex; gap:14px; padding:20px 0; border-top:1px solid var(--line);}
  .pillar:first-of-type{border-top:none;}
  .pillar .slash{margin-top:6px;}
  .pillar h4{font-size:16.5px; margin-bottom:6px;}
  .pillar p{font-size:14.5px;}

  /* ---------- content pillars ---------- */
  .pillars-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
  .pillar-card{
    background:var(--white); border:1px solid var(--line); border-radius:18px;
    padding:28px 24px; transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
  }
  .pillar-card:hover{transform:translateY(-5px); box-shadow:0 20px 38px -20px rgba(27,43,73,.25); border-color:transparent;}
  .pillar-icon{
    width:46px; height:46px; border-radius:12px; background:var(--paper); color:var(--orange);
    display:flex; align-items:center; justify-content:center; margin-bottom:18px;
  }
  .pillar-icon svg{width:23px; height:23px;}
  .pillar-card h3{font-size:17px; margin-bottom:8px;}
  .pillar-card p{font-size:13.5px;}
  @media (max-width:980px){ .pillars-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:720px){ .pillars-grid{grid-template-columns:1fr;} }

  /* ---------- services ---------- */
  .services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
  .service-card{
    background:var(--white); border:1px solid var(--line); border-radius:20px;
    padding:32px 28px; transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
    display:flex; flex-direction:column; height:100%;
  }
  .service-card:hover{transform:translateY(-6px); box-shadow:0 24px 44px -20px rgba(27,43,73,.25); border-color:transparent;}
  .service-icon{
    width:52px; height:52px; border-radius:14px; background:var(--paper);
    display:flex; align-items:center; justify-content:center; margin-bottom:22px;
  }
  .service-icon svg{width:26px; height:26px;}
  .service-card h3{margin-bottom:10px;}
  .service-card p{font-size:14.5px; flex:1;}
  .service-card .btn{margin-top:22px; align-self:flex-start; padding:11px 22px; font-size:13.5px;}

  /* ---------- courses ---------- */
  .courses-panel{
    background:linear-gradient(120deg, var(--navy), var(--navy-2));
    border-radius:28px; padding:56px; color:var(--white);
    display:grid; grid-template-columns:1.3fr .7fr; gap:40px; align-items:center;
    position:relative; overflow:hidden;
  }
  .courses-panel::before{
    content:''; position:absolute; width:16px; height:130px; background:var(--orange);
    transform:skewX(-18deg); opacity:.9; inset-inline-end:60px; top:-10px;
  }
  .courses-panel h2, .courses-panel p{color:var(--white);}
  .courses-panel p{color:rgba(255,255,255,.78);}
  .courses-cta{display:flex; justify-content:flex-start;}
  [dir="rtl"] .courses-cta{justify-content:flex-end;}

  /* ---------- videos ---------- */
  .video-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
  .video-card{border-radius:18px; overflow:hidden; background:var(--navy); position:relative; aspect-ratio:16/10; display:flex; align-items:flex-end;}
  .video-card::before{
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(241,95,35,.4), rgba(27,43,73,.85));
  }
  .video-play{
    position:absolute; top:50%; inset-inline-start:50%; transform:translate(-50%,-50%);
    width:56px; height:56px; border-radius:50%; background:rgba(255,255,255,.92);
    display:flex; align-items:center; justify-content:center;
    transition:transform .25s var(--ease);
  }
  [dir="rtl"] .video-play{transform:translate(50%,-50%);}
  .video-card:hover .video-play{transform:translate(-50%,-50%) scale(1.1);}
  [dir="rtl"] .video-card:hover .video-play{transform:translate(50%,-50%) scale(1.1);}
  .video-play svg{width:20px; height:20px; fill:var(--navy); margin-inline-start:3px;}
  .video-label{position:relative; z-index:1; padding:20px; color:var(--white); font-weight:600; font-size:14.5px;}

  /* ---------- testimonials ---------- */
  .test-track-wrap{overflow:hidden; position:relative;}
  .test-track{display:flex; gap:22px; transition:transform .5s var(--ease);}
  .test-card{
    min-width:calc(33.333% - 15px); background:var(--white); border:1px solid var(--line);
    border-radius:20px; padding:28px; flex-shrink:0;
  }
  .test-stars{color:var(--orange); font-size:14px; margin-bottom:14px; letter-spacing:2px;}
  .test-quote{font-size:14.5px; color:var(--ink); margin-bottom:20px; min-height:80px;}
  .test-person{display:flex; align-items:center; gap:12px;}
  .test-avatar{width:42px; height:42px; border-radius:50%; background:var(--teal); color:var(--white); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:15px;}
  .test-name{font-weight:700; font-size:14px; color:var(--navy);}
  .test-role{font-size:12.5px; color:var(--ink-soft);}
  .test-nav{display:flex; gap:12px; margin-top:32px; justify-content:center;}
  .test-dot{width:9px; height:9px; border-radius:50%; background:var(--line); cursor:pointer; border:0; transition:background .2s;}
  .test-dot.active{background:var(--orange);}

  /* ---------- contact ---------- */
  .contact-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:50px;}
  .contact-info{}
  .contact-method{display:flex; align-items:center; gap:14px; padding:16px 0; border-bottom:1px solid var(--line);}
  .contact-method:first-child{padding-top:0;}
  .contact-icon{width:44px; height:44px; border-radius:12px; background:var(--paper); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
  .contact-icon svg{width:20px; height:20px;}
  .contact-method b{display:block; font-size:14.5px; color:var(--navy);}
  .contact-method span{font-size:13.5px; color:var(--ink-soft);}
  .social-row{display:flex; gap:12px; margin-top:26px;}
  .social-row a{
    width:42px; height:42px; border-radius:50%; border:1.5px solid var(--line);
    display:flex; align-items:center; justify-content:center; transition:all .2s;
  }
  .social-row a:hover{background:var(--navy); border-color:var(--navy);}
  .social-row a:hover svg{fill:var(--white);}
  .social-row svg{width:18px; height:18px; fill:var(--navy); transition:fill .2s;}

  .contact-form{background:var(--paper); border-radius:24px; padding:36px;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
  .field{display:flex; flex-direction:column; gap:8px;}
  .field.full{grid-column:1/-1;}
  .field label{font-size:13px; font-weight:600; color:var(--navy);}
  .field input, .field textarea{
    border:1.5px solid var(--line); border-radius:12px; padding:13px 16px;
    font-family:inherit; font-size:14.5px; background:var(--white); resize:vertical;
    transition:border-color .2s;
  }
  .field input:focus, .field textarea:focus{outline:none; border-color:var(--orange);}
  .contact-form .btn{width:100%; justify-content:center; margin-top:6px;}
  .form-note{font-size:12.5px; margin-top:14px; text-align:center;}

  /* ---------- footer ---------- */
  footer{background:var(--navy); color:rgba(255,255,255,.75); padding:56px 0 28px;}
  .footer-top{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,.14);}
  .footer-brand{display:flex; align-items:center; gap:10px;}
  .footer-brand img{height:30px;}
  footer nav ul{display:flex; gap:26px; flex-wrap:wrap;}
  footer nav a{font-size:13.5px; color:rgba(255,255,255,.75);}
  footer nav a:hover{color:var(--white);}
  .footer-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; padding-top:24px; font-size:12.5px;}

  /* ---------- whatsapp float ---------- */
  .wa-float{
    position:fixed; bottom:26px; inset-inline-end:26px; z-index:60;
    width:58px; height:58px; border-radius:50%; background:#25D366;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 12px 28px -8px rgba(37,211,102,.6);
    animation:pulse 2.4s infinite;
  }
  .wa-float svg{width:28px; height:28px; fill:var(--white);}
  @keyframes pulse{
    0%{box-shadow:0 0 0 0 rgba(37,211,102,.5), 0 12px 28px -8px rgba(37,211,102,.6);}
    70%{box-shadow:0 0 0 14px rgba(37,211,102,0), 0 12px 28px -8px rgba(37,211,102,.6);}
    100%{box-shadow:0 0 0 0 rgba(37,211,102,0), 0 12px 28px -8px rgba(37,211,102,.6);}
  }

  /* ---------- reveal on scroll ---------- */
  .reveal{opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
  .reveal.in{opacity:1; transform:none;}

  /* ---------- responsive ---------- */
  @media (max-width:980px){
    .hero-grid, .about-grid, .contact-grid{grid-template-columns:1fr;}
    .services-grid, .video-grid{grid-template-columns:repeat(2,1fr);}
    .test-card{min-width:calc(50% - 11px);}
    .courses-panel{grid-template-columns:1fr; text-align:center;}
    .courses-cta, [dir="rtl"] .courses-cta{justify-content:center;}
    .courses-panel::before{display:none;}
  }
  @media (max-width:720px){
    nav.main-nav{position:fixed; top:78px; inset-inline:0; background:var(--white); flex-direction:column;
      padding:20px 28px 30px; border-bottom:1px solid var(--line);
      transform:translateY(-130%); transition:transform .35s var(--ease); z-index:40;}
    nav.main-nav.open{transform:translateY(0);}
    nav.main-nav ul{flex-direction:column; align-items:flex-start; gap:18px; width:100%;}
    .burger{display:block;}
    .services-grid, .video-grid{grid-template-columns:1fr;}
    .test-card{min-width:100%;}
    .form-row{grid-template-columns:1fr;}
    .section{padding:70px 0;}
    .hero{padding:60px 0 70px;}
    .footer-top{flex-direction:column; align-items:flex-start;}
  }
