:root{
    --navy:#0B1E33;
    --navy-2:#0F2740;
    --near-black:#0A0A0A;
    --teal:#1B95A6;
    --teal-dark:#157988;
    --slate:#4C5C72;
    --green:#4B9460;
    --white:#FFFFFF;
    --ink:#111417;
    --body-gray:#414c56;
    --display:'Poppins', sans-serif;
    --sans:'Inter', sans-serif;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{ font-family:var(--sans); color:var(--ink); background:var(--white); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
  a{color:inherit; text-decoration:none;}
  img,svg{display:block; max-width:100%;}
  .container{ max-width:1240px; margin:0 auto; padding:0 40px; }
  .tag{ font-family:var(--sans); font-size:0.74rem; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; }

  /* ---------- NAV ---------- */
  header.nav{ position:sticky; top:0; z-index:50; background:var(--near-black); }
  .nav-inner{ max-width:1240px; margin:0 auto; padding:18px 40px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
  .brand{ display:flex; align-items:center; gap:12px; color:var(--white); }
  .brand-word{ font-family:var(--display); font-weight:700; font-size:1rem; line-height:1.1; }
  .brand-word small{ display:block; font-family:var(--sans); font-size:0.6rem; letter-spacing:0.2em; font-weight:600; color:var(--teal); margin-top:3px; text-transform:uppercase; }
  @media (max-width:900px){
    .brand-word{ font-size:0.85rem; }
    .brand-word small{ font-size:0.5rem; letter-spacing:0.06em; margin-top:2px; }
  }
  nav.links{ display:flex; gap:26px; align-items:center; }
  nav.links a.nlink{ color:rgba(255,255,255,0.75); font-size:0.85rem; font-weight:600; }
  nav.links a.nlink:hover{ color:var(--white); }
  .btn{ display:inline-block; padding:14px 28px; border-radius:8px; font-size:0.85rem; font-weight:700; transition:transform 0.15s ease, opacity 0.15s ease; }
  .btn-teal{ background:var(--teal); color:var(--white); }
  .btn-teal:hover{ transform:translateY(-2px); opacity:0.92; }
  .btn-outline{ border:2px solid rgba(255,255,255,0.55); color:var(--white); }
  .btn-outline:hover{ border-color:var(--white); }
  @media (max-width:900px){ nav.links a.hide-mobile{display:none;} }

  /* ---------- NAV DROPDOWN ---------- */
  .nav-dropdown{ position:relative; }
  .nav-dropdown .drop-trigger{ display:inline-flex; align-items:center; gap:6px; color:rgba(255,255,255,0.75); font-size:0.85rem; font-weight:600; cursor:pointer; }
  .nav-dropdown:hover .drop-trigger{ color:var(--white); }
  .nav-dropdown .caret{ font-size:0.68em; transition:transform 0.15s ease; }
  .nav-dropdown:hover .caret{ transform:rotate(180deg); }
  .nav-dropdown .nav-menu{ position:absolute; top:100%; left:0; padding-top:20px; min-width:200px; display:none; z-index:60; }
  .nav-dropdown:hover .nav-menu{ display:block; }
  .nav-menu-inner{ background:var(--near-black); border-radius:10px; padding:8px 0; box-shadow:0 16px 40px rgba(0,0,0,0.45); border:1px solid rgba(255,255,255,0.08); }
  .nav-menu-inner a{ display:block; color:rgba(255,255,255,0.8); font-size:0.85rem; font-weight:600; padding:12px 22px; white-space:nowrap; }
  .nav-menu-inner a:hover{ color:var(--white); background:rgba(255,255,255,0.07); }
  @media (max-width:900px){ nav.links .nav-dropdown{ display:none; } }

  /* ---------- MOBILE NAV TOGGLE ---------- */
  .nav-toggle-checkbox{ display:none; }
  .nav-toggle-btn{ display:none; flex-direction:column; gap:5px; cursor:pointer; padding:6px; z-index:60; }
  .nav-toggle-btn span{ width:26px; height:3px; background:var(--white); border-radius:2px; display:block; }
  .mobile-menu{ display:none; }
  @media (max-width:900px){
    .nav-inner{ position:relative; }
    .nav-toggle-btn{ display:flex; }
    .mobile-menu{
      display:none; flex-direction:column; position:absolute; top:100%; left:0; right:0;
      background:var(--near-black); padding:8px 40px 28px; box-shadow:0 12px 24px rgba(0,0,0,0.3);
    }
    .nav-toggle-checkbox:checked ~ .mobile-menu{ display:flex; }
    .mobile-menu a.nlink{ color:rgba(255,255,255,0.85); font-size:1rem; font-weight:600; padding:14px 0; border-bottom:1px solid rgba(255,255,255,0.1); }
    .mobile-menu a.nlink:last-of-type{ border-bottom:none; }
    .mobile-menu .btn{ margin-top:18px; text-align:center; }
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative; min-height:88vh; display:flex; align-items:center;
    background:
      linear-gradient(180deg, rgba(6,10,15,0.48) 0%, rgba(6,10,15,0.66) 100%),
      url('../images/hero-classroom.jpg') center 35%/cover no-repeat;
    color:var(--white); text-align:center; padding:80px 0;
  }
  .hero-inner{ position:relative; z-index:2; max-width:920px; margin:0 auto; }
  .hero h1{ font-family:var(--display); font-weight:800; font-size:clamp(2.6rem, 6vw, 5rem); line-height:1.06; text-shadow:0 2px 20px rgba(0,0,0,0.4); }
  .hero h1 em{ font-style:italic; color:var(--teal); font-weight:800; }
  .hero p.lede{ margin:26px auto 0; max-width:600px; font-size:1.15rem; line-height:1.6; color:rgba(255,255,255,0.92); text-shadow:0 2px 12px rgba(0,0,0,0.5); }
  .hero-ctas{ margin-top:38px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

  /* ---------- SUB-HERO ANNOUNCE BAND ---------- */
  .announce{
    position:relative; padding:120px 0;
    background: linear-gradient(180deg, rgba(6,13,21,0.55) 0%, rgba(6,13,21,0.85) 100%), radial-gradient(circle at 70% 40%, #123244 0%, #060d15 65%);
    color:var(--white); text-align:center;
  }
  .announce h2{ font-family:var(--display); font-weight:800; font-size:clamp(2rem, 4.4vw, 3.4rem); }
  .announce .line2{ font-family:var(--display); font-weight:600; font-size:clamp(1.2rem, 2.6vw, 1.8rem); margin-top:10px; }
  .announce .times{ font-family:var(--display); font-weight:700; font-size:1.6rem; margin-top:22px; line-height:1.5; color:rgba(255,255,255,0.9); }
  .announce .btn{ margin-top:30px; }

  /* ---------- NAVY THREE-COL BAND (Growth Track / Dream Team pattern) ---------- */
  .pillars-band{ background:var(--navy); color:var(--white); padding:100px 0; }

  /* ---------- PHOTO BREAK ---------- */
  .photo-break{ position:relative; height:380px; background-size:cover; background-position:center 20%; }
  .photo-break::before{ content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(11,30,51,0.7) 0%, rgba(11,30,51,0.15) 55%, rgba(11,30,51,0.35) 100%); }
  .photo-break .pb-inner{ position:relative; z-index:2; height:100%; display:flex; align-items:flex-end; padding:36px 40px; max-width:1240px; margin:0 auto; }
  .photo-break p{ font-family:var(--display); font-style:italic; font-weight:700; color:var(--white); font-size:clamp(1.1rem,2.2vw,1.5rem); max-width:640px; line-height:1.4; }
  @media (max-width:700px){ .photo-break{ height:300px; } .photo-break .pb-inner{ padding:26px 24px; } }
  .pillars-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:50px; }
  .pillar-col h3{ font-family:var(--display); font-weight:800; font-size:2.1rem; }
  .pillar-col h3 em{ font-style:italic; color:var(--teal); }
  .pillar-col p{ margin-top:20px; font-size:0.98rem; line-height:1.65; color:rgba(255,255,255,0.72); }
  .pillar-col .btn{ margin-top:28px; }
  @media (max-width:900px){ .pillars-grid{ grid-template-columns:1fr; gap:60px; } }

  /* ---------- ALTERNATING WHITE STORY-CARD ROWS ---------- */
  .feature-row{ padding:90px 0; }
  .feature-inner{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
  .feature-inner.rev > *:first-child{ order:2; }
  .feature-text h2{ font-family:var(--display); font-weight:800; font-size:clamp(1.8rem,3vw,2.4rem); color:var(--ink); }
  .feature-text p{ margin-top:18px; font-size:1rem; line-height:1.7; color:var(--body-gray); max-width:48ch; }
  .feature-text .btn{ margin-top:26px; }
  .feature-card{
    border-radius:14px; overflow:hidden; aspect-ratio:4/3; position:relative;
    display:flex; align-items:flex-end; padding:26px;
  }
  .feature-card.enrolling{ background: linear-gradient(150deg, var(--teal) 0%, var(--navy-2) 100%); }
  .feature-card.hiring{ background: linear-gradient(150deg, var(--green) 0%, var(--navy-2) 100%); }
  .feature-card .badge{
    font-family:var(--display); font-weight:800; font-size:1.6rem; color:var(--white);
    text-transform:uppercase; line-height:1.1;
  }
  .feature-card.academics{ background: linear-gradient(150deg, var(--green) 0%, var(--navy-2) 100%); }
  @media (max-width:850px){
    .feature-inner{ grid-template-columns:1fr; gap:30px; }
    .feature-inner.rev > *:first-child{ order:0; }
  }

  /* ---------- DIFFERENCE GRID ---------- */
  .difference-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2px; background:#E5E0D2; border-radius:14px; overflow:hidden; }
  .difference-item{ background:var(--white); padding:38px 36px; }
  .difference-item h3{ font-family:var(--display); font-weight:700; font-size:1.12rem; color:var(--ink); }
  .difference-item p{ margin-top:12px; font-size:0.94rem; line-height:1.65; color:var(--body-gray); }
  .difference-item.wide{ grid-column:1 / -1; }
  @media (max-width:750px){ .difference-grid{ grid-template-columns:1fr; } }

  /* ---------- SCHEDULE BAND ---------- */
  .schedule-band{ background:var(--navy); color:var(--white); padding:90px 0; }
  .schedule-head{ text-align:center; max-width:640px; margin:0 auto 56px; }
  .schedule-head h2{ font-family:var(--display); font-weight:800; font-size:clamp(1.9rem,3.6vw,2.6rem); }
  .schedule-head h2 em{ font-style:italic; color:var(--teal); }
  .schedule-head p{ margin-top:14px; font-size:1rem; line-height:1.65; color:rgba(255,255,255,0.72); }
  .schedule-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2px; background:rgba(255,255,255,0.12); border-radius:14px; overflow:hidden; max-width:820px; margin:0 auto; }
  .schedule-card{ background:var(--navy-2); padding:36px 34px; }
  .schedule-card .tag{ color:var(--teal); }
  .schedule-card .days{ margin-top:12px; font-family:var(--display); font-weight:800; font-size:1.5rem; }
  .schedule-card .hours{ margin-top:6px; font-size:1rem; color:rgba(255,255,255,0.75); }
  .benefit-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; max-width:960px; margin:56px auto 0; }
  .benefit-item{ text-align:center; padding:0 10px; }
  .benefit-item .n{ font-family:var(--display); font-weight:800; font-size:1.1rem; color:var(--teal); }
  .benefit-item p{ margin-top:8px; font-size:0.92rem; line-height:1.55; color:rgba(255,255,255,0.75); }
  .schedule-close{ text-align:center; max-width:640px; margin:50px auto 0; font-size:0.98rem; line-height:1.65; color:rgba(255,255,255,0.78); font-style:italic; }
  .schedule-note{ text-align:center; max-width:680px; margin:40px auto 0; padding:34px 40px; border:1px solid rgba(255,255,255,0.2); border-radius:12px; background:rgba(255,255,255,0.04); }
  .schedule-note .tag{ font-size:0.82rem; }
  .schedule-note p{ margin-top:12px; font-size:1.08rem; line-height:1.6; color:rgba(255,255,255,0.85); }
  @media (max-width:700px){ .schedule-grid, .benefit-row{ grid-template-columns:1fr; } }

  /* ---------- TEAL MARQUEE TICKER ---------- */
  .marquee{ background:var(--teal); overflow:hidden; padding:26px 0; }
  .marquee-track{ display:flex; gap:60px; white-space:nowrap; animation: scroll 22s linear infinite; width:max-content; }
  .marquee-track span{ font-family:var(--display); font-size:2.4rem; font-weight:800; color:var(--white); }
  .marquee-track span.i{ font-style:italic; font-weight:700; }
  @keyframes scroll{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

  /* ---------- PHOTO GRID ROW ---------- */
  .photo-row{ display:grid; grid-template-columns:repeat(3,1fr); }
  .photo-row div{ aspect-ratio:1; background-size:cover; background-position:center; position:relative; overflow:hidden; }
  @media (max-width:700px){ .photo-row{ grid-template-columns:1fr; } }

  /* ---------- MEET OUR FOUNDERS ---------- */
  .section-title{ text-align:center; padding:100px 0 50px; }
  .section-title h2{ font-family:var(--display); font-weight:800; font-size:clamp(2rem,4vw,3rem); color:var(--ink); }
  .section-title h2 em{ font-style:italic; color:var(--teal); }
  .bio-row{ padding-bottom:90px; }
  .bio-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:60px; align-items:center; }
  .bio-grid h3{ font-family:var(--display); font-weight:700; font-size:1.5rem; color:var(--ink); }
  .bio-grid p{ margin-top:16px; font-size:0.98rem; line-height:1.72; color:var(--body-gray); }
  .bio-photo{ aspect-ratio:4/3; border-radius:12px; background-size:cover; background-position:center top; }
  @media (max-width:850px){ .bio-grid{ grid-template-columns:1fr; } .bio-grid h3, .bio-grid p{ text-align:center; } }

  /* ---------- OASIS STORY (alternating) ---------- */
  .story-block{ padding:70px 0; }
  .story-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:60px; align-items:center; }
  .story-grid.rev > *:first-child{ order:2; }
  .story-photo{ aspect-ratio:4/3; border-radius:12px; background-size:cover; background-position:center top; }
  .story-text h2{ font-family:var(--display); font-weight:800; font-size:clamp(1.6rem,2.6vw,2.1rem); color:var(--ink); }
  .story-text p{ margin-top:16px; font-size:0.98rem; line-height:1.72; color:var(--body-gray); }
  @media (max-width:850px){ .story-grid{ grid-template-columns:1fr; } .story-grid.rev > *:first-child{ order:0; } .story-grid h2, .story-grid h3, .story-grid p{ text-align:center; } }

  /* ---------- SLATE QUOTE BAND WITH SILHOUETTE ---------- */
  .quote-band{ position:relative; background:linear-gradient(120deg, var(--slate) 0%, #3a4a5e 100%); padding:110px 0; overflow:hidden; }
  .quote-band .frond{ position:absolute; right:-40px; top:50%; transform:translateY(-50%); width:520px; opacity:0.9; z-index:1; }
  .quote-band .container{ position:relative; z-index:2; }
  .quote-band blockquote{ font-family:var(--display); font-weight:700; font-style:italic; color:var(--white); font-size:clamp(1.5rem,3.2vw,2.4rem); line-height:1.4; max-width:760px; }
  .quote-band cite{ display:block; margin-top:22px; font-style:normal; font-size:0.95rem; font-weight:600; color:rgba(255,255,255,0.75); }

  /* ---------- SCHOLARSHIP BANNER ---------- */
  .banner{ background:var(--teal); padding:32px 0; }
  .banner-inner{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; }
  .banner p{ font-family:var(--display); font-weight:700; font-size:1.1rem; color:var(--white); }
  .banner span.pill{ font-size:0.78rem; font-weight:700; background:var(--near-black); color:var(--teal); padding:10px 18px; border-radius:8px; }

  /* ---------- GET IN TOUCH FOOTER ---------- */
  footer.cta{ position:relative; background:var(--white); padding:110px 0 0; overflow:hidden; }
  .cta-lines{ position:absolute; inset:0; opacity:0.5; z-index:0; }
  .cta-head{ position:relative; z-index:1; text-align:center; max-width:640px; margin:0 auto; }
  .cta-head .tag{ color:var(--near-black); }
  .cta-head h2{ margin-top:14px; font-family:var(--display); font-weight:800; font-size:clamp(2rem,4vw,3rem); color:var(--ink); }
  .cta-head h2 em{ font-style:italic; color:var(--teal); }
  .cta-head p{ margin-top:16px; font-size:1rem; color:var(--body-gray); }
  .cta-head .btn{ margin-top:30px; display:inline-block; }
  .contact-strip{
    position:relative; z-index:1; margin-top:80px; display:grid; grid-template-columns:repeat(3,1fr);
    background:var(--near-black); border-radius:16px 16px 0 0; overflow:hidden;
  }
  .contact-item{ padding:40px 34px; border-left:1px solid rgba(255,255,255,0.08); min-width:0; }
  .contact-item:first-child{ border-left:none; }
  .contact-item .tag{ color:var(--teal); }
  .contact-item .value{ margin-top:10px; font-family:var(--display); font-weight:700; font-size:1.1rem; color:var(--white); overflow-wrap:anywhere; }
  .footer-bottom{
    background:var(--near-black); padding:26px 0 30px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
    font-size:0.78rem; color:rgba(255,255,255,0.4);
  }
  @media (max-width:800px){ .contact-strip{ grid-template-columns:1fr; } .contact-item{ border-left:none; border-top:1px solid rgba(255,255,255,0.08); } .contact-item:first-child{ border-top:none; } }