
    :root {
      --navy: #102542;
      --navy-2: #123456;
      --navy-3: #1E456E;
      --navy-soft: #17365C;
      --navy-soft-2: rgba(10, 37, 64, 0.09);
      --navy-border: rgba(16, 37, 66, 0.14);
      --blue: #102542;
      --blue-dark: #0B1F3A;
      --gold: #F3B421;
      --gold-soft: #FFE7A6;
      --gold-pale: #FFF7DF;
      --gold-glow: rgba(247, 184, 1, 0.24);
      --text: #17212F;
      --muted: #6E7582;
      --light: #F7F8FB;
      --soft-blue: #F4F7FB;
      --border: rgba(16, 37, 66, 0.12);
      --white: #FFFFFF;
      --footer: #102542;
      --glass: rgba(255, 255, 255, 0.62);
      --glass-strong: rgba(255, 255, 255, 0.82);
      --glass-border: rgba(10, 37, 64, 0.12);
      --warm-shadow: rgba(10, 37, 64, 0.07);
      --surface: rgba(255, 255, 255, 0.86);
      --surface-solid: #FFFFFF;
      --gold-border: rgba(243, 180, 33, 0.28);
      --clean-shadow: 0 24px 70px rgba(16, 37, 66, 0.08);
      --soft-shadow: 0 14px 38px rgba(16, 37, 66, 0.07);
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: Arial, sans-serif;
      color: var(--text);
      background: var(--white);
      line-height: 1.6;
      overflow-x: hidden;
    }

    a {
      text-decoration: none;
      color: inherit;
    }

    button,
    input,
    select,
    textarea {
      font: inherit;
    }

    .container {
      width: min(1120px, 92%);
      margin: 0 auto;
    }

    /* Header */
    header {
      border-bottom: 1px solid var(--border);
      background: rgba(255, 255, 255, 0.96);
      backdrop-filter: blur(10px);
      position: sticky;
      top: 0;
      z-index: 100;
    }

    .nav {
      height: 72px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .logo {
      font-weight: 900;
      color: var(--navy);
      font-size: 22px;
      letter-spacing: -0.03em;
      display: inline-flex;
      align-items: center;
    }

    .logo span {
      color: var(--blue);
    }

    .logo-img {
      display: block;
      width: 152px;
      height: auto;
      max-height: 58px;
      object-fit: contain;
    }

    @media (max-width: 980px) {
      .logo-img {
        width: 136px;
        max-height: 54px;
      }
    }

    @media (max-width: 620px) {
      .logo-img {
        width: 116px;
        max-height: 48px;
      }
    }

    .nav-links {
      display: flex;
      gap: 28px;
      font-size: 15px;
      color: var(--muted);
      align-items: center;
    }

    .nav-links a {
      transition: color 0.2s ease;
    }

    .nav-links a:hover {
      color: var(--blue);
    }

    .nav-actions {
      display: flex;
      gap: 12px;
      align-items: center;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 12px 20px;
      border-radius: 10px;
      font-weight: 800;
      font-size: 15px;
      cursor: pointer;
      border: 1px solid transparent;
      transition: all 0.2s ease;
      white-space: nowrap;
    }

    .btn-primary {
      background: var(--blue);
      color: var(--white);
      box-shadow: 0 8px 20px rgba(21, 101, 216, 0.18);
    }

    .btn-primary:hover {
      background: var(--blue-dark);
      transform: translateY(-1px);
    }

    .btn-secondary {
      background: var(--white);
      color: var(--blue);
      border-color: var(--blue);
    }

    .btn-secondary:hover {
      background: var(--soft-blue);
      transform: translateY(-1px);
    }

    /* Hero */
    .hero {
      position: relative;
      min-height: calc(100vh - 72px);
      padding: 82px 0 74px;
      overflow: hidden;
      display: flex;
      align-items: center;
      background:
        radial-gradient(circle at 80% 30%, rgba(21, 101, 216, 0.35), transparent 28%),
        radial-gradient(circle at 18% 82%, rgba(244, 185, 66, 0.16), transparent 30%),
        var(--navy);
    }

    .hero-video {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 0;
      opacity: 0.55;
    }

    .hero-overlay {
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, rgba(11, 31, 58, 0.95) 0%, rgba(11, 31, 58, 0.78) 48%, rgba(11, 31, 58, 0.42) 100%),
        linear-gradient(180deg, rgba(11, 31, 58, 0.2), rgba(11, 31, 58, 0.8));
      z-index: 1;
    }

    .hero-content {
      position: relative;
      z-index: 2;
      width: 100%;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: 1.08fr 0.92fr;
      gap: 72px;
      align-items: center;
    }

    .eyebrow {
      color: #8AB7FF;
      font-weight: 900;
      font-size: 13px;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      margin-bottom: 16px;
    }

    .hero .eyebrow {
      margin-bottom: 14px;
    }

    h1 {
      font-size: 56px;
      line-height: 1.06;
      color: var(--white);
      margin-bottom: 20px;
      letter-spacing: -0.055em;
      max-width: 660px;
    }

    .hero-copy p {
      font-size: 20px;
      color: rgba(255, 255, 255, 0.78);
      margin-bottom: 30px;
      max-width: 520px;
    }

    .hero-actions {
      display: flex;
      gap: 16px;
      flex-wrap: wrap;
      margin-bottom: 0;
    }

    .hero .btn-secondary {
      background: rgba(255, 255, 255, 0.08);
      color: var(--white);
      border-color: rgba(255, 255, 255, 0.34);
      backdrop-filter: blur(10px);
    }

    .hero .btn-secondary:hover {
      background: rgba(255, 255, 255, 0.16);
    }

    .hero-note {
      color: rgba(255, 255, 255, 0.68);
      font-size: 14px;
    }

    .hero-proof-line {
      display: none;
    }

    .hero-proof-pill {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border: 1px solid rgba(255, 255, 255, 0.18);
      background: rgba(255, 255, 255, 0.08);
      color: rgba(255, 255, 255, 0.92);
      border-radius: 999px;
      padding: 9px 13px;
      font-size: 14px;
      font-weight: 800;
      line-height: 1;
      backdrop-filter: blur(12px);
    }

    .hero-proof-pill::before {
      content: "✓";
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: rgba(138, 183, 255, 0.18);
      color: #8AB7FF;
      font-size: 12px;
      flex-shrink: 0;
    }

    /* Right Assessment Accordion Card */
    .consultation-card {
      width: 100%;
      max-width: 410px;
      margin-left: auto;
      background: rgba(255, 255, 255, 0.96);
      border: 1px solid rgba(255, 255, 255, 0.65);
      border-radius: 28px;
      box-shadow: 0 24px 70px rgba(0, 0, 0, 0.26);
      backdrop-filter: blur(16px);
      overflow: hidden;
    }

    .card-browser-bar,
    .browser-dot {
      display: none;
    }

    .consultation-toggle {
      width: 100%;
      border: none;
      background: var(--white);
      padding: 28px 28px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      cursor: pointer;
      text-align: left;
    }

    .consultation-toggle strong {
      display: block;
      color: var(--navy);
      font-size: 30px;
      line-height: 1.12;
      letter-spacing: -0.04em;
      margin-bottom: 6px;
    }

    .consultation-toggle small {
      display: block;
      color: var(--muted);
      font-size: 14px;
      font-weight: 600;
    }

    .toggle-icon {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: var(--soft-blue);
      color: var(--blue);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      font-weight: 900;
      flex-shrink: 0;
      transition: transform 0.25s ease;
    }

    .consultation-card.is-open .toggle-icon {
      transform: rotate(180deg);
    }

    .consultation-panel {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.35s ease;
    }

    .consultation-card.is-open .consultation-panel {
      max-height: 860px;
    }

    .inline-form {
      display: grid;
      gap: 12px;
      padding: 0 28px 28px;
    }

    .form-row {
      display: grid;
      gap: 8px;
    }

    .form-row label {
      color: var(--navy);
      font-size: 13px;
      font-weight: 800;
    }

    .form-row input,
    .form-row select {
      width: 100%;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 12px 13px;
      color: var(--text);
      background: var(--white);
      outline: none;
      font-size: 14px;
    }

    .form-row input:focus,
    .form-row select:focus {
      border-color: var(--blue);
      box-shadow: 0 0 0 4px rgba(21, 101, 216, 0.12);
    }

    .eligibility-options {
      display: grid;
      gap: 9px;
    }

    .eligibility-option {
      display: grid;
      grid-template-columns: 18px 1fr;
      gap: 10px;
      align-items: flex-start;
      padding: 12px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--white);
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .eligibility-option:hover {
      border-color: rgba(21, 101, 216, 0.38);
      background: #F8FBFF;
    }

    .eligibility-option input {
      width: 16px;
      height: 16px;
      margin-top: 3px;
      accent-color: var(--blue);
    }

    .eligibility-option strong {
      display: block;
      color: var(--navy);
      font-size: 14px;
      line-height: 1.25;
      margin-bottom: 2px;
    }

    .eligibility-option small {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
      font-weight: 600;
    }

    .eligibility-message {
      margin-top: 10px;
      padding: 12px 13px;
      border-radius: 14px;
      background: #FFF7ED;
      border: 1px solid #FED7AA;
      color: #9A3412;
      font-size: 12px;
      line-height: 1.45;
      font-weight: 700;
    }

    .is-hidden {
      display: none;
    }

    .eligible-actions {
      display: grid;
      gap: 12px;
    }

    .eligible-actions.is-disabled {
      opacity: 0.45;
      pointer-events: none;
      filter: grayscale(0.2);
    }

    .eligibility-note {
      padding: 13px 14px;
      border-radius: 14px;
      background: #F8FBFF;
      border: 1px solid rgba(21, 101, 216, 0.18);
    }

    .eligibility-note strong {
      display: block;
      color: var(--navy);
      font-size: 14px;
      line-height: 1.25;
      margin-bottom: 4px;
    }

    .eligibility-note small {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
      font-weight: 600;
    }

    .status-options {
      display: grid;
      gap: 9px;
    }

    .status-option {
      display: grid;
      grid-template-columns: 18px 1fr;
      gap: 10px;
      align-items: center;
      padding: 12px 13px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--white);
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .status-option:hover {
      border-color: rgba(21, 101, 216, 0.38);
      background: #F8FBFF;
    }

    .status-option:has(input:checked) {
      border-color: rgba(21, 101, 216, 0.7);
      background: var(--soft-blue);
      box-shadow: 0 0 0 4px rgba(21, 101, 216, 0.08);
    }

    .status-option input {
      width: 16px;
      height: 16px;
      accent-color: var(--blue);
    }

    .status-option span {
      color: var(--navy);
      font-size: 14px;
      font-weight: 800;
      line-height: 1.25;
    }

    .consultation-options {
      display: grid;
      gap: 10px;
      margin: 4px 0 2px;
    }

    .consultation-option {
      display: grid;
      grid-template-columns: 38px 1fr;
      gap: 12px;
      align-items: center;
      padding: 13px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: #F8FBFF;
      transition: all 0.2s ease;
    }

    .consultation-option:hover {
      border-color: rgba(21, 101, 216, 0.42);
      background: var(--soft-blue);
      transform: translateY(-1px);
    }

    .option-icon {
      width: 38px;
      height: 38px;
      border-radius: 12px;
      background: var(--white);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      box-shadow: 0 8px 18px rgba(11, 31, 58, 0.06);
    }

    .consultation-option strong {
      display: block;
      color: var(--navy);
      font-size: 14px;
      line-height: 1.25;
      margin-bottom: 3px;
    }

    .consultation-option small {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
      font-weight: 600;
    }

    .form-disclaimer {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.5;
      text-align: center;
    }

    /* Trust Ticker */
    .trust-ticker {
      width: 100%;
      background: #ffffff;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      overflow: hidden;
      padding: 18px 0;
      position: relative;
    }

    .trust-ticker::before,
    .trust-ticker::after {
      content: "";
      position: absolute;
      top: 0;
      width: 120px;
      height: 100%;
      z-index: 2;
      pointer-events: none;
    }

    .trust-ticker::before {
      left: 0;
      background: linear-gradient(to right, #ffffff, rgba(255, 255, 255, 0));
    }

    .trust-ticker::after {
      right: 0;
      background: linear-gradient(to left, #ffffff, rgba(255, 255, 255, 0));
    }

    .ticker-track {
      display: flex;
      width: max-content;
      animation: tickerMove 34s linear infinite;
    }

    .ticker-content {
      display: flex;
      align-items: center;
      gap: 34px;
      padding-right: 34px;
    }

    .ticker-content span {
      position: relative;
      white-space: nowrap;
      color: var(--navy);
      font-size: 15px;
      font-weight: 900;
      letter-spacing: -0.01em;
    }

    .ticker-content span::before {
      content: "✦";
      color: var(--blue);
      margin-right: 12px;
      font-size: 14px;
    }

    @keyframes tickerMove {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }

    .trust-ticker:hover .ticker-track {
      animation-play-state: paused;
    }

    /* Mission Scroll Reveal */
    .mission-scroll {
      min-height: 360vh;
      background:
        radial-gradient(circle at 12% 30%, rgba(21, 101, 216, 0.06), transparent 28%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
      position: relative;
    }

    .mission-sticky {
      position: sticky;
      top: 72px;
      min-height: calc(100vh - 72px);
      display: flex;
      align-items: center;
      overflow: hidden;
      padding: 64px 0;
    }

    .mission-grid {
      display: grid;
      grid-template-columns: minmax(420px, 0.95fr) minmax(460px, 1.05fr);
      gap: clamp(48px, 6vw, 84px);
      align-items: center;
    }

    .mission-video {
      width: 100%;
      aspect-ratio: 16 / 10;
      min-height: 330px;
      max-height: 430px;
      border: 1px solid rgba(21, 101, 216, 0.14);
      border-radius: 30px;
      background:
        radial-gradient(circle at 70% 20%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0) 32%),
        linear-gradient(135deg, rgba(21, 101, 216, 0.12), rgba(244, 185, 66, 0.08)),
        #EAF0F8;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--muted);
      font-weight: 800;
      text-align: center;
      padding: 32px;
      position: relative;
      overflow: hidden;
      box-shadow: 0 28px 70px rgba(11, 31, 58, 0.08);
    }

    .mission-video::before {
      content: "";
      position: absolute;
      inset: 20px;
      border-radius: 24px;
      border: 1px solid rgba(255, 255, 255, 0.9);
      pointer-events: none;
    }

    .mission-video::after {
      content: "▶";
      width: 68px;
      height: 68px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.84);
      color: var(--blue);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 26px;
      box-shadow: 0 18px 45px rgba(11, 31, 58, 0.12);
      position: absolute;
      transform: translateY(-16px);
    }

    .mission-video span {
      position: relative;
      z-index: 2;
      margin-top: 112px;
      font-size: 15px;
      color: rgba(31, 41, 55, 0.62);
    }

    .mission-copy {
      max-width: 560px;
      justify-self: start;
    }

    .mission-copy .eyebrow {
      color: var(--blue);
      margin-bottom: 14px;
    }

    .mission-copy h2 {
      font-size: clamp(36px, 3.8vw, 46px);
      line-height: 1.06;
      color: var(--navy);
      letter-spacing: -0.055em;
      margin-bottom: 18px;
      max-width: 560px;
    }

    .mission-copy > p {
      color: var(--muted);
      font-size: 17px;
      line-height: 1.72;
      max-width: 540px;
      margin-bottom: 26px;
    }

    .mission-flow {
      display: grid;
      grid-template-columns: 44px minmax(0, 1fr);
      gap: 26px;
      align-items: start;
      width: 100%;
    }

    .mission-progress {
      position: relative;
      width: 44px;
      height: 295px;
      padding: 8px 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      margin-top: 0;
    }

    .progress-line {
      position: absolute;
      top: 16px;
      bottom: 16px;
      left: 50%;
      width: 3px;
      transform: translateX(-50%);
      background: var(--border);
      border-radius: 999px;
      z-index: 0;
    }

    .progress-fill {
      position: absolute;
      top: 16px;
      left: 50%;
      width: 3px;
      height: 0%;
      transform: translateX(-50%);
      background: linear-gradient(180deg, var(--blue), var(--gold));
      border-radius: 999px;
      z-index: 1;
      transition: height 0.35s ease;
    }

    .progress-dot {
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: #D1D5DB;
      border: 4px solid var(--white);
      box-shadow: 0 0 0 1px var(--border);
      z-index: 2;
      transition: all 0.25s ease;
    }

    .progress-dot.is-active {
      background: var(--blue);
      box-shadow: 0 0 0 7px rgba(21, 101, 216, 0.14);
    }

    .mission-steps {
      position: relative;
      min-height: 295px;
      width: 100%;
    }

    .mission-step {
      position: absolute;
      inset: 0;
      background: rgba(255, 255, 255, 0.86);
      border: 1px solid rgba(21, 101, 216, 0.18);
      border-radius: 26px;
      padding: 34px 36px;
      box-shadow: 0 24px 60px rgba(11, 31, 58, 0.08);
      opacity: 0;
      transform: translateY(32px) scale(0.97);
      pointer-events: none;
      transition:
        opacity 0.45s ease,
        transform 0.45s ease;
      backdrop-filter: blur(12px);
    }

    .mission-step.is-active {
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: auto;
    }

    .mission-number {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      background: var(--blue);
      color: var(--white);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      font-weight: 900;
      margin-bottom: 22px;
      box-shadow: 0 14px 30px rgba(21, 101, 216, 0.24);
    }

    .mission-step h3 {
      color: var(--navy);
      font-size: clamp(26px, 2.4vw, 31px);
      line-height: 1.12;
      letter-spacing: -0.04em;
      margin-bottom: 12px;
    }

    .mission-step p {
      color: var(--muted);
      font-size: 17px;
      line-height: 1.65;
      max-width: 500px;
    }

    /* Sections */
    .section {
      padding: 88px 0;
    }

    .section h2,
    .final-cta h2 {
      font-size: 40px;
      line-height: 1.16;
      color: var(--navy);
      margin-bottom: 18px;
      letter-spacing: -0.04em;
    }


    /* Subtle human cues */
    .advisor-strip {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 13px;
      border-radius: 14px;
      background: #F8FBFF;
      border: 1px solid rgba(21, 101, 216, 0.16);
    }

    .advisor-avatars {
      display: flex;
      flex-shrink: 0;
    }

    .advisor-avatars span {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      border: 2px solid var(--white);
      background:
        linear-gradient(135deg, rgba(21, 101, 216, 0.18), rgba(244, 185, 66, 0.22)),
        #DDE3EA;
      margin-left: -8px;
      box-shadow: 0 6px 12px rgba(11, 31, 58, 0.08);
    }

    .advisor-avatars span:first-child {
      margin-left: 0;
    }

    .advisor-strip strong {
      display: block;
      color: var(--navy);
      font-size: 13px;
      line-height: 1.25;
    }

    .advisor-strip small {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.3;
      font-weight: 600;
    }

    /* Consultation Desk */
    .desk-section {
      background:
        radial-gradient(circle at 15% 20%, rgba(21, 101, 216, 0.06), transparent 30%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
    }

    .desk-grid {
      display: grid;
      grid-template-columns: 0.95fr 1.05fr;
      gap: clamp(38px, 6vw, 78px);
      align-items: center;
    }

    .desk-visual {
      position: relative;
      min-height: 430px;
    }

    .desk-photo {
      height: 390px;
      border-radius: 34px;
      background:
        linear-gradient(135deg, rgba(11, 31, 58, 0.08), rgba(21, 101, 216, 0.14)),
        #DDE3EA;
      border: 1px solid rgba(21, 101, 216, 0.14);
      box-shadow: 0 28px 70px rgba(11, 31, 58, 0.1);
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(11, 31, 58, 0.45);
      font-weight: 900;
      overflow: hidden;
      position: relative;
    }

    .desk-photo::after {
      content: "";
      position: absolute;
      inset: 22px;
      border: 1px solid rgba(255, 255, 255, 0.62);
      border-radius: 26px;
    }

    .desk-note {
      position: absolute;
      right: -22px;
      bottom: 26px;
      width: min(330px, 86%);
      display: grid;
      grid-template-columns: 46px 1fr;
      gap: 12px;
      padding: 18px;
      border-radius: 22px;
      background: rgba(255, 255, 255, 0.92);
      border: 1px solid rgba(21, 101, 216, 0.14);
      box-shadow: 0 22px 52px rgba(11, 31, 58, 0.14);
      backdrop-filter: blur(16px);
    }

    .note-avatar {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      background:
        linear-gradient(135deg, rgba(21, 101, 216, 0.18), rgba(244, 185, 66, 0.20)),
        #DDE3EA;
    }

    .desk-note strong {
      display: block;
      color: var(--navy);
      font-size: 15px;
      line-height: 1.25;
      margin-bottom: 4px;
    }

    .desk-note p {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.45;
    }

    .desk-copy h2 {
      font-size: clamp(34px, 4vw, 46px);
      line-height: 1.08;
      color: var(--navy);
      letter-spacing: -0.055em;
      margin-bottom: 18px;
      max-width: 600px;
    }

    .desk-copy > p {
      color: var(--muted);
      font-size: 17px;
      line-height: 1.72;
      max-width: 560px;
      margin-bottom: 28px;
    }

    .desk-flow {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
    }

    .desk-flow-item {
      padding: 18px;
      border-radius: 20px;
      border: 1px solid rgba(21, 101, 216, 0.14);
      background: rgba(255, 255, 255, 0.82);
      box-shadow: 0 14px 34px rgba(11, 31, 58, 0.05);
    }

    .desk-flow-item span {
      display: inline-flex;
      color: var(--blue);
      font-size: 12px;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      margin-bottom: 8px;
    }

    .desk-flow-item strong {
      display: block;
      color: var(--navy);
      font-size: 16px;
      line-height: 1.3;
    }

    .story-card .story-meta {
      width: fit-content;
      margin: 0 auto 12px;
      padding: 5px 10px;
      border-radius: 999px;
      background: var(--soft-blue);
      color: var(--blue);
      font-size: 11px;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }

    .story-card .avatar {
      width: 82px;
      height: 82px;
      border: 4px solid var(--white);
      box-shadow: 0 14px 34px rgba(11, 31, 58, 0.12);
    }

    /* Programs */
    .programs {
      background: var(--white);
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
    }

    .section-header {
      text-align: center;
      max-width: 720px;
      margin: 0 auto 48px;
    }

    .section-header p {
      color: var(--muted);
      font-size: 17px;
      margin-top: 12px;
    }

    .program-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }

    .program-card {
      border: 1px solid var(--border);
      border-radius: 18px;
      overflow: hidden;
      background: var(--white);
      transition: all 0.2s ease;
    }

    .program-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 18px 40px rgba(11, 31, 58, 0.08);
      border-color: rgba(21, 101, 216, 0.28);
    }

    .program-image {
      height: 150px;
      background:
        linear-gradient(135deg, rgba(11, 31, 58, 0.08), rgba(21, 101, 216, 0.12)),
        #DDE3EA;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--muted);
      font-size: 14px;
      font-weight: 700;
    }

    .program-content {
      padding: 22px;
    }

    .program-content h3 {
      color: var(--navy);
      font-size: 19px;
      margin-bottom: 10px;
      letter-spacing: -0.02em;
    }

    .program-content p {
      color: var(--muted);
      font-size: 15px;
      margin-bottom: 18px;
    }

    .text-link {
      color: var(--blue);
      font-weight: 900;
      font-size: 15px;
    }

    .center-action {
      text-align: center;
      margin-top: 36px;
    }

    /* Journey */
    .journey {
      background: var(--white);
    }

    .journey-cards {
      display: grid;
      grid-template-columns: 0.8fr 1.1fr 0.8fr;
      gap: 28px;
      align-items: center;
      margin-top: 48px;
    }

    .journey-card {
      border: 1px solid var(--border);
      border-radius: 22px;
      padding: 28px;
      text-align: center;
      background: var(--white);
      min-height: 230px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .journey-card.featured {
      min-height: 310px;
      border-color: rgba(21, 101, 216, 0.55);
      box-shadow: 0 18px 45px rgba(21, 101, 216, 0.12);
      background: linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
    }

    .avatar {
      width: 74px;
      height: 74px;
      border-radius: 50%;
      background:
        linear-gradient(135deg, rgba(21, 101, 216, 0.12), rgba(244, 185, 66, 0.16)),
        #DDE3EA;
      margin: 0 auto 18px;
    }

    .journey-card h3 {
      color: var(--navy);
      margin-bottom: 10px;
      letter-spacing: -0.02em;
    }

    .journey-card p {
      color: var(--muted);
      font-size: 15px;
    }


    .journey-carousel {
      position: relative;
      margin-top: 52px;
    }

    .journey-stage {
      position: relative;
      height: 370px;
      overflow: hidden;
    }

    .journey-card {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 300px;
      min-height: 245px;
      border: 1px solid var(--border);
      border-radius: 22px;
      padding: 28px;
      text-align: center;
      background: var(--white);
      display: flex;
      flex-direction: column;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      z-index: 0;
      box-shadow: none;
      transition:
        transform 0.45s ease,
        opacity 0.45s ease,
        width 0.45s ease,
        min-height 0.45s ease,
        border-color 0.45s ease,
        box-shadow 0.45s ease;
    }

    .journey-card.is-prev,
    .journey-card.is-next {
      opacity: 1;
      pointer-events: auto;
      cursor: pointer;
      z-index: 2;
    }

    .journey-card.is-prev {
      transform: translate(calc(-50% - 370px), -50%) scale(0.92);
    }

    .journey-card.is-next {
      transform: translate(calc(-50% + 370px), -50%) scale(0.92);
    }

    .journey-card.is-active {
      width: 430px;
      min-height: 310px;
      opacity: 1;
      pointer-events: auto;
      z-index: 3;
      border-color: rgba(21, 101, 216, 0.75);
      box-shadow: 0 26px 70px rgba(21, 101, 216, 0.14);
      background: linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
      transform: translate(-50%, -50%) scale(1);
    }

    .journey-card.is-hidden-left {
      opacity: 0;
      transform: translate(calc(-50% - 720px), -50%) scale(0.86);
    }

    .journey-card.is-hidden-right {
      opacity: 0;
      transform: translate(calc(-50% + 720px), -50%) scale(0.86);
    }

    .journey-card:hover {
      border-color: rgba(21, 101, 216, 0.45);
    }

    .journey-card h3 {
      color: var(--navy);
      margin-bottom: 10px;
      letter-spacing: -0.02em;
      font-size: 20px;
    }

    .journey-card p {
      color: var(--muted);
      font-size: 15px;
      line-height: 1.65;
    }

    .journey-card.is-active h3 {
      font-size: 22px;
    }

    .journey-controls {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 14px;
      margin-top: 18px;
    }

    .journey-arrow {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      border: 1px solid var(--border);
      background: var(--white);
      color: var(--navy);
      font-size: 22px;
      font-weight: 900;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 12px 28px rgba(11, 31, 58, 0.06);
      transition: all 0.2s ease;
    }

    .journey-arrow:hover {
      border-color: var(--blue);
      color: var(--blue);
      transform: translateY(-2px);
    }

    .journey-dots {
      display: flex;
      align-items: center;
      gap: 9px;
      padding: 0 8px;
    }

    .journey-dot {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      border: none;
      background: #D1D5DB;
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .journey-dot.is-active {
      width: 28px;
      border-radius: 99px;
      background: var(--blue);
    }

    @media (max-width: 980px) {
      .journey-card.is-prev {
        transform: translate(calc(-50% - 300px), -50%) scale(0.9);
      }

      .journey-card.is-next {
        transform: translate(calc(-50% + 300px), -50%) scale(0.9);
      }

      .journey-card.is-active {
        width: 390px;
      }
    }

    @media (max-width: 720px) {
      .journey-stage {
        height: 330px;
      }

      .journey-card {
        width: 82vw;
        min-height: 250px;
      }

      .journey-card.is-active {
        width: 86vw;
        min-height: 280px;
      }

      .journey-card.is-prev,
      .journey-card.is-next {
        opacity: 0.2;
        pointer-events: none;
      }

      .journey-card.is-prev {
        transform: translate(calc(-50% - 88vw), -50%) scale(0.9);
      }

      .journey-card.is-next {
        transform: translate(calc(-50% + 88vw), -50%) scale(0.9);
      }
    }

    /* FAQ */
    .faq {
      background: var(--light);
    }

    .faq-list {
      max-width: 780px;
      margin: 0 auto;
      display: grid;
      gap: 12px;
    }

    details {
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 18px 20px;
    }

    summary {
      cursor: pointer;
      font-weight: 900;
      color: var(--navy);
      list-style: none;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 20px;
    }

    summary::-webkit-details-marker {
      display: none;
    }

    summary::after {
      content: "+";
      color: var(--blue);
      font-size: 20px;
      font-weight: 900;
    }

    details[open] summary::after {
      content: "−";
    }

    details p {
      color: var(--muted);
      margin-top: 12px;
      font-size: 15px;
    }

    /* Final CTA */
    .final-cta {
      background: var(--navy);
      color: var(--white);
      padding: 76px 0;
      text-align: center;
    }

    .final-cta h2 {
      color: var(--white);
    }

    .final-cta p {
      color: #D1D5DB;
      max-width: 640px;
      margin: 0 auto 28px;
      font-size: 17px;
    }

    /* Footer */
    footer {
      background: var(--footer);
      color: #D1D5DB;
      padding: 56px 0 28px;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1.4fr repeat(3, 1fr);
      gap: 40px;
      margin-bottom: 40px;
    }

    footer h4 {
      color: var(--white);
      margin-bottom: 16px;
    }

    footer ul {
      list-style: none;
      display: grid;
      gap: 10px;
      color: #9CA3AF;
      font-size: 14px;
    }

    .footer-brand {
      max-width: 320px;
    }

    .footer-brand p {
      margin-top: 14px;
      color: #9CA3AF;
      font-size: 14px;
    }

    .footer-bottom {
      border-top: 1px solid #374151;
      padding-top: 24px;
      display: flex;
      justify-content: space-between;
      gap: 20px;
      color: #9CA3AF;
      font-size: 13px;
    }

    /* Responsive */
    @media (max-width: 980px) {
      .nav-links {
        display: none;
      }

      .hero {
        min-height: auto;
        padding: 72px 0;
      }

      .hero-grid {
        grid-template-columns: 1fr;
      }

      .consultation-card {
        margin-left: 0;
        max-width: 100%;
      }

      h1 {
        font-size: 42px;
      }

      .section h2,
      .final-cta h2 {
        font-size: 34px;
      }

      .program-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .desk-grid {
        grid-template-columns: 1fr;
      }

      .desk-note {
        right: 18px;
      }

      .journey-cards {
        grid-template-columns: 1fr;
      }

      .footer-grid {
        grid-template-columns: 1fr 1fr;
      }
    }

    @media (max-width: 820px) {
      .mission-scroll {
        min-height: auto;
        padding: 72px 0;
      }

      .mission-sticky {
        position: relative;
        top: auto;
        min-height: auto;
        padding: 0;
      }

      .mission-grid {
        grid-template-columns: 1fr;
        gap: 36px;
      }

      .mission-copy {
        max-width: none;
      }

      .mission-video {
        min-height: 260px;
        max-height: none;
      }

      .mission-copy h2 {
        font-size: 34px;
      }

      .mission-flow {
        display: block;
      }

      .mission-progress {
        display: none;
      }

      .mission-steps {
        min-height: auto;
        display: grid;
        gap: 18px;
      }

      .mission-step {
        position: relative;
        opacity: 1;
        transform: none;
        pointer-events: auto;
        padding: 28px;
      }

      .mission-step h3 {
        font-size: 24px;
      }

      .mission-step p {
        font-size: 15px;
      }
    }

    @media (max-width: 620px) {
      .nav {
        height: auto;
        padding: 18px 0;
      }

      .nav-actions .btn-secondary {
        display: none;
      }

      .nav-actions .btn-primary {
        padding: 10px 14px;
        font-size: 13px;
      }

      .hero {
        padding: 48px 0;
      }

      h1 {
        font-size: 34px;
      }

      .hero-copy p {
        font-size: 17px;
        margin-bottom: 24px;
      }

      .hero-actions {
        flex-direction: column;
      }

      .hero-proof-line {
        gap: 8px;
        margin-top: -8px;
      }

      .hero-proof-pill {
        font-size: 13px;
        padding: 8px 11px;
      }

      .btn {
        width: 100%;
      }

      .section h2,
      .final-cta h2 {
        font-size: 30px;
      }

      .consultation-toggle {
        padding: 24px;
      }

      .consultation-toggle strong {
        font-size: 25px;
      }

      .inline-form {
        padding: 0 24px 24px;
      }

      .trust-ticker {
        padding: 14px 0;
      }

      .ticker-content {
        gap: 28px;
        padding-right: 28px;
      }

      .ticker-content span {
        font-size: 14px;
      }

      .trust-ticker::before,
      .trust-ticker::after {
        width: 60px;
      }

      .section {
        padding: 64px 0;
      }

      .program-grid,
      .desk-grid,
      .footer-grid {
        grid-template-columns: 1fr;
      }

      .desk-visual {
        min-height: 360px;
      }

      .desk-photo {
        height: 330px;
      }

      .desk-note {
        right: 12px;
        bottom: 16px;
      }

      .desk-flow {
        grid-template-columns: 1fr;
      }

      .footer-bottom {
        flex-direction: column;
      }
    }



    body.consultation-modal-open #consultationCard .form-success.is-visible {
      display: block !important;
      grid-column: 1 / -1 !important;
      position: relative !important;
      z-index: 3 !important;
    }

    body.consultation-modal-open #consultationCard.is-success-state {
      pointer-events: auto !important;
    }

    body.consultation-modal-open #consultationCard.is-success-state .consultation-panel {
      overflow-y: auto !important;
    }

    body.consultation-modal-open #consultationCard .success-panel {
      padding: 16px !important;
      margin-top: 2px !important;
    }

    body.consultation-modal-open #consultationCard .success-head {
      margin-bottom: 10px !important;
    }

    body.consultation-modal-open #consultationCard .success-pills {
      margin: 10px 0 12px !important;
    }

    body.consultation-modal-open #consultationCard .success-actions {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    @media (max-width: 620px) {
      body.consultation-modal-open #consultationCard .success-actions {
        grid-template-columns: 1fr !important;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .ticker-track {
        animation: none;
      }

      .hero-video {
        display: none;
      }

      .mission-scroll {
        min-height: auto;
        padding: 72px 0;
      }

      .mission-sticky {
        position: relative;
        top: auto;
        height: auto;
      }

      .mission-step {
        position: relative;
        opacity: 1;
        transform: none;
      }

      .mission-steps {
        display: grid;
        gap: 18px;
        min-height: auto;
      }
    }
  

    /* =========================================================
       BRIGHT WARM GLASS THEME — inspired by the uploaded reference
       Light, warm, transparent, premium. No dark hero.
    ========================================================= */

    body {
      color: var(--text);
      background:
        radial-gradient(circle at 8% 8%, rgba(255, 194, 41, 0.22), transparent 26%),
        radial-gradient(circle at 86% 0%, rgba(255, 230, 160, 0.30), transparent 24%),
        linear-gradient(180deg, #FFFDF7 0%, #FFF8E8 42%, #FFFFFF 100%);
    }

    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: -1;
      background:
        linear-gradient(120deg, rgba(255, 194, 41, 0.08), transparent 34%),
        radial-gradient(circle at 50% 100%, rgba(255, 194, 41, 0.13), transparent 35%);
    }

    .container {
      width: min(1160px, 92%);
    }

    header {
      border-bottom: 1px solid rgba(231, 167, 0, 0.22);
      background: rgba(255, 253, 247, 0.74);
      -webkit-backdrop-filter: blur(18px);
      backdrop-filter: blur(18px);
      box-shadow: 0 12px 40px rgba(171, 119, 0, 0.06);
    }

    .logo {
      color: #262016;
    }

    .logo span,
    .nav-links a:hover,
    .text-link,
    summary::after,
    .mission-copy .eyebrow,
    .desk-flow-item span,
    .journey-arrow:hover {
      color: var(--blue);
    }

    .nav-links {
      color: rgba(31, 41, 51, 0.66);
    }

    .btn {
      border-radius: 999px;
      position: relative;
      overflow: hidden;
    }

    .btn::before {
      content: "";
      position: absolute;
      inset: 1px auto auto 14px;
      width: 42%;
      height: 1px;
      background: linear-gradient(90deg, rgba(255, 255, 255, 0.8), transparent);
      opacity: 0.65;
      pointer-events: none;
    }

    .btn-primary {
      background: linear-gradient(135deg, #FFE38A 0%, #FFC229 48%, #F4A900 100%);
      color: #2A2108;
      border-color: rgba(231, 167, 0, 0.38);
      box-shadow:
        0 12px 28px rgba(255, 194, 41, 0.28),
        0 0 24px rgba(255, 194, 41, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
    }

    .btn-primary:hover {
      background: linear-gradient(135deg, #FFEAA8 0%, #FFD04A 48%, #F5B51B 100%);
      transform: translateY(-2px);
      box-shadow:
        0 16px 36px rgba(255, 194, 41, 0.34),
        0 0 30px rgba(255, 194, 41, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
    }

    .btn-secondary {
      background: rgba(255, 255, 255, 0.68);
      color: #3B3427;
      border-color: rgba(231, 167, 0, 0.34);
      -webkit-backdrop-filter: blur(16px);
      backdrop-filter: blur(16px);
      box-shadow: 0 10px 26px rgba(171, 119, 0, 0.08);
    }

    .btn-secondary:hover {
      background: rgba(255, 246, 220, 0.88);
      border-color: rgba(231, 167, 0, 0.54);
      color: #2A2108;
      transform: translateY(-2px);
    }

    /* Light Hero */
    .hero {
      min-height: calc(100vh - 72px);
      background:
        radial-gradient(circle at 10% 18%, rgba(255, 194, 41, 0.34), transparent 28%),
        radial-gradient(circle at 72% 12%, rgba(255, 238, 182, 0.58), transparent 26%),
        radial-gradient(circle at 88% 80%, rgba(255, 194, 41, 0.20), transparent 28%),
        linear-gradient(135deg, #FFFDF7 0%, #FFF6DC 48%, #FFFFFF 100%);
    }

    .hero::before {
      content: "";
      position: absolute;
      right: -10vw;
      bottom: 7%;
      width: min(760px, 76vw);
      height: 40%;
      border-right: 2px solid rgba(255, 194, 41, 0.82);
      border-bottom: 2px solid rgba(255, 194, 41, 0.82);
      border-radius: 0 0 110px 0;
      filter: drop-shadow(0 0 12px rgba(255, 194, 41, 0.45));
      z-index: 1;
      pointer-events: none;
    }

    .hero::after {
      content: "";
      position: absolute;
      left: -12%;
      bottom: -18%;
      width: 520px;
      height: 520px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255, 194, 41, 0.26), transparent 64%);
      filter: blur(6px);
      z-index: 0;
      pointer-events: none;
    }

    .hero-video {
      opacity: 0.14;
      filter: saturate(0.82) sepia(0.28) brightness(1.18);
      mix-blend-mode: multiply;
    }

    .hero-overlay {
      background:
        linear-gradient(90deg, rgba(255, 253, 247, 0.96) 0%, rgba(255, 248, 232, 0.84) 50%, rgba(255, 255, 255, 0.54) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.30), rgba(255, 246, 220, 0.56));
      z-index: 1;
    }

    .hero-content {
      z-index: 3;
    }

    .eyebrow,
    .hero .eyebrow {
      color: #C58B00;
    }

    h1,
    .section h2,
    .final-cta h2,
    .consultation-toggle strong,
    .form-row label,
    .eligibility-option strong,
    .eligibility-note strong,
    .status-option span,
    .consultation-option strong,
    .mission-copy h2,
    .mission-step h3,
    .desk-note strong,
    .desk-copy h2,
    .desk-flow-item strong,
    .program-content h3,
    .journey-card h3,
    summary,
    footer h4 {
      color: var(--text);
    }

    h1 {
      max-width: 700px;
      color: #211D16;
      text-shadow: 0 1px 0 rgba(255, 255, 255, 0.62);
    }

    .hero-copy p,
    .section-header p,
    .mission-copy > p,
    .mission-step p,
    .desk-copy > p,
    .program-content p,
    .journey-card p,
    details p,
    .desk-note p,
    .form-disclaimer,
    .consultation-toggle small,
    .eligibility-option small,
    .eligibility-note small,
    .consultation-option small,
    footer ul,
    .footer-brand p,
    .footer-bottom {
      color: var(--muted);
    }

    .hero .btn-secondary {
      background: rgba(255, 255, 255, 0.60);
      color: #2A2108;
      border-color: rgba(231, 167, 0, 0.36);
      -webkit-backdrop-filter: blur(18px);
      backdrop-filter: blur(18px);
    }

    .hero .btn-secondary:hover {
      background: rgba(255, 246, 220, 0.86);
    }

    /* Shared warm glass surfaces */
    .consultation-card,
    .mission-step,
    .program-card,
    .desk-flow-item,
    .journey-card,
    details,
    .desk-note,
    .consultation-option,
    .eligibility-note,
    .advisor-strip,
    .status-option,
    .eligibility-option {
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.46));
      border: 1px solid var(--glass-border);
      -webkit-backdrop-filter: blur(22px);
      backdrop-filter: blur(22px);
      box-shadow:
        0 22px 58px rgba(171, 119, 0, 0.10),
        0 0 24px rgba(255, 194, 41, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
    }

    .consultation-card {
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(255, 251, 240, 0.58));
      border-radius: 30px;
      border-color: rgba(255, 194, 41, 0.62);
      box-shadow:
        0 30px 80px rgba(171, 119, 0, 0.15),
        0 0 34px rgba(255, 194, 41, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.92);
    }

    .consultation-toggle {
      background: transparent;
    }

    .toggle-icon,
    .option-icon,
    .mission-number {
      background: linear-gradient(135deg, #FFE38A, #FFC229);
      color: #2A2108;
      box-shadow: 0 12px 26px rgba(255, 194, 41, 0.28);
    }

    .form-row input,
    .form-row select {
      border: 1px solid rgba(231, 167, 0, 0.25);
      background: rgba(255, 255, 255, 0.74);
      color: var(--text);
      border-radius: 15px;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    }

    .form-row input:focus,
    .form-row select:focus {
      border-color: rgba(231, 167, 0, 0.64);
      box-shadow:
        0 0 0 4px rgba(255, 194, 41, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
    }

    .status-option:hover,
    .eligibility-option:hover,
    .consultation-option:hover {
      border-color: rgba(255, 194, 41, 0.76);
      background: rgba(255, 248, 226, 0.72);
      transform: translateY(-1px);
    }

    .status-option:has(input:checked) {
      border-color: rgba(231, 167, 0, 0.76);
      background: rgba(255, 241, 200, 0.78);
      box-shadow:
        0 0 0 4px rgba(255, 194, 41, 0.13),
        0 16px 36px rgba(171, 119, 0, 0.12);
    }

    .status-option input,
    .eligibility-option input {
      accent-color: var(--gold);
    }

    .eligibility-message {
      background: rgba(255, 247, 237, 0.88);
      border-color: rgba(251, 146, 60, 0.34);
    }

    /* Ticker */
    .trust-ticker {
      background: rgba(255, 253, 247, 0.74);
      border-top: 1px solid rgba(231, 167, 0, 0.20);
      border-bottom: 1px solid rgba(231, 167, 0, 0.20);
      -webkit-backdrop-filter: blur(16px);
      backdrop-filter: blur(16px);
    }

    .trust-ticker::before {
      background: linear-gradient(to right, #FFFDF7, rgba(255, 255, 255, 0));
    }

    .trust-ticker::after {
      background: linear-gradient(to left, #FFFDF7, rgba(255, 255, 255, 0));
    }

    .ticker-content span {
      color: #2A2108;
    }

    .ticker-content span::before {
      color: var(--gold);
      text-shadow: 0 0 12px rgba(255, 194, 41, 0.54);
    }

    /* Mission / gold path */
    .mission-scroll {
      background:
        radial-gradient(circle at 10% 22%, rgba(255, 194, 41, 0.12), transparent 28%),
        radial-gradient(circle at 82% 70%, rgba(255, 230, 160, 0.24), transparent 30%),
        linear-gradient(180deg, #FFFFFF 0%, #FFF8E8 56%, #FFFFFF 100%);
      overflow: clip;
    }

    .mission-scroll::before {
      content: "";
      position: absolute;
      top: 8%;
      left: min(7vw, 80px);
      width: 2px;
      height: 76%;
      background: linear-gradient(180deg, transparent, rgba(255, 194, 41, 0.66), transparent);
      box-shadow: 0 0 18px rgba(255, 194, 41, 0.40);
      pointer-events: none;
    }

    .mission-video,
    .desk-photo,
    .program-image {
      background:
        radial-gradient(circle at 22% 18%, rgba(255, 255, 255, 0.95), transparent 26%),
        radial-gradient(circle at 76% 18%, rgba(255, 194, 41, 0.22), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 243, 207, 0.66)),
        #FFF8E8;
      border: 1px solid rgba(255, 194, 41, 0.42);
      color: rgba(42, 33, 8, 0.48);
      box-shadow:
        0 24px 60px rgba(171, 119, 0, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
      -webkit-backdrop-filter: blur(18px);
      backdrop-filter: blur(18px);
    }

    .mission-video::before,
    .desk-photo::after {
      border-color: rgba(255, 255, 255, 0.82);
    }

    .mission-video::after {
      background: rgba(255, 255, 255, 0.82);
      color: #C58B00;
      box-shadow:
        0 16px 38px rgba(171, 119, 0, 0.14),
        0 0 24px rgba(255, 194, 41, 0.18);
    }

    .mission-flow {
      position: relative;
    }

    .progress-line {
      background: rgba(231, 167, 0, 0.18);
    }

    .progress-fill {
      background: linear-gradient(180deg, #FFE38A, #FFC229, #F4A900);
      box-shadow: 0 0 18px rgba(255, 194, 41, 0.62);
    }

    .progress-dot {
      background: #F0DFAF;
      border-color: rgba(255, 255, 255, 0.92);
      box-shadow: 0 0 0 1px rgba(231, 167, 0, 0.20);
    }

    .progress-dot.is-active {
      background: var(--gold);
      box-shadow:
        0 0 0 7px rgba(255, 194, 41, 0.16),
        0 0 22px rgba(255, 194, 41, 0.70);
    }

    .mission-step.is-active {
      box-shadow:
        0 26px 72px rgba(171, 119, 0, 0.13),
        0 0 32px rgba(255, 194, 41, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.84);
    }

    /* Desk / Programs / Stories */
    .desk-section,
    .programs,
    .journey,
    .faq {
      background:
        radial-gradient(circle at 12% 16%, rgba(255, 194, 41, 0.10), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 248, 232, 0.72) 100%);
      border-color: rgba(231, 167, 0, 0.20);
    }

    .desk-photo {
      color: rgba(42, 33, 8, 0.38);
    }

    .note-avatar,
    .avatar,
    .advisor-avatars span {
      background:
        radial-gradient(circle at 35% 24%, rgba(255, 255, 255, 0.82), transparent 24%),
        linear-gradient(135deg, rgba(255, 194, 41, 0.36), rgba(255, 248, 226, 0.72)),
        #F5DE9B;
      border-color: rgba(255, 255, 255, 0.88);
      box-shadow: 0 10px 24px rgba(171, 119, 0, 0.13);
    }

    .program-card:hover,
    .journey-card:hover {
      transform: translateY(-5px);
      border-color: rgba(255, 194, 41, 0.74);
      box-shadow:
        0 24px 60px rgba(171, 119, 0, 0.13),
        0 0 28px rgba(255, 194, 41, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
    }

    .journey-card.is-active {
      border-color: rgba(255, 194, 41, 0.78);
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(255, 248, 226, 0.64));
      box-shadow:
        0 28px 74px rgba(171, 119, 0, 0.15),
        0 0 34px rgba(255, 194, 41, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.86);
    }

    .story-card .story-meta {
      background: rgba(255, 241, 200, 0.82);
      color: #A86F00;
      border: 1px solid rgba(231, 167, 0, 0.22);
    }

    .journey-arrow {
      background: rgba(255, 255, 255, 0.72);
      border-color: rgba(231, 167, 0, 0.28);
      color: #3B3427;
      -webkit-backdrop-filter: blur(16px);
      backdrop-filter: blur(16px);
      box-shadow: 0 12px 28px rgba(171, 119, 0, 0.09);
    }

    .journey-arrow:hover {
      border-color: rgba(231, 167, 0, 0.62);
      color: #A86F00;
    }

    .journey-dot {
      background: rgba(231, 167, 0, 0.22);
    }

    .journey-dot.is-active {
      background: linear-gradient(90deg, #FFE38A, #FFC229);
      box-shadow: 0 0 16px rgba(255, 194, 41, 0.38);
    }

    /* FAQ + final CTA + footer kept light */
    details {
      border-radius: 18px;
    }

    .final-cta {
      background:
        radial-gradient(circle at 20% 10%, rgba(255, 194, 41, 0.26), transparent 28%),
        radial-gradient(circle at 86% 78%, rgba(255, 230, 160, 0.30), transparent 24%),
        linear-gradient(135deg, #FFFDF7 0%, #FFF4D7 48%, #FFFFFF 100%);
      color: var(--text);
      border-top: 1px solid rgba(231, 167, 0, 0.20);
      border-bottom: 1px solid rgba(231, 167, 0, 0.20);
      position: relative;
      overflow: hidden;
    }

    .final-cta::before {
      content: "";
      position: absolute;
      left: 8%;
      right: 8%;
      bottom: 22px;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(255, 194, 41, 0.76), transparent);
      box-shadow: 0 0 18px rgba(255, 194, 41, 0.46);
    }

    .final-cta p {
      color: var(--muted);
    }

    footer {
      background: #FFFDF7;
      color: var(--muted);
      border-top: 1px solid rgba(231, 167, 0, 0.22);
    }

    footer .logo,
    footer .logo[style] {
      color: #262016 !important;
    }

    footer .logo span {
      color: var(--blue);
    }

    footer ul {
      color: var(--muted);
    }

    .footer-bottom {
      border-top: 1px solid rgba(231, 167, 0, 0.22);
    }

    @media (max-width: 980px) {
      .hero::before {
        right: -28vw;
        width: 88vw;
        height: 34%;
        opacity: 0.75;
      }
    }

    @media (max-width: 620px) {
      .hero {
        background:
          radial-gradient(circle at 12% 12%, rgba(255, 194, 41, 0.30), transparent 32%),
          linear-gradient(180deg, #FFFDF7 0%, #FFF3CF 52%, #FFFFFF 100%);
      }

      .hero::before {
        right: -48vw;
        bottom: 5%;
        width: 118vw;
        height: 24%;
        border-radius: 0 0 76px 0;
      }

      .consultation-card,
      .mission-step,
      .program-card,
      .journey-card,
      details {
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
      }
    }


    /* =========================================================
       PROFESSIONAL LIGHT GLASS REFINEMENT
       Cleaner, less yellow, fixed story carousel alignment.
    ========================================================= */

    body {
      background:
        radial-gradient(circle at 8% 9%, rgba(247, 184, 1, 0.11), transparent 25%),
        radial-gradient(circle at 88% 4%, rgba(255, 215, 106, 0.13), transparent 24%),
        linear-gradient(180deg, #FFFEFA 0%, #FAF7EF 46%, #FFFFFF 100%);
    }

    body::before {
      background:
        linear-gradient(120deg, rgba(247, 184, 1, 0.035), transparent 34%),
        radial-gradient(circle at 50% 100%, rgba(247, 184, 1, 0.055), transparent 35%);
    }

    header {
      background: rgba(255, 255, 255, 0.80);
      border-bottom: 1px solid rgba(17, 24, 39, 0.08);
      box-shadow: 0 10px 34px rgba(17, 24, 39, 0.045);
    }

    .btn-primary {
      background: linear-gradient(135deg, #FFD867 0%, #F7B801 56%, #EFA300 100%);
      border-color: rgba(184, 135, 0, 0.30);
      box-shadow:
        0 12px 24px rgba(247, 184, 1, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.64);
    }

    .btn-secondary {
      background: rgba(255, 255, 255, 0.74);
      border-color: rgba(17, 24, 39, 0.12);
      color: #1F2937;
      box-shadow: 0 10px 24px rgba(17, 24, 39, 0.055);
    }

    .hero {
      background:
        radial-gradient(circle at 11% 18%, rgba(247, 184, 1, 0.15), transparent 28%),
        radial-gradient(circle at 74% 14%, rgba(255, 215, 106, 0.14), transparent 25%),
        linear-gradient(135deg, #FFFFFF 0%, #FCF8EE 50%, #FFFFFF 100%);
    }

    .hero::before {
      border-right-color: rgba(247, 184, 1, 0.46);
      border-bottom-color: rgba(247, 184, 1, 0.46);
      filter: drop-shadow(0 0 8px rgba(247, 184, 1, 0.22));
      opacity: 0.68;
    }

    .hero::after {
      background: radial-gradient(circle, rgba(247, 184, 1, 0.10), transparent 64%);
    }

    .hero-overlay {
      background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.94) 0%, rgba(252, 248, 238, 0.80) 52%, rgba(255, 255, 255, 0.58) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(250, 247, 239, 0.30));
    }

    .eyebrow,
    .hero .eyebrow {
      color: #B88700;
      letter-spacing: 0.15em;
    }

    .consultation-card,
    .mission-step,
    .program-card,
    .desk-flow-item,
    .journey-card,
    details,
    .desk-note,
    .consultation-option,
    .eligibility-note,
    .advisor-strip,
    .status-option,
    .eligibility-option {
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.58));
      border: 1px solid rgba(184, 135, 0, 0.20);
      box-shadow:
        0 18px 48px rgba(17, 24, 39, 0.055),
        0 0 18px rgba(247, 184, 1, 0.055),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
    }

    .consultation-card {
      border-color: rgba(184, 135, 0, 0.28);
      box-shadow:
        0 28px 70px rgba(17, 24, 39, 0.075),
        0 0 22px rgba(247, 184, 1, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.92);
    }

    .desk-section,
    .programs,
    .journey,
    .faq {
      background:
        radial-gradient(circle at 12% 16%, rgba(247, 184, 1, 0.055), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(250, 247, 239, 0.58) 100%);
      border-color: rgba(17, 24, 39, 0.08);
    }

    .mission-scroll {
      background:
        radial-gradient(circle at 10% 22%, rgba(247, 184, 1, 0.065), transparent 28%),
        radial-gradient(circle at 82% 70%, rgba(255, 215, 106, 0.10), transparent 30%),
        linear-gradient(180deg, #FFFFFF 0%, #FAF7EF 56%, #FFFFFF 100%);
    }

    .mission-video,
    .desk-photo,
    .program-image {
      background:
        radial-gradient(circle at 24% 18%, rgba(255, 255, 255, 0.95), transparent 26%),
        radial-gradient(circle at 76% 18%, rgba(247, 184, 1, 0.10), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.84), rgba(250, 247, 239, 0.72)),
        #FAF7EF;
      border-color: rgba(184, 135, 0, 0.18);
      box-shadow:
        0 22px 52px rgba(17, 24, 39, 0.055),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
    }

    .note-avatar,
    .avatar,
    .advisor-avatars span {
      background:
        radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.86), transparent 24%),
        linear-gradient(135deg, rgba(247, 184, 1, 0.24), rgba(255, 255, 255, 0.72)),
        #F4EFE3;
      box-shadow: 0 10px 22px rgba(17, 24, 39, 0.07);
    }

    .program-card:hover {
      transform: translateY(-5px);
      border-color: rgba(184, 135, 0, 0.34);
      box-shadow:
        0 24px 58px rgba(17, 24, 39, 0.075),
        0 0 18px rgba(247, 184, 1, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
    }

    /* Fixed, cleaner student stories carousel */
    .stories-section {
      position: relative;
      overflow: hidden;
      background:
        radial-gradient(circle at 9% 18%, rgba(247, 184, 1, 0.075), transparent 26%),
        radial-gradient(circle at 92% 74%, rgba(255, 215, 106, 0.085), transparent 30%),
        linear-gradient(180deg, #FFFFFF 0%, #FAF7EF 100%);
    }

    .stories-section .section-header {
      margin-bottom: 30px;
    }

    .journey-carousel {
      max-width: 1120px;
      margin: 28px auto 0;
      overflow: visible;
    }

    .journey-stage {
      position: relative;
      height: 350px;
      overflow: visible;
      isolation: isolate;
    }

    .journey-card {
      top: 50% !important;
      left: 50% !important;
      width: 292px;
      min-height: 238px;
      padding: 28px 26px;
      border-radius: 24px;
      opacity: 0;
      pointer-events: none;
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.70));
      border: 1px solid rgba(17, 24, 39, 0.09);
      box-shadow:
        0 20px 54px rgba(17, 24, 39, 0.08),
        0 0 0 1px rgba(255, 255, 255, 0.52) inset;
      transition:
        transform 0.55s cubic-bezier(.22,.8,.2,1),
        opacity 0.45s ease,
        width 0.55s cubic-bezier(.22,.8,.2,1),
        min-height 0.55s cubic-bezier(.22,.8,.2,1),
        border-color 0.35s ease,
        box-shadow 0.35s ease;
      will-change: transform, opacity;
    }

    .journey-card::before {
      content: "";
      position: absolute;
      top: 0;
      left: 24px;
      right: 24px;
      height: 2px;
      border-radius: 99px;
      background: linear-gradient(90deg, transparent, rgba(247, 184, 1, 0.72), transparent);
      opacity: 0.75;
    }

    .journey-card.is-active {
      width: 388px;
      min-height: 292px;
      opacity: 1;
      pointer-events: auto;
      z-index: 5;
      transform: translate(-50%, -50%) scale(1) !important;
      border-color: rgba(184, 135, 0, 0.26);
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 252, 244, 0.82));
      box-shadow:
        0 28px 74px rgba(17, 24, 39, 0.10),
        0 0 24px rgba(247, 184, 1, 0.10),
        0 0 0 1px rgba(255, 255, 255, 0.66) inset;
    }

    .journey-card.is-prev {
      opacity: 0.78;
      pointer-events: auto;
      cursor: pointer;
      z-index: 3;
      transform: translate(calc(-50% - clamp(292px, 32vw, 352px)), -50%) scale(0.90) !important;
    }

    .journey-card.is-next {
      opacity: 0.78;
      pointer-events: auto;
      cursor: pointer;
      z-index: 3;
      transform: translate(calc(-50% + clamp(292px, 32vw, 352px)), -50%) scale(0.90) !important;
    }

    .journey-card.is-hidden-left {
      opacity: 0;
      transform: translate(calc(-50% - 740px), -50%) scale(0.86) !important;
    }

    .journey-card.is-hidden-right {
      opacity: 0;
      transform: translate(calc(-50% + 740px), -50%) scale(0.86) !important;
    }

    .journey-card.is-active:hover {
      transform: translate(-50%, -50%) scale(1.015) !important;
    }

    .journey-card.is-prev:hover {
      opacity: 0.92;
      transform: translate(calc(-50% - clamp(292px, 32vw, 352px)), -50%) scale(0.92) !important;
    }

    .journey-card.is-next:hover {
      opacity: 0.92;
      transform: translate(calc(-50% + clamp(292px, 32vw, 352px)), -50%) scale(0.92) !important;
    }

    .story-card .avatar {
      width: 68px;
      height: 68px;
      margin-bottom: 16px;
      border: 3px solid rgba(255, 255, 255, 0.92);
      box-shadow: 0 12px 26px rgba(17, 24, 39, 0.075);
    }

    .story-card .story-meta {
      margin-bottom: 12px;
      background: rgba(255, 248, 230, 0.78);
      color: #9B7200;
      border: 1px solid rgba(184, 135, 0, 0.18);
      box-shadow: none;
    }

    .journey-card h3 {
      font-size: 19px;
      letter-spacing: -0.025em;
    }

    .journey-card.is-active h3 {
      font-size: 22px;
    }

    .journey-card p {
      max-width: 280px;
      margin: 0 auto;
      line-height: 1.62;
    }

    .journey-controls {
      margin-top: 8px;
    }

    .journey-arrow {
      width: 44px;
      height: 44px;
      border-color: rgba(17, 24, 39, 0.10);
      background: rgba(255, 255, 255, 0.82);
      color: #17202B;
    }

    .journey-dot {
      background: rgba(17, 24, 39, 0.16);
    }

    .journey-dot.is-active {
      background: linear-gradient(90deg, #F7B801, #EFA300);
      box-shadow: 0 0 12px rgba(247, 184, 1, 0.22);
    }

    .final-cta {
      background:
        radial-gradient(circle at 20% 10%, rgba(247, 184, 1, 0.10), transparent 28%),
        radial-gradient(circle at 86% 78%, rgba(255, 215, 106, 0.12), transparent 24%),
        linear-gradient(135deg, #FFFFFF 0%, #FAF7EF 48%, #FFFFFF 100%);
    }

    footer {
      background: #FFFFFF;
    }

    @media (max-width: 980px) {
      .journey-stage {
        height: 340px;
      }

      .journey-card {
        width: 270px;
      }

      .journey-card.is-active {
        width: 360px;
      }

      .journey-card.is-prev {
        transform: translate(calc(-50% - 285px), -50%) scale(0.88) !important;
      }

      .journey-card.is-next {
        transform: translate(calc(-50% + 285px), -50%) scale(0.88) !important;
      }
    }

    @media (max-width: 720px) {
      .journey-carousel {
        margin-top: 20px;
      }

      .journey-stage {
        height: 325px;
        overflow: hidden;
      }

      .journey-card,
      .journey-card.is-active {
        width: min(88vw, 360px);
        min-height: 270px;
      }

      .journey-card.is-active {
        transform: translate(-50%, -50%) scale(1) !important;
      }

      .journey-card.is-prev {
        opacity: 0;
        pointer-events: none;
        transform: translate(calc(-50% - 100vw), -50%) scale(0.90) !important;
      }

      .journey-card.is-next {
        opacity: 0;
        pointer-events: none;
        transform: translate(calc(-50% + 100vw), -50%) scale(0.90) !important;
      }
    }



    /* =========================================================
       LIGHT GLASS + NAVY ACCENT REFINEMENT
       Keeps the page bright, but adds a controlled EduPath navy layer
       for hierarchy, trust, and a more professional finish.
    ========================================================= */

    body {
      background:
        radial-gradient(circle at 8% 9%, rgba(247, 184, 1, 0.095), transparent 25%),
        radial-gradient(circle at 90% 7%, rgba(10, 37, 64, 0.07), transparent 24%),
        radial-gradient(circle at 82% 88%, rgba(247, 184, 1, 0.045), transparent 28%),
        linear-gradient(180deg, #FFFEFA 0%, #F8F6EF 46%, #FFFFFF 100%);
    }

    body::before {
      background:
        linear-gradient(120deg, rgba(247, 184, 1, 0.028), transparent 34%),
        radial-gradient(circle at 100% 0%, rgba(10, 37, 64, 0.045), transparent 35%),
        radial-gradient(circle at 50% 100%, rgba(247, 184, 1, 0.045), transparent 35%);
    }

    header {
      background: rgba(255, 255, 255, 0.84);
      border-bottom: 1px solid rgba(10, 37, 64, 0.10);
      box-shadow: 0 12px 34px rgba(10, 37, 64, 0.055);
    }

    header::before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      height: 2px;
      background: linear-gradient(90deg, var(--navy), rgba(247, 184, 1, 0.85), transparent 72%);
      opacity: 0.86;
    }

    .logo,
    footer .logo,
    footer .logo[style] {
      color: var(--navy) !important;
    }

    .logo span,
    footer .logo span {
      color: var(--gold);
    }

    .nav-links a {
      position: relative;
      color: rgba(10, 37, 64, 0.62);
      font-weight: 700;
    }

    .nav-links a::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: -8px;
      height: 2px;
      border-radius: 99px;
      background: linear-gradient(90deg, var(--navy), var(--gold));
      opacity: 0;
      transform: scaleX(0.6);
      transition: opacity 0.2s ease, transform 0.2s ease;
    }

    .nav-links a:hover {
      color: var(--navy);
    }

    .nav-links a:hover::after {
      opacity: 1;
      transform: scaleX(1);
    }

    h1,
    .section h2,
    .final-cta h2,
    .mission-copy h2,
    .desk-copy h2,
    .section-header h2,
    .consultation-toggle strong,
    .program-content h3,
    .journey-card h3,
    summary,
    footer h4 {
      color: var(--navy);
    }

    .hero-copy p,
    .section-header p,
    .mission-copy > p,
    .mission-step p,
    .desk-copy > p,
    .program-content p,
    .journey-card p,
    details p,
    .footer-brand p,
    .footer-bottom {
      color: var(--muted);
    }

    .eyebrow,
    .hero .eyebrow,
    .mission-copy .eyebrow,
    .desk-flow-item span,
    .story-card .story-meta {
      color: #A97800;
    }

    .btn-primary {
      color: var(--navy);
      border-color: rgba(10, 37, 64, 0.13);
      box-shadow:
        0 12px 24px rgba(247, 184, 1, 0.20),
        0 8px 22px rgba(10, 37, 64, 0.055),
        inset 0 1px 0 rgba(255, 255, 255, 0.66);
    }

    .btn-secondary,
    .hero .btn-secondary {
      color: var(--navy);
      border-color: rgba(10, 37, 64, 0.18);
      background: rgba(255, 255, 255, 0.78);
      box-shadow: 0 10px 24px rgba(10, 37, 64, 0.055);
    }

    .btn-secondary:hover,
    .hero .btn-secondary:hover {
      color: var(--white);
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-2) 100%);
      border-color: rgba(10, 37, 64, 0.34);
      box-shadow: 0 14px 30px rgba(10, 37, 64, 0.16);
    }

    .hero {
      background:
        radial-gradient(circle at 11% 18%, rgba(247, 184, 1, 0.13), transparent 28%),
        radial-gradient(circle at 78% 15%, rgba(10, 37, 64, 0.075), transparent 25%),
        radial-gradient(circle at 88% 86%, rgba(247, 184, 1, 0.052), transparent 29%),
        linear-gradient(135deg, #FFFFFF 0%, #F8F6EF 50%, #FFFFFF 100%);
    }

    .hero::before {
      border-right-color: rgba(10, 37, 64, 0.28);
      border-bottom-color: rgba(247, 184, 1, 0.52);
      filter:
        drop-shadow(0 0 7px rgba(247, 184, 1, 0.20))
        drop-shadow(0 0 10px rgba(10, 37, 64, 0.08));
      opacity: 0.82;
    }

    .hero-overlay {
      background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 246, 239, 0.82) 52%, rgba(255, 255, 255, 0.60) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(10, 37, 64, 0.028));
    }

    .consultation-card,
    .mission-step,
    .program-card,
    .desk-flow-item,
    .journey-card,
    details,
    .desk-note,
    .consultation-option,
    .eligibility-note,
    .advisor-strip,
    .status-option,
    .eligibility-option {
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(255, 255, 255, 0.62));
      border-color: rgba(10, 37, 64, 0.105);
      box-shadow:
        0 18px 48px rgba(10, 37, 64, 0.060),
        0 0 16px rgba(247, 184, 1, 0.045),
        inset 0 1px 0 rgba(255, 255, 255, 0.84);
    }

    .consultation-card {
      border-color: rgba(10, 37, 64, 0.14);
      box-shadow:
        0 28px 74px rgba(10, 37, 64, 0.085),
        0 0 18px rgba(247, 184, 1, 0.065),
        inset 0 1px 0 rgba(255, 255, 255, 0.92);
    }

    .consultation-card::before,
    .program-card::before,
    .mission-step::before,
    details::before {
      background: linear-gradient(90deg, rgba(10, 37, 64, 0.38), rgba(247, 184, 1, 0.58), transparent);
    }

    .toggle-icon,
    .option-icon,
    .mission-number {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-2) 100%);
      color: var(--gold-soft);
      box-shadow:
        0 12px 26px rgba(10, 37, 64, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
    }

    .mission-number {
      border: 1px solid rgba(247, 184, 1, 0.32);
    }

    .form-row input,
    .form-row select {
      border-color: rgba(10, 37, 64, 0.13);
    }

    .form-row input:focus,
    .form-row select:focus {
      border-color: rgba(10, 37, 64, 0.36);
      box-shadow:
        0 0 0 4px rgba(10, 37, 64, 0.065),
        0 0 0 1px rgba(247, 184, 1, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
    }

    .status-option:hover,
    .eligibility-option:hover,
    .consultation-option:hover,
    .program-card:hover,
    details:hover {
      border-color: rgba(10, 37, 64, 0.18);
    }

    .status-option:has(input:checked) {
      border-color: rgba(10, 37, 64, 0.24);
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(246, 249, 252, 0.78));
      box-shadow:
        0 0 0 4px rgba(10, 37, 64, 0.045),
        0 16px 36px rgba(10, 37, 64, 0.075);
    }

    .status-option input,
    .eligibility-option input {
      accent-color: var(--navy);
    }

    .trust-ticker {
      background: rgba(255, 255, 255, 0.78);
      border-top: 1px solid rgba(10, 37, 64, 0.10);
      border-bottom: 1px solid rgba(10, 37, 64, 0.10);
      box-shadow: 0 10px 34px rgba(10, 37, 64, 0.035);
    }

    .ticker-content span {
      color: var(--navy);
    }

    .ticker-content span::before {
      color: var(--gold);
    }

    .mission-scroll,
    .desk-section,
    .programs,
    .stories-section,
    .journey,
    .faq {
      background:
        radial-gradient(circle at 12% 16%, rgba(247, 184, 1, 0.045), transparent 26%),
        radial-gradient(circle at 88% 18%, rgba(10, 37, 64, 0.038), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 246, 239, 0.54) 100%);
      border-color: rgba(10, 37, 64, 0.08);
    }

    .mission-video,
    .desk-photo,
    .program-image {
      background:
        radial-gradient(circle at 24% 18%, rgba(255, 255, 255, 0.96), transparent 26%),
        radial-gradient(circle at 78% 18%, rgba(10, 37, 64, 0.06), transparent 28%),
        radial-gradient(circle at 22% 88%, rgba(247, 184, 1, 0.08), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(246, 249, 252, 0.74)),
        #F7F9FC;
      border-color: rgba(10, 37, 64, 0.12);
    }

    .progress-fill {
      background: linear-gradient(180deg, var(--navy), var(--gold));
      box-shadow: 0 0 16px rgba(10, 37, 64, 0.18), 0 0 14px rgba(247, 184, 1, 0.22);
    }

    .progress-dot.is-active {
      background: var(--navy);
      box-shadow:
        0 0 0 7px rgba(10, 37, 64, 0.09),
        0 0 16px rgba(247, 184, 1, 0.18);
    }

    .story-card .avatar,
    .note-avatar,
    .avatar,
    .advisor-avatars span {
      background:
        radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.88), transparent 24%),
        linear-gradient(135deg, rgba(10, 37, 64, 0.16), rgba(247, 184, 1, 0.14), rgba(255, 255, 255, 0.74)),
        #F4F7FA;
    }

    .story-card .story-meta {
      background: rgba(246, 249, 252, 0.86);
      border-color: rgba(10, 37, 64, 0.12);
      color: var(--navy);
    }

    .journey-card.is-active {
      border-color: rgba(10, 37, 64, 0.18);
      box-shadow:
        0 28px 74px rgba(10, 37, 64, 0.10),
        0 0 18px rgba(247, 184, 1, 0.075),
        0 0 0 1px rgba(255, 255, 255, 0.66) inset;
    }

    .journey-arrow:hover {
      color: var(--white);
      background: var(--navy);
      border-color: var(--navy);
    }

    .journey-dot.is-active {
      background: linear-gradient(90deg, var(--navy), var(--navy-3));
      box-shadow: 0 0 12px rgba(10, 37, 64, 0.16);
    }

    .final-cta {
      background:
        radial-gradient(circle at 20% 10%, rgba(247, 184, 1, 0.075), transparent 28%),
        radial-gradient(circle at 86% 78%, rgba(10, 37, 64, 0.060), transparent 24%),
        linear-gradient(135deg, #FFFFFF 0%, #F7F9FC 48%, #FFFCF2 100%);
      border-color: rgba(10, 37, 64, 0.09);
    }

    .final-cta::before {
      background: linear-gradient(90deg, transparent, rgba(10, 37, 64, 0.32), rgba(247, 184, 1, 0.42), transparent);
      box-shadow: 0 0 14px rgba(10, 37, 64, 0.10);
    }

    footer {
      background:
        linear-gradient(180deg, #FFFFFF 0%, #F7F9FC 100%);
      border-top: 1px solid rgba(10, 37, 64, 0.11);
    }

    .footer-bottom {
      border-top: 1px solid rgba(10, 37, 64, 0.10);
    }



    /* =========================================================
       Clean Light Professional Theme — Navy + Gold, no dirty mix
       ========================================================= */
    body {
      color: var(--text);
      background:
        radial-gradient(circle at 9% 11%, rgba(243, 180, 33, 0.10), transparent 26%),
        linear-gradient(180deg, #FFFDF8 0%, #FFFFFF 34%, #F7F8FB 100%);
    }

    header {
      background: rgba(255, 255, 255, 0.88);
      border-bottom: 1px solid rgba(16, 37, 66, 0.10);
      box-shadow: 0 10px 34px rgba(16, 37, 66, 0.04);
    }

    .logo { color: var(--navy); }
    .logo span { color: var(--gold); }

    .nav-links { color: #6A7280; }
    .nav-links a:hover { color: var(--navy); }

    .btn {
      border-radius: 999px;
      letter-spacing: -0.01em;
    }

    .btn-primary {
      color: #1B2430;
      background: linear-gradient(180deg, #FFD767 0%, #F3B421 100%);
      border-color: rgba(201, 139, 0, 0.20);
      box-shadow: 0 12px 28px rgba(243, 180, 33, 0.22);
    }

    .btn-primary:hover {
      background: linear-gradient(180deg, #FFDC78 0%, #EEAE15 100%);
      transform: translateY(-1px);
      box-shadow: 0 16px 34px rgba(243, 180, 33, 0.26);
    }

    .btn-secondary {
      background: rgba(255, 255, 255, 0.78);
      color: var(--navy);
      border-color: rgba(16, 37, 66, 0.16);
      box-shadow: 0 10px 24px rgba(16, 37, 66, 0.04);
    }

    .btn-secondary:hover {
      background: #FFFFFF;
      border-color: rgba(16, 37, 66, 0.28);
      color: var(--navy);
    }

    .hero {
      min-height: calc(100vh - 72px);
      background:
        radial-gradient(circle at 10% 23%, rgba(243, 180, 33, 0.16), transparent 24%),
        radial-gradient(circle at 88% 15%, rgba(16, 37, 66, 0.045), transparent 26%),
        linear-gradient(180deg, #FFFDF7 0%, #FFFFFF 62%, #F8FAFC 100%);
      isolation: isolate;
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      z-index: 1;
      opacity: 0.72;
      background:
        linear-gradient(90deg, transparent 0 11%, rgba(243, 180, 33, 0.28) 11.1% 11.22%, transparent 11.32% 100%),
        linear-gradient(180deg, transparent 0 71%, rgba(243, 180, 33, 0.25) 71.1% 71.22%, transparent 71.32% 100%);
      mask-image: linear-gradient(90deg, rgba(0,0,0,0.62), transparent 70%);
    }

    .hero-video {
      opacity: 0.06;
      filter: saturate(0.7) brightness(1.08);
      mix-blend-mode: multiply;
    }

    .hero-overlay {
      background: linear-gradient(90deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.86) 54%, rgba(255, 255, 255, 0.72) 100%);
    }

    .hero-content { z-index: 2; }

    .eyebrow,
    .hero .eyebrow,
    .mission-copy .eyebrow,
    .desk-copy .eyebrow,
    .section-header .eyebrow {
      color: #C48B07;
      letter-spacing: 0.16em;
    }

    h1 {
      color: var(--navy);
      text-wrap: balance;
    }

    .hero-copy p {
      color: var(--muted);
    }

    .hero .btn-secondary {
      background: rgba(255, 255, 255, 0.72);
      color: var(--navy);
      border-color: rgba(16, 37, 66, 0.16);
      backdrop-filter: blur(18px);
    }

    .hero .btn-secondary:hover {
      background: #FFFFFF;
      border-color: rgba(16, 37, 66, 0.26);
    }

    .consultation-card,
    .mission-step,
    .program-card,
    .desk-flow-item,
    .journey-card,
    details,
    .desk-note {
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.76));
      border: 1px solid rgba(16, 37, 66, 0.12);
      box-shadow: var(--soft-shadow);
      backdrop-filter: blur(18px);
    }

    .consultation-card {
      border-color: rgba(243, 180, 33, 0.22);
      box-shadow: 0 26px 70px rgba(16, 37, 66, 0.12);
    }

    .consultation-toggle { background: rgba(255, 255, 255, 0.74); }
    .consultation-toggle strong,
    .form-row label,
    .status-option span,
    .consultation-option strong,
    .eligibility-note strong,
    .advisor-strip strong,
    summary,
    .program-content h3,
    .journey-card h3,
    .desk-copy h2,
    .section h2,
    .final-cta h2,
    .mission-copy h2,
    .mission-step h3 {
      color: var(--navy);
    }

    .toggle-icon {
      background: #F5F7FA;
      color: var(--navy);
      border: 1px solid rgba(16, 37, 66, 0.10);
    }

    .form-row input,
    .form-row select {
      background: rgba(255, 255, 255, 0.88);
      border-color: rgba(16, 37, 66, 0.12);
    }

    .form-row input:focus,
    .form-row select:focus {
      border-color: rgba(243, 180, 33, 0.62);
      box-shadow: 0 0 0 4px rgba(243, 180, 33, 0.12);
    }

    .status-option,
    .eligibility-option,
    .consultation-option,
    .eligibility-note,
    .advisor-strip {
      background: rgba(255, 255, 255, 0.68);
      border-color: rgba(16, 37, 66, 0.10);
    }

    .status-option:hover,
    .eligibility-option:hover,
    .consultation-option:hover {
      background: #FFFFFF;
      border-color: rgba(243, 180, 33, 0.35);
      transform: translateY(-1px);
    }

    .status-option:has(input:checked) {
      background: #FFF9E8;
      border-color: rgba(243, 180, 33, 0.52);
      box-shadow: 0 0 0 4px rgba(243, 180, 33, 0.10);
    }

    .status-option input,
    .eligibility-option input { accent-color: var(--gold); }

    .option-icon {
      background: #FFFFFF;
      color: var(--navy);
      box-shadow: 0 8px 18px rgba(16, 37, 66, 0.06);
    }

    .trust-ticker {
      background: #FFFFFF;
      border-color: rgba(16, 37, 66, 0.10);
    }

    .trust-ticker::before { background: linear-gradient(to right, #FFFFFF, rgba(255, 255, 255, 0)); }
    .trust-ticker::after { background: linear-gradient(to left, #FFFFFF, rgba(255, 255, 255, 0)); }
    .ticker-content span { color: var(--navy); }
    .ticker-content span::before { color: var(--gold); }

    .mission-scroll,
    .desk-section,
    .faq,
    .journey,
    .programs {
      background:
        radial-gradient(circle at 12% 18%, rgba(243, 180, 33, 0.055), transparent 24%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
      border-color: rgba(16, 37, 66, 0.08);
    }

    .mission-video,
    .desk-photo,
    .program-image,
    .avatar,
    .note-avatar,
    .advisor-avatars span {
      background:
        linear-gradient(180deg, #FFFFFF 0%, #F6F8FB 100%);
      border: 1px solid rgba(16, 37, 66, 0.10);
      color: rgba(16, 37, 66, 0.46);
    }

    .mission-video::after {
      background: #FFFFFF;
      color: var(--navy);
      border: 1px solid rgba(16, 37, 66, 0.10);
    }

    .progress-line { background: rgba(16, 37, 66, 0.12); }
    .progress-fill {
      background: var(--gold);
      box-shadow: 0 0 14px rgba(243, 180, 33, 0.32);
    }
    .progress-dot {
      background: #D8DEE7;
      border-color: #FFFFFF;
      box-shadow: 0 0 0 1px rgba(16, 37, 66, 0.12);
    }
    .progress-dot.is-active {
      background: var(--gold);
      box-shadow: 0 0 0 6px rgba(243, 180, 33, 0.14);
    }
    .mission-number {
      background: var(--navy);
      color: #FFFFFF;
      box-shadow: 0 14px 30px rgba(16, 37, 66, 0.18);
    }

    .desk-flow-item span,
    .story-card .story-meta {
      color: #B88006;
      background: #FFF7DF;
      border: 1px solid rgba(243, 180, 33, 0.20);
    }

    .program-card:hover,
    .journey-card:hover,
    details:hover {
      border-color: rgba(243, 180, 33, 0.34);
      box-shadow: 0 22px 54px rgba(16, 37, 66, 0.09);
    }

    .text-link,
    summary::after { color: var(--navy); }

    .journey-carousel {
      position: relative;
      margin-top: 52px;
      padding: 10px 0 46px;
      overflow: hidden;
    }

    .journey-stage {
      position: relative;
      height: 400px;
      max-width: 1080px;
      margin: 0 auto;
      overflow: visible;
    }

    .journey-card {
      top: 50%;
      left: 50%;
      width: 300px;
      min-height: 260px;
      border-radius: 26px;
      padding: 28px;
      opacity: 0;
      pointer-events: none;
      will-change: transform, opacity;
      transition:
        transform 0.46s cubic-bezier(.22,.61,.36,1),
        opacity 0.46s ease,
        width 0.46s ease,
        min-height 0.46s ease,
        border-color 0.26s ease,
        box-shadow 0.26s ease;
    }

    .journey-card.is-active {
      width: 390px;
      min-height: 318px;
      opacity: 1;
      pointer-events: auto;
      z-index: 4;
      transform: translate(-50%, -50%) scale(1);
      border-color: rgba(16, 37, 66, 0.18);
      box-shadow: 0 28px 70px rgba(16, 37, 66, 0.12);
      background: #FFFFFF;
    }

    .journey-card.is-prev,
    .journey-card.is-next {
      opacity: 1;
      pointer-events: auto;
      cursor: pointer;
      z-index: 3;
    }

    .journey-card.is-prev { transform: translate(calc(-50% - 360px), -50%) scale(0.90); }
    .journey-card.is-next { transform: translate(calc(-50% + 360px), -50%) scale(0.90); }
    .journey-card.is-hidden-left { transform: translate(calc(-50% - 680px), -50%) scale(0.86); opacity: 0; }
    .journey-card.is-hidden-right { transform: translate(calc(-50% + 680px), -50%) scale(0.86); opacity: 0; }

    .journey-card .avatar {
      background: linear-gradient(180deg, #FFF5D3 0%, #FFFFFF 100%);
      border: 4px solid #FFFFFF;
      box-shadow: 0 14px 30px rgba(16, 37, 66, 0.08);
    }

    .journey-arrow {
      background: #FFFFFF;
      color: var(--navy);
      border-color: rgba(16, 37, 66, 0.12);
    }
    .journey-arrow:hover {
      border-color: rgba(16, 37, 66, 0.28);
      color: var(--navy);
    }
    .journey-dot { background: #D9DEE8; }
    .journey-dot.is-active { background: var(--navy); }

    .final-cta {
      background:
        radial-gradient(circle at 20% 8%, rgba(243, 180, 33, 0.10), transparent 26%),
        #FFFFFF;
      color: var(--text);
      border-top: 1px solid rgba(16, 37, 66, 0.08);
    }
    .final-cta h2 { color: var(--navy); }
    .final-cta p { color: var(--muted); }

    footer {
      background: #FFFFFF;
      color: var(--muted);
      border-top: 1px solid rgba(16, 37, 66, 0.10);
    }
    footer h4,
    footer .logo { color: var(--navy) !important; }
    footer ul,
    .footer-brand p,
    .footer-bottom { color: var(--muted); }
    .footer-bottom { border-top-color: rgba(16, 37, 66, 0.10); }

    @media (max-width: 980px) {
      .journey-card.is-prev { transform: translate(calc(-50% - 300px), -50%) scale(0.88); }
      .journey-card.is-next { transform: translate(calc(-50% + 300px), -50%) scale(0.88); }
      .journey-card.is-active { width: 380px; }
    }

    @media (max-width: 720px) {
      .journey-carousel { overflow: hidden; }
      .journey-stage { height: 345px; overflow: hidden; }
      .journey-card { width: 82vw; min-height: 248px; }
      .journey-card.is-active { width: 86vw; min-height: 286px; }
      .journey-card.is-prev,
      .journey-card.is-next { opacity: 0.18; pointer-events: none; }
      .journey-card.is-prev { transform: translate(calc(-50% - 88vw), -50%) scale(0.90); }
      .journey-card.is-next { transform: translate(calc(-50% + 88vw), -50%) scale(0.90); }
    }

  

    /* Bilingual language switch */
    .language-switch {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 4px;
      border: 1px solid rgba(11, 31, 58, 0.12);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.74);
      box-shadow: 0 10px 26px rgba(11, 31, 58, 0.06);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
    }

    .lang-btn {
      border: none;
      border-radius: 999px;
      background: transparent;
      color: var(--muted);
      cursor: pointer;
      font-size: 12px;
      font-weight: 900;
      line-height: 1;
      padding: 9px 11px;
      transition: all 0.2s ease;
    }

    .lang-btn.is-active {
      background: var(--navy);
      color: #FFFFFF;
      box-shadow: 0 8px 18px rgba(11, 31, 58, 0.16);
    }

    html[dir="rtl"] body {
      direction: rtl;
      font-family: Tahoma, Arial, sans-serif;
    }

    html[dir="rtl"] .hero-copy,
    html[dir="rtl"] .mission-copy,
    html[dir="rtl"] .desk-copy,
    html[dir="rtl"] .section-header,
    html[dir="rtl"] .program-content,
    html[dir="rtl"] .journey-card,
    html[dir="rtl"] details,
    html[dir="rtl"] .footer-brand,
    html[dir="rtl"] footer {
      text-align: right;
    }

    html[dir="rtl"] .section-header {
      text-align: center;
    }

    html[dir="rtl"] .consultation-toggle,
    html[dir="rtl"] .form-row label,
    html[dir="rtl"] .eligibility-note,
    html[dir="rtl"] .consultation-option,
    html[dir="rtl"] .status-option,
    html[dir="rtl"] .desk-note {
      text-align: right;
    }

    html[dir="rtl"] .eyebrow,
    html[dir="rtl"] .story-meta,
    html[dir="rtl"] .desk-flow-item span,
    html[dir="rtl"] .ticker-content span {
      letter-spacing: 0;
    }

    html[dir="rtl"] .ticker-content span::before {
      margin-right: 0;
      margin-left: 12px;
    }

    html[dir="rtl"] summary::after {
      margin-left: 0;
      margin-right: auto;
    }

    html[dir="rtl"] input,
    html[dir="rtl"] select,
    html[dir="rtl"] textarea {
      text-align: right;
    }

    @media (max-width: 620px) {
      .language-switch {
        order: 3;
      }

      .nav-actions {
        justify-content: flex-end;
        flex-wrap: wrap;
        row-gap: 8px;
        max-width: 62%;
      }
    }


    /* Persian UX writing/readability polish */
    html[dir="rtl"] body {
      font-family: "Vazirmatn", "IRANSans", Tahoma, Arial, sans-serif;
      line-height: 1.85;
    }

    html[dir="rtl"] h1,
    html[dir="rtl"] h2,
    html[dir="rtl"] h3,
    html[dir="rtl"] .consultation-toggle strong {
      letter-spacing: 0;
      line-height: 1.32;
    }

    html[dir="rtl"] .hero-copy p,
    html[dir="rtl"] .mission-copy > p,
    html[dir="rtl"] .desk-copy > p,
    html[dir="rtl"] .section-header p,
    html[dir="rtl"] .journey-card p,
    html[dir="rtl"] details p {
      line-height: 1.9;
    }

    html[dir="rtl"] .btn,
    html[dir="rtl"] .text-link,
    html[dir="rtl"] .consultation-option strong,
    html[dir="rtl"] .status-option span {
      letter-spacing: 0;
    }


    /* Final typography system — professional bilingual UI */
    body {
      font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      text-rendering: geometricPrecision;
    }

    h1, h2, h3, h4,
    .logo,
    .btn,
    .nav-links,
    .consultation-toggle strong,
    .mission-number,
    .story-meta,
    .eyebrow {
      font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    }

    html[dir="rtl"] body,
    body.lang-fa {
      font-family: "Vazirmatn", "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
      font-weight: 400;
      line-height: 1.85;
      letter-spacing: 0;
      text-rendering: optimizeLegibility;
    }

    html[dir="rtl"] h1,
    html[dir="rtl"] h2,
    html[dir="rtl"] h3,
    html[dir="rtl"] h4,
    html[dir="rtl"] .logo,
    html[dir="rtl"] .btn,
    html[dir="rtl"] .nav-links,
    html[dir="rtl"] .consultation-toggle strong,
    html[dir="rtl"] .mission-number,
    html[dir="rtl"] .story-meta,
    html[dir="rtl"] .eyebrow,
    html[dir="rtl"] .form-row label,
    html[dir="rtl"] .status-option span,
    html[dir="rtl"] .consultation-option strong,
    html[dir="rtl"] summary,
    html[dir="rtl"] .text-link {
      font-family: "Vazirmatn", "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
      letter-spacing: 0;
    }

    html[dir="rtl"] h1 {
      font-weight: 850;
      line-height: 1.22;
      letter-spacing: -0.015em;
    }

    html[dir="rtl"] h2 {
      font-weight: 820;
      line-height: 1.28;
      letter-spacing: -0.01em;
    }

    html[dir="rtl"] h3,
    html[dir="rtl"] .consultation-toggle strong {
      font-weight: 780;
      line-height: 1.34;
    }

    html[dir="rtl"] p,
    html[dir="rtl"] small,
    html[dir="rtl"] input,
    html[dir="rtl"] select,
    html[dir="rtl"] textarea,
    html[dir="rtl"] details p,
    html[dir="rtl"] .program-content p,
    html[dir="rtl"] .journey-card p,
    html[dir="rtl"] .form-disclaimer,
    html[dir="rtl"] .eligibility-note small,
    html[dir="rtl"] .consultation-option small {
      font-family: "Vazirmatn", "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
      font-weight: 400;
      line-height: 1.9;
      letter-spacing: 0;
    }

    html[dir="rtl"] .hero-copy p,
    html[dir="rtl"] .mission-copy > p,
    html[dir="rtl"] .desk-copy > p,
    html[dir="rtl"] .section-header p,
    html[dir="rtl"] .final-cta p {
      font-size: 16.5px;
      font-weight: 430;
      line-height: 1.95;
    }

    html[dir="rtl"] .btn {
      font-weight: 780;
      line-height: 1.35;
    }

    html[dir="rtl"] .eyebrow,
    html[dir="rtl"] .story-meta,
    html[dir="rtl"] .desk-flow-item span {
      font-weight: 800;
      font-size: 12px;
      letter-spacing: 0;
    }

    html[dir="rtl"] input::placeholder,
    html[dir="rtl"] textarea::placeholder {
      font-family: "Vazirmatn", "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
      color: rgba(111, 106, 95, 0.68);
    }



    /* Seamless infinite ticker fix: no visible ending/gap in EN or FA */
    .trust-ticker {
      direction: ltr;
      overflow: hidden;
      isolation: isolate;
    }

    .ticker-track {
      display: flex !important;
      flex-wrap: nowrap !important;
      width: max-content !important;
      min-width: max-content !important;
      will-change: transform;
      animation: tickerMoveSeamless 42s linear infinite !important;
    }

    .ticker-content {
      display: flex !important;
      align-items: center;
      gap: clamp(28px, 4vw, 52px);
      padding-right: clamp(28px, 4vw, 52px);
      flex: 0 0 auto;
      min-width: max-content;
      white-space: nowrap;
    }

    .ticker-content span {
      display: inline-flex;
      align-items: center;
      white-space: nowrap;
      unicode-bidi: plaintext;
    }

    @keyframes tickerMoveSeamless {
      from { transform: translate3d(0, 0, 0); }
      to { transform: translate3d(-16.666666%, 0, 0); }
    }

    .trust-ticker:hover .ticker-track {
      animation-play-state: running !important;
    }

    html[dir="rtl"] .trust-ticker {
      direction: ltr;
    }

    html[dir="rtl"] .ticker-content span::before {
      margin-right: 0;
      margin-left: 12px;
    }



    /* =========================================================
       HERO COMPACT UX PASS — smaller, cleaner, stronger hierarchy
       ========================================================= */
    .hero {
      min-height: clamp(500px, 68vh, 620px) !important;
      padding: clamp(46px, 6vw, 74px) 0 clamp(34px, 4vw, 54px) !important;
      align-items: flex-end !important;
    }

    .hero-content {
      width: 100%;
    }

    .hero .container.hero-grid {
      width: min(1080px, 90%) !important;
    }

    .hero-grid {
      grid-template-columns: minmax(0, 0.96fr) minmax(300px, 0.62fr) !important;
      gap: clamp(40px, 7vw, 92px) !important;
      align-items: center !important;
    }

    .hero-copy {
      max-width: 560px;
    }

    .hero .eyebrow {
      display: inline-flex;
      align-items: center;
      width: fit-content;
      margin-bottom: 12px !important;
      padding: 3px 8px;
      border-radius: 7px;
      background: rgba(243, 180, 33, 0.16);
      color: #B47C00;
      font-size: 11px !important;
      line-height: 1.1;
      letter-spacing: 0.14em !important;
    }

    .hero h1 {
      max-width: 560px !important;
      margin-bottom: 14px !important;
      font-size: clamp(38px, 4.2vw, 56px) !important;
      line-height: 0.98 !important;
      letter-spacing: -0.065em !important;
    }

    .hero-copy p {
      max-width: 500px !important;
      margin-bottom: 22px !important;
      font-size: clamp(15px, 1.25vw, 17px) !important;
      line-height: 1.58 !important;
    }

    .hero-actions {
      gap: 10px !important;
      align-items: center;
    }

    .hero-actions .btn {
      width: auto !important;
      min-height: 44px;
      padding: 12px 22px !important;
      font-size: 14px !important;
      box-shadow: 0 12px 26px rgba(243, 180, 33, 0.18) !important;
    }

    .hero .consultation-card {
      max-width: 340px !important;
      margin-left: auto !important;
      border-radius: 24px !important;
      box-shadow:
        0 24px 62px rgba(16, 37, 66, 0.11),
        0 0 0 1px rgba(255, 255, 255, 0.58) inset !important;
    }

    .hero .consultation-toggle {
      min-height: 108px;
      padding: 22px 24px !important;
      gap: 16px !important;
    }

    .hero .consultation-toggle strong {
      margin-bottom: 5px !important;
      font-size: clamp(24px, 2.1vw, 29px) !important;
      line-height: 1.05 !important;
      letter-spacing: -0.05em !important;
    }

    .hero .consultation-toggle small {
      font-size: 12.5px !important;
      line-height: 1.35 !important;
      max-width: 235px;
    }

    .hero .toggle-icon {
      width: 34px !important;
      height: 34px !important;
      font-size: 18px !important;
      box-shadow: 0 10px 22px rgba(16, 37, 66, 0.06) !important;
    }

    .hero .inline-form {
      gap: 10px !important;
      padding: 0 22px 22px !important;
    }

    .hero .eligibility-note,
    .hero .status-option,
    .hero .consultation-option {
      border-radius: 14px !important;
      padding: 12px !important;
    }

    .hero .form-row {
      gap: 6px !important;
    }

    .hero .form-row label {
      font-size: 12px !important;
    }

    .hero .form-row input,
    .hero .form-row select {
      min-height: 42px;
      padding: 10px 12px !important;
      border-radius: 13px !important;
      font-size: 13px !important;
    }

    .hero + .trust-ticker {
      margin-top: 0 !important;
    }

    html[dir="rtl"] .hero .eyebrow {
      letter-spacing: 0 !important;
    }

    html[dir="rtl"] .hero h1 {
      max-width: 590px !important;
      font-size: clamp(36px, 4vw, 54px) !important;
      line-height: 1.16 !important;
      letter-spacing: -0.018em !important;
    }

    html[dir="rtl"] .hero-copy p {
      max-width: 540px !important;
      font-size: clamp(14.5px, 1.2vw, 16px) !important;
      line-height: 1.9 !important;
    }

    html[dir="rtl"] .hero .consultation-toggle {
      text-align: right;
    }

    html[dir="rtl"] .hero .consultation-toggle strong {
      line-height: 1.24 !important;
      letter-spacing: -0.01em !important;
    }

    @media (max-width: 980px) {
      .hero {
        min-height: clamp(560px, 80vh, 700px) !important;
        padding: 52px 0 64px !important;
      }

      .hero-grid {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
      }

      .hero-copy {
        max-width: 680px;
      }

      .hero .consultation-card {
        max-width: 520px !important;
        margin-left: 0 !important;
      }
    }

    @media (max-width: 620px) {
      .hero {
        padding: 38px 0 30px !important;
      }

      .hero .container.hero-grid {
        width: min(100% - 34px, 560px) !important;
      }

      .hero .eyebrow {
        font-size: 10px !important;
        padding: 3px 7px;
      }

      .hero h1,
      html[dir="rtl"] .hero h1 {
        font-size: clamp(30px, 9vw, 38px) !important;
        line-height: 1.12 !important;
        margin-bottom: 12px !important;
      }

      .hero-copy p,
      html[dir="rtl"] .hero-copy p {
        font-size: 14.5px !important;
        line-height: 1.75 !important;
        margin-bottom: 18px !important;
      }

      .hero-actions .btn {
        width: auto !important;
        min-height: 42px;
        padding: 11px 18px !important;
        font-size: 13.5px !important;
      }

      .hero .consultation-card {
        max-width: 100% !important;
        border-radius: 22px !important;
      }

      .hero .consultation-toggle {
        min-height: 94px;
        padding: 19px 20px !important;
      }

      .hero .consultation-toggle strong {
        font-size: 22px !important;
      }
    }



    /* =========================================================
       HERO MICRO UI PASS — inspired by compact premium SaaS hero
       Smaller visual elements, tighter rhythm, stronger empty space
       ========================================================= */
    @media (min-width: 981px) {
      .hero {
        min-height: clamp(580px, 76vh, 720px) !important;
        padding: clamp(30px, 4.2vw, 48px) 0 clamp(46px, 6vw, 72px) !important;
        display: flex !important;
        align-items: flex-end !important;
      }

      .hero .container.hero-grid {
        width: min(890px, 82vw) !important;
        margin-inline: auto !important;
      }

      .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(240px, 280px) !important;
        gap: clamp(46px, 7vw, 92px) !important;
        align-items: center !important;
      }

      .hero-copy {
        max-width: 420px !important;
      }

      .hero .eyebrow {
        margin-bottom: 9px !important;
        padding: 3px 7px !important;
        border-radius: 6px !important;
        font-size: 9.5px !important;
        line-height: 1 !important;
        letter-spacing: 0.18em !important;
      }

      .hero h1 {
        max-width: 430px !important;
        margin-bottom: 11px !important;
        font-size: clamp(31px, 3vw, 40px) !important;
        line-height: 1.02 !important;
        letter-spacing: -0.058em !important;
      }

      .hero-copy p {
        max-width: 390px !important;
        margin-bottom: 18px !important;
        font-size: 13.5px !important;
        line-height: 1.62 !important;
      }

      .hero-actions {
        gap: 8px !important;
      }

      .hero-actions .btn {
        min-height: 36px !important;
        padding: 9px 17px !important;
        border-radius: 999px !important;
        font-size: 12.5px !important;
        line-height: 1 !important;
      }

      .hero .consultation-card {
        max-width: 276px !important;
        border-radius: 20px !important;
        box-shadow:
          0 18px 46px rgba(16, 37, 66, 0.09),
          0 0 0 1px rgba(255, 255, 255, 0.62) inset !important;
      }

      .hero .consultation-toggle {
        min-height: 82px !important;
        padding: 16px 17px !important;
        gap: 12px !important;
      }

      .hero .consultation-toggle strong {
        margin-bottom: 4px !important;
        font-size: clamp(18px, 1.55vw, 22px) !important;
        line-height: 1.07 !important;
        letter-spacing: -0.045em !important;
      }

      .hero .consultation-toggle small {
        max-width: 198px !important;
        font-size: 10.7px !important;
        line-height: 1.3 !important;
      }

      .hero .toggle-icon {
        width: 29px !important;
        height: 29px !important;
        font-size: 15px !important;
        flex: 0 0 29px !important;
      }

      .hero .inline-form {
        gap: 8px !important;
        padding: 0 16px 16px !important;
      }

      .hero .eligibility-note,
      .hero .status-option,
      .hero .consultation-option {
        border-radius: 12px !important;
        padding: 10px !important;
      }

      .hero .eligibility-note strong,
      .hero .consultation-option strong,
      .hero .status-option span {
        font-size: 12px !important;
      }

      .hero .eligibility-note small,
      .hero .consultation-option small,
      .hero .form-disclaimer {
        font-size: 10.5px !important;
        line-height: 1.35 !important;
      }

      .hero .option-icon {
        width: 30px !important;
        height: 30px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
      }

      .hero .consultation-option {
        grid-template-columns: 30px 1fr !important;
        gap: 9px !important;
      }

      .hero .form-row label {
        font-size: 10.8px !important;
      }

      .hero .form-row input,
      .hero .form-row select {
        min-height: 36px !important;
        padding: 8px 10px !important;
        border-radius: 11px !important;
        font-size: 12px !important;
      }

      html[dir="rtl"] .hero-copy {
        max-width: 450px !important;
      }

      html[dir="rtl"] .hero h1 {
        max-width: 460px !important;
        font-size: clamp(30px, 2.85vw, 39px) !important;
        line-height: 1.23 !important;
        letter-spacing: -0.015em !important;
      }

      html[dir="rtl"] .hero-copy p {
        max-width: 420px !important;
        font-size: 13px !important;
        line-height: 1.85 !important;
      }

      html[dir="rtl"] .hero .consultation-toggle strong {
        font-size: clamp(17px, 1.45vw, 21px) !important;
        line-height: 1.25 !important;
        letter-spacing: -0.005em !important;
      }
    }

    @media (max-width: 980px) {
      .hero .container.hero-grid {
        width: min(720px, 88vw) !important;
      }

      .hero h1,
      html[dir="rtl"] .hero h1 {
        font-size: clamp(28px, 6.2vw, 40px) !important;
      }

      .hero-copy p,
      html[dir="rtl"] .hero-copy p {
        max-width: 470px !important;
        font-size: 13.5px !important;
      }

      .hero .consultation-card {
        max-width: 390px !important;
      }
    }

    @media (max-width: 620px) {
      .hero {
        padding: 30px 0 24px !important;
      }

      .hero h1,
      html[dir="rtl"] .hero h1 {
        font-size: clamp(27px, 8.2vw, 34px) !important;
      }

      .hero-copy p,
      html[dir="rtl"] .hero-copy p {
        font-size: 13px !important;
      }
    }



    /* =========================================================
       HERO BALANCED FORM PASS — wider card, shorter open state
       Keeps the hero compact without turning the form into a thin column
       ========================================================= */
    @media (min-width: 981px) {
      .hero .container.hero-grid {
        width: min(1060px, 88vw) !important;
      }

      .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(390px, 430px) !important;
        gap: clamp(46px, 6vw, 84px) !important;
      }

      .hero-copy {
        max-width: 440px !important;
      }

      .hero h1 {
        max-width: 440px !important;
        font-size: clamp(31px, 2.85vw, 40px) !important;
      }

      .hero-copy p {
        max-width: 410px !important;
      }

      .hero .consultation-card {
        width: min(100%, 430px) !important;
        max-width: 430px !important;
        justify-self: end !important;
        border-radius: 22px !important;
      }

      html[dir="rtl"] .hero .consultation-card {
        justify-self: start !important;
      }

      .hero .consultation-toggle {
        min-height: 86px !important;
        padding: 16px 18px !important;
      }

      .hero .consultation-toggle strong {
        font-size: clamp(19px, 1.5vw, 23px) !important;
      }

      .hero .consultation-toggle small {
        max-width: 320px !important;
        font-size: 10.8px !important;
      }

      .hero .inline-form {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px 10px !important;
        padding: 0 16px 16px !important;
      }

      .hero .eligibility-note,
      .hero .form-row:nth-of-type(4),
      .hero .consultation-options,
      .hero .inline-form > .btn,
      .hero .form-disclaimer {
        grid-column: 1 / -1 !important;
      }

      .hero .eligibility-note {
        padding: 10px 12px !important;
      }

      .hero .eligibility-note strong {
        font-size: 11.8px !important;
        line-height: 1.25 !important;
      }

      .hero .eligibility-note small {
        font-size: 10.2px !important;
        line-height: 1.35 !important;
      }

      .hero .form-row {
        gap: 5px !important;
      }

      .hero .form-row input,
      .hero .form-row select {
        min-height: 34px !important;
        padding: 7px 10px !important;
        font-size: 11.8px !important;
      }

      .hero .status-options {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 7px !important;
      }

      .hero .status-option {
        min-height: 42px !important;
        padding: 8px 7px !important;
        grid-template-columns: 14px 1fr !important;
        gap: 6px !important;
        align-items: center !important;
      }

      .hero .status-option input {
        width: 14px !important;
        height: 14px !important;
      }

      .hero .status-option span {
        font-size: 10.5px !important;
        line-height: 1.25 !important;
      }

      .hero .consultation-options {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        margin: 0 !important;
      }

      .hero .consultation-option {
        grid-template-columns: 26px 1fr !important;
        gap: 7px !important;
        min-height: 54px !important;
        padding: 8px !important;
      }

      .hero .option-icon {
        width: 26px !important;
        height: 26px !important;
        border-radius: 9px !important;
        font-size: 12px !important;
      }

      .hero .consultation-option strong {
        font-size: 10.8px !important;
        line-height: 1.25 !important;
      }

      .hero .consultation-option small {
        font-size: 9.6px !important;
        line-height: 1.3 !important;
      }

      .hero .inline-form > .btn {
        width: fit-content !important;
        justify-self: center !important;
        min-height: 34px !important;
        padding: 8px 18px !important;
        font-size: 11.8px !important;
      }

      .hero .form-disclaimer {
        max-width: 340px !important;
        justify-self: center !important;
        font-size: 9.6px !important;
        line-height: 1.35 !important;
      }
    }

    @media (min-width: 621px) and (max-width: 980px) {
      .hero .consultation-card {
        max-width: 520px !important;
        width: min(100%, 520px) !important;
      }

      .hero .inline-form {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px 12px !important;
      }

      .hero .eligibility-note,
      .hero .form-row:nth-of-type(4),
      .hero .consultation-options,
      .hero .inline-form > .btn,
      .hero .form-disclaimer {
        grid-column: 1 / -1 !important;
      }

      .hero .status-options,
      .hero .consultation-options {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      }

      .hero .consultation-options {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }
    }

    @media (max-width: 620px) {
      .hero .inline-form,
      .hero .status-options,
      .hero .consultation-options {
        grid-template-columns: 1fr !important;
      }
    }



    /* =========================================================
       HERO STATUS OPTIONS FIX — compact, readable segmented choices
       ========================================================= */
    .hero .status-options {
      display: flex !important;
      flex-wrap: nowrap !important;
      gap: 8px !important;
      align-items: stretch !important;
      width: 100% !important;
    }

    .hero .status-option {
      flex: 1 1 0 !important;
      min-width: 0 !important;
      display: flex !important;
      grid-template-columns: none !important;
      align-items: center !important;
      justify-content: flex-start !important;
      gap: 7px !important;
      min-height: 48px !important;
      padding: 9px 10px !important;
      text-align: start !important;
    }

    .hero .status-option:nth-child(3) {
      flex-grow: 1.48 !important;
    }

    .hero .status-option input {
      flex: 0 0 auto !important;
      width: 15px !important;
      height: 15px !important;
      margin: 0 !important;
    }

    .hero .status-option span {
      display: block !important;
      min-width: 0 !important;
      font-size: 11.4px !important;
      line-height: 1.22 !important;
      letter-spacing: -0.01em !important;
      overflow-wrap: normal !important;
      word-break: normal !important;
    }

    .hero .status-option:nth-child(1) span,
    .hero .status-option:nth-child(2) span {
      white-space: nowrap !important;
    }

    html[dir="rtl"] .hero .status-option {
      justify-content: flex-start !important;
      text-align: right !important;
    }

    html[dir="rtl"] .hero .status-option span {
      font-size: 11.2px !important;
      line-height: 1.35 !important;
      letter-spacing: 0 !important;
    }

    @media (min-width: 981px) {
      .hero .consultation-card {
        width: min(100%, 450px) !important;
        max-width: 450px !important;
      }

      .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(410px, 450px) !important;
      }
    }

    @media (max-width: 620px) {
      .hero .status-options {
        display: grid !important;
        grid-template-columns: 1fr !important;
      }

      .hero .status-option,
      .hero .status-option:nth-child(3) {
        flex: initial !important;
      }
    }


    /* =========================================================
       HERO STATUS OPTIONS FINAL FIX — readable, balanced, no crushed labels
       ========================================================= */
    .hero .status-options {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 9px !important;
      width: 100% !important;
      align-items: stretch !important;
    }

    .hero .status-option,
    .hero .status-option:nth-child(3) {
      flex: initial !important;
      min-width: 0 !important;
      width: 100% !important;
      min-height: 46px !important;
      display: flex !important;
      align-items: center !important;
      justify-content: flex-start !important;
      gap: 9px !important;
      padding: 10px 12px !important;
      border-radius: 15px !important;
      text-align: start !important;
      overflow: hidden !important;
    }

    .hero .status-option:nth-child(3) {
      grid-column: 1 / -1 !important;
      min-height: 48px !important;
    }

    .hero .status-option input {
      width: 15px !important;
      height: 15px !important;
      margin: 0 !important;
      flex: 0 0 auto !important;
    }

    .hero .status-option span,
    .hero .status-option:nth-child(1) span,
    .hero .status-option:nth-child(2) span,
    .hero .status-option:nth-child(3) span {
      display: block !important;
      min-width: 0 !important;
      white-space: normal !important;
      font-size: 12px !important;
      line-height: 1.25 !important;
      letter-spacing: -0.01em !important;
      overflow-wrap: normal !important;
      word-break: normal !important;
      hyphens: none !important;
    }

    .hero .status-option:nth-child(1) span,
    .hero .status-option:nth-child(2) span {
      white-space: nowrap !important;
    }

    html[dir="rtl"] .hero .status-option {
      direction: rtl !important;
      text-align: right !important;
      justify-content: flex-start !important;
    }

    html[dir="rtl"] .hero .status-option span {
      font-size: 12px !important;
      line-height: 1.35 !important;
      letter-spacing: 0 !important;
    }

    @media (max-width: 620px) {
      .hero .status-options {
        grid-template-columns: 1fr !important;
      }

      .hero .status-option:nth-child(3) {
        grid-column: auto !important;
      }
    }



    /* =========================================================
       HERO ELIGIBILITY NOTE REFINEMENT
       ========================================================= */
    .hero .hero-status-note {
      grid-column: 1 / -1 !important;
      margin-top: -2px !important;
      padding: 4px 2px 2px !important;
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }

    .hero .hero-status-note strong {
      display: none !important;
    }

    .hero .hero-status-note small {
      display: block !important;
      font-size: 10px !important;
      line-height: 1.35 !important;
      color: #7b8190 !important;
      text-align: start !important;
      font-weight: 600 !important;
    }

    html[dir="rtl"] .hero .hero-status-note small {
      text-align: right !important;
      line-height: 1.55 !important;
    }

    /* =========================================================
       FORM LAYOUT — FINAL, AUTHORITATIVE PASS
       Supersedes the older nth-of-type based column spans above,
       which silently broke once the progress bar / success box
       were added (indexes shifted, leaving the status row squeezed
       into one column and an empty cell beside the progress bar).
       Only Name + Phone pair up; every other row is full width.
       ========================================================= */
    @media (min-width: 621px) {
      .hero .inline-form {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        row-gap: 12px !important;
        column-gap: 14px !important;
      }

      .hero .inline-form > .form-progress,
      .hero .inline-form > .eligibility-note,
      .hero .inline-form > .consultation-options,
      .hero .inline-form > .btn,
      .hero .inline-form > .form-success,
      .hero .inline-form > .form-disclaimer,
      .hero .form-row:has(#email),
      .hero .form-row:has(.status-options) {
        grid-column: 1 / -1 !important;
      }
    }

    @media (max-width: 620px) {
      .hero .inline-form {
        grid-template-columns: 1fr !important;
        row-gap: 12px !important;
      }
    }

    .hero .inline-form {
      align-items: start !important;
    }

    .hero .form-row {
      min-width: 0;
    }



    /* =========================================================
       PROGRAMS CAROUSEL — compact category slider
       ========================================================= */
    .programs-header {
      margin-bottom: 34px;
    }

    .programs-carousel {
      position: relative;
      display: grid;
      grid-template-columns: 54px minmax(0, 1fr) 54px;
      align-items: center;
      gap: 16px;
    }

    .programs-viewport {
      overflow: hidden;
      width: 100%;
    }

    .programs-track {
      display: flex;
      gap: 18px;
      transition: transform 0.35s ease;
      will-change: transform;
    }

    .program-category-card {
      flex: 0 0 calc((100% - 36px) / 3);
      border: 1px solid var(--border);
      border-radius: 20px;
      overflow: hidden;
      background: linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.56));
      box-shadow: 0 20px 50px rgba(171, 119, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.78);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      min-height: 260px;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    }

    .program-category-card:hover {
      transform: translateY(-4px);
      border-color: rgba(255, 194, 41, 0.68);
      box-shadow: 0 24px 60px rgba(171, 119, 0, 0.12), 0 0 24px rgba(255, 194, 41, 0.12);
    }

    .program-category-card .program-image {
      height: 150px;
      position: relative;
      display: flex;
      align-items: flex-start;
      justify-content: flex-start;
      padding: 18px;
      background:
        radial-gradient(circle at 22% 18%, rgba(255, 255, 255, 0.95), transparent 26%),
        radial-gradient(circle at 76% 18%, rgba(255, 194, 41, 0.22), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 243, 207, 0.66)),
        #FFF8E8;
      border-bottom: 1px solid rgba(255, 194, 41, 0.22);
      color: transparent;
      font-size: 0;
    }

    .program-tag {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.78);
      border: 1px solid rgba(255, 194, 41, 0.35);
      color: #C58B00;
      font-size: 18px;
      font-weight: 900;
      box-shadow: 0 10px 24px rgba(171, 119, 0, 0.10);
    }

    .program-category-card .program-content {
      padding: 22px 20px 24px;
      display: flex;
      align-items: center;
      min-height: 110px;
    }

    .program-category-card .program-content h3 {
      margin: 0;
      color: var(--navy);
      font-size: 22px;
      line-height: 1.25;
      letter-spacing: -0.02em;
    }

    .programs-arrow {
      width: 54px;
      height: 54px;
      border-radius: 50%;
      border: 1px solid rgba(231, 167, 0, 0.28);
      background: rgba(255, 255, 255, 0.74);
      color: var(--navy);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0 12px 28px rgba(171, 119, 0, 0.08);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      transition: all 0.2s ease;
    }

    .programs-arrow span {
      font-size: 24px;
      line-height: 1;
      font-weight: 900;
      transform: translateY(-1px);
    }

    .programs-arrow:hover {
      transform: translateY(-2px);
      border-color: rgba(231, 167, 0, 0.62);
      color: #A86F00;
    }

    .programs-arrow:disabled {
      opacity: 0.45;
      cursor: not-allowed;
      transform: none;
    }

    .programs-dots {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
      margin-top: 20px;
    }

    .programs-dot {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      border: none;
      background: rgba(231, 167, 0, 0.24);
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .programs-dot.is-active {
      width: 28px;
      border-radius: 99px;
      background: linear-gradient(90deg, #FFE38A, #FFC229);
      box-shadow: 0 0 14px rgba(255, 194, 41, 0.28);
    }

    html[dir="rtl"] .program-category-card .program-content {
      text-align: right;
      justify-content: flex-start;
    }

    @media (max-width: 980px) {
      .programs-carousel {
        grid-template-columns: 46px minmax(0, 1fr) 46px;
        gap: 12px;
      }

      .programs-arrow {
        width: 46px;
        height: 46px;
      }

      .program-category-card {
        flex-basis: calc((100% - 18px) / 2);
        min-height: 240px;
      }

      .program-category-card .program-content h3 {
        font-size: 20px;
      }
    }

    @media (max-width: 620px) {
      .programs-carousel {
        grid-template-columns: 1fr;
        gap: 14px;
      }

      .programs-viewport {
        order: 1;
      }

      .programs-arrow {
        width: 42px;
        height: 42px;
      }

      .programs-arrow-prev,
      .programs-arrow-next {
        position: absolute;
        top: calc(50% - 36px);
        z-index: 4;
      }

      .programs-arrow-prev {
        left: -4px;
      }

      .programs-arrow-next {
        right: -4px;
      }

      .program-category-card {
        flex-basis: 100%;
      }

      .program-category-card .program-image {
        height: 136px;
      }

      .program-category-card .program-content {
        min-height: 96px;
        padding: 18px 18px 22px;
      }

      .program-category-card .program-content h3 {
        font-size: 19px;
      }
    }



    /* =========================================================
       PROGRAMS CAROUSEL REFINEMENTS — wheel swipe, no clipping
       ========================================================= */
    .programs {
      overflow: visible !important;
    }

    .programs .container,
    .programs-carousel {
      overflow: visible !important;
    }

    .programs-viewport {
      overflow: hidden;
      width: 100%;
      padding: 10px 4px 16px;
      margin: -10px -4px -16px;
    }

    .programs-track {
      align-items: stretch;
      padding: 2px 0;
    }

    .program-category-card {
      min-height: 272px;
    }

    .program-category-card .program-image {
      height: 146px;
    }

    .program-tag {
      display: none !important;
    }

    .programs-center-action {
      margin-top: 8px;
    }

    @media (max-width: 980px) {
      .program-category-card {
        min-height: 252px;
      }
    }

    @media (max-width: 620px) {
      .programs-viewport {
        padding: 10px 2px 16px;
        margin: -10px -2px -16px;
      }

      .program-category-card {
        min-height: 236px;
      }

      .program-category-card .program-image {
        height: 132px;
      }
    }



    /* =========================================================
       PROGRAMS CAROUSEL CLEANUP — remove blurred frame
       ========================================================= */
    .programs-viewport {
      background: transparent !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
      padding: 6px 2px 10px !important;
      margin: -6px -2px -10px !important;
    }

    .programs-track {
      background: transparent !important;
      box-shadow: none !important;
    }

    .program-category-card {
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
      box-shadow: 0 14px 30px rgba(171, 119, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
    }

    .program-category-card:hover {
      box-shadow: 0 18px 36px rgba(171, 119, 0, 0.08), 0 0 18px rgba(255, 194, 41, 0.10) !important;
    }



    /* =========================================================
       PROGRAMS CAROUSEL FINAL CLEAN — remove remaining faded box
       ========================================================= */
    .programs-carousel,
    .programs-viewport,
    .programs-track,
    .programs .container {
      background: transparent !important;
      box-shadow: none !important;
      filter: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }

    .programs-carousel::before,
    .programs-carousel::after,
    .programs-viewport::before,
    .programs-viewport::after,
    .programs-track::before,
    .programs-track::after {
      content: none !important;
      display: none !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    .program-category-card,
    .program-category-card:hover {
      box-shadow: none !important;
      filter: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }

    .program-category-card .program-image,
    .program-category-card .program-content {
      box-shadow: none !important;
      filter: none !important;
    }



    /* =========================================================
       PROGRAMS CAROUSEL UX FIX — stable arrows and movement
       ========================================================= */
    .programs-carousel,
    .programs-viewport,
    .programs-track {
      direction: ltr !important;
    }

    .programs-arrow {
      direction: ltr !important;
      unicode-bidi: isolate !important;
    }

    .programs-arrow span {
      display: inline-block;
      direction: ltr !important;
      unicode-bidi: isolate !important;
    }

    html[dir="rtl"] .programs-header,
    html[dir="rtl"] .programs-header .eyebrow,
    html[dir="rtl"] .programs-header h2,
    html[dir="rtl"] .programs-header p {
      text-align: center !important;
    }

    html[dir="rtl"] .program-category-card .program-content h3 {
      text-align: right !important;
      width: 100%;
    }



    /* =========================================================
       MISSION YOUTUBE VIDEO EMBED
       ========================================================= */
    .mission-video.has-youtube {
      padding: 0 !important;
      display: block !important;
      min-height: 330px;
      aspect-ratio: 16 / 10;
      overflow: hidden;
    }

    .mission-video.has-youtube::after {
      content: none !important;
      display: none !important;
    }

    .mission-video.has-youtube::before {
      inset: 0 !important;
      border-radius: inherit !important;
      z-index: 2;
      pointer-events: none;
    }

    .mission-video.has-youtube iframe {
      width: 100%;
      height: 100%;
      min-height: inherit;
      border: 0;
      display: block;
      border-radius: inherit;
      position: relative;
      z-index: 1;
    }

    @media (max-width: 820px) {
      .mission-video.has-youtube {
        min-height: 260px;
      }
    }

    @media (max-width: 620px) {
      .mission-video.has-youtube {
        min-height: 220px;
        aspect-ratio: 16 / 9;
      }
    }



    /* =========================================================
       MISSION YOUTUBE PREVIEW CARD — local-preview safe
       ========================================================= */
    .mission-video.youtube-preview-card {
      padding: 0 !important;
      display: block !important;
      min-height: 330px;
      aspect-ratio: 16 / 10;
      overflow: hidden;
      position: relative;
      cursor: pointer;
      text-decoration: none;
      color: inherit;
    }

    .mission-video.youtube-preview-card::after {
      content: "" !important;
      position: absolute;
      inset: 0;
      display: block !important;
      background:
        linear-gradient(180deg, rgba(11, 31, 58, 0.10), rgba(11, 31, 58, 0.48)),
        radial-gradient(circle at 50% 50%, rgba(255, 194, 41, 0.18), transparent 42%);
      z-index: 2;
      pointer-events: none;
      transform: none !important;
      width: auto !important;
      height: auto !important;
      border-radius: inherit !important;
      box-shadow: none !important;
    }

    .mission-video.youtube-preview-card::before {
      inset: 0 !important;
      border-radius: inherit !important;
      z-index: 4;
      pointer-events: none;
    }

    .mission-video.youtube-preview-card img {
      width: 100%;
      height: 100%;
      min-height: inherit;
      object-fit: cover;
      display: block;
      border-radius: inherit;
      filter: saturate(0.95) brightness(0.96);
      transition: transform 0.35s ease, filter 0.35s ease;
    }

    .mission-video.youtube-preview-card:hover img {
      transform: scale(1.035);
      filter: saturate(1.02) brightness(1);
    }

    .youtube-preview-overlay {
      position: absolute;
      inset: 0;
      z-index: 5;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 12px;
      text-align: center;
      padding: 24px;
      pointer-events: none;
    }

    .youtube-play-button {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.92);
      color: #C58B00;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      padding-left: 4px;
      box-shadow:
        0 18px 42px rgba(11, 31, 58, 0.20),
        0 0 24px rgba(255, 194, 41, 0.24);
    }

    .youtube-preview-text {
      color: #ffffff;
      font-size: 15px;
      font-weight: 900;
      text-shadow: 0 2px 14px rgba(0, 0, 0, 0.34);
    }

    .youtube-platform-badge {
      position: absolute;
      top: 16px;
      left: 16px;
      z-index: 6;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 8px 12px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.96);
      color: #0B1F3A;
      font-size: 12px;
      font-weight: 900;
      line-height: 1;
      box-shadow: 0 12px 28px rgba(11, 31, 58, 0.18);
      pointer-events: none;
    }

    .youtube-platform-dot {
      width: 18px;
      height: 18px;
      border-radius: 999px;
      background: #FF0033;
      position: relative;
      box-shadow: 0 0 0 4px rgba(255, 0, 51, 0.12);
      flex: 0 0 auto;
    }

    .youtube-platform-dot::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-35%, -50%);
      width: 0;
      height: 0;
      border-top: 4px solid transparent;
      border-bottom: 4px solid transparent;
      border-left: 6px solid #ffffff;
    }

    .youtube-click-hint {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-top: 2px;
      padding: 8px 12px;
      border-radius: 999px;
      background: rgba(11, 31, 58, 0.42);
      border: 1px solid rgba(255, 255, 255, 0.22);
      color: rgba(255, 255, 255, 0.96);
      font-size: 11.5px;
      font-weight: 800;
      letter-spacing: 0.01em;
      box-shadow: 0 12px 28px rgba(11, 31, 58, 0.12);
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
    }

    .youtube-click-hint::after {
      content: "↗";
      font-size: 13px;
      line-height: 1;
    }

    @media (max-width: 820px) {
      .mission-video.youtube-preview-card {
        min-height: 260px;
      }
    }

    @media (max-width: 620px) {
      .mission-video.youtube-preview-card {
        min-height: 220px;
        aspect-ratio: 16 / 9;
      }

      .youtube-play-button {
        width: 60px;
        height: 60px;
        font-size: 23px;
      }

      .youtube-platform-badge {
        top: 12px;
        left: 12px;
        padding: 7px 10px;
        font-size: 11px;
      }

      .youtube-click-hint {
        font-size: 10.5px;
        padding: 7px 10px;
      }
    }



    /* =========================================================
       PREVIEW IMAGES — temporary online visuals
       ========================================================= */
    .hero-preview-image {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 0;
      opacity: 0.16;
      filter: saturate(0.9) sepia(0.14) brightness(1.12);
      mix-blend-mode: multiply;
      pointer-events: none;
    }

    .hero-video {
      display: none !important;
    }

    .program-category-card .program-image {
      background-image:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 248, 232, 0.20)),
        var(--program-img) !important;
      background-size: cover !important;
      background-position: center !important;
      filter: saturate(0.88) brightness(1.04);
    }

    .program-category-card .program-image::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.20), rgba(255, 194, 41, 0.14)),
        radial-gradient(circle at 75% 20%, rgba(255, 255, 255, 0.34), transparent 38%);
      pointer-events: none;
    }

    .review-avatar {
      background-image: var(--avatar-img) !important;
      background-size: cover !important;
      background-position: center !important;
      border: 4px solid rgba(255, 255, 255, 0.92) !important;
    }

    .story-card .avatar.review-avatar {
      width: 82px;
      height: 82px;
    }



    /* =========================================================
       TEMP HERO VIDEO — preview only
       ========================================================= */
    .hero-video.hero-temp-video {
      display: block !important;
      opacity: 0.18 !important;
      filter: saturate(0.78) sepia(0.18) brightness(1.18);
      mix-blend-mode: multiply;
    }

    .hero-preview-image {
      opacity: 0.08 !important;
    }

    .hero::after {
      z-index: 0;
    }



    /* =========================================================
       TEMP HERO VIDEO VISIBILITY FIX
       ========================================================= */
    .hero-video.hero-temp-video {
      display: block !important;
      opacity: 0.42 !important;
      filter: saturate(0.95) sepia(0.08) brightness(1.08) contrast(1.05) !important;
      mix-blend-mode: normal !important;
      z-index: 0 !important;
    }

    .hero-preview-image {
      display: none !important;
    }

    .hero-overlay {
      background:
        linear-gradient(90deg, rgba(255, 253, 247, 0.88) 0%, rgba(255, 248, 232, 0.68) 50%, rgba(255, 255, 255, 0.34) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 246, 220, 0.34)) !important;
    }

    .hero::before {
      opacity: 0.42 !important;
    }

    .hero::after {
      opacity: 0.45 !important;
    }

    @media (max-width: 620px) {
      .hero-video.hero-temp-video {
        opacity: 0.30 !important;
      }

      .hero-overlay {
        background:
          linear-gradient(180deg, rgba(255, 253, 247, 0.88), rgba(255, 248, 232, 0.72)) !important;
      }
    }



    /* =========================================================
       CURRENT EDUPATH HERO MEDIA — based on edupath.ca hero asset
       ========================================================= */
    .hero-video.hero-current-site-media {
      display: none !important;
    }

    .hero-preview-image.hero-current-preview {
      display: block !important;
      opacity: 0.36 !important;
      filter: saturate(0.92) sepia(0.08) brightness(1.05) contrast(1.02) !important;
      mix-blend-mode: multiply !important;
      transform-origin: center center;
      animation: heroCurrentMediaDrift 18s ease-in-out infinite alternate;
    }

    @keyframes heroCurrentMediaDrift {
      0% {
        transform: scale(1.02) translate3d(-0.8%, -0.6%, 0);
      }
      100% {
        transform: scale(1.09) translate3d(1.1%, 0.7%, 0);
      }
    }

    .hero-overlay {
      background:
        linear-gradient(90deg, rgba(255, 253, 247, 0.84) 0%, rgba(255, 248, 232, 0.64) 50%, rgba(255, 255, 255, 0.30) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 246, 220, 0.30)) !important;
    }

    @media (prefers-reduced-motion: reduce) {
      .hero-preview-image.hero-current-preview {
        animation: none !important;
      }
    }

    @media (max-width: 620px) {
      .hero-preview-image.hero-current-preview {
        opacity: 0.24 !important;
      }

      .hero-overlay {
        background:
          linear-gradient(180deg, rgba(255, 253, 247, 0.88), rgba(255, 248, 232, 0.72)) !important;
      }
    }

    /* =========================================================
       BORDERS — static translucent ring, no motion.
       An earlier version rotated this ring with a conic-gradient
       (motionRingSpin). Even correctly masked to the border, a
       rotating bright arc reads as a moving diagonal line/streak
       sweeping through the button or card, which is not wanted.
       This is now a fixed two-tone gradient ring — same soft
       depth, zero motion. Any "alive" feeling comes from the
       breathing glow below, which pulses uniformly and has no
       direction, so it never looks like a line.
       ========================================================= */
    .btn-primary,
    .btn-secondary,
    .consultation-card {
      position: relative;
      isolation: isolate;
      overflow: hidden;
    }

    .btn > * {
      position: relative;
      z-index: 1;
    }

    .consultation-card > .consultation-toggle,
    .consultation-card > .consultation-panel {
      position: relative;
      z-index: 1;
    }

    .btn-primary::before,
    .consultation-card::before {
      content: "";
      position: absolute;
      inset: 0;
      /* explicit resets: an older .btn::before sheen rule shares this
         pseudo-element slot and sets width/height/opacity — without
         resetting them here, that leftover 42%-wide / 1px-tall box
         survives and turns the ring into a stray diagonal sliver. */
      width: auto;
      height: auto;
      margin: 0;
      z-index: 0;
      border-radius: inherit;
      padding: 1.75px;
      /* a whisper of cool blue and warm lavender either side of the
         gold gives a soft prismatic edge like light catching real
         glass, without ever animating or sweeping across it */
      background: linear-gradient(135deg,
        rgba(190, 220, 255, 0.55) 0%,
        rgba(255, 255, 255, 0.95) 22%,
        var(--gold-soft) 50%,
        rgba(255, 255, 255, 0.7) 72%,
        rgba(220, 195, 255, 0.45) 100%
      );
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      mask-composite: exclude;
      opacity: 0.55;
      pointer-events: none;
      transition: opacity 0.4s ease;
    }

    .btn-primary:hover::before,
    .btn-primary:focus-visible::before,
    .btn-primary.is-loading::before {
      opacity: 0.9;
    }

    .consultation-card::before {
      background: linear-gradient(135deg,
        rgba(190, 220, 255, 0.5) 0%,
        rgba(255, 255, 255, 0.9) 22%,
        var(--gold) 48%,
        rgba(255, 255, 255, 0.6) 74%,
        rgba(220, 195, 255, 0.4) 100%
      );
      opacity: 0.3;
    }

    .consultation-card:focus-within::before,
    .consultation-card.is-active::before {
      opacity: 0.5;
    }

    /* Soft, uniform breathing glow — no direction, no sweep, so it
       never reads as a line. Animates `filter` (a separate paint
       layer) rather than box-shadow, so it can't strip or replace
       the card's own layered shadows set elsewhere. */
    @keyframes cardGlowBreathe {
      0%, 100% {
        filter: drop-shadow(0 0 0 rgba(243, 180, 33, 0));
      }
      50% {
        filter: drop-shadow(0 0 20px rgba(243, 180, 33, 0.22));
      }
    }

    .consultation-card.is-active {
      animation: cardGlowBreathe 3.6s ease-in-out infinite;
    }

    @media (prefers-reduced-motion: reduce) {
      .consultation-card.is-active {
        animation: none;
      }
    }

    /* Glossy specular highlight — sits behind content, above the ring.
       A concentrated bright patch near the top-left corner (like light
       catching a curved glass surface) reads as "glossy" far more than
       an even top-to-bottom fade does; it stays static, never sweeps. */
    .btn-primary::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      border-radius: inherit;
      background:
        radial-gradient(65% 90% at 24% -10%, rgba(255, 255, 255, 0.9), transparent 60%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.04) 40%, rgba(255, 255, 255, 0) 60%);
      pointer-events: none;
      mix-blend-mode: soft-light;
    }

    .consultation-card::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      border-radius: inherit;
      background:
        radial-gradient(55% 45% at 18% -6%, rgba(255, 255, 255, 0.85), transparent 62%),
        radial-gradient(40% 30% at 88% 106%, rgba(255, 255, 255, 0.3), transparent 65%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 35%);
      pointer-events: none;
      mix-blend-mode: soft-light;
    }

    .btn-secondary::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      border-radius: inherit;
      background: radial-gradient(60% 85% at 22% -8%, rgba(255, 255, 255, 0.85), transparent 60%);
      pointer-events: none;
      mix-blend-mode: soft-light;
    }

    /* =========================================================
       LIQUID SHIMMER — soft, slow, non-directional micro-motion.
       This is deliberately NOT a sweep/line/rotation: it only ever
       animates the existing specular-highlight layer's opacity and
       a tiny (2-3%) translate + scale of that same soft round patch,
       so the "light" gently breathes/drifts in place rather than
       traveling across the surface. Nothing here ever forms a hard
       edge or band — every layer already fades to transparent well
       before it would reach the element's border.
       ========================================================= */
    @keyframes glassShimmerDrift {
      0%, 100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.88;
      }
      50% {
        transform: translate(1.5%, 1%) scale(1.03);
        opacity: 1;
      }
    }

    .btn-primary::after {
      animation: glassShimmerDrift 6.5s ease-in-out infinite;
    }

    .btn-secondary::after {
      animation: glassShimmerDrift 7.5s ease-in-out infinite;
    }

    .consultation-card::after {
      animation: glassShimmerDrift 9s ease-in-out infinite;
    }

    @media (prefers-reduced-motion: reduce) {
      .btn-primary::after,
      .btn-secondary::after,
      .consultation-card::after {
        animation: none !important;
      }
    }

    /* =========================================================
       LIQUID GLASS — clear-acrylic reference match
       Modeled on a "liquid glass" UI board: crystal-clear surfaces
       (low fill opacity, not a milky frosted fill), a crisp bright
       rim at the top edge instead of a soft blended border, a
       strong soft shadow lifting each surface off the page, and a
       concentrated glossy highlight rather than an even sheen.
       Colored (primary) elements stay closer to full color, like
       the reference's red/blue buttons; neutral elements (card,
       secondary buttons, inputs, options) stay almost see-through
       and are defined mostly by their rim light and shadow.
       ========================================================= */
    .consultation-card {
      border-radius: 32px !important;
      background: linear-gradient(160deg, rgba(255, 255, 255, 0.40) 0%, rgba(255, 255, 255, 0.14) 50%, rgba(255, 255, 255, 0.24) 100%) !important;
      border: 1.5px solid rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(26px) saturate(1.7) !important;
      -webkit-backdrop-filter: blur(26px) saturate(1.7) !important;
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 1),
        inset 0 -20px 32px rgba(16, 37, 66, 0.045),
        0 44px 90px rgba(16, 37, 66, 0.20),
        0 14px 32px rgba(16, 37, 66, 0.10) !important;
    }

    .consultation-toggle {
      background: rgba(255, 255, 255, 0.10) !important;
      border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    }

    .consultation-card.is-open .consultation-toggle {
      border-bottom-color: rgba(16, 37, 66, 0.08);
    }

    /* Note: the elements below live INSIDE .consultation-card, which
       already has its own backdrop-filter. Giving them a second,
       nested backdrop-filter produced visible rectangular seams where
       the two blurred layers' compositing bounds met — so these get
       a translucent tint only, and let the card's blur do the work. */
    .toggle-icon {
      background: rgba(255, 255, 255, 0.6) !important;
      box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, 0.9), 0 6px 16px rgba(16, 37, 66, 0.1);
    }

    .btn {
      border-radius: 999px !important;
    }

    /* Primary CTA: closer to full brand color, like the reference's
       saturated red/blue glass buttons, with a bright top rim and a
       warm colored shadow instead of a neutral one. */
    .btn-primary {
      background: linear-gradient(165deg, #FFEAAA 0%, #FFC93C 48%, #F0A400 100%) !important;
      backdrop-filter: blur(14px) saturate(1.4);
      -webkit-backdrop-filter: blur(14px) saturate(1.4);
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.9),
        inset 0 -10px 18px rgba(170, 110, 0, 0.26),
        0 18px 36px rgba(243, 180, 33, 0.4),
        0 5px 12px rgba(243, 180, 33, 0.28) !important;
      transition: transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.25s ease, background 0.25s ease;
    }

    .btn-primary:hover {
      transform: translateY(-2px) scale(1.02);
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 1),
        inset 0 -10px 18px rgba(170, 110, 0, 0.3),
        0 22px 44px rgba(243, 180, 33, 0.46),
        0 6px 14px rgba(243, 180, 33, 0.32) !important;
    }

    .btn-primary:active {
      transform: translateY(0) scale(0.97);
    }

    /* Secondary CTA + "Explore Programs": almost fully clear, like
       the reference's white "Icon button" — defined by rim light
       and shadow rather than a visible fill. */
    .btn-secondary {
      background: rgba(255, 255, 255, 0.2) !important;
      border: 1.5px solid rgba(255, 255, 255, 0.85) !important;
      backdrop-filter: blur(20px) saturate(1.6);
      -webkit-backdrop-filter: blur(20px) saturate(1.6);
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.95),
        inset 0 -6px 14px rgba(16, 37, 66, 0.03),
        0 16px 32px rgba(16, 37, 66, 0.1) !important;
      transition: transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.25s ease, background 0.25s ease;
    }

    .btn-secondary:hover {
      transform: translateY(-2px) scale(1.02);
      background: rgba(255, 255, 255, 0.38) !important;
    }

    .btn-secondary:active {
      transform: translateY(0) scale(0.97);
    }

    /* Glass capsule text fields, matching the reference "Text Field"
       pill: clear fill, crisp top highlight, soft inner shadow. */
    .form-row input,
    .form-row select {
      border-radius: 18px !important;
      background: rgba(255, 255, 255, 0.32) !important;
      border: 1.5px solid rgba(255, 255, 255, 0.8) !important;
      box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, 0.95), inset 0 -4px 10px rgba(16, 37, 66, 0.035);
      transition: box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
    }

    .form-row input:focus,
    .form-row select:focus {
      background: rgba(255, 255, 255, 0.5) !important;
      border-color: rgba(243, 180, 33, 0.65) !important;
      box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 1),
        inset 0 -4px 10px rgba(16, 37, 66, 0.03),
        0 0 0 4px rgba(243, 180, 33, 0.16) !important;
    }

    /* Status / consultation options as glass "choice cards" — clear
       when unselected, filled with a warm glass tint + glow when
       chosen (the same language as the reference's colored buttons,
       scaled down for a smaller control). */
    .status-option,
    .consultation-option {
      border-radius: 20px !important;
      background: rgba(255, 255, 255, 0.18) !important;
      border: 1.5px solid rgba(255, 255, 255, 0.75) !important;
      box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 0.9),
        inset 0 -5px 12px rgba(16, 37, 66, 0.03),
        0 10px 22px rgba(16, 37, 66, 0.05);
      transition: transform 0.22s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.22s ease, background 0.22s ease, border-color 0.22s ease;
    }

    .status-option:hover,
    .consultation-option:hover {
      transform: translateY(-1px) scale(1.012);
      background: rgba(255, 255, 255, 0.32) !important;
      box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 1),
        inset 0 -5px 12px rgba(16, 37, 66, 0.04),
        0 12px 26px rgba(16, 37, 66, 0.08);
    }

    .status-option:active,
    .consultation-option:active {
      transform: translateY(0) scale(0.985);
    }

    .status-option:has(input:checked) {
      background: linear-gradient(160deg, rgba(255, 233, 168, 0.7), rgba(255, 201, 60, 0.42)) !important;
      border-color: rgba(255, 201, 60, 0.9) !important;
      box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 0.95),
        inset 0 -5px 12px rgba(180, 120, 0, 0.1),
        0 14px 28px rgba(243, 180, 33, 0.3);
    }

    .eligibility-note {
      border-radius: 20px !important;
      background: rgba(255, 255, 255, 0.16) !important;
    }

    /* Bug fix: ".hero .form-row input" (meant for text inputs) sets
       min-height: 42px and, since radios live inside a .form-row too,
       that clamped each radio's native control to 15px wide by 42px
       tall — an invisible tall hit-box that painted as a faint pale
       rectangle above the visible circle. Radios/checkboxes get their
       own square sizing back here. */
    .hero .status-option input,
    .status-option input {
      min-height: 0 !important;
      height: 16px !important;
      width: 16px !important;
    }

    .program-category-card,
    .journey-card,
    details {
      background: rgba(255, 255, 255, 0.22) !important;
      backdrop-filter: blur(22px) saturate(1.5) !important;
      -webkit-backdrop-filter: blur(22px) saturate(1.5) !important;
      box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 0.85),
        0 16px 36px rgba(16, 37, 66, 0.08) !important;
    }

    @media (max-width: 620px) {
      .consultation-card,
      .btn-secondary,
      .program-category-card,
      .journey-card,
      details {
        backdrop-filter: blur(16px) saturate(1.3) !important;
        -webkit-backdrop-filter: blur(16px) saturate(1.3) !important;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .btn-primary:hover,
      .btn-secondary:hover,
      .status-option:hover,
      .consultation-option:hover {
        transform: none !important;
      }
    }

    /* =========================================================
       SCROLL REVEAL — gentle fade + rise on scroll into view
       ========================================================= */
    [data-reveal] {
      opacity: 0;
      transform: translateY(22px);
      transition: opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1), transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
    }

    [data-reveal].is-visible {
      opacity: 1;
      transform: translateY(0);
    }

    /* opacity-only variant for elements that already animate `transform` on hover/state */
    [data-reveal-fade] {
      opacity: 0;
      transition: opacity 0.6s ease;
    }

    [data-reveal-fade].is-visible {
      opacity: 1;
    }

    .form-row.is-complete label::after {
      content: "\2713";
      margin-inline-start: 6px;
      color: #2FA167;
      font-weight: 900;
    }

    /* =========================================================
       SMART FORM — progress, field states, loading/success
       ========================================================= */
    /* Hidden until the user has started filling the form — an empty
       0%-filled track with no label used to read as a stray line
       floating under the card title, so it now only appears once
       it actually has something to say. */
    .form-progress {
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      column-gap: 10px;
      max-height: 0;
      opacity: 0;
      margin-bottom: 0;
      overflow: hidden;
      transition: max-height 0.35s ease, opacity 0.3s ease, margin-bottom 0.35s ease;
    }

    .form-progress.is-active {
      max-height: 30px;
      opacity: 1;
      margin-bottom: 6px;
    }

    .form-progress-track {
      height: 6px;
      border-radius: 999px;
      background: rgba(16, 37, 66, 0.08);
      box-shadow: inset 0 1px 2px rgba(16, 37, 66, 0.12);
      overflow: hidden;
    }

    .form-progress-fill {
      height: 100%;
      width: 0%;
      border-radius: inherit;
      background: linear-gradient(90deg, var(--navy), var(--gold));
      transition: width 0.4s ease;
    }

    .form-progress-label {
      flex-shrink: 0;
      font-size: 11.5px;
      font-weight: 700;
      color: var(--muted);
      text-align: right;
      white-space: nowrap;
    }

    html[dir="rtl"] .form-progress-label {
      text-align: left;
    }

    .field-error {
      display: block;
      font-size: 12px;
      font-weight: 700;
      line-height: 1.4;
      color: #B4530A;
      opacity: 0;
      max-height: 0;
      overflow: hidden;
      transition: opacity 0.25s ease, max-height 0.25s ease, margin-top 0.25s ease;
    }

    .field-error:not(:empty) {
      opacity: 1;
      max-height: 40px;
      margin-top: 4px;
    }

    .form-row input.is-invalid {
      border-color: rgba(196, 68, 12, 0.55) !important;
      box-shadow: 0 0 0 4px rgba(196, 68, 12, 0.10) !important;
    }

    .form-row input.is-valid {
      border-color: rgba(52, 140, 90, 0.5) !important;
    }

    .status-options.is-invalid .status-option {
      border-color: rgba(196, 68, 12, 0.4);
    }

    .btn-spinner {
      display: none;
      width: 15px;
      height: 15px;
      margin-inline-end: 2px;
      border-radius: 50%;
      border: 2px solid rgba(27, 36, 48, 0.25);
      border-top-color: currentColor;
      vertical-align: -3px;
      animation: btnSpin 0.7s linear infinite;
    }

    .js-submit-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }

    .js-submit-btn.is-loading {
      pointer-events: none;
      opacity: 0.94;
    }

    .js-submit-btn.is-loading .btn-spinner {
      display: inline-block;
    }

    .js-submit-btn.is-success {
      background: linear-gradient(135deg, #7BD79E 0%, #2FA167 100%);
      color: #FFFFFF;
      border-color: rgba(47, 161, 103, 0.4);
    }

    @keyframes btnSpin {
      to {
        transform: rotate(360deg);
      }
    }

    .form-success {
      display: none;
      padding: 12px 14px;
      border-radius: 14px;
      background: rgba(47, 161, 103, 0.10);
      border: 1px solid rgba(47, 161, 103, 0.30);
      color: #1E6B45;
      font-size: 13px;
      font-weight: 700;
      line-height: 1.5;
      text-align: center;
    }

    .form-success.is-visible {
      display: block;
    }


    .js-submit-btn.is-success {
      box-shadow:
        0 14px 34px rgba(47, 161, 103, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.34);
    }

    .form-success {
      position: relative;
      overflow: hidden;
      padding: 0;
      border: none;
      background: transparent;
      box-shadow: none;
      text-align: initial;
    }

    .form-success.is-visible {
      display: block;
      animation: successCardIn 0.55s cubic-bezier(.22, 1, .36, 1);
    }

    .success-panel {
      position: relative;
      padding: 18px;
      border-radius: 20px;
      border: 1px solid rgba(47, 161, 103, 0.22);
      background:
        radial-gradient(circle at top right, rgba(123, 215, 158, 0.22), transparent 30%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(245, 255, 249, 0.92));
      box-shadow:
        0 18px 48px rgba(47, 161, 103, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.7);
      color: var(--text);
      isolation: isolate;
    }

    .success-panel::before,
    .success-panel::after {
      content: "";
      position: absolute;
      width: 132px;
      height: 132px;
      border-radius: 50%;
      pointer-events: none;
      opacity: 0.36;
      z-index: -1;
      filter: blur(10px);
    }

    .success-panel::before {
      inset-inline-end: -28px;
      top: -28px;
      background: radial-gradient(circle, rgba(243, 180, 33, 0.42), transparent 66%);
    }

    .success-panel::after {
      inset-inline-start: -26px;
      bottom: -34px;
      background: radial-gradient(circle, rgba(47, 161, 103, 0.24), transparent 66%);
    }

    .success-burst {
      position: absolute;
      inset: 0;
      pointer-events: none;
      opacity: 0.9;
    }

    .success-burst span {
      position: absolute;
      width: 8px;
      height: 8px;
      border-radius: 999px;
      background: linear-gradient(135deg, #FFE38A, #7BD79E);
      box-shadow: 0 0 0 3px rgba(255,255,255,0.38);
      animation: successFloat 2.8s ease-in-out infinite;
    }

    .success-burst span:nth-child(1) { top: 16px; inset-inline-end: 56px; animation-delay: 0s; }
    .success-burst span:nth-child(2) { top: 54px; inset-inline-end: 18px; width: 6px; height: 6px; animation-delay: .4s; }
    .success-burst span:nth-child(3) { bottom: 26px; inset-inline-end: 42px; width: 10px; height: 10px; animation-delay: .8s; }

    .success-head {
      display: grid;
      grid-template-columns: 52px minmax(0, 1fr);
      gap: 14px;
      align-items: start;
      margin-bottom: 14px;
    }

    .success-icon {
      width: 52px;
      height: 52px;
      border-radius: 18px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: linear-gradient(135deg, #7BD79E 0%, #2FA167 100%);
      color: #FFFFFF;
      box-shadow: 0 12px 30px rgba(47, 161, 103, 0.22);
      font-size: 26px;
      font-weight: 900;
      line-height: 1;
    }

    .success-title {
      display: block;
      font-size: 18px;
      line-height: 1.25;
      font-weight: 900;
      color: var(--navy);
      margin-bottom: 5px;
    }

    .success-text {
      font-size: 13.5px;
      line-height: 1.65;
      color: var(--muted);
      margin: 0;
    }

    .success-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin: 14px 0 16px;
    }

    .success-pill {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 11px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.72);
      border: 1px solid rgba(16, 37, 66, 0.08);
      color: var(--navy);
      font-size: 11.5px;
      font-weight: 800;
      line-height: 1;
      box-shadow: 0 10px 24px rgba(16, 37, 66, 0.05);
    }

    .success-pill::before {
      content: "✦";
      color: var(--gold);
      font-size: 11px;
      line-height: 1;
    }

    .success-next-label {
      display: block;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: #2FA167;
      margin-bottom: 10px;
    }

    .success-actions {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .success-action {
      display: grid;
      grid-template-columns: 32px minmax(0, 1fr);
      gap: 10px;
      align-items: center;
      padding: 12px 13px;
      border-radius: 16px;
      border: 1px solid rgba(16, 37, 66, 0.12);
      background: rgba(255, 255, 255, 0.88);
      text-decoration: none;
      transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
      box-shadow: 0 12px 24px rgba(16, 37, 66, 0.05);
    }

    .success-action:hover {
      transform: translateY(-2px);
      border-color: rgba(243, 180, 33, 0.36);
      box-shadow: 0 18px 34px rgba(16, 37, 66, 0.08);
    }

    .success-action--primary {
      background: linear-gradient(135deg, rgba(255, 245, 214, 0.96), rgba(255, 255, 255, 0.92));
      border-color: rgba(243, 180, 33, 0.34);
    }

    .success-action-icon {
      width: 32px;
      height: 32px;
      border-radius: 12px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: rgba(16, 37, 66, 0.06);
      color: var(--navy);
      font-size: 16px;
    }

    .success-action--primary .success-action-icon {
      background: linear-gradient(135deg, #FFE38A, #FFC229);
      color: #2A2108;
    }

    .success-action strong {
      display: block;
      font-size: 13px;
      line-height: 1.25;
      color: var(--navy);
      margin-bottom: 2px;
      font-weight: 900;
    }

    .success-action small {
      display: block;
      color: var(--muted);
      font-size: 11.5px;
      line-height: 1.4;
      font-weight: 600;
    }

    .success-note {
      margin-top: 12px;
      font-size: 11.5px;
      line-height: 1.5;
      color: var(--muted);
      text-align: center;
    }

    .success-note strong {
      color: var(--navy);
    }

    @keyframes successCardIn {
      from { opacity: 0; transform: translateY(14px) scale(0.98); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    @keyframes successFloat {
      0%, 100% { transform: translateY(0) scale(1); opacity: 0.85; }
      50% { transform: translateY(-8px) scale(1.08); opacity: 1; }
    }

    @media (max-width: 620px) {
      .success-head {
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 12px;
      }

      .success-icon {
        width: 46px;
        height: 46px;
        border-radius: 16px;
        font-size: 23px;
      }

      .success-title {
        font-size: 16px;
      }

      .success-actions {
        grid-template-columns: 1fr;
      }
    }



    body.consultation-modal-open #consultationCard.is-success-state .inline-form {
      display: block !important;
      min-height: 100%;
    }

    body.consultation-modal-open #consultationCard.is-success-state .inline-form > *:not(.form-success) {
      display: none !important;
    }

    body.consultation-modal-open #consultationCard.is-success-state .form-success,
    body.consultation-modal-open #consultationCard.is-success-state .form-success.is-visible {
      display: block !important;
      margin: 0 !important;
      padding: 0 !important;
      grid-column: auto !important;
      max-width: none !important;
    }

    body.consultation-modal-open #consultationCard.is-success-state .consultation-toggle {
      padding-bottom: 18px;
    }

    body.consultation-modal-open #consultationCard.is-success-state .toggle-icon {
      opacity: 0;
      transform: scale(0.7);
      pointer-events: none;
    }

    .success-panel.success-panel--celebration {
      padding: 24px !important;
      border-radius: 28px;
      border: 1px solid rgba(71, 176, 113, 0.22);
      background:
        radial-gradient(circle at top left, rgba(255, 232, 165, 0.55), transparent 28%),
        radial-gradient(circle at bottom right, rgba(118, 216, 160, 0.24), transparent 36%),
        linear-gradient(165deg, rgba(255,255,255,0.98), rgba(248,255,250,0.95));
      box-shadow:
        0 24px 60px rgba(26, 92, 60, 0.10),
        inset 0 1px 0 rgba(255,255,255,0.86);
    }

    .success-confetti {
      position: absolute;
      inset: 0;
      overflow: hidden;
      pointer-events: none;
    }

    .success-confetti span,
    .success-sparkles span {
      position: absolute;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      line-height: 1;
      pointer-events: none;
    }

    .success-confetti span {
      width: 10px;
      height: 20px;
      border-radius: 999px;
      opacity: 0.95;
      animation: confettiDrop 2.8s cubic-bezier(.22,.61,.36,1) infinite;
      transform-origin: center;
    }

    .success-confetti span:nth-child(1) { inset-inline-start: 12%; top: 10%; background: #FFE38A; animation-delay: 0s; }
    .success-confetti span:nth-child(2) { inset-inline-start: 24%; top: 2%; background: #2FA167; height: 16px; animation-delay: .45s; }
    .success-confetti span:nth-child(3) { inset-inline-end: 22%; top: 8%; background: #F3B421; animation-delay: .9s; }
    .success-confetti span:nth-child(4) { inset-inline-end: 10%; top: 16%; background: #8ED7AB; height: 14px; animation-delay: 1.25s; }
    .success-confetti span:nth-child(5) { left: 50%; top: 4%; background: #D9F3E4; height: 12px; animation-delay: .65s; }

    .success-sparkles {
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .success-sparkles span {
      color: #F3B421;
      font-size: 18px;
      text-shadow: 0 0 18px rgba(243,180,33,0.28);
      animation: sparklePulse 1.9s ease-in-out infinite;
    }

    .success-sparkles span:nth-child(1) { top: 18px; inset-inline-start: 18px; animation-delay: 0s; }
    .success-sparkles span:nth-child(2) { top: 44px; inset-inline-end: 30px; font-size: 14px; animation-delay: .5s; }
    .success-sparkles span:nth-child(3) { bottom: 94px; inset-inline-start: 42px; font-size: 12px; animation-delay: 1s; }
    .success-sparkles span:nth-child(4) { bottom: 38px; inset-inline-end: 56px; font-size: 16px; animation-delay: 1.4s; }

    .success-hero {
      text-align: center;
      padding: 10px 6px 2px;
      margin-bottom: 14px;
    }

    .success-check-wrap {
      position: relative;
      width: 88px;
      height: 88px;
      margin: 0 auto 14px;
    }

    .success-check-wrap::before {
      content: "";
      position: absolute;
      inset: 10px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(123,215,158,0.32), transparent 72%);
      animation: haloPulse 2s ease-in-out infinite;
    }

    .success-check {
      position: relative;
      width: 88px;
      height: 88px;
      border-radius: 30px;
      background: linear-gradient(135deg, #8FE0AE 0%, #38AF72 100%);
      color: #fff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 40px;
      font-weight: 900;
      box-shadow: 0 18px 38px rgba(56, 175, 114, 0.28);
    }

    .success-badge-line {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 10px;
      padding: 8px 14px;
      border-radius: 999px;
      background: rgba(255,255,255,0.85);
      border: 1px solid rgba(16,37,66,0.08);
      color: #2FA167;
      font-size: 12px;
      font-weight: 900;
      box-shadow: 0 10px 22px rgba(16,37,66,0.05);
    }

    .success-badge-line::before,
    .success-badge-line::after {
      content: "✦";
      color: #F3B421;
      font-size: 11px;
    }

    .success-main-title {
      margin: 0 0 10px;
      color: var(--navy);
      font-size: clamp(24px, 3vw, 30px);
      line-height: 1.18;
      letter-spacing: -0.03em;
      font-weight: 900;
    }

    .success-main-text {
      margin: 0 auto;
      max-width: 490px;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.8;
    }

    .success-summary-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      margin: 18px 0;
    }

    .success-summary-card {
      padding: 14px 12px;
      border-radius: 18px;
      background: rgba(255,255,255,0.8);
      border: 1px solid rgba(16,37,66,0.08);
      text-align: center;
      box-shadow: 0 12px 24px rgba(16,37,66,0.04);
    }

    .success-summary-card strong {
      display: block;
      color: var(--navy);
      font-size: 13px;
      line-height: 1.35;
      font-weight: 900;
      margin-bottom: 4px;
    }

    .success-summary-card small {
      display: block;
      color: var(--muted);
      font-size: 11.5px;
      line-height: 1.55;
      font-weight: 600;
    }

    .success-timeline {
      display: grid;
      gap: 10px;
      margin-top: 8px;
    }

    .success-step-row {
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr);
      gap: 12px;
      align-items: start;
      padding: 12px 14px;
      border-radius: 18px;
      background: rgba(255,255,255,0.74);
      border: 1px solid rgba(16,37,66,0.07);
      box-shadow: 0 10px 22px rgba(16,37,66,0.04);
    }

    .success-step-no {
      width: 36px;
      height: 36px;
      border-radius: 12px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: linear-gradient(135deg, #FFE38A, #FFC229);
      color: #2A2108;
      font-size: 14px;
      font-weight: 900;
      box-shadow: 0 10px 22px rgba(243,180,33,0.20);
    }

    .success-step-row strong {
      display: block;
      color: var(--navy);
      font-size: 13px;
      line-height: 1.4;
      font-weight: 900;
      margin-bottom: 3px;
    }

    .success-step-row small {
      display: block;
      color: var(--muted);
      font-size: 11.5px;
      line-height: 1.6;
      font-weight: 600;
    }

    .success-footnote {
      margin-top: 14px;
      padding-top: 14px;
      border-top: 1px dashed rgba(16,37,66,0.10);
      color: var(--muted);
      font-size: 12px;
      line-height: 1.7;
      text-align: center;
    }

    .success-footnote strong {
      color: var(--navy);
    }

    @keyframes confettiDrop {
      0% { transform: translateY(-10px) rotate(0deg); opacity: 0; }
      15% { opacity: 1; }
      100% { transform: translateY(54px) rotate(220deg); opacity: 0; }
    }

    @keyframes sparklePulse {
      0%, 100% { transform: scale(0.8) rotate(0deg); opacity: 0.45; }
      50% { transform: scale(1.15) rotate(12deg); opacity: 1; }
    }

    @keyframes haloPulse {
      0%, 100% { transform: scale(0.92); opacity: 0.65; }
      50% { transform: scale(1.06); opacity: 1; }
    }

    @media (max-width: 820px) {
      .success-summary-grid {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 620px) {
      .success-panel.success-panel--celebration {
        padding: 18px !important;
        border-radius: 22px;
      }

      .success-check-wrap,
      .success-check {
        width: 74px;
        height: 74px;
      }

      .success-check {
        border-radius: 24px;
        font-size: 34px;
      }

      .success-main-title {
        font-size: 22px;
      }

      .success-main-text {
        font-size: 14px;
        line-height: 1.72;
      }

      .success-step-row {
        grid-template-columns: 32px minmax(0, 1fr);
      }

      .success-step-no {
        width: 32px;
        height: 32px;
        border-radius: 11px;
        font-size: 13px;
      }
    }
    @media (prefers-reduced-motion: reduce) {
      .btn-spinner {
        animation: none !important;
      }

      [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
      }
    }

    /* =========================================================
       BUTTON POLISH — press state + accessible focus ring
       ========================================================= */
    .btn {
      transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.2s ease, opacity 0.2s ease;
    }

    .btn-primary:active {
      transform: translateY(0) scale(0.97);
    }

    .btn-secondary:active {
      transform: translateY(0) scale(0.97);
    }

    .btn:focus-visible {
      outline: 2px solid rgba(16, 37, 66, 0.55);
      outline-offset: 3px;
    }

    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    summary:focus-visible {
      outline: 2px solid rgba(16, 37, 66, 0.55);
      outline-offset: 2px;
    }

    /* =========================================================
       LANDING ENTRANCE — calm, staggered fade/rise on first paint.
       Hero content is above the fold, so this runs immediately on
       load rather than waiting on IntersectionObserver; the scroll
       reveal system above continues to handle everything below.
       ========================================================= */
    @keyframes heroEnterRise {
      from {
        opacity: 0;
        transform: translateY(16px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @keyframes heroEnterCard {
      from {
        opacity: 0;
        transform: translateY(24px);
        filter: blur(8px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
      }
    }

    .hero .eyebrow {
      animation: heroEnterRise 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) both;
    }

    .hero h1 {
      animation: heroEnterRise 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.12s both;
    }

    .hero-copy p {
      animation: heroEnterRise 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.24s both;
    }

    .hero-actions {
      animation: heroEnterRise 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.36s both;
    }

    .hero .consultation-card {
      animation: heroEnterCard 1s cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s both;
    }

    @media (prefers-reduced-motion: reduce) {
      .hero .eyebrow,
      .hero h1,
      .hero-copy p,
      .hero-actions,
      .hero .consultation-card {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
      }
    }

    /* Bug fix: ".hero .consultation-card" above sets the one-shot
       load-in animation (heroEnterCard). Since ".consultation-card
       .is-active" (the breathing-glow trigger) has equal specificity,
       whichever rule is declared LAST wins the whole `animation`
       shorthand — so without this, the glow could never start once
       the entrance animation rule "claimed" the property. Redeclaring
       it here, after the entrance rule, lets the glow take over once
       the user starts interacting (well after the one-shot entrance
       has already finished and is holding its resting state). */
    .consultation-card.is-active {
      animation: cardGlowBreathe 3.6s ease-in-out infinite;
    }

    @media (prefers-reduced-motion: reduce) {
      .consultation-card.is-active {
        animation: none !important;
      }
    }



    /* =========================================================
       FINAL FIX — mask-free shiny CTA buttons
       The previous CodePen-style version used pseudo-elements + CSS masks.
       In some embedded previews those masks can fail and appear as a stray
       floating line. This version keeps the animated shiny border but removes
       all mask/pseudo-element rendering from the buttons.
       ========================================================= */

    @property --edupath-button-angle {
      syntax: "<angle>";
      initial-value: 0deg;
      inherits: false;
    }

    .btn-primary,
    .btn-secondary,
    .hero .btn-secondary {
      --edupath-button-angle: 0deg;
      position: relative !important;
      isolation: isolate;
      overflow: hidden !important;
      border: 1.5px solid transparent !important;
      border-radius: 999px !important;
      background-origin: border-box !important;
      background-clip: padding-box, border-box !important;
      animation: edupathButtonBorderSpin 4.8s linear infinite;
      transform: translateZ(0);
      backface-visibility: hidden;
      -webkit-mask: none !important;
      mask: none !important;
      clip-path: inset(0 round 999px);
    }

    /* Disable every old button pseudo-element, including the previous
       masked ring and the earlier 1px top sheen that looked like a loose line. */
    .btn-primary::before,
    .btn-primary::after,
    .btn-secondary::before,
    .btn-secondary::after,
    .hero .btn-secondary::before,
    .hero .btn-secondary::after {
      content: none !important;
      display: none !important;
      width: 0 !important;
      height: 0 !important;
      opacity: 0 !important;
      animation: none !important;
      background: none !important;
      -webkit-mask: none !important;
      mask: none !important;
    }

    .btn-primary {
      color: #2A2108 !important;
      background:
        radial-gradient(95% 120% at 24% 0%, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0) 52%) padding-box,
        linear-gradient(135deg, #FFECA8 0%, #FFC229 46%, #F3A900 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 206, 70, 0.62) 0deg,
          rgba(255, 206, 70, 0.62) 78deg,
          rgba(255, 255, 255, 0.98) 112deg,
          rgba(255, 231, 150, 0.96) 136deg,
          rgba(243, 180, 33, 0.92) 168deg,
          rgba(255, 206, 70, 0.62) 206deg,
          rgba(255, 206, 70, 0.62) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -9px 18px rgba(155, 98, 0, 0.16),
        0 12px 28px rgba(255, 194, 41, 0.26),
        0 0 22px rgba(255, 194, 41, 0.16) !important;
    }

    .btn-secondary,
    .hero .btn-secondary {
      color: #2A2108 !important;
      background:
        radial-gradient(100% 130% at 24% -8%, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0) 58%) padding-box,
        linear-gradient(160deg, rgba(255, 255, 255, 0.74), rgba(255, 248, 228, 0.44)) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 220, 120, 0.42) 0deg,
          rgba(255, 220, 120, 0.42) 84deg,
          rgba(255, 255, 255, 0.96) 116deg,
          rgba(255, 232, 160, 0.82) 150deg,
          rgba(231, 167, 0, 0.58) 184deg,
          rgba(255, 220, 120, 0.42) 220deg,
          rgba(255, 220, 120, 0.42) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.80),
        0 10px 24px rgba(171, 119, 0, 0.09),
        0 0 18px rgba(255, 194, 41, 0.10) !important;
      -webkit-backdrop-filter: blur(16px);
      backdrop-filter: blur(16px);
    }

    .btn-primary:hover,
    .btn-primary:focus-visible,
    .btn-secondary:hover,
    .btn-secondary:focus-visible,
    .hero .btn-secondary:hover,
    .hero .btn-secondary:focus-visible {
      transform: translateY(-2px) translateZ(0) !important;
      animation-duration: 2.6s;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.88),
        inset 0 -10px 18px rgba(155, 98, 0, 0.16),
        0 16px 34px rgba(255, 194, 41, 0.30),
        0 0 26px rgba(255, 218, 120, 0.22) !important;
    }

    .btn-primary:active,
    .btn-secondary:active,
    .hero .btn-secondary:active {
      transform: translateY(0) scale(0.98) translateZ(0) !important;
    }

    .js-submit-btn.is-success {
      color: #FFFFFF !important;
      background:
        radial-gradient(95% 120% at 24% 0%, rgba(255, 255, 255, 0.50), rgba(255, 255, 255, 0) 52%) padding-box,
        linear-gradient(135deg, #7BD79E 0%, #2FA167 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(123, 215, 158, 0.72),
          rgba(255, 255, 255, 0.92),
          rgba(47, 161, 103, 0.88),
          rgba(123, 215, 158, 0.72)
        ) border-box !important;
    }

    @keyframes edupathButtonBorderSpin {
      to { --edupath-button-angle: 360deg; }
    }

    @media (prefers-reduced-motion: reduce) {
      .btn-primary,
      .btn-secondary,
      .hero .btn-secondary {
        animation: none !important;
      }
    }



    /* =========================================================
       HERO FORM MODAL — form removed from hero/right column
       Opens as a centered glass popup from Start Free Guidance.
       ========================================================= */
    .hero .container.hero-grid,
    .hero-grid {
      grid-template-columns: minmax(0, 1fr) !important;
      gap: 0 !important;
    }

    .hero .hero-copy {
      max-width: min(720px, 100%) !important;
      position: relative;
      z-index: 4;
    }

    .consultation-modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 9997;
      background:
        radial-gradient(circle at 50% 38%, rgba(255, 224, 137, 0.18), transparent 28%),
        rgba(16, 37, 66, 0.28);
      -webkit-backdrop-filter: blur(13px) saturate(1.15);
      backdrop-filter: blur(13px) saturate(1.15);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity 0.28s ease, visibility 0.28s ease;
    }

    body.consultation-modal-open {
      overflow: hidden;
    }

    body.consultation-modal-open .consultation-modal-backdrop {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    /* Modal is appended to <body> by JS so it can sit above the blur layer. */
    body > .consultation-modal-backdrop {
      z-index: 9997 !important;
    }

    body > #consultationCard.consultation-card {
      z-index: 9998 !important;
    }

    #consultationCard.consultation-card,
    .hero #consultationCard.consultation-card {
      position: fixed !important;
      top: 50% !important;
      left: 50% !important;
      right: auto !important;
      bottom: auto !important;
      width: min(430px, calc(100vw - 32px)) !important;
      max-width: min(430px, calc(100vw - 32px)) !important;
      max-height: calc(100dvh - 32px) !important;
      margin: 0 !important;
      z-index: 9998 !important;
      opacity: 0 !important;
      visibility: hidden !important;
      pointer-events: none !important;
      overflow-y: auto !important;
      transform: translate(-50%, calc(-50% + 22px)) scale(0.96) !important;
      transition:
        opacity 0.28s ease,
        visibility 0.28s ease,
        transform 0.34s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
      animation: none !important;
      overscroll-behavior: contain;
    }

    body.consultation-modal-open #consultationCard.consultation-card {
      opacity: 1 !important;
      visibility: visible !important;
      pointer-events: auto !important;
      transform: translate(-50%, -50%) scale(1) !important;
    }

    body.consultation-modal-open #consultationCard .consultation-panel {
      max-height: none !important;
      overflow: visible !important;
    }

    body.consultation-modal-open #consultationCard .consultation-toggle {
      cursor: default;
      padding-inline-end: 62px !important;
    }

    body.consultation-modal-open #consultationCard .toggle-icon {
      display: none !important;
    }

    .consultation-modal-close {
      position: absolute;
      top: 18px;
      inset-inline-end: 18px;
      z-index: 10;
      width: 38px;
      height: 38px;
      border: 1.5px solid rgba(255, 255, 255, 0.82);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.26);
      color: var(--text);
      font-size: 26px;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      -webkit-backdrop-filter: blur(16px) saturate(1.4);
      backdrop-filter: blur(16px) saturate(1.4);
      box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 0.9),
        0 10px 24px rgba(16, 37, 66, 0.12);
      transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
    }

    .consultation-modal-close:hover {
      transform: translateY(-1px) scale(1.04);
      background: rgba(255, 255, 255, 0.42);
      box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 1),
        0 13px 28px rgba(16, 37, 66, 0.16);
    }

    /* Floating bubble motion only for the main hero CTA. */
    .hero-actions .js-open-consultation.btn-primary {
      animation:
        edupathButtonBorderSpin 4.8s linear infinite,
        heroGuidanceBubbleFloat 4.6s ease-in-out infinite !important;
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.92),
        inset 0 -10px 18px rgba(170, 110, 0, 0.24),
        0 22px 44px rgba(243, 180, 33, 0.44),
        0 0 44px rgba(255, 205, 74, 0.28) !important;
      will-change: translate, box-shadow;
    }

    @keyframes heroGuidanceBubbleFloat {
      0%, 100% {
        translate: 0 0;
        box-shadow:
          inset 0 2px 0 rgba(255, 255, 255, 0.92),
          inset 0 -10px 18px rgba(170, 110, 0, 0.24),
          0 22px 44px rgba(243, 180, 33, 0.42),
          0 0 36px rgba(255, 205, 74, 0.22);
      }
      50% {
        translate: 0 -9px;
        box-shadow:
          inset 0 2px 0 rgba(255, 255, 255, 1),
          inset 0 -10px 18px rgba(170, 110, 0, 0.20),
          0 30px 58px rgba(243, 180, 33, 0.52),
          0 0 58px rgba(255, 205, 74, 0.34);
      }
    }

    @media (max-width: 620px) {
      #consultationCard.consultation-card,
      .hero #consultationCard.consultation-card {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        max-height: calc(100dvh - 20px) !important;
      }

      body.consultation-modal-open #consultationCard .consultation-toggle {
        padding: 22px 56px 20px 20px !important;
      }

      html[dir="rtl"] body.consultation-modal-open #consultationCard .consultation-toggle {
        padding: 22px 20px 20px 56px !important;
      }

      .consultation-modal-close {
        top: 14px;
        inset-inline-end: 14px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .consultation-modal-backdrop,
      #consultationCard.consultation-card,
      .hero #consultationCard.consultation-card,
      .hero-actions .js-open-consultation.btn-primary {
        transition: none !important;
        animation: none !important;
        translate: 0 0 !important;
      }
    }


    /* =========================================================
       PROFESSIONAL MODAL POLISH — clean, readable popup layout
       Fixes the overly blurry/tall glass card appearance.
       ========================================================= */
    body.consultation-modal-open .consultation-modal-backdrop {
      background:
        radial-gradient(circle at 52% 28%, rgba(255, 210, 88, 0.20), transparent 32%),
        rgba(8, 20, 38, 0.42) !important;
      -webkit-backdrop-filter: blur(5px) saturate(1.05) !important;
      backdrop-filter: blur(5px) saturate(1.05) !important;
    }

    body.consultation-modal-open #consultationCard.consultation-card,
    body.consultation-modal-open .hero #consultationCard.consultation-card {
      width: min(860px, calc(100vw - 48px)) !important;
      max-width: min(860px, calc(100vw - 48px)) !important;
      max-height: min(720px, calc(100dvh - 54px)) !important;
      display: grid !important;
      grid-template-columns: minmax(260px, 0.85fr) minmax(360px, 1.15fr) !important;
      align-items: stretch !important;
      overflow: hidden !important;
      border-radius: 32px !important;
      border: 1px solid rgba(255, 214, 104, 0.58) !important;
      background: rgba(255, 255, 255, 0.96) !important;
      -webkit-backdrop-filter: blur(22px) saturate(1.08) !important;
      backdrop-filter: blur(22px) saturate(1.08) !important;
      box-shadow:
        0 34px 90px rgba(8, 20, 38, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.58) inset,
        0 0 44px rgba(243, 180, 33, 0.18) !important;
    }

    body.consultation-modal-open #consultationCard.consultation-card::before,
    body.consultation-modal-open #consultationCard.consultation-card::after,
    body.consultation-modal-open .hero #consultationCard.consultation-card::before,
    body.consultation-modal-open .hero #consultationCard.consultation-card::after {
      display: none !important;
      content: none !important;
    }

    body.consultation-modal-open #consultationCard .consultation-toggle {
      grid-column: 1 !important;
      min-height: 100% !important;
      height: auto !important;
      padding: 44px 34px 34px !important;
      cursor: default !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: flex-start !important;
      justify-content: space-between !important;
      gap: 28px !important;
      text-align: left !important;
      border: none !important;
      background:
        radial-gradient(circle at 20% 12%, rgba(255, 255, 255, 0.92), transparent 24%),
        radial-gradient(circle at 82% 18%, rgba(255, 211, 88, 0.40), transparent 30%),
        linear-gradient(145deg, #FFF7DF 0%, #FFFFFF 56%, #F7FAFF 100%) !important;
      box-shadow: none !important;
    }

    html[dir="rtl"] body.consultation-modal-open #consultationCard .consultation-toggle {
      text-align: right !important;
      align-items: flex-start !important;
    }

    body.consultation-modal-open #consultationCard .consultation-toggle span:first-child {
      display: block !important;
      width: 100% !important;
    }

    body.consultation-modal-open #consultationCard .consultation-toggle strong {
      font-size: clamp(28px, 3vw, 38px) !important;
      line-height: 1.04 !important;
      letter-spacing: -0.055em !important;
      color: #102542 !important;
      max-width: 260px !important;
      margin: 0 0 12px !important;
    }

    body.consultation-modal-open #consultationCard .consultation-toggle small {
      font-size: 14px !important;
      line-height: 1.55 !important;
      color: rgba(16, 37, 66, 0.70) !important;
      font-weight: 800 !important;
      max-width: 270px !important;
    }

    body.consultation-modal-open #consultationCard .consultation-toggle::after {
      content: "Quick assessment\A Free consultation\A Ontario-focused guidance";
      white-space: pre-line;
      display: block;
      width: 100%;
      margin-top: auto;
      padding: 18px 18px 18px 20px;
      border-radius: 22px;
      color: rgba(16, 37, 66, 0.78);
      font-size: 13px;
      line-height: 1.9;
      font-weight: 900;
      background: rgba(255, 255, 255, 0.72);
      border: 1px solid rgba(243, 180, 33, 0.26);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92);
    }

    html[dir="fa"] body.consultation-modal-open #consultationCard .consultation-toggle::after,
    html[lang="fa"] body.consultation-modal-open #consultationCard .consultation-toggle::after,
    html[dir="rtl"] body.consultation-modal-open #consultationCard .consultation-toggle::after {
      content: "بررسی سریع شرایط\A مشاوره رایگان\A راهنمایی مخصوص انتاریو";
      padding: 18px 20px 18px 18px;
    }

    body.consultation-modal-open #consultationCard .consultation-panel {
      grid-column: 2 !important;
      display: block !important;
      max-height: min(720px, calc(100dvh - 54px)) !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
      background: #FFFFFF !important;
      border-inline-start: 1px solid rgba(16, 37, 66, 0.08) !important;
    }

    body.consultation-modal-open #consultationCard .inline-form {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 16px !important;
      padding: 40px 38px 34px !important;
      background: transparent !important;
    }

    body.consultation-modal-open #consultationCard .form-progress,
    body.consultation-modal-open #consultationCard .form-row:has(#email),
    body.consultation-modal-open #consultationCard .form-row:has(.status-options),
    body.consultation-modal-open #consultationCard .hero-status-note,
    body.consultation-modal-open #consultationCard .consultation-options,
    body.consultation-modal-open #consultationCard #consultationSubmit,
    body.consultation-modal-open #consultationCard .form-success,
    body.consultation-modal-open #consultationCard .form-disclaimer {
      grid-column: 1 / -1 !important;
    }

    body.consultation-modal-open #consultationCard .form-progress {
      margin: 0 0 4px !important;
      display: grid !important;
      grid-template-columns: 1fr auto !important;
      align-items: center !important;
      gap: 12px !important;
    }

    body.consultation-modal-open #consultationCard .form-progress-track {
      height: 7px !important;
      border-radius: 999px !important;
      background: rgba(16, 37, 66, 0.09) !important;
      overflow: hidden !important;
    }

    body.consultation-modal-open #consultationCard .form-progress-fill {
      background: linear-gradient(90deg, #102542, #F3B421) !important;
      box-shadow: 0 0 12px rgba(243, 180, 33, 0.38) !important;
    }

    body.consultation-modal-open #consultationCard .form-progress-label {
      font-size: 12px !important;
      font-weight: 900 !important;
      color: rgba(16, 37, 66, 0.58) !important;
      white-space: nowrap !important;
    }

    body.consultation-modal-open #consultationCard .form-row {
      gap: 8px !important;
    }

    body.consultation-modal-open #consultationCard .form-row label {
      color: #102542 !important;
      font-size: 13px !important;
      line-height: 1.15 !important;
      font-weight: 900 !important;
    }

    body.consultation-modal-open #consultationCard .form-row input,
    body.consultation-modal-open #consultationCard .form-row select {
      height: 48px !important;
      border-radius: 16px !important;
      border: 1px solid rgba(16, 37, 66, 0.13) !important;
      background: #F8FAFD !important;
      color: #102542 !important;
      padding: 0 15px !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
    }

    body.consultation-modal-open #consultationCard .form-row input:focus,
    body.consultation-modal-open #consultationCard .form-row select:focus {
      border-color: rgba(243, 180, 33, 0.82) !important;
      background: #FFFFFF !important;
      box-shadow: 0 0 0 4px rgba(243, 180, 33, 0.16) !important;
    }

    body.consultation-modal-open #consultationCard .field-error {
      min-height: 14px !important;
      color: #B45309 !important;
      font-size: 11px !important;
      font-weight: 800 !important;
      line-height: 1.25 !important;
    }

    body.consultation-modal-open #consultationCard .status-options {
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      gap: 10px !important;
    }

    body.consultation-modal-open #consultationCard .status-option {
      display: flex !important;
      align-items: center !important;
      gap: 9px !important;
      min-height: 46px !important;
      padding: 10px 12px !important;
      border-radius: 15px !important;
      background: #F8FAFD !important;
      border: 1px solid rgba(16, 37, 66, 0.12) !important;
      box-shadow: none !important;
    }

    body.consultation-modal-open #consultationCard .status-option:hover,
    body.consultation-modal-open #consultationCard .status-option:has(input:checked) {
      background: #FFF8E4 !important;
      border-color: rgba(243, 180, 33, 0.74) !important;
      box-shadow: 0 0 0 4px rgba(243, 180, 33, 0.11) !important;
      transform: none !important;
    }

    body.consultation-modal-open #consultationCard .status-option input {
      width: 16px !important;
      height: 16px !important;
      margin: 0 !important;
      flex: 0 0 auto !important;
    }

    body.consultation-modal-open #consultationCard .status-option span {
      font-size: 13px !important;
      line-height: 1.2 !important;
      font-weight: 900 !important;
      color: #102542 !important;
    }

    body.consultation-modal-open #consultationCard .hero-status-note {
      padding: 14px 16px !important;
      border-radius: 18px !important;
      background: #F8FAFD !important;
      border: 1px solid rgba(16, 37, 66, 0.10) !important;
      box-shadow: none !important;
    }

    body.consultation-modal-open #consultationCard .hero-status-note strong {
      font-size: 13px !important;
      color: #102542 !important;
      margin-bottom: 3px !important;
    }

    body.consultation-modal-open #consultationCard .hero-status-note small {
      color: rgba(16, 37, 66, 0.62) !important;
      font-size: 12px !important;
      line-height: 1.45 !important;
      font-weight: 750 !important;
    }

    body.consultation-modal-open #consultationCard .consultation-options {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 12px !important;
      margin: 0 !important;
    }

    body.consultation-modal-open #consultationCard .consultation-option {
      grid-template-columns: 34px 1fr !important;
      gap: 10px !important;
      padding: 14px !important;
      border-radius: 18px !important;
      background: #FFFFFF !important;
      border: 1px solid rgba(16, 37, 66, 0.10) !important;
      box-shadow: 0 10px 28px rgba(16, 37, 66, 0.06) !important;
    }

    body.consultation-modal-open #consultationCard .consultation-option:hover {
      border-color: rgba(243, 180, 33, 0.66) !important;
      background: #FFFDF6 !important;
      transform: translateY(-1px) !important;
    }

    body.consultation-modal-open #consultationCard .option-icon {
      width: 34px !important;
      height: 34px !important;
      border-radius: 12px !important;
      font-size: 15px !important;
      background: #FFF3C7 !important;
      box-shadow: none !important;
    }

    body.consultation-modal-open #consultationCard .consultation-option strong {
      color: #102542 !important;
      font-size: 13px !important;
      margin-bottom: 2px !important;
    }

    body.consultation-modal-open #consultationCard .consultation-option small {
      color: rgba(16, 37, 66, 0.58) !important;
      font-size: 11px !important;
      line-height: 1.35 !important;
      font-weight: 700 !important;
    }

    body.consultation-modal-open #consultationCard #consultationSubmit {
      min-height: 50px !important;
      margin-top: 2px !important;
      border-radius: 17px !important;
      width: 100% !important;
      animation: edupathButtonBorderSpin 5.8s linear infinite !important;
    }

    body.consultation-modal-open #consultationCard .form-disclaimer {
      text-align: left !important;
      color: rgba(16, 37, 66, 0.52) !important;
      font-size: 11px !important;
      line-height: 1.45 !important;
      padding-bottom: 2px !important;
    }

    html[dir="rtl"] body.consultation-modal-open #consultationCard .form-disclaimer {
      text-align: right !important;
    }

    body.consultation-modal-open #consultationCard .consultation-modal-close {
      top: 18px !important;
      inset-inline-end: 18px !important;
      width: 38px !important;
      height: 38px !important;
      border-radius: 50% !important;
      border: 1px solid rgba(16, 37, 66, 0.10) !important;
      background: rgba(255, 255, 255, 0.92) !important;
      color: #102542 !important;
      font-size: 24px !important;
      font-weight: 400 !important;
      box-shadow: 0 12px 26px rgba(16, 37, 66, 0.10) !important;
    }

    body.consultation-modal-open #consultationCard .consultation-modal-close:hover {
      transform: translateY(-1px) scale(1.03) !important;
      background: #FFFFFF !important;
    }

    @media (max-width: 820px) {
      body.consultation-modal-open #consultationCard.consultation-card,
      body.consultation-modal-open .hero #consultationCard.consultation-card {
        width: min(560px, calc(100vw - 24px)) !important;
        max-width: min(560px, calc(100vw - 24px)) !important;
        max-height: calc(100dvh - 24px) !important;
        grid-template-columns: 1fr !important;
        overflow-y: auto !important;
      }

      body.consultation-modal-open #consultationCard .consultation-toggle {
        grid-column: 1 !important;
        min-height: auto !important;
        padding: 28px 66px 18px 24px !important;
        background: linear-gradient(145deg, #FFF7DF 0%, #FFFFFF 100%) !important;
      }

      html[dir="rtl"] body.consultation-modal-open #consultationCard .consultation-toggle {
        padding: 28px 24px 18px 66px !important;
      }

      body.consultation-modal-open #consultationCard .consultation-toggle strong {
        font-size: 28px !important;
        max-width: none !important;
      }

      body.consultation-modal-open #consultationCard .consultation-toggle small {
        max-width: none !important;
      }

      body.consultation-modal-open #consultationCard .consultation-toggle::after {
        display: none !important;
      }

      body.consultation-modal-open #consultationCard .consultation-panel {
        grid-column: 1 !important;
        max-height: none !important;
        overflow: visible !important;
        border-inline-start: none !important;
      }

      body.consultation-modal-open #consultationCard .inline-form {
        grid-template-columns: 1fr !important;
        padding: 0 24px 24px !important;
      }

      body.consultation-modal-open #consultationCard .form-row,
      body.consultation-modal-open #consultationCard .form-progress,
      body.consultation-modal-open #consultationCard .hero-status-note,
      body.consultation-modal-open #consultationCard .consultation-options,
      body.consultation-modal-open #consultationCard #consultationSubmit,
      body.consultation-modal-open #consultationCard .form-success,
      body.consultation-modal-open #consultationCard .form-disclaimer {
        grid-column: 1 / -1 !important;
      }

      body.consultation-modal-open #consultationCard .status-options,
      body.consultation-modal-open #consultationCard .consultation-options {
        grid-template-columns: 1fr !important;
      }
    }

    @media (max-width: 420px) {
      body.consultation-modal-open #consultationCard .consultation-toggle {
        padding: 24px 58px 16px 20px !important;
      }

      html[dir="rtl"] body.consultation-modal-open #consultationCard .consultation-toggle {
        padding: 24px 20px 16px 58px !important;
      }

      body.consultation-modal-open #consultationCard .inline-form {
        padding: 0 20px 22px !important;
        gap: 14px !important;
      }
    }



    /* =========================================================
       SMOOTH MISSION SCROLL PROGRESS
       The vertical journey line now follows the user's scroll
       continuously instead of jumping only between step dots.
    ========================================================= */
    @media (min-width: 821px) {
      .mission-progress {
        height: clamp(320px, 34vh, 430px) !important;
        padding: 10px 0 !important;
      }

      .progress-line {
        width: 4px !important;
        top: 18px !important;
        bottom: 18px !important;
        background: linear-gradient(
          180deg,
          rgba(16, 37, 66, 0.08),
          rgba(16, 37, 66, 0.16),
          rgba(16, 37, 66, 0.08)
        ) !important;
        overflow: hidden;
      }

      .progress-fill {
        width: 4px !important;
        top: 18px !important;
        height: var(--mission-progress, 0%) !important;
        max-height: calc(100% - 36px);
        background: linear-gradient(180deg, #ffe28a 0%, #f3b421 48%, #d89400 100%) !important;
        box-shadow:
          0 0 16px rgba(243, 180, 33, 0.48),
          0 0 34px rgba(243, 180, 33, 0.22) !important;
        transition: none !important;
        will-change: height;
        overflow: visible;
      }

      .progress-fill::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -7px;
        width: 16px;
        height: 16px;
        transform: translateX(-50%);
        border-radius: 999px;
        background: radial-gradient(circle, #ffffff 0 28%, #f3b421 40%, rgba(243, 180, 33, 0) 72%);
        box-shadow:
          0 0 18px rgba(243, 180, 33, 0.72),
          0 0 34px rgba(243, 180, 33, 0.34);
        opacity: calc(0.25 + var(--mission-scroll-progress, 0) * 0.75);
        pointer-events: none;
      }

      .progress-dot {
        width: 18px !important;
        height: 18px !important;
        background: rgba(255, 255, 255, 0.96) !important;
        border: 3px solid rgba(16, 37, 66, 0.12) !important;
        box-shadow:
          0 0 0 1px rgba(16, 37, 66, 0.08),
          0 8px 20px rgba(16, 37, 66, 0.08) !important;
        transition:
          background 0.18s ease,
          border-color 0.18s ease,
          box-shadow 0.18s ease,
          transform 0.18s ease !important;
      }

      .progress-dot.is-active {
        background: #f3b421 !important;
        border-color: #ffffff !important;
        box-shadow:
          0 0 0 7px rgba(243, 180, 33, 0.16),
          0 0 22px rgba(243, 180, 33, 0.50),
          0 10px 28px rgba(16, 37, 66, 0.10) !important;
      }

      .progress-dot.is-current {
        transform: scale(1.16) !important;
      }
    }



    /* =========================================================
       RESPONSIVE MISSION SCROLL MOTION — desktop + tablet + mobile
       Keeps the same scroll-driven step animation on phones instead
       of expanding all cards into a static stack.
    ========================================================= */
    @media (max-width: 820px) {
      .mission-scroll {
        min-height: 330vh !important;
        min-height: 330dvh !important;
        padding: 0 !important;
        overflow: visible !important;
      }

      .mission-sticky {
        position: sticky !important;
        top: 72px !important;
        min-height: calc(100vh - 72px) !important;
        min-height: calc(100dvh - 72px) !important;
        padding: clamp(18px, 4vw, 28px) 0 !important;
        display: flex !important;
        align-items: center !important;
        overflow: hidden !important;
      }

      .mission-grid {
        grid-template-columns: 1fr !important;
        gap: clamp(16px, 4vw, 24px) !important;
        align-items: start !important;
      }

      .mission-video,
      .mission-video.youtube-preview-card,
      .mission-video.has-youtube {
        width: 100% !important;
        min-height: 180px !important;
        max-height: 220px !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 24px !important;
      }

      .mission-copy {
        max-width: none !important;
        width: 100% !important;
      }

      .mission-copy .eyebrow {
        margin-bottom: 8px !important;
        font-size: 12px !important;
      }

      .mission-copy h2 {
        font-size: clamp(28px, 8vw, 36px) !important;
        line-height: 1.08 !important;
        margin-bottom: 10px !important;
        max-width: 100% !important;
      }

      .mission-copy > p {
        font-size: 15px !important;
        line-height: 1.55 !important;
        max-width: 100% !important;
        margin-bottom: 16px !important;
      }

      .mission-flow {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        width: 100% !important;
      }

      .mission-progress {
        display: flex !important;
        width: 100% !important;
        height: 32px !important;
        padding: 0 9px !important;
        margin: 0 !important;
        align-items: center !important;
        justify-content: space-between !important;
        position: relative !important;
      }

      .progress-line {
        position: absolute !important;
        left: 9px !important;
        right: 9px !important;
        top: 50% !important;
        bottom: auto !important;
        width: auto !important;
        height: 4px !important;
        transform: translateY(-50%) !important;
        border-radius: 999px !important;
        background: linear-gradient(90deg, rgba(16,37,66,.08), rgba(16,37,66,.16), rgba(16,37,66,.08)) !important;
        overflow: hidden !important;
      }

      .progress-fill {
        position: absolute !important;
        left: 9px !important;
        top: 50% !important;
        bottom: auto !important;
        width: var(--mission-progress, 0%) !important;
        max-width: calc(100% - 18px) !important;
        height: 4px !important;
        transform: translateY(-50%) !important;
        border-radius: 999px !important;
        background: linear-gradient(90deg, #ffe28a 0%, #f3b421 52%, #d89400 100%) !important;
        box-shadow: 0 0 16px rgba(243,180,33,.46), 0 0 30px rgba(243,180,33,.18) !important;
        transition: none !important;
        overflow: visible !important;
        will-change: width !important;
      }

      html[dir="rtl"] .progress-fill {
        left: auto !important;
        right: 9px !important;
        background: linear-gradient(270deg, #ffe28a 0%, #f3b421 52%, #d89400 100%) !important;
      }

      .progress-fill::after {
        content: "" !important;
        position: absolute !important;
        right: -7px !important;
        bottom: auto !important;
        top: 50% !important;
        left: auto !important;
        width: 15px !important;
        height: 15px !important;
        transform: translateY(-50%) !important;
        border-radius: 999px !important;
        background: radial-gradient(circle, #ffffff 0 28%, #f3b421 40%, rgba(243, 180, 33, 0) 72%) !important;
        box-shadow: 0 0 18px rgba(243, 180, 33, 0.70), 0 0 34px rgba(243, 180, 33, 0.28) !important;
        opacity: calc(0.25 + var(--mission-scroll-progress, 0) * 0.75) !important;
        pointer-events: none !important;
      }

      html[dir="rtl"] .progress-fill::after {
        right: auto !important;
        left: -7px !important;
      }

      .progress-dot {
        width: 18px !important;
        height: 18px !important;
        border-radius: 999px !important;
        background: rgba(255, 255, 255, 0.96) !important;
        border: 3px solid rgba(16, 37, 66, 0.12) !important;
        box-shadow: 0 0 0 1px rgba(16,37,66,.08), 0 8px 18px rgba(16,37,66,.08) !important;
        z-index: 2 !important;
        transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
      }

      .progress-dot.is-active {
        background: #f3b421 !important;
        border-color: #ffffff !important;
        box-shadow: 0 0 0 7px rgba(243,180,33,.16), 0 0 22px rgba(243,180,33,.50), 0 10px 28px rgba(16,37,66,.10) !important;
      }

      .progress-dot.is-current {
        transform: scale(1.15) !important;
      }

      .mission-steps {
        position: relative !important;
        display: block !important;
        min-height: clamp(245px, 32vh, 310px) !important;
        width: 100% !important;
      }

      .mission-step {
        position: absolute !important;
        inset: 0 !important;
        opacity: 0 !important;
        pointer-events: none !important;
        padding: clamp(22px, 5vw, 30px) !important;
        border-radius: 24px !important;
        transform: translateX(28px) scale(.975) !important;
        transition: opacity .38s ease, transform .42s cubic-bezier(.22,.72,.18,1) !important;
        will-change: opacity, transform !important;
      }

      html[dir="rtl"] .mission-step {
        transform: translateX(-28px) scale(.975) !important;
      }

      .mission-step.is-active {
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: translateX(0) scale(1) !important;
      }

      .mission-number {
        width: 42px !important;
        height: 42px !important;
        font-size: 18px !important;
        margin-bottom: 16px !important;
      }

      .mission-step h3 {
        font-size: clamp(23px, 6.4vw, 30px) !important;
        line-height: 1.12 !important;
        margin-bottom: 10px !important;
      }

      .mission-step p {
        font-size: 15px !important;
        line-height: 1.58 !important;
        max-width: 100% !important;
      }
    }

    @media (max-width: 620px) {
      .mission-sticky {
        top: 68px !important;
        min-height: calc(100vh - 68px) !important;
        min-height: calc(100dvh - 68px) !important;
        padding: 16px 0 !important;
      }

      .mission-video,
      .mission-video.youtube-preview-card,
      .mission-video.has-youtube {
        min-height: 145px !important;
        max-height: 170px !important;
        border-radius: 20px !important;
      }

      .youtube-play-button {
        width: 54px !important;
        height: 54px !important;
        font-size: 21px !important;
      }

      .youtube-preview-text {
        font-size: 13px !important;
      }

      .mission-copy > p {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
      }

      .mission-steps {
        min-height: 260px !important;
        margin-inline: auto !important;
      }

      /* Keep phone step cards centered throughout their transition. */
      .mission-step,
      html[dir="rtl"] .mission-step {
        transform: scale(.975) !important;
        transform-origin: center center !important;
      }

      .mission-step.is-active,
      html[dir="rtl"] .mission-step.is-active {
        transform: scale(1) !important;
      }
    }

    @media (max-width: 420px) {
      .mission-grid {
        gap: 12px !important;
      }

      .mission-copy h2 {
        font-size: 26px !important;
      }

      .mission-copy > p {
        font-size: 14px !important;
        margin-bottom: 12px !important;
      }

      .mission-video,
      .mission-video.youtube-preview-card,
      .mission-video.has-youtube {
        min-height: 132px !important;
        max-height: 150px !important;
      }

      .mission-steps {
        min-height: 280px !important;
      }

      .mission-step {
        padding: 20px !important;
      }

      .mission-step p {
        font-size: 14px !important;
        line-height: 1.5 !important;
      }
    }


  /* =========================================================
     FINAL CTA TWEAKS — larger hero CTA, cleaner nav copy,
     and border-only motion for the white secondary button.
     ========================================================= */
  .hero-actions .js-open-consultation.btn-primary {
    font-size: clamp(17px, 1.25vw, 20px) !important;
    font-weight: 900 !important;
    padding: 18px 34px !important;
    min-height: 62px !important;
    min-width: 250px;
    letter-spacing: -0.01em;
  }

  .btn-secondary,
  .hero .btn-secondary {
    background-origin: border-box !important;
    background-clip: padding-box, padding-box, border-box !important;
    background:
      radial-gradient(100% 130% at 24% -8%, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0) 58%) padding-box,
      linear-gradient(160deg, rgba(255, 255, 255, 0.90), rgba(255, 250, 236, 0.72)) padding-box,
      conic-gradient(
        from var(--edupath-button-angle),
        rgba(255, 220, 120, 0.36) 0deg,
        rgba(255, 220, 120, 0.36) 82deg,
        rgba(255, 255, 255, 0.98) 110deg,
        rgba(255, 232, 160, 0.86) 146deg,
        rgba(231, 167, 0, 0.64) 182deg,
        rgba(255, 220, 120, 0.36) 222deg,
        rgba(255, 220, 120, 0.36) 360deg
      ) border-box !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.88),
      0 10px 24px rgba(171, 119, 0, 0.08),
      0 0 18px rgba(255, 194, 41, 0.08) !important;
    color: #2A2108 !important;
  }

  .btn-secondary:hover,
  .btn-secondary:focus-visible,
  .hero .btn-secondary:hover,
  .hero .btn-secondary:focus-visible {
    background:
      radial-gradient(100% 130% at 24% -8%, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0) 58%) padding-box,
      linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(255, 250, 236, 0.78)) padding-box,
      conic-gradient(
        from var(--edupath-button-angle),
        rgba(255, 220, 120, 0.42) 0deg,
        rgba(255, 220, 120, 0.42) 82deg,
        rgba(255, 255, 255, 1) 110deg,
        rgba(255, 232, 160, 0.9) 146deg,
        rgba(231, 167, 0, 0.70) 182deg,
        rgba(255, 220, 120, 0.42) 222deg,
        rgba(255, 220, 120, 0.42) 360deg
      ) border-box !important;
  }

  @media (max-width: 620px) {
    .hero-actions .js-open-consultation.btn-primary {
      min-width: 220px;
      min-height: 58px !important;
      padding: 16px 28px !important;
      font-size: 16px !important;
    }
  }

  /* =========================================================
     YOUTUBE CARD FINAL FIX
     Earlier .mission-video span rules were overriding the badge/overlay
     positioning. These high-specificity rules make the YouTube state visible.
     ========================================================= */
  .mission-video.youtube-preview-card {
    isolation: isolate !important;
  }

  .mission-video.youtube-preview-card .youtube-preview-overlay {
    position: absolute !important;
    inset: 0 !important;
    z-index: 30 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 24px !important;
    color: #fff !important;
    pointer-events: none !important;
    transform: none !important;
  }

  .mission-video.youtube-preview-card .youtube-platform-badge {
    position: absolute !important;
    top: 16px !important;
    left: 16px !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 40 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0B1F3A !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    box-shadow: 0 12px 28px rgba(11, 31, 58, 0.18) !important;
    pointer-events: none !important;
  }

  .mission-video.youtube-preview-card .youtube-platform-badge span,
  .mission-video.youtube-preview-card .youtube-preview-overlay span,
  .mission-video.youtube-preview-card .youtube-play-button,
  .mission-video.youtube-preview-card .youtube-preview-text,
  .mission-video.youtube-preview-card .youtube-click-hint {
    position: relative !important;
    z-index: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  .mission-video.youtube-preview-card .youtube-platform-dot {
    width: 18px !important;
    height: 18px !important;
    border-radius: 999px !important;
    background: #FF0033 !important;
    box-shadow: 0 0 0 4px rgba(255, 0, 51, 0.12) !important;
    flex: 0 0 auto !important;
  }

  .mission-video.youtube-preview-card .youtube-platform-dot::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-35%, -50%) !important;
    width: 0 !important;
    height: 0 !important;
    border-top: 4px solid transparent !important;
    border-bottom: 4px solid transparent !important;
    border-left: 6px solid #ffffff !important;
  }

  .mission-video.youtube-preview-card .youtube-play-button {
    width: 76px !important;
    height: 76px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #FF0033 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 30px !important;
    padding-left: 5px !important;
    box-shadow:
      0 18px 42px rgba(11, 31, 58, 0.24),
      0 0 30px rgba(255, 0, 51, 0.22) !important;
  }

  .mission-video.youtube-preview-card .youtube-preview-text {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.42) !important;
  }

  .mission-video.youtube-preview-card .youtube-click-hint {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 2px !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    background: rgba(11, 31, 58, 0.48) !important;
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
    color: rgba(255, 255, 255, 0.98) !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    box-shadow: 0 12px 28px rgba(11, 31, 58, 0.14) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
  }

  .mission-video.youtube-preview-card .youtube-click-hint::after {
    content: "↗" !important;
    font-size: 13px !important;
    line-height: 1 !important;
  }

  @media (max-width: 620px) {
    .mission-video.youtube-preview-card .youtube-platform-badge {
      top: 12px !important;
      left: 12px !important;
      padding: 7px 10px !important;
      font-size: 11px !important;
    }

    .mission-video.youtube-preview-card .youtube-play-button {
      width: 62px !important;
      height: 62px !important;
      font-size: 24px !important;
    }

    .mission-video.youtube-preview-card .youtube-click-hint {
      font-size: 10.5px !important;
      padding: 7px 10px !important;
    }
  }


  /* =========================================================
     YOUTUBE CAPTION COMPACT FIX
     Small native-looking title bar at the top, not a large dark panel.
     ========================================================= */
  .mission-video.youtube-preview-card .youtube-preview-overlay {
    position: absolute !important;
    inset: 0 !important;
    z-index: 30 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 24px !important;
    pointer-events: none !important;
    margin: 0 !important;
  }

  .mission-video.youtube-preview-card .youtube-top-caption-compact {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    right: 14px !important;
    z-index: 42 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 !important;
    pointer-events: none !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .mission-video.youtube-preview-card .youtube-caption-avatar-compact {
    width: 36px !important;
    height: 36px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 6px 18px rgba(0,0,0,0.18) !important;
    border: 2px solid rgba(255,255,255,0.9) !important;
    background: #fff !important;
  }

  .mission-video.youtube-preview-card .youtube-caption-avatar-compact img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: inherit !important;
    filter: none !important;
    transform: none !important;
  }

  .mission-video.youtube-preview-card .youtube-caption-copy-compact {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1px !important;
    text-shadow: 0 2px 10px rgba(0,0,0,0.42) !important;
  }

  .mission-video.youtube-preview-card .youtube-caption-copy-compact strong,
  .mission-video.youtube-preview-card .youtube-caption-copy-compact small {
    display: block !important;
    margin: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: #fff !important;
    line-height: 1.2 !important;
  }

  .mission-video.youtube-preview-card .youtube-caption-copy-compact strong {
    font-size: 14px !important;
    font-weight: 900 !important;
  }

  .mission-video.youtube-preview-card .youtube-caption-copy-compact small {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: rgba(255,255,255,0.88) !important;
  }

  .mission-video.youtube-preview-card .youtube-platform-badge {
    position: absolute !important;
    left: 14px !important;
    bottom: 14px !important;
    top: auto !important;
    right: auto !important;
    z-index: 35 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 11px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,0.96) !important;
    color: #0B1F3A !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    box-shadow: 0 10px 24px rgba(11,31,58,0.16) !important;
    pointer-events: none !important;
  }

  .mission-video.youtube-preview-card .youtube-play-button {
    width: 74px !important;
    height: 74px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.96) !important;
    color: #FF0033 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 29px !important;
    padding-left: 5px !important;
    box-shadow: 0 18px 42px rgba(11,31,58,0.22), 0 0 24px rgba(255,0,51,0.14) !important;
  }

  .mission-video.youtube-preview-card .youtube-preview-text {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    text-shadow: 0 2px 14px rgba(0,0,0,0.38) !important;
    background: rgba(11,31,58,0.42) !important;
    border: 1px solid rgba(255,255,255,0.16) !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
  }

  .mission-video.youtube-preview-card .youtube-click-hint {
    display: none !important;
  }

  @media (max-width: 620px) {
    .mission-video.youtube-preview-card .youtube-top-caption-compact {
      top: 10px !important;
      left: 10px !important;
      right: 10px !important;
      gap: 8px !important;
    }

    .mission-video.youtube-preview-card .youtube-caption-avatar-compact {
      width: 30px !important;
      height: 30px !important;
    }

    .mission-video.youtube-preview-card .youtube-caption-copy-compact strong {
      font-size: 12px !important;
    }

    .mission-video.youtube-preview-card .youtube-caption-copy-compact small {
      font-size: 10px !important;
    }

    .mission-video.youtube-preview-card .youtube-platform-badge {
      left: 10px !important;
      bottom: 10px !important;
      font-size: 11px !important;
      padding: 7px 10px !important;
    }

    .mission-video.youtube-preview-card .youtube-play-button {
      width: 60px !important;
      height: 60px !important;
      font-size: 24px !important;
    }

    .mission-video.youtube-preview-card .youtube-preview-text {
      font-size: 12px !important;
      padding: 6px 10px !important;
    }
  }


  /* Small cleanup: keep only one strong YouTube logo (the center play). */
  .mission-video.youtube-preview-card .youtube-platform-badge--plain {
    padding: 8px 12px !important;
    background: rgba(255,255,255,0.94) !important;
    color: #334155 !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.01em !important;
  }

  .mission-video.youtube-preview-card .youtube-platform-badge--plain .youtube-platform-dot,
  .mission-video.youtube-preview-card .youtube-platform-badge--plain .youtube-platform-dot::before {
    display: none !important;
    content: none !important;
  }


/* =========================================================
   EDUPATH SYSTEM UNIFICATION PATCH
   Shared header, buttons, cards, footer, and user path clarity
   ========================================================= */
:root{
  --edupath-navy:#102542;
  --edupath-navy-2:#0B1F3A;
  --edupath-gold:#F3B421;
  --edupath-gold-2:#F4A900;
  --edupath-text:#17212F;
  --edupath-muted:#6E7582;
  --edupath-line:rgba(16,37,66,.12);
  --edupath-gold-line:rgba(243,180,33,.30);
}
header{
  position:sticky !important;
  top:0 !important;
  z-index:100 !important;
  background:rgba(255,253,247,.78) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.15) !important;
  backdrop-filter:blur(18px) saturate(1.15) !important;
  border-bottom:1px solid rgba(231,167,0,.22) !important;
  box-shadow:0 12px 40px rgba(171,119,0,.06) !important;
}
header .nav,
.nav.edupath-system-nav{
  width:min(1160px,92%) !important;
  margin:0 auto !important;
  min-height:72px !important;
  height:auto !important;
  padding:12px 0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:24px !important;
}
header .logo{display:inline-flex !important;align-items:center !important;flex:0 0 auto !important;}
header .logo-img, header .logo img{width:152px !important;max-height:58px !important;height:auto !important;object-fit:contain !important;}
header .nav-links,
header .links.nav-links{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:28px !important;
  color:rgba(23,33,47,.68) !important;
  font-size:15px !important;
  font-weight:800 !important;
}
header .nav-links a{
  position:relative !important;
  color:inherit !important;
  transition:color .2s ease !important;
}
header .nav-links a:hover,
header .nav-links a.is-active{color:var(--edupath-navy) !important;}
header .nav-links a.is-active::after,
header .nav-links a:hover::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:-8px !important;
  height:2px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,transparent,var(--edupath-gold),transparent) !important;
}
header .nav-actions,
header .actions.nav-actions,
header .actions{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  flex:0 0 auto !important;
}
.btn,
.btn-primary,
.btn-secondary,
button.btn,
a.btn,
header .menu-toggle{
  min-height:46px !important;
  padding:0 22px !important;
  border-radius:999px !important;
  font-size:14px !important;
  font-weight:900 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  white-space:nowrap !important;
  border:1.5px solid transparent !important;
  text-decoration:none !important;
  cursor:pointer !important;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
.btn.primary,.btn-primary,
.btn.btn-primary{
  color:#2A2108 !important;
  background:linear-gradient(135deg,#FFECA8 0%,#FFC229 46%,#F3A900 100%) !important;
  border-color:rgba(231,167,0,.38) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 12px 28px rgba(255,194,41,.24) !important;
}
.btn.secondary,.btn-secondary,
.btn.btn-secondary,
header .menu-toggle{
  color:#2A2108 !important;
  background:linear-gradient(160deg,rgba(255,255,255,.84),rgba(255,248,228,.54)) !important;
  border-color:rgba(231,167,0,.32) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.80),0 10px 24px rgba(171,119,0,.08) !important;
  -webkit-backdrop-filter:blur(16px) !important;
  backdrop-filter:blur(16px) !important;
}
.btn:hover, .btn-primary:hover, .btn-secondary:hover, header .menu-toggle:hover{transform:translateY(-2px) !important;}
.card,.program-card,.info-panel,.mini-card,.journey-card,details,.consultation-card,.overview-card,.hero-info-card{
  border-radius:24px;
  border-color:rgba(16,37,66,.10);
  box-shadow:0 18px 48px rgba(16,37,66,.065);
}
.card:hover,.program-card:hover,.mini-card:hover{
  border-color:rgba(243,180,33,.48) !important;
  box-shadow:0 24px 58px rgba(16,37,66,.10) !important;
}
.edupath-pathbar{
  position:relative;
  z-index:30;
  background:rgba(255,253,247,.82);
  border-bottom:1px solid rgba(243,180,33,.20);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}
.edupath-pathbar .container{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.edupath-steps{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  overflow:auto;
  scrollbar-width:none;
}
.edupath-steps::-webkit-scrollbar{display:none;}
.edupath-step{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:rgba(16,37,66,.66);
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}
.edupath-step:not(:last-child)::after{
  content:"→";
  color:#B47E00;
  opacity:.8;
}
.edupath-step.is-current{color:var(--edupath-navy);}
.edupath-step-cta{
  flex:0 0 auto;
  min-height:34px !important;
  padding:0 14px !important;
  font-size:12px !important;
}
footer,
.landing-footer{
  background:var(--edupath-navy) !important;
  color:#D1D5DB !important;
  padding:56px 0 28px !important;
}
footer .footer-grid{
  display:grid !important;
  grid-template-columns:1.4fr repeat(3,1fr) !important;
  gap:40px !important;
  margin-bottom:40px !important;
}
footer .footer-logo img,
footer .logo-img{width:152px !important;max-height:58px !important;object-fit:contain !important;}
footer .footer-brand{max-width:320px !important;}
footer .footer-brand p{margin-top:14px !important;color:#9CA3AF !important;font-size:14px !important;line-height:1.6 !important;}
footer h4{color:#fff !important;margin-bottom:16px !important;font-size:16px !important;}
footer ul{list-style:none !important;display:grid !important;gap:10px !important;color:#9CA3AF !important;font-size:14px !important;padding:0 !important;margin:0 !important;}
footer a{color:#9CA3AF !important;text-decoration:none !important;}
footer a:hover{color:#fff !important;}
footer .footer-bottom{border-top:1px solid rgba(255,255,255,.16) !important;padding-top:24px !important;display:flex !important;justify-content:space-between !important;gap:20px !important;color:#9CA3AF !important;font-size:13px !important;}
@media(max-width:980px){
  header .nav-links,header .links.nav-links{display:none !important;}
  header .logo-img, header .logo img{width:136px !important;}
  footer .footer-grid{grid-template-columns:1fr 1fr !important;}
}
@media(max-width:620px){
  header .nav,.nav.edupath-system-nav{width:min(100% - 28px,520px) !important;gap:10px !important;padding:14px 0 !important;}
  header .logo-img, header .logo img{width:116px !important;}
  header .nav-actions .btn.secondary, header .actions .btn.secondary{display:none !important;}
  .btn,.btn-primary,.btn-secondary,button.btn,a.btn,header .menu-toggle{min-height:42px !important;padding:0 14px !important;font-size:13px !important;}
  .edupath-pathbar .container{width:min(100% - 28px,520px);align-items:flex-start;flex-direction:column;padding:10px 0;}
  .edupath-step-cta{width:100%;}
  footer .footer-grid{grid-template-columns:1fr !important;}
  footer .footer-bottom{flex-direction:column !important;}
}
/* =========================================================
   EDUPATH REFERENCE CTA BORDER ANIMATION
   Kept last so the shared page theme cannot override it.
   ========================================================= */
@property --edupath-button-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

.btn.primary,
.btn-primary,
.btn.btn-primary,
.btn.secondary,
.btn-secondary,
.btn.btn-secondary,
header .menu-toggle {
  --edupath-button-angle: 0deg;
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  border: 1.5px solid transparent !important;
  border-radius: 999px !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  animation: edupathButtonBorderSpin 4.8s linear infinite !important;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-mask: none !important;
  mask: none !important;
  clip-path: inset(0 round 999px);
}

.btn::before,
.btn::after,
.btn-primary::before,
.btn-primary::after,
.btn-secondary::before,
.btn-secondary::after,
header .menu-toggle::before,
header .menu-toggle::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  animation: none !important;
  background: none !important;
  -webkit-mask: none !important;
  mask: none !important;
}

.btn.primary,
.btn-primary,
.btn.btn-primary {
  color: #2A2108 !important;
  background:
    radial-gradient(95% 120% at 24% 0%, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0) 52%) padding-box,
    linear-gradient(135deg, #FFECA8 0%, #FFC229 46%, #F3A900 100%) padding-box,
    conic-gradient(
      from var(--edupath-button-angle),
      rgba(255, 206, 70, 0.62) 0deg,
      rgba(255, 206, 70, 0.62) 78deg,
      rgba(255, 255, 255, 0.98) 112deg,
      rgba(255, 231, 150, 0.96) 136deg,
      rgba(243, 180, 33, 0.92) 168deg,
      rgba(255, 206, 70, 0.62) 206deg,
      rgba(255, 206, 70, 0.62) 360deg
    ) border-box !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    inset 0 -9px 18px rgba(155, 98, 0, 0.16),
    0 12px 28px rgba(255, 194, 41, 0.26),
    0 0 22px rgba(255, 194, 41, 0.16) !important;
}

.btn.secondary,
.btn-secondary,
.btn.btn-secondary,
header .menu-toggle {
  color: #2A2108 !important;
  background:
    radial-gradient(100% 130% at 24% -8%, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0) 58%) padding-box,
    linear-gradient(160deg, rgba(255, 255, 255, 0.74), rgba(255, 248, 228, 0.44)) padding-box,
    conic-gradient(
      from var(--edupath-button-angle),
      rgba(255, 220, 120, 0.42) 0deg,
      rgba(255, 220, 120, 0.42) 84deg,
      rgba(255, 255, 255, 0.96) 116deg,
      rgba(255, 232, 160, 0.82) 150deg,
      rgba(231, 167, 0, 0.58) 184deg,
      rgba(255, 220, 120, 0.42) 220deg,
      rgba(255, 220, 120, 0.42) 360deg
    ) border-box !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.80),
    0 10px 24px rgba(171, 119, 0, 0.09),
    0 0 18px rgba(255, 194, 41, 0.10) !important;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.btn.primary:hover,
.btn.primary:focus-visible,
.btn-primary:hover,
.btn-primary:focus-visible,
.btn.secondary:hover,
.btn.secondary:focus-visible,
.btn-secondary:hover,
.btn-secondary:focus-visible,
header .menu-toggle:hover,
header .menu-toggle:focus-visible {
  transform: translateY(-2px) translateZ(0) !important;
  animation-duration: 2.6s !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.88),
    inset 0 -10px 18px rgba(155, 98, 0, 0.16),
    0 16px 34px rgba(255, 194, 41, 0.30),
    0 0 26px rgba(255, 218, 120, 0.22) !important;
}

.btn.primary:active,
.btn-primary:active,
.btn.secondary:active,
.btn-secondary:active,
header .menu-toggle:active {
  transform: translateY(0) scale(0.98) translateZ(0) !important;
}

@keyframes edupathButtonBorderSpin {
  to { --edupath-button-angle: 360deg; }
}

@media (prefers-reduced-motion: reduce) {
  .btn.primary,
  .btn-primary,
  .btn.btn-primary,
  .btn.secondary,
  .btn-secondary,
  .btn.btn-secondary,
  header .menu-toggle {
    animation: none !important;
  }
}
html[dir="rtl"] .program-category-card .program-content h3 {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: left !important;
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
}
/* =========================================================
   FINAL PERSIAN LAYOUT POLISH
   ========================================================= */
html[dir="rtl"] body {
  direction: rtl;
  font-family: "Vazirmatn", Tahoma, Arial, sans-serif;
  line-height: 1.9;
  text-align: right;
}

html[dir="rtl"] header .nav {
  direction: rtl;
}

html[dir="rtl"] header .nav-links {
  direction: rtl;
}

html[dir="rtl"] header .nav-actions,
html[dir="rtl"] header .actions {
  direction: ltr;
}

html[dir="rtl"] header .nav-actions .btn,
html[dir="rtl"] header .actions .btn {
  direction: rtl;
}

html[dir="rtl"] .language-switch {
  direction: ltr;
  flex: 0 0 auto;
}

html[dir="rtl"] .hero-copy,
html[dir="rtl"] .hero-copy h1,
html[dir="rtl"] .hero-copy p,
html[dir="rtl"] .mission-copy,
html[dir="rtl"] .desk-copy,
html[dir="rtl"] .journey-card,
html[dir="rtl"] .consultation-card,
html[dir="rtl"] .form-row,
html[dir="rtl"] .eligibility-note,
html[dir="rtl"] .consultation-option,
html[dir="rtl"] .status-option,
html[dir="rtl"] details,
html[dir="rtl"] footer {
  text-align: right;
}

html[dir="rtl"] .hero h1 {
  line-height: 1.28;
  letter-spacing: 0;
}

html[dir="rtl"] .hero-copy p,
html[dir="rtl"] .mission-copy > p,
html[dir="rtl"] .desk-copy > p,
html[dir="rtl"] .section-header p,
html[dir="rtl"] .journey-card p,
html[dir="rtl"] details p,
html[dir="rtl"] .final-cta p {
  line-height: 1.95;
}

html[dir="rtl"] .hero-actions {
  direction: rtl;
  justify-content: flex-start;
}

html[dir="rtl"] .program-category-card .program-content {
  text-align: right;
  align-items: flex-start;
}

html[dir="rtl"] .program-category-card .program-content h3 {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: right !important;
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
}

html[dir="rtl"] .consultation-options,
html[dir="rtl"] .status-options {
  direction: rtl;
}

html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] summary {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] footer .footer-grid,
html[dir="rtl"] footer .footer-bottom {
  direction: rtl;
}

html[dir="rtl"] footer .footer-brand,
html[dir="rtl"] footer h4,
html[dir="rtl"] footer ul,
html[dir="rtl"] footer li {
  text-align: right;
}

@media (max-width: 620px) {
  html[dir="rtl"] header .nav {
    gap: 8px !important;
  }

  html[dir="rtl"] header .nav-actions,
  html[dir="rtl"] header .actions {
    gap: 6px !important;
    max-width: 68%;
  }

  html[dir="rtl"] .language-switch {
    padding: 3px;
  }

  html[dir="rtl"] .lang-btn {
    min-width: 34px;
    padding-inline: 8px;
  }

  html[dir="rtl"] .hero h1 {
    font-size: clamp(36px, 12vw, 52px);
    line-height: 1.2;
  }

  html[dir="rtl"] .program-category-card .program-content h3 {
    text-align: right !important;
  }
}


    /* =========================================================
       FINAL HERO MEDIA + BLACK HEADER PATCH
       Full-clarity hero media, no full-section overlay.
       ========================================================= */
    header {
      background: #050505 !important;
      border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
      box-shadow: 0 12px 34px rgba(0, 0, 0, 0.26) !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
    }

    header::before {
      display: none !important;
      content: none !important;
    }

    header .logo-img,
    header .logo img {
      filter: brightness(0) invert(1) !important;
      opacity: 0.98 !important;
    }

    header .nav-links,
    header .links.nav-links {
      color: rgba(255, 255, 255, 0.78) !important;
    }

    header .nav-links a,
    header .links.nav-links a {
      color: inherit !important;
    }

    header .nav-links a:hover,
    header .nav-links a.is-active,
    header .links.nav-links a:hover,
    header .links.nav-links a.is-active {
      color: #FFFFFF !important;
    }

    header .nav-links a.is-active::after,
    header .nav-links a:hover::after {
      background: linear-gradient(90deg, transparent, #F3B421, transparent) !important;
    }

    header .language-switch {
      background: #151515 !important;
      border-color: rgba(255, 255, 255, 0.16) !important;
      box-shadow: none !important;
    }

    header .lang-btn {
      color: rgba(255, 255, 255, 0.68) !important;
    }

    header .lang-btn:hover {
      color: #FFFFFF !important;
    }

    header .lang-btn.is-active {
      background: #FFFFFF !important;
      color: #050505 !important;
      box-shadow: none !important;
    }

    header .btn-primary,
    header .btn.primary {
      color: #17120A !important;
      background: linear-gradient(180deg, #FFD96D 0%, #F3B421 100%) !important;
      border-color: rgba(255, 217, 109, 0.74) !important;
      box-shadow: 0 10px 24px rgba(243, 180, 33, 0.22) !important;
    }

    header .btn-primary:hover,
    header .btn.primary:hover {
      background: linear-gradient(180deg, #FFE08A 0%, #F6BD32 100%) !important;
      transform: translateY(-1px) !important;
    }

    .hero {
      background: #050505 !important;
      isolation: isolate !important;
    }

    .hero::before,
    .hero::after {
      display: none !important;
      content: none !important;
    }

    .hero-overlay {
      display: none !important;
      background: none !important;
    }

    .hero-video,
    .hero-video.hero-current-site-media,
    .hero-video.hero-temp-video {
      display: block !important;
      position: absolute !important;
      inset: 0 !important;
      width: 100% !important;
      height: 100% !important;
      object-fit: cover !important;
      object-position: center !important;
      opacity: 1 !important;
      filter: none !important;
      mix-blend-mode: normal !important;
      transform: none !important;
      z-index: 0 !important;
    }

    .hero-preview-image,
    .hero-preview-image.hero-current-preview {
      display: none !important;
    }

    .hero-content {
      z-index: 2 !important;
    }

    .hero-copy {
      position: relative;
      z-index: 2;
      color: #FFFFFF !important;
      filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.26));
    }

    .hero .eyebrow {
      color: #FFE08A !important;
      background: rgba(0, 0, 0, 0.58) !important;
      border: 1px solid rgba(255, 255, 255, 0.18) !important;
      box-shadow: 0 8px 22px rgba(0, 0, 0, 0.20) !important;
      text-shadow: 0 1px 5px rgba(0, 0, 0, 0.88) !important;
    }

    .hero h1,
    html[dir="rtl"] .hero h1 {
      color: #FFFFFF !important;
      -webkit-text-stroke: 0.35px rgba(0, 0, 0, 0.38);
      text-shadow:
        0 2px 4px rgba(0, 0, 0, 0.92),
        0 8px 22px rgba(0, 0, 0, 0.78),
        0 18px 42px rgba(0, 0, 0, 0.44) !important;
    }

    .hero-copy p,
    html[dir="rtl"] .hero-copy p {
      color: #FFFFFF !important;
      font-weight: 600 !important;
      text-shadow:
        0 2px 3px rgba(0, 0, 0, 0.96),
        0 6px 16px rgba(0, 0, 0, 0.82) !important;
    }

    .hero-actions .btn-primary {
      color: #17120A !important;
      background: linear-gradient(180deg, #FFDE7A 0%, #F3B421 100%) !important;
      border-color: rgba(255, 255, 255, 0.34) !important;
      box-shadow:
        0 14px 32px rgba(0, 0, 0, 0.30),
        0 10px 26px rgba(243, 180, 33, 0.28) !important;
    }

    .hero-actions .btn-primary:hover {
      background: linear-gradient(180deg, #FFE798 0%, #F7C343 100%) !important;
    }

    .hero .consultation-card {
      filter: none !important;
      box-shadow:
        0 28px 72px rgba(0, 0, 0, 0.32),
        0 0 0 1px rgba(255, 255, 255, 0.54) inset !important;
    }

    @media (max-width: 620px) {
      header .logo-img,
      header .logo img {
        opacity: 1 !important;
      }

      .hero-video,
      .hero-video.hero-current-site-media,
      .hero-video.hero-temp-video {
        object-position: center !important;
        opacity: 1 !important;
      }

      .hero-copy {
        filter: none;
      }
    }



    /* =========================================================
       FINAL DARK VIDEO-MATCHED HEADER + ORIGINAL LOGO COLORS
       ========================================================= */
    header {
      background:
        linear-gradient(135deg,
          rgba(36, 28, 22, 0.88) 0%,
          rgba(19, 31, 45, 0.90) 52%,
          rgba(49, 37, 28, 0.88) 100%) !important;
      border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
      box-shadow:
        0 14px 34px rgba(8, 13, 20, 0.26),
        inset 0 -1px 0 rgba(255, 255, 255, 0.05) !important;
      -webkit-backdrop-filter: blur(16px) saturate(1.06) !important;
      backdrop-filter: blur(16px) saturate(1.06) !important;
    }

    header::before {
      display: block !important;
      content: "" !important;
      position: absolute !important;
      top: 0 !important;
      left: 0 !important;
      right: 0 !important;
      height: 2px !important;
      background: linear-gradient(90deg, rgba(243, 180, 33, 0.95) 0%, rgba(255, 232, 170, 0.65) 42%, rgba(255, 255, 255, 0) 100%) !important;
      opacity: 0.92 !important;
      pointer-events: none !important;
    }

    header .logo {
      padding: 8px 14px !important;
      border-radius: 16px !important;
      background: rgba(255, 252, 245, 0.94) !important;
      box-shadow:
        0 10px 24px rgba(0, 0, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
    }

    header .logo-img,
    header .logo img {
      filter: none !important;
      opacity: 1 !important;
    }

    header .nav-links,
    header .links.nav-links {
      color: rgba(255, 255, 255, 0.78) !important;
    }

    header .nav-links a,
    header .links.nav-links a {
      color: inherit !important;
      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.22) !important;
    }

    header .nav-links a:hover,
    header .nav-links a.is-active,
    header .links.nav-links a:hover,
    header .links.nav-links a.is-active {
      color: #FFF4CF !important;
    }

    header .nav-links a.is-active::after,
    header .nav-links a:hover::after {
      background: linear-gradient(90deg, transparent, #F3B421, transparent) !important;
    }

    header .language-switch {
      background: rgba(255, 255, 255, 0.10) !important;
      border-color: rgba(255, 255, 255, 0.16) !important;
      box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
      -webkit-backdrop-filter: blur(14px) !important;
      backdrop-filter: blur(14px) !important;
    }

    header .lang-btn {
      color: rgba(255, 255, 255, 0.82) !important;
    }

    header .lang-btn:hover {
      color: #FFFFFF !important;
    }

    header .lang-btn.is-active {
      background: linear-gradient(180deg, #FFD96C 0%, #F3B421 100%) !important;
      color: #17212F !important;
      box-shadow: 0 7px 16px rgba(0, 0, 0, 0.16) !important;
    }

    header .btn-primary,
    header .btn.primary {
      color: #17212F !important;
      background: linear-gradient(180deg, #FFD96C 0%, #F3B421 100%) !important;
      border-color: rgba(157, 111, 10, 0.22) !important;
      box-shadow:
        0 10px 22px rgba(0, 0, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.58) !important;
    }

    header .btn-primary:hover,
    header .btn.primary:hover {
      background: linear-gradient(180deg, #FFE182 0%, #F6BD31 100%) !important;
      box-shadow:
        0 13px 26px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.66) !important;
    }




    /* =========================================================
       FINAL HEADER FIX — remove logo box + restore button motion
       ========================================================= */
    header {
      background:
        linear-gradient(135deg,
          rgba(31, 25, 22, 0.84) 0%,
          rgba(18, 30, 44, 0.88) 54%,
          rgba(44, 34, 28, 0.84) 100%) !important;
      border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
      box-shadow:
        0 14px 34px rgba(8, 13, 20, 0.24),
        inset 0 -1px 0 rgba(255, 255, 255, 0.05) !important;
      -webkit-backdrop-filter: blur(16px) saturate(1.06) !important;
      backdrop-filter: blur(16px) saturate(1.06) !important;
    }

    header .logo {
      padding: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      border-radius: 0 !important;
    }

    header .logo-img,
    header .logo img {
      filter: none !important;
      opacity: 1 !important;
      display: block !important;
    }

    header .nav-links,
    header .links.nav-links {
      color: rgba(255, 255, 255, 0.80) !important;
    }

    header .nav-links a,
    header .links.nav-links a {
      color: inherit !important;
      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.24) !important;
    }

    header .nav-links a:hover,
    header .nav-links a.is-active,
    header .links.nav-links a:hover,
    header .links.nav-links a.is-active {
      color: #FFF4CF !important;
    }

    header .nav-links a.is-active::after,
    header .nav-links a:hover::after {
      background: linear-gradient(90deg, transparent, #F3B421, transparent) !important;
    }

    header .language-switch {
      --edupath-button-angle: 0deg;
      position: relative !important;
      isolation: isolate !important;
      overflow: hidden !important;
      border: 1.5px solid transparent !important;
      border-radius: 999px !important;
      background:
        radial-gradient(100% 140% at 20% 0%, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0) 54%) padding-box,
        linear-gradient(160deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03)) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 220, 120, 0.42) 0deg,
          rgba(255, 220, 120, 0.42) 82deg,
          rgba(255, 255, 255, 0.92) 116deg,
          rgba(255, 232, 160, 0.82) 148deg,
          rgba(231, 167, 0, 0.62) 186deg,
          rgba(255, 220, 120, 0.42) 224deg,
          rgba(255, 220, 120, 0.42) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 8px 20px rgba(0, 0, 0, 0.18),
        0 0 18px rgba(243, 180, 33, 0.12) !important;
      -webkit-backdrop-filter: blur(14px) !important;
      backdrop-filter: blur(14px) !important;
      animation: edupathButtonBorderSpin 4.8s linear infinite !important;
    }

    header .lang-btn {
      position: relative !important;
      z-index: 1 !important;
      color: rgba(255, 255, 255, 0.84) !important;
      background: transparent !important;
      transition: color 0.2s ease, transform 0.2s ease, background 0.2s ease !important;
    }

    header .lang-btn:hover {
      color: #FFFFFF !important;
      transform: translateY(-1px) !important;
    }

    header .lang-btn.is-active {
      background: linear-gradient(180deg, #FFD96C 0%, #F3B421 100%) !important;
      color: #17212F !important;
      box-shadow:
        0 7px 16px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.58) !important;
    }

    header .btn-primary,
    header .btn.primary {
      color: #17212F !important;
      border: 1.5px solid transparent !important;
      border-radius: 999px !important;
      background-origin: border-box !important;
      background-clip: padding-box, border-box !important;
      background:
        radial-gradient(95% 120% at 24% 0%, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0) 52%) padding-box,
        linear-gradient(135deg, #FFECA8 0%, #FFC229 46%, #F3A900 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 206, 70, 0.62) 0deg,
          rgba(255, 206, 70, 0.62) 78deg,
          rgba(255, 255, 255, 0.98) 112deg,
          rgba(255, 231, 150, 0.96) 136deg,
          rgba(243, 180, 33, 0.92) 168deg,
          rgba(255, 206, 70, 0.62) 206deg,
          rgba(255, 206, 70, 0.62) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -9px 18px rgba(155, 98, 0, 0.16),
        0 12px 28px rgba(255, 194, 41, 0.26),
        0 0 22px rgba(255, 194, 41, 0.16) !important;
      animation: edupathButtonBorderSpin 4.8s linear infinite !important;
      transform: translateZ(0) !important;
    }

    header .btn-primary:hover,
    header .btn.primary:hover,
    header .btn-primary:focus-visible,
    header .btn.primary:focus-visible {
      transform: translateY(-2px) translateZ(0) !important;
      animation-duration: 2.6s !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.88),
        inset 0 -10px 18px rgba(155, 98, 0, 0.16),
        0 16px 34px rgba(255, 194, 41, 0.30),
        0 0 26px rgba(255, 218, 120, 0.22) !important;
    }


    /* =========================================================
       FINAL BUTTON POLISH — motion on all buttons + better lang colors
       ========================================================= */
    header .language-switch {
      padding: 4px !important;
      gap: 4px !important;
      border-radius: 999px !important;
      background: rgba(255, 255, 255, 0.08) !important;
      border: 1px solid rgba(255, 255, 255, 0.14) !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 8px 18px rgba(0, 0, 0, 0.18) !important;
      animation: none !important;
    }

    header .lang-btn,
    .consultation-toggle,
    .journey-arrow,
    .programs-arrow,
    .consultation-modal-close {
      --edupath-button-angle: 0deg;
      position: relative !important;
      isolation: isolate !important;
      overflow: hidden !important;
      border: 1.5px solid transparent !important;
      background-origin: border-box !important;
      background-clip: padding-box, border-box !important;
      animation: edupathButtonBorderSpin 4.8s linear infinite !important;
      transform: translateZ(0) !important;
      backface-visibility: hidden !important;
      -webkit-backdrop-filter: blur(14px) !important;
      backdrop-filter: blur(14px) !important;
    }

    header .lang-btn {
      min-width: 46px !important;
      min-height: 42px !important;
      padding: 0 14px !important;
      border-radius: 999px !important;
      color: #F6E9C5 !important;
      background:
        radial-gradient(100% 140% at 20% 0%, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0) 54%) padding-box,
        linear-gradient(160deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04)) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 218, 120, 0.48) 0deg,
          rgba(255, 218, 120, 0.48) 78deg,
          rgba(255, 255, 255, 0.94) 112deg,
          rgba(255, 236, 176, 0.86) 146deg,
          rgba(243, 180, 33, 0.72) 184deg,
          rgba(255, 218, 120, 0.48) 220deg,
          rgba(255, 218, 120, 0.48) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 8px 18px rgba(0, 0, 0, 0.16),
        0 0 18px rgba(243, 180, 33, 0.12) !important;
      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25) !important;
      transition: color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
    }

    header .lang-btn:hover,
    header .lang-btn:focus-visible {
      color: #FFFFFF !important;
      transform: translateY(-2px) translateZ(0) !important;
      animation-duration: 2.6s !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 12px 24px rgba(0, 0, 0, 0.20),
        0 0 20px rgba(255, 218, 120, 0.18) !important;
    }

    header .lang-btn.is-active {
      color: #17212F !important;
      text-shadow: none !important;
      background:
        radial-gradient(95% 120% at 24% 0%, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0) 52%) padding-box,
        linear-gradient(135deg, #FFECA8 0%, #FFC229 46%, #F3A900 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 206, 70, 0.62) 0deg,
          rgba(255, 206, 70, 0.62) 78deg,
          rgba(255, 255, 255, 0.98) 112deg,
          rgba(255, 231, 150, 0.96) 136deg,
          rgba(243, 180, 33, 0.92) 168deg,
          rgba(255, 206, 70, 0.62) 206deg,
          rgba(255, 206, 70, 0.62) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -9px 18px rgba(155, 98, 0, 0.16),
        0 10px 22px rgba(255, 194, 41, 0.22),
        0 0 18px rgba(255, 194, 41, 0.14) !important;
    }

    .consultation-toggle,
    .journey-arrow,
    .programs-arrow,
    .consultation-modal-close {
      color: #102542 !important;
      background:
        radial-gradient(100% 130% at 24% -8%, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0) 58%) padding-box,
        linear-gradient(160deg, rgba(255, 255, 255, 0.74), rgba(255, 248, 228, 0.44)) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 220, 120, 0.42) 0deg,
          rgba(255, 220, 120, 0.42) 84deg,
          rgba(255, 255, 255, 0.96) 116deg,
          rgba(255, 232, 160, 0.82) 150deg,
          rgba(231, 167, 0, 0.58) 184deg,
          rgba(255, 220, 120, 0.42) 220deg,
          rgba(255, 220, 120, 0.42) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.80),
        0 10px 24px rgba(171, 119, 0, 0.09),
        0 0 18px rgba(255, 194, 41, 0.10) !important;
    }

    .consultation-toggle:hover,
    .consultation-toggle:focus-visible,
    .journey-arrow:hover,
    .journey-arrow:focus-visible,
    .programs-arrow:hover,
    .programs-arrow:focus-visible,
    .consultation-modal-close:hover,
    .consultation-modal-close:focus-visible {
      transform: translateY(-2px) translateZ(0) !important;
      animation-duration: 2.6s !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.88),
        0 14px 28px rgba(171, 119, 0, 0.14),
        0 0 22px rgba(255, 218, 120, 0.16) !important;
    }

    .journey-dot {
      --edupath-button-angle: 0deg;
      border: 1.5px solid transparent !important;
      background-origin: border-box !important;
      background-clip: padding-box, border-box !important;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(255, 248, 228, 0.72)) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 220, 120, 0.32) 0deg,
          rgba(255, 255, 255, 0.9) 118deg,
          rgba(243, 180, 33, 0.72) 180deg,
          rgba(255, 220, 120, 0.32) 360deg
        ) border-box !important;
      animation: edupathButtonBorderSpin 4.8s linear infinite !important;
      box-shadow: 0 0 12px rgba(255, 194, 41, 0.10) !important;
    }

    .journey-dot.is-active {
      background:
        linear-gradient(180deg, #FFECA8 0%, #F3B421 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 206, 70, 0.62) 0deg,
          rgba(255, 255, 255, 0.98) 112deg,
          rgba(243, 180, 33, 0.92) 180deg,
          rgba(255, 206, 70, 0.62) 360deg
        ) border-box !important;
    }

    @media (prefers-reduced-motion: reduce) {
      header .lang-btn,
      .consultation-toggle,
      .journey-arrow,
      .programs-arrow,
      .consultation-modal-close,
      .journey-dot {
        animation: none !important;
      }
    }


    /* =========================================================
       FINAL HERO CTA + FA BUTTON REFINEMENT
       ========================================================= */
    .hero-actions .btn-primary,
    .hero-actions .js-open-consultation.btn-primary {
      --edupath-button-angle: 0deg;
      position: relative !important;
      isolation: isolate !important;
      overflow: hidden !important;
      border: 1.5px solid transparent !important;
      border-radius: 999px !important;
      background-origin: border-box !important;
      background-clip: padding-box, border-box !important;
      color: #17120A !important;
      background:
        radial-gradient(95% 120% at 24% 0%, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0) 52%) padding-box,
        linear-gradient(135deg, #FFECA8 0%, #FFC229 46%, #F3A900 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 206, 70, 0.62) 0deg,
          rgba(255, 206, 70, 0.62) 78deg,
          rgba(255, 255, 255, 0.98) 112deg,
          rgba(255, 231, 150, 0.96) 136deg,
          rgba(243, 180, 33, 0.92) 168deg,
          rgba(255, 206, 70, 0.62) 206deg,
          rgba(255, 206, 70, 0.62) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.92),
        inset 0 -10px 18px rgba(170, 110, 0, 0.24),
        0 22px 44px rgba(243, 180, 33, 0.44),
        0 0 44px rgba(255, 205, 74, 0.28) !important;
      animation:
        edupathButtonBorderSpin 4.8s linear infinite,
        heroGuidanceBubbleFloat 4.6s ease-in-out infinite !important;
      transform: translateZ(0) !important;
      will-change: transform, box-shadow !important;
    }

    .hero-actions .btn-primary:hover,
    .hero-actions .btn-primary:focus-visible,
    .hero-actions .js-open-consultation.btn-primary:hover,
    .hero-actions .js-open-consultation.btn-primary:focus-visible {
      transform: translateY(-2px) translateZ(0) !important;
      animation-duration: 2.6s, 4.0s !important;
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.96),
        inset 0 -11px 18px rgba(170, 110, 0, 0.26),
        0 24px 48px rgba(243, 180, 33, 0.48),
        0 0 46px rgba(255, 218, 120, 0.32) !important;
    }

    header .lang-btn:not(.is-active) {
      color: #F4E8C9 !important;
      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.22) !important;
      background:
        radial-gradient(100% 140% at 20% 0%, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0) 54%) padding-box,
        linear-gradient(160deg, rgba(29, 38, 52, 0.88), rgba(23, 28, 40, 0.82)) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(232, 193, 103, 0.38) 0deg,
          rgba(232, 193, 103, 0.38) 82deg,
          rgba(255, 255, 255, 0.75) 116deg,
          rgba(244, 223, 173, 0.58) 148deg,
          rgba(210, 157, 43, 0.55) 186deg,
          rgba(232, 193, 103, 0.38) 224deg,
          rgba(232, 193, 103, 0.38) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        inset 0 -8px 16px rgba(0, 0, 0, 0.10),
        0 8px 18px rgba(0, 0, 0, 0.16),
        0 0 16px rgba(232, 193, 103, 0.10) !important;
    }

    header .lang-btn:not(.is-active):hover,
    header .lang-btn:not(.is-active):focus-visible {
      color: #FFF7E1 !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -8px 16px rgba(0, 0, 0, 0.12),
        0 12px 22px rgba(0, 0, 0, 0.18),
        0 0 20px rgba(244, 223, 173, 0.14) !important;
    }


    /* =========================================================
       FINAL HEADER CLEANUP — navy like numbered circles
       ========================================================= */
    header {
      background: linear-gradient(180deg, rgba(16, 37, 66, 0.95) 0%, rgba(19, 44, 76, 0.93) 100%) !important;
      border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
      box-shadow:
        0 12px 28px rgba(8, 18, 34, 0.26),
        inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
      -webkit-backdrop-filter: blur(16px) saturate(1.02) !important;
      backdrop-filter: blur(16px) saturate(1.02) !important;
    }

    header::before {
      background: linear-gradient(90deg, rgba(243, 180, 33, 0.92) 0%, rgba(255, 224, 135, 0.52) 45%, rgba(255,255,255,0) 100%) !important;
      opacity: 0.72 !important;
    }

    header .nav-links,
    header .links.nav-links {
      color: rgba(255, 255, 255, 0.82) !important;
    }

    header .nav-links a,
    header .links.nav-links a {
      color: inherit !important;
      text-shadow: none !important;
    }

    header .nav-links a:hover,
    header .nav-links a.is-active,
    header .links.nav-links a:hover,
    header .links.nav-links a.is-active {
      color: #FFE3A0 !important;
    }

    header .language-switch {
      padding: 4px !important;
      gap: 4px !important;
      background: rgba(255, 255, 255, 0.06) !important;
      border: 1px solid rgba(255, 255, 255, 0.10) !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 8px 18px rgba(5, 13, 26, 0.18) !important;
      animation: none !important;
    }

    header .lang-btn {
      min-width: 46px !important;
      min-height: 42px !important;
      padding: 0 14px !important;
      border-radius: 999px !important;
      color: rgba(255, 255, 255, 0.88) !important;
      text-shadow: none !important;
      background:
        linear-gradient(180deg, rgba(22, 48, 82, 0.96) 0%, rgba(15, 33, 59, 0.96) 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(216, 182, 94, 0.30) 0deg,
          rgba(255,255,255,0.70) 118deg,
          rgba(216, 182, 94, 0.56) 180deg,
          rgba(216, 182, 94, 0.30) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        inset 0 -6px 14px rgba(0, 0, 0, 0.10),
        0 6px 14px rgba(6, 14, 28, 0.16) !important;
    }

    header .lang-btn:hover,
    header .lang-btn:focus-visible {
      color: #FFFFFF !important;
      transform: translateY(-2px) translateZ(0) !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 10px 18px rgba(6, 14, 28, 0.20),
        0 0 18px rgba(216, 182, 94, 0.12) !important;
    }

    header .lang-btn.is-active {
      color: #102542 !important;
      background:
        linear-gradient(180deg, #FFE7A0 0%, #F3B421 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 208, 87, 0.58) 0deg,
          rgba(255,255,255,0.95) 114deg,
          rgba(243, 180, 33, 0.88) 180deg,
          rgba(255, 208, 87, 0.58) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        0 8px 18px rgba(243, 180, 33, 0.20) !important;
    }

    header .btn-primary,
    header .btn.primary {
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -9px 18px rgba(155, 98, 0, 0.16),
        0 10px 22px rgba(255, 194, 41, 0.22),
        0 0 18px rgba(255, 194, 41, 0.12) !important;
    }


    /* =========================================================
       FINAL HEADER OVERRIDE — match white section color
       ========================================================= */
    header {
      background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
      border-bottom: 1px solid rgba(16, 37, 66, 0.08) !important;
      box-shadow:
        0 10px 24px rgba(16, 37, 66, 0.08),
        inset 0 -1px 0 rgba(255, 255, 255, 0.65) !important;
      -webkit-backdrop-filter: blur(14px) saturate(1.02) !important;
      backdrop-filter: blur(14px) saturate(1.02) !important;
    }

    header::before {
      background: linear-gradient(90deg, rgba(243, 180, 33, 0.85) 0%, rgba(255, 224, 135, 0.45) 42%, rgba(255,255,255,0) 100%) !important;
      opacity: 0.6 !important;
    }

    header .nav-links,
    header .links.nav-links {
      color: rgba(16, 37, 66, 0.78) !important;
    }

    header .nav-links a,
    header .links.nav-links a {
      color: inherit !important;
      text-shadow: none !important;
    }

    header .nav-links a:hover,
    header .nav-links a.is-active,
    header .links.nav-links a:hover,
    header .links.nav-links a.is-active {
      color: #102542 !important;
    }

    header .nav-links a.is-active::after,
    header .nav-links a:hover::after {
      background: linear-gradient(90deg, transparent, #F3B421, transparent) !important;
    }

    header .language-switch {
      background: rgba(16, 37, 66, 0.04) !important;
      border: 1px solid rgba(16, 37, 66, 0.10) !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        0 6px 14px rgba(16, 37, 66, 0.06) !important;
    }

    header .lang-btn {
      color: #4B5A6C !important;
      background:
        linear-gradient(180deg, #FFFFFF 0%, #F6F8FB 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(219, 226, 235, 0.9) 0deg,
          rgba(255,255,255,1) 118deg,
          rgba(198, 210, 224, 0.95) 180deg,
          rgba(219, 226, 235, 0.9) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.95),
        0 4px 10px rgba(16, 37, 66, 0.05) !important;
      text-shadow: none !important;
    }

    header .lang-btn:hover,
    header .lang-btn:focus-visible {
      color: #102542 !important;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,1),
        0 8px 16px rgba(16, 37, 66, 0.08) !important;
    }

    header .lang-btn.is-active {
      color: #17212F !important;
      background:
        linear-gradient(180deg, #FFE7A0 0%, #F3B421 100%) padding-box,
        conic-gradient(
          from var(--edupath-button-angle),
          rgba(255, 208, 87, 0.58) 0deg,
          rgba(255,255,255,0.95) 114deg,
          rgba(243, 180, 33, 0.88) 180deg,
          rgba(255, 208, 87, 0.58) 360deg
        ) border-box !important;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.7),
        0 8px 18px rgba(243,180,33,0.18) !important;
    }


    /* =========================================================
       FINAL HEADER OVERRIDE — larger logo to match header buttons
       ========================================================= */
    header .logo {
      display: inline-flex !important;
      align-items: center !important;
    }

    header .logo-img,
    header .logo img {
      width: 182px !important;
      max-height: 68px !important;
      height: auto !important;
      object-fit: contain !important;
    }

    @media (max-width: 980px) {
      header .logo-img,
      header .logo img {
        width: 160px !important;
        max-height: 62px !important;
      }
    }

    @media (max-width: 620px) {
      header .logo-img,
      header .logo img {
        width: 138px !important;
        max-height: 54px !important;
      }
    }


    /* =========================================================
       CLEAN COMPACT STEP PROGRESS — remove the three mobile dots
       ========================================================= */
    @media (max-width: 820px) {
      .mission-progress {
        height: 20px !important;
        padding: 0 !important;
        display: block !important;
      }

      .mission-progress .progress-dot {
        display: none !important;
      }

      .mission-progress .progress-line {
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        height: 4px !important;
      }

      .mission-progress .progress-fill {
        left: 0 !important;
        right: auto !important;
        max-width: 100% !important;
        height: 4px !important;
      }

      html[dir="rtl"] .mission-progress .progress-fill {
        left: auto !important;
        right: 0 !important;
      }
    }


    /* =========================================================
       REAL GOOGLE REVIEWS — use clean initials instead of stock faces
       ========================================================= */
    .review-avatar.review-initials {
      background-image: none !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      background: linear-gradient(180deg, #FFF7DF 0%, #FFFFFF 100%) !important;
      color: #102542 !important;
      font-weight: 900 !important;
      font-size: 24px !important;
      letter-spacing: -0.03em;
    }


    /* =========================================================
       GOOGLE REVIEWS — refined equal-card layout
       ========================================================= */
    .google-reviews-section {
      background:
        radial-gradient(circle at 12% 14%, rgba(243, 180, 33, 0.055), transparent 26%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
      overflow: hidden;
    }

    .google-reviews-header {
      margin-bottom: 24px !important;
    }

    .google-reviews-header p {
      max-width: 620px;
      margin-inline: auto;
    }

    .google-rating-summary {
      width: fit-content;
      margin: 0 auto 34px;
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 12px 18px;
      border-radius: 18px;
      background: rgba(255, 255, 255, 0.86);
      border: 1px solid rgba(16, 37, 66, 0.10);
      box-shadow: 0 12px 30px rgba(16, 37, 66, 0.07);
      -webkit-backdrop-filter: blur(14px);
      backdrop-filter: blur(14px);
    }

    .google-mark {
      width: 42px;
      height: 42px;
      border-radius: 14px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      font-size: 23px;
      font-weight: 900;
      color: #4285F4;
      background: #FFFFFF;
      border: 1px solid rgba(16, 37, 66, 0.08);
      box-shadow: 0 8px 18px rgba(16, 37, 66, 0.07);
    }

    .google-rating-copy {
      display: grid;
      gap: 2px;
    }

    .google-rating-line {
      display: flex;
      align-items: center;
      gap: 9px;
    }

    .google-rating-line strong {
      color: #102542;
      font-size: 20px;
      line-height: 1;
    }

    .google-summary-stars,
    .google-review-stars {
      color: #F4B400;
      letter-spacing: 0.08em;
      line-height: 1;
    }

    .google-rating-copy small {
      color: #6E7582;
      font-size: 12px;
      font-weight: 700;
    }

    .google-reviews-wrap {
      max-width: 1120px !important;
      margin: 0 auto !important;
      padding: 0 !important;
      overflow: visible !important;
    }

    .google-reviews-grid {
      position: relative !important;
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      gap: 20px !important;
      height: auto !important;
      max-width: none !important;
      overflow: visible !important;
      align-items: stretch !important;
    }

    .google-review-card,
    .google-review-card.is-active,
    .google-review-card.is-prev,
    .google-review-card.is-next,
    .google-review-card.is-hidden-left,
    .google-review-card.is-hidden-right {
      position: relative !important;
      inset: auto !important;
      width: auto !important;
      min-height: 320px !important;
      padding: 28px !important;
      opacity: 1 !important;
      pointer-events: auto !important;
      transform: none !important;
      display: flex !important;
      flex-direction: column !important;
      justify-content: flex-start !important;
      text-align: left !important;
      border-radius: 24px !important;
      background: #FFFFFF !important;
      border: 1px solid rgba(16, 37, 66, 0.10) !important;
      box-shadow:
        0 20px 54px rgba(16, 37, 66, 0.075),
        inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
      overflow: hidden !important;
      z-index: 1 !important;
    }

    .google-review-card::before {
      content: "" !important;
      position: absolute !important;
      top: 0 !important;
      left: 0 !important;
      right: 0 !important;
      height: 3px !important;
      background: linear-gradient(90deg, #F3B421, #FFE3A0, transparent) !important;
      opacity: 0.92 !important;
    }

    .google-review-card:hover {
      transform: translateY(-6px) !important;
      border-color: rgba(243, 180, 33, 0.30) !important;
      box-shadow:
        0 28px 66px rgba(16, 37, 66, 0.10),
        0 0 24px rgba(243, 180, 33, 0.08) !important;
    }

    .google-review-topline {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 24px;
    }

    .google-review-stars {
      font-size: 16px;
      white-space: nowrap;
    }

    .google-review-source {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      color: #566273;
      font-size: 11px;
      font-weight: 800;
      white-space: nowrap;
    }

    .google-review-source > span {
      width: 22px;
      height: 22px;
      border-radius: 7px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #4285F4;
      background: #F8FAFD;
      border: 1px solid rgba(16, 37, 66, 0.08);
      font-size: 12px;
      font-weight: 900;
    }

    .google-review-card blockquote {
      margin: 0 0 26px !important;
      color: #384455 !important;
      font-size: 15.5px !important;
      line-height: 1.78 !important;
      font-style: normal !important;
      text-align: left !important;
      flex: 1;
    }

    .google-review-card blockquote::before {
      content: "“";
      display: block;
      margin-bottom: 8px;
      color: #F3B421;
      font-family: Georgia, serif;
      font-size: 46px;
      line-height: 0.6;
    }

    .google-review-footer {
      display: flex;
      align-items: center;
      gap: 12px;
      padding-top: 20px;
      border-top: 1px solid rgba(16, 37, 66, 0.08);
      margin-top: auto;
    }

    .reviewer-avatar {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      color: #102542;
      font-size: 13px;
      font-weight: 900;
      background: linear-gradient(180deg, #FFF7DF 0%, #FFFFFF 100%);
      border: 1px solid rgba(243, 180, 33, 0.22);
    }

    .google-review-footer strong,
    .google-review-footer small {
      display: block;
    }

    .google-review-footer strong {
      color: #102542;
      font-size: 14px;
      line-height: 1.35;
      margin-bottom: 2px;
    }

    .google-review-footer small {
      color: #7A8390;
      font-size: 11.5px;
      font-weight: 600;
    }

    .google-reviews-section .journey-controls {
      display: none !important;
    }

    html[dir="rtl"] .google-review-card,
    html[dir="rtl"] .google-review-card blockquote {
      text-align: right !important;
    }

    html[dir="rtl"] .google-review-card blockquote::before {
      content: "”";
    }

    @media (max-width: 980px) {
      .google-reviews-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }

      .google-review-card:last-child {
        grid-column: 1 / -1;
        max-width: 540px;
        width: 100% !important;
        justify-self: center;
      }
    }

    @media (max-width: 680px) {
      .google-rating-summary {
        width: min(100%, 360px);
        justify-content: center;
      }

      .google-reviews-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
      }

      .google-review-card,
      .google-review-card.is-active,
      .google-review-card.is-prev,
      .google-review-card.is-next,
      .google-review-card.is-hidden-left,
      .google-review-card.is-hidden-right {
        min-height: auto !important;
        padding: 24px !important;
      }

      .google-review-card:last-child {
        grid-column: auto;
        max-width: none;
      }

      .google-review-topline {
        align-items: flex-start;
      }
    }


    /* =========================================================
       FINAL GOOGLE REVIEWS SPOTLIGHT — one elegant card at a time
       ========================================================= */
    .google-reviews-section {
      padding-top: 78px !important;
      padding-bottom: 82px !important;
      background:
        radial-gradient(circle at 12% 18%, rgba(243, 180, 33, 0.06), transparent 24%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
    }

    .google-reviews-header {
      max-width: 700px !important;
      margin-bottom: 18px !important;
    }

    .google-reviews-header h2 {
      margin-bottom: 12px !important;
    }

    .google-reviews-header p {
      max-width: 560px !important;
      margin-inline: auto !important;
    }

    .google-rating-summary {
      margin: 0 auto 28px !important;
      padding: 10px 16px !important;
      border-radius: 999px !important;
      background: #FFFFFF !important;
      border: 1px solid rgba(16, 37, 66, 0.09) !important;
      box-shadow: 0 10px 26px rgba(16, 37, 66, 0.06) !important;
    }

    .google-mark {
      width: 34px !important;
      height: 34px !important;
      border-radius: 50% !important;
      font-size: 18px !important;
      box-shadow: none !important;
    }

    .google-rating-line strong {
      font-size: 18px !important;
    }

    .google-reviews-wrap {
      position: relative !important;
      max-width: 820px !important;
      margin: 0 auto !important;
      padding: 0 24px 6px !important;
      overflow: visible !important;
    }

    .google-reviews-grid {
      position: relative !important;
      display: block !important;
      width: 100% !important;
      height: 350px !important;
      max-width: 760px !important;
      margin: 0 auto !important;
      overflow: visible !important;
    }

    .google-review-card,
    .google-review-card.is-active,
    .google-review-card.is-prev,
    .google-review-card.is-next,
    .google-review-card.is-hidden-left,
    .google-review-card.is-hidden-right {
      position: absolute !important;
      top: 0 !important;
      left: 50% !important;
      right: auto !important;
      bottom: auto !important;
      width: 100% !important;
      min-height: 320px !important;
      padding: 34px 38px 30px !important;
      border-radius: 28px !important;
      background:
        radial-gradient(circle at 92% 8%, rgba(243, 180, 33, 0.10), transparent 22%),
        #FFFFFF !important;
      border: 1px solid rgba(16, 37, 66, 0.10) !important;
      box-shadow:
        0 26px 70px rgba(16, 37, 66, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
      opacity: 0 !important;
      pointer-events: none !important;
      transform: translateX(-50%) translateY(18px) scale(0.97) !important;
      transition:
        opacity 0.42s ease,
        transform 0.52s cubic-bezier(.22,.8,.2,1),
        box-shadow 0.3s ease !important;
      overflow: hidden !important;
      z-index: 1 !important;
    }

    .google-review-card::before {
      content: "" !important;
      position: absolute !important;
      top: 0 !important;
      left: 32px !important;
      right: 32px !important;
      height: 2px !important;
      border-radius: 99px !important;
      background: linear-gradient(90deg, transparent, #F3B421, transparent) !important;
      opacity: 0.8 !important;
    }

    .google-review-card.is-active {
      opacity: 1 !important;
      pointer-events: auto !important;
      transform: translateX(-50%) translateY(0) scale(1) !important;
      z-index: 4 !important;
    }

    .google-review-card.is-prev,
    .google-review-card.is-next,
    .google-review-card.is-hidden-left,
    .google-review-card.is-hidden-right {
      opacity: 0 !important;
      pointer-events: none !important;
    }

    .google-review-card:hover,
    .google-review-card.is-active:hover {
      transform: translateX(-50%) translateY(-4px) scale(1) !important;
      border-color: rgba(243, 180, 33, 0.24) !important;
      box-shadow:
        0 32px 78px rgba(16, 37, 66, 0.12),
        0 0 22px rgba(243, 180, 33, 0.07) !important;
    }

    .google-review-topline {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      gap: 16px !important;
      margin-bottom: 22px !important;
    }

    .google-review-stars {
      font-size: 17px !important;
      letter-spacing: 0.11em !important;
    }

    .google-review-source {
      padding: 6px 10px !important;
      border-radius: 999px !important;
      color: #536174 !important;
      background: #F8FAFC !important;
      border: 1px solid rgba(16, 37, 66, 0.08) !important;
      font-size: 11px !important;
    }

    .google-review-source > span {
      width: 18px !important;
      height: 18px !important;
      border-radius: 50% !important;
      background: #FFFFFF !important;
      box-shadow: none !important;
    }

    .google-review-card blockquote {
      margin: 0 0 24px !important;
      color: #27364A !important;
      font-size: clamp(16px, 1.35vw, 18px) !important;
      line-height: 1.82 !important;
      font-weight: 500 !important;
      text-align: left !important;
      flex: 1 !important;
    }

    .google-review-card blockquote::before {
      content: "“" !important;
      display: inline !important;
      margin: 0 8px 0 0 !important;
      color: #F3B421 !important;
      font-family: Georgia, serif !important;
      font-size: 42px !important;
      line-height: 0 !important;
      vertical-align: -10px !important;
    }

    .google-review-footer {
      display: flex !important;
      align-items: center !important;
      gap: 12px !important;
      padding-top: 18px !important;
      border-top: 1px solid rgba(16, 37, 66, 0.08) !important;
      margin-top: auto !important;
    }

    .reviewer-avatar {
      width: 40px !important;
      height: 40px !important;
      background: #FFF8E7 !important;
      border: 1px solid rgba(243, 180, 33, 0.22) !important;
      box-shadow: none !important;
    }

    .google-review-footer strong {
      font-size: 14px !important;
    }

    .google-review-footer small {
      font-size: 11.5px !important;
    }

    .google-reviews-section .journey-controls,
    .google-review-controls {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 14px !important;
      margin-top: 22px !important;
    }

    .google-review-controls .journey-arrow {
      width: 42px !important;
      height: 42px !important;
      border-radius: 50% !important;
      font-size: 21px !important;
      background: #FFFFFF !important;
      border-color: rgba(16, 37, 66, 0.11) !important;
      color: #102542 !important;
      box-shadow: 0 10px 22px rgba(16, 37, 66, 0.07) !important;
    }

    .google-review-controls .journey-arrow:hover {
      color: #102542 !important;
      background: #FFF9E8 !important;
      border-color: rgba(243, 180, 33, 0.30) !important;
    }

    .google-review-controls .journey-dots {
      gap: 7px !important;
      padding: 0 2px !important;
    }

    .google-review-controls .journey-dot {
      width: 7px !important;
      height: 7px !important;
      min-width: 7px !important;
      border-radius: 99px !important;
      background: #D6DCE5 !important;
      border: none !important;
      box-shadow: none !important;
      animation: none !important;
    }

    .google-review-controls .journey-dot.is-active {
      width: 24px !important;
      min-width: 24px !important;
      background: #F3B421 !important;
    }

    html[dir="rtl"] .google-review-card blockquote {
      text-align: right !important;
    }

    html[dir="rtl"] .google-review-card blockquote::before {
      content: "”" !important;
      margin: 0 0 0 8px !important;
    }

    @media (max-width: 760px) {
      .google-reviews-section {
        padding-top: 64px !important;
        padding-bottom: 68px !important;
      }

      .google-reviews-wrap {
        padding: 0 8px !important;
      }

      .google-reviews-grid {
        height: 430px !important;
      }

      .google-review-card,
      .google-review-card.is-active,
      .google-review-card.is-prev,
      .google-review-card.is-next,
      .google-review-card.is-hidden-left,
      .google-review-card.is-hidden-right {
        min-height: 400px !important;
        padding: 28px 24px 24px !important;
        border-radius: 24px !important;
      }

      .google-review-topline {
        align-items: flex-start !important;
      }

      .google-review-card blockquote {
        font-size: 15.5px !important;
        line-height: 1.82 !important;
      }
    }

    @media (max-width: 460px) {
      .google-rating-summary {
        width: 100% !important;
        justify-content: center !important;
      }

      .google-reviews-grid {
        height: 500px !important;
      }

      .google-review-card,
      .google-review-card.is-active,
      .google-review-card.is-prev,
      .google-review-card.is-next,
      .google-review-card.is-hidden-left,
      .google-review-card.is-hidden-right {
        min-height: 470px !important;
        padding: 26px 20px 22px !important;
      }

      .google-review-topline {
        flex-direction: column !important;
        gap: 10px !important;
      }
    }


    /* =========================================================
       MOBILE PROGRAMS CAROUSEL V6 — swipe-first responsive layout
       ========================================================= */
    @media (max-width: 620px) {
      .programs {
        padding-top: 58px !important;
        padding-bottom: 64px !important;
        overflow: hidden !important;
      }

      .programs-header {
        margin-bottom: 24px !important;
        padding-inline: 4px;
        text-align: center;
      }

      .programs-header .eyebrow {
        margin-bottom: 8px !important;
      }

      .programs-header h2 {
        font-size: clamp(29px, 9vw, 36px) !important;
        line-height: 1.08 !important;
        margin-bottom: 14px !important;
      }

      .programs-header p {
        max-width: 34ch;
        margin-inline: auto;
        font-size: 15px !important;
        line-height: 1.65 !important;
      }

      .programs-carousel {
        display: block !important;
        width: 100% !important;
        overflow: visible !important;
      }

      .programs-arrow,
      .programs-arrow-prev,
      .programs-arrow-next {
        display: none !important;
      }

      .programs-viewport {
        width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 4px 2px 14px !important;
        margin: 0 !important;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        scroll-padding-inline: 2px;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        touch-action: pan-x pan-y;
      }

      .programs-viewport::-webkit-scrollbar {
        display: none;
      }

      .programs-track {
        width: max-content !important;
        gap: 12px !important;
        padding: 0 !important;
        transform: none !important;
        transition: none !important;
      }

      /* Mobile uses native horizontal scrolling, so every card must be visible
         before it enters the viewport. Desktop keeps the staggered reveal. */
      .programs-track .program-category-card[data-reveal-fade] {
        opacity: 1 !important;
        transition: none !important;
      }

      .program-category-card {
        flex: 0 0 var(--mobile-program-card-width, 220px) !important;
        width: var(--mobile-program-card-width, 220px) !important;
        min-height: 244px !important;
        scroll-snap-align: start;
        scroll-snap-stop: always;
        border-radius: 22px !important;
      }

      .program-category-card .program-image {
        height: 148px !important;
      }

      .program-category-card .program-content {
        min-height: 92px !important;
        padding: 18px 18px 20px !important;
        align-items: center !important;
      }

      .program-category-card .program-content h3 {
        font-size: 19px !important;
        line-height: 1.25 !important;
      }

      .programs-dots {
        min-height: 12px;
        margin-top: 14px !important;
        gap: 7px !important;
      }

      .programs-dot {
        width: 7px !important;
        height: 7px !important;
      }

      .programs-dot.is-active {
        width: 24px !important;
      }

      .programs-center-action {
        margin-top: 18px !important;
      }

      .programs-center-action .btn {
        width: min(100%, 326px) !important;
        min-height: 50px !important;
        margin-inline: auto;
      }
    }




/* =========================================================
   FINAL GOOGLE REVIEWS — TRUE CAROUSEL LAYOUT
   ========================================================= */
.google-reviews-wrap {
  max-width: 1100px !important;
  padding: 0 24px 8px !important;
  overflow: hidden !important;
}

.google-reviews-grid {
  height: 360px !important;
  max-width: 1000px !important;
  overflow: visible !important;
}

.google-review-card,
.google-review-card.is-active,
.google-review-card.is-prev,
.google-review-card.is-next,
.google-review-card.is-hidden-left,
.google-review-card.is-hidden-right {
  width: 340px !important;
  min-height: 300px !important;
  max-height: 300px !important;
  padding: 28px 26px 22px !important;
  border-radius: 26px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  opacity: 0 !important;
  pointer-events: none !important;
  top: 18px !important;
}

.google-review-card.is-active {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) scale(1) !important;
  z-index: 5 !important;
  box-shadow:
    0 26px 70px rgba(16, 37, 66, 0.12),
    0 0 24px rgba(243, 180, 33, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.96) !important;
}

.google-review-card.is-prev,
.google-review-card.is-next {
  opacity: 0.72 !important;
  pointer-events: auto !important;
  z-index: 3 !important;
  filter: saturate(0.95) !important;
}

.google-review-card.is-prev {
  transform: translate(calc(-50% - 270px), 14px) scale(0.92) !important;
}

.google-review-card.is-next {
  transform: translate(calc(-50% + 270px), 14px) scale(0.92) !important;
}

.google-review-card.is-hidden-left {
  opacity: 0 !important;
  transform: translate(calc(-50% - 540px), 18px) scale(0.88) !important;
}

.google-review-card.is-hidden-right {
  opacity: 0 !important;
  transform: translate(calc(-50% + 540px), 18px) scale(0.88) !important;
}

.google-review-card:hover,
.google-review-card.is-active:hover {
  transform: translateX(-50%) translateY(-4px) scale(1) !important;
}

.google-review-card.is-prev:hover {
  transform: translate(calc(-50% - 270px), 10px) scale(0.92) !important;
  opacity: 0.82 !important;
}

.google-review-card.is-next:hover {
  transform: translate(calc(-50% + 270px), 10px) scale(0.92) !important;
  opacity: 0.82 !important;
}

.google-review-topline {
  margin-bottom: 16px !important;
}

.google-review-card blockquote {
  margin: 0 !important;
  flex: 1 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 6 !important;
  overflow: hidden !important;
  font-size: 16px !important;
  line-height: 1.8 !important;
}

.google-review-card.is-active blockquote {
  -webkit-line-clamp: 7 !important;
}

.google-review-footer {
  margin-top: 18px !important;
  padding-top: 14px !important;
}

.google-review-controls {
  margin-top: 14px !important;
}

@media (max-width: 1120px) {
  .google-reviews-wrap {
    max-width: 940px !important;
  }
  .google-review-card,
  .google-review-card.is-active,
  .google-review-card.is-prev,
  .google-review-card.is-next,
  .google-review-card.is-hidden-left,
  .google-review-card.is-hidden-right {
    width: 300px !important;
    min-height: 290px !important;
    max-height: 290px !important;
  }
  .google-review-card.is-prev {
    transform: translate(calc(-50% - 225px), 16px) scale(0.9) !important;
  }
  .google-review-card.is-next {
    transform: translate(calc(-50% + 225px), 16px) scale(0.9) !important;
  }
  .google-review-card.is-hidden-left {
    transform: translate(calc(-50% - 470px), 20px) scale(0.86) !important;
  }
  .google-review-card.is-hidden-right {
    transform: translate(calc(-50% + 470px), 20px) scale(0.86) !important;
  }
}

@media (max-width: 860px) {
  .google-reviews-wrap {
    max-width: 540px !important;
    padding: 0 8px 8px !important;
  }
  .google-reviews-grid {
    height: 380px !important;
    max-width: 460px !important;
  }
  .google-review-card,
  .google-review-card.is-active,
  .google-review-card.is-prev,
  .google-review-card.is-next,
  .google-review-card.is-hidden-left,
  .google-review-card.is-hidden-right {
    width: min(88vw, 400px) !important;
    min-height: 320px !important;
    max-height: 320px !important;
    top: 10px !important;
  }
  .google-review-card.is-active {
    transform: translateX(-50%) translateY(0) scale(1) !important;
  }
  .google-review-card.is-prev,
  .google-review-card.is-next {
    opacity: 0.18 !important;
    pointer-events: none !important;
  }
  .google-review-card.is-prev {
    transform: translate(calc(-50% - 92vw), 10px) scale(0.92) !important;
  }
  .google-review-card.is-next {
    transform: translate(calc(-50% + 92vw), 10px) scale(0.92) !important;
  }
  .google-review-card.is-hidden-left,
  .google-review-card.is-hidden-right {
    opacity: 0 !important;
  }
}

@media (max-width: 520px) {
  .google-reviews-grid {
    height: 430px !important;
  }
  .google-review-card,
  .google-review-card.is-active,
  .google-review-card.is-prev,
  .google-review-card.is-next,
  .google-review-card.is-hidden-left,
  .google-review-card.is-hidden-right {
    width: min(92vw, 390px) !important;
    min-height: 370px !important;
    max-height: 370px !important;
    padding: 24px 20px 20px !important;
  }
  .google-review-topline {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }
  .google-review-card blockquote {
    font-size: 15px !important;
    -webkit-line-clamp: 8 !important;
  }
}



/* FINAL GOOGLE REVIEWS HEADER CLEANUP */
.google-reviews-header {
  margin-bottom: 20px !important;
}
.google-reviews-header .eyebrow {
  margin-bottom: 0 !important;
}
.google-rating-summary {
  display: none !important;
}




/* =========================================================
   EDUPATH SHARED SITE SHELL — unified header, language switch & footer
   ========================================================= */
.edupath-site-header{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  min-height:76px !important;
  border-bottom:1px solid rgba(243,180,33,.24) !important;
  background:rgba(255,253,247,.86) !important;
  box-shadow:0 12px 38px rgba(16,37,66,.065) !important;
  -webkit-backdrop-filter:blur(20px) saturate(1.18) !important;
  backdrop-filter:blur(20px) saturate(1.18) !important;
}
.edupath-site-header .edupath-header-inner{
  width:min(1160px,92%) !important;
  min-height:76px !important;
  margin-inline:auto !important;
  padding:10px 0 !important;
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:clamp(18px,2.5vw,34px) !important;
}
.edupath-site-header .edupath-header-logo{
  display:inline-flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  min-width:0 !important;
}
.edupath-site-header .edupath-header-logo img{
  width:150px !important;
  height:auto !important;
  max-height:56px !important;
  object-fit:contain !important;
}
.edupath-site-header .edupath-header-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:clamp(18px,2.2vw,30px) !important;
  min-width:0 !important;
}
.edupath-site-header .edupath-header-nav a{
  position:relative !important;
  padding:10px 0 !important;
  color:rgba(23,33,47,.65) !important;
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  transition:color .2s ease !important;
}
.edupath-site-header .edupath-header-nav a:hover,
.edupath-site-header .edupath-header-nav a.is-active{
  color:#102542 !important;
}
.edupath-site-header .edupath-header-nav a::after{
  content:"" !important;
  position:absolute !important;
  left:10% !important;
  right:10% !important;
  bottom:2px !important;
  height:2px !important;
  border-radius:99px !important;
  background:linear-gradient(90deg,transparent,#F3B421,transparent) !important;
  opacity:0 !important;
  transform:scaleX(.35) !important;
  transition:opacity .2s ease,transform .2s ease !important;
}
.edupath-site-header .edupath-header-nav a:hover::after,
.edupath-site-header .edupath-header-nav a.is-active::after{
  opacity:1 !important;
  transform:scaleX(1) !important;
}
.edupath-site-header .edupath-header-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  min-width:0 !important;
}
.edupath-language-switch{
  display:inline-grid !important;
  grid-template-columns:auto 1fr 1fr !important;
  align-items:center !important;
  gap:3px !important;
  min-height:46px !important;
  padding:4px !important;
  border:1px solid rgba(16,37,66,.12) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.76) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 24px rgba(16,37,66,.06) !important;
  -webkit-backdrop-filter:blur(16px) !important;
  backdrop-filter:blur(16px) !important;
  direction:ltr !important;
}
.edupath-language-switch .language-icon{
  width:30px !important;
  height:30px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#9B7009 !important;
  border-radius:50% !important;
  background:rgba(243,180,33,.11) !important;
}
.edupath-language-switch .language-icon svg{
  width:16px !important;
  height:16px !important;
  display:block !important;
}
.edupath-language-switch .lang-btn{
  appearance:none !important;
  min-width:72px !important;
  min-height:36px !important;
  padding:0 11px !important;
  border:0 !important;
  border-radius:999px !important;
  background:transparent !important;
  color:rgba(16,37,66,.60) !important;
  font-family:Inter,Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:900 !important;
  line-height:1 !important;
  cursor:pointer !important;
  transition:background .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease !important;
}
.edupath-language-switch .lang-btn[data-lang="fa"]{
  font-family:"Vazirmatn",Tahoma,Arial,sans-serif !important;
  font-size:12px !important;
}
.edupath-language-switch .lang-btn:hover{
  color:#102542 !important;
  background:rgba(243,180,33,.10) !important;
}
.edupath-language-switch .lang-btn.is-active{
  color:#fff !important;
  background:linear-gradient(145deg,#18395F,#102542) !important;
  box-shadow:0 8px 18px rgba(16,37,66,.19),inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.edupath-language-switch .lang-btn:focus-visible{
  outline:3px solid rgba(243,180,33,.42) !important;
  outline-offset:2px !important;
}
.edupath-site-header .edupath-shell-btn{
  min-height:46px !important;
  padding:0 19px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  white-space:nowrap !important;
  font-size:13px !important;
  font-weight:900 !important;
  line-height:1 !important;
  text-decoration:none !important;
}
.edupath-site-header .edupath-shell-secondary{
  color:#102542 !important;
  border:1px solid rgba(16,37,66,.12) !important;
  background:rgba(255,255,255,.67) !important;
  box-shadow:0 10px 24px rgba(16,37,66,.055),inset 0 1px 0 rgba(255,255,255,.88) !important;
}
.edupath-site-header .edupath-shell-primary{
  color:#2A2108 !important;
  border:1px solid rgba(231,167,0,.40) !important;
  background:linear-gradient(135deg,#FFECA8 0%,#FFC229 48%,#F3A900 100%) !important;
  box-shadow:0 12px 26px rgba(243,180,33,.24),inset 0 1px 0 rgba(255,255,255,.74) !important;
}
.edupath-site-header .edupath-shell-btn:hover{
  transform:translateY(-2px) !important;
}
.edupath-site-header .edupath-shell-primary:hover{
  box-shadow:0 16px 32px rgba(243,180,33,.30),inset 0 1px 0 rgba(255,255,255,.82) !important;
}
.edupath-site-header .cta-mobile{display:none !important;}
.edupath-language-switch .lang-short{display:none !important;}

.edupath-site-footer{
  position:relative !important;
  overflow:hidden !important;
  padding:0 0 26px !important;
  color:#DCE4EF !important;
  background:
    radial-gradient(circle at 8% 0%,rgba(243,180,33,.13),transparent 24%),
    radial-gradient(circle at 92% 14%,rgba(74,117,168,.16),transparent 26%),
    linear-gradient(155deg,#102542 0%,#0B1F3A 58%,#07172C 100%) !important;
  border-top:1px solid rgba(243,180,33,.30) !important;
}
.edupath-site-footer::before{
  display:none !important;
}
.edupath-site-footer .edupath-footer-container{
  position:relative !important;
  z-index:1 !important;
  width:min(1160px,92%) !important;
  margin-inline:auto !important;
}
.edupath-site-footer .footer-cta-panel{
  transform:translateY(-1px) !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:30px !important;
  padding:30px 32px !important;
  border:1px solid rgba(243,180,33,.34) !important;
  border-radius:0 0 28px 28px !important;
  background:
    radial-gradient(circle at 84% 16%,rgba(255,227,138,.18),transparent 30%),
    linear-gradient(135deg,rgba(255,255,255,.105),rgba(255,255,255,.045)) !important;
  box-shadow:0 24px 58px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.12) !important;
  -webkit-backdrop-filter:blur(16px) !important;
  backdrop-filter:blur(16px) !important;
}
.edupath-site-footer .footer-cta-copy{max-width:720px !important;}
.edupath-site-footer .footer-eyebrow{
  display:block !important;
  margin-bottom:7px !important;
  color:#F3C85D !important;
  font-size:11px !important;
  font-weight:900 !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
}
.edupath-site-footer .footer-cta-panel h2{
  margin:0 0 8px !important;
  color:#fff !important;
  font-size:clamp(25px,3vw,36px) !important;
  line-height:1.1 !important;
  letter-spacing:-.045em !important;
}
.edupath-site-footer .footer-cta-panel p{
  margin:0 !important;
  color:rgba(220,228,239,.72) !important;
  font-size:14px !important;
  line-height:1.65 !important;
}
.edupath-site-footer .footer-cta-button{
  min-height:50px !important;
  padding:0 23px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#2A2108 !important;
  background:linear-gradient(135deg,#FFECA8,#FFC229 50%,#F3A900) !important;
  border:1px solid rgba(255,231,166,.48) !important;
  box-shadow:0 16px 34px rgba(243,180,33,.22),inset 0 1px 0 rgba(255,255,255,.72) !important;
  font-size:13px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  transition:transform .2s ease,box-shadow .2s ease !important;
}
.edupath-site-footer .footer-cta-button:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 20px 40px rgba(243,180,33,.28),inset 0 1px 0 rgba(255,255,255,.8) !important;
}
.edupath-site-footer .footer-main-grid{
  display:grid !important;
  grid-template-columns:minmax(260px,1.55fr) repeat(2,minmax(130px,.72fr)) minmax(230px,1fr) !important;
  gap:clamp(28px,4vw,54px) !important;
  padding:54px 0 42px !important;
  align-items:start !important;
}
.edupath-site-footer .footer-brand-block{max-width:370px !important;}
.edupath-site-footer .footer-logo-tile{
  width:max-content !important;
  display:inline-flex !important;
  align-items:center !important;
  padding:9px 13px !important;
  margin-bottom:18px !important;
  border-radius:17px !important;
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(255,255,255,.74) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.16) !important;
}
.edupath-site-footer .footer-logo-tile img{
  width:142px !important;
  height:auto !important;
  max-height:52px !important;
  object-fit:contain !important;
}
.edupath-site-footer .footer-brand-block>p{
  margin:0 !important;
  max-width:350px !important;
  color:rgba(220,228,239,.70) !important;
  font-size:14px !important;
  line-height:1.72 !important;
}
.edupath-site-footer .footer-trust-pills{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  margin-top:20px !important;
}
.edupath-site-footer .footer-trust-pills span{
  display:inline-flex !important;
  min-height:30px !important;
  align-items:center !important;
  padding:0 11px !important;
  border-radius:999px !important;
  color:rgba(255,255,255,.82) !important;
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  font-size:10px !important;
  font-weight:800 !important;
}
.edupath-site-footer .footer-nav-group h3,
.edupath-site-footer .footer-contact-card h3{
  margin:3px 0 17px !important;
  color:#fff !important;
  font-size:14px !important;
  line-height:1.2 !important;
  font-weight:900 !important;
  letter-spacing:.01em !important;
}
.edupath-site-footer .footer-nav-group ul{
  list-style:none !important;
  display:grid !important;
  gap:11px !important;
  margin:0 !important;
  padding:0 !important;
}
.edupath-site-footer .footer-nav-group a{
  display:inline-flex !important;
  align-items:center !important;
  color:rgba(220,228,239,.66) !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  transition:color .2s ease,transform .2s ease !important;
}
.edupath-site-footer .footer-nav-group a:hover{
  color:#fff !important;
  transform:translateX(3px) !important;
}
.edupath-site-footer .footer-contact-card{
  padding:21px !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.055) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.edupath-site-footer .footer-contact-card p{
  margin:0 0 15px !important;
  color:rgba(220,228,239,.68) !important;
  font-size:12px !important;
  line-height:1.6 !important;
}
.edupath-site-footer .footer-contact-link{
  width:100% !important;
  min-height:42px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:0 14px !important;
  margin-top:9px !important;
  border-radius:14px !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.07) !important;
  font-size:12px !important;
  font-weight:800 !important;
  transition:background .2s ease,border-color .2s ease !important;
}
.edupath-site-footer .footer-contact-link:hover{
  background:rgba(255,255,255,.11) !important;
  border-color:rgba(243,180,33,.35) !important;
}
.edupath-site-footer .footer-contact-link strong{
  color:#F3C85D !important;
  font-size:11px !important;
}
.edupath-site-footer .footer-bottom-bar{
  min-height:56px !important;
  padding-top:20px !important;
  border-top:1px solid rgba(255,255,255,.10) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  color:rgba(220,228,239,.52) !important;
  font-size:11px !important;
}
.edupath-site-footer .footer-legal-links{
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
  flex-wrap:wrap !important;
}
.edupath-site-footer .footer-legal-links a{
  color:rgba(220,228,239,.60) !important;
  font-weight:700 !important;
}
.edupath-site-footer .footer-legal-links a:hover{color:#fff !important;}

html[dir="rtl"] .edupath-site-header .edupath-header-nav,
body.shell-fa .edupath-site-header,
body.shell-fa .edupath-site-header .edupath-header-nav,
html[dir="rtl"] .edupath-site-footer,
body.shell-fa .edupath-site-footer{
  font-family:"Vazirmatn",Tahoma,Arial,sans-serif !important;
}
html[dir="rtl"] .edupath-site-footer,
body.shell-fa .edupath-site-footer{
  direction:rtl !important;
  text-align:right !important;
}
html[dir="rtl"] .edupath-site-footer .footer-eyebrow,
body.shell-fa .edupath-site-footer .footer-eyebrow{
  letter-spacing:0 !important;
}
html[dir="rtl"] .edupath-site-footer .footer-nav-group a:hover,
body.shell-fa .edupath-site-footer .footer-nav-group a:hover{
  transform:translateX(-3px) !important;
}

@media(max-width:1120px){
  .edupath-site-header .edupath-header-nav{gap:18px !important;}
  .edupath-site-header .edupath-shell-secondary{display:none !important;}
}
@media(max-width:900px){
  .edupath-site-header .edupath-header-inner{
    grid-template-columns:auto 1fr !important;
  }
  .edupath-site-header .edupath-header-nav{display:none !important;}
  .edupath-site-footer .footer-main-grid{
    grid-template-columns:1.25fr 1fr 1fr !important;
  }
  .edupath-site-footer .footer-contact-card{grid-column:1/-1 !important;}
}
@media(max-width:680px){
  .edupath-site-header{min-height:68px !important;}
  .edupath-site-header .edupath-header-inner{
    min-height:68px !important;
    width:min(100% - 28px,620px) !important;
    gap:10px !important;
  }
  .edupath-site-header .edupath-header-logo img{width:116px !important;}
  .edupath-site-header .edupath-header-actions{gap:7px !important;}
  .edupath-language-switch{min-height:42px !important;}
  .edupath-language-switch .language-icon{display:none !important;}
  .edupath-language-switch .lang-full{display:none !important;}
  .edupath-language-switch .lang-short{display:inline !important;}
  .edupath-language-switch .lang-btn{
    min-width:39px !important;
    min-height:32px !important;
    padding:0 8px !important;
    font-size:10px !important;
  }
  .edupath-site-header .edupath-shell-primary{
    min-height:42px !important;
    padding:0 14px !important;
  }
  .edupath-site-header .cta-full{display:none !important;}
  .edupath-site-header .cta-mobile{display:inline !important;}
  .edupath-site-footer .footer-cta-panel{
    grid-template-columns:1fr !important;
    gap:20px !important;
    padding:27px 23px !important;
  }
  .edupath-site-footer .footer-cta-button{width:100% !important;}
  .edupath-site-footer .footer-main-grid{
    grid-template-columns:1fr 1fr !important;
    gap:34px 24px !important;
    padding:44px 0 36px !important;
  }
  .edupath-site-footer .footer-brand-block,
  .edupath-site-footer .footer-contact-card{grid-column:1/-1 !important;max-width:none !important;}
  .edupath-site-footer .footer-bottom-bar{
    align-items:flex-start !important;
    flex-direction:column !important;
  }
}
@media(max-width:420px){
  .edupath-site-header .edupath-header-logo img{width:102px !important;}
  .edupath-site-header .edupath-header-inner{width:min(100% - 20px,420px) !important;}
  .edupath-language-switch{padding:3px !important;gap:1px !important;}
  .edupath-language-switch .lang-btn{min-width:34px !important;padding:0 6px !important;}
  .edupath-site-header .edupath-shell-primary{padding:0 11px !important;font-size:11px !important;}
  .edupath-site-footer .footer-main-grid{grid-template-columns:1fr !important;}
  .edupath-site-footer .footer-nav-group{grid-column:auto !important;}
}
@media(prefers-reduced-motion:reduce){
  .edupath-site-header *,
  .edupath-site-footer *{transition:none !important;animation:none !important;}
}

/* =========================================================
   HEADER V2 — original typography + minimal language dropdown
   ========================================================= */
.edupath-site-header,
.edupath-site-footer{
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
  -webkit-font-smoothing:antialiased !important;
  text-rendering:optimizeLegibility !important;
}
.edupath-site-header :where(a,button),
.edupath-site-footer :where(a,button){
  font-family:inherit !important;
}
html[dir="rtl"] .edupath-site-header,
body.lang-fa .edupath-site-header,
body.shell-fa .edupath-site-header,
html[dir="rtl"] .edupath-site-footer,
body.lang-fa .edupath-site-footer,
body.shell-fa .edupath-site-footer{
  font-family:"Vazirmatn","Noto Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif !important;
  letter-spacing:0 !important;
}
.edupath-site-header .edupath-header-actions{
  gap:12px !important;
}
.edupath-language-menu{
  position:relative !important;
  display:inline-flex !important;
  flex:0 0 auto !important;
  direction:ltr !important;
}
.edupath-language-trigger{
  appearance:none !important;
  min-width:128px !important;
  min-height:44px !important;
  padding:0 12px !important;
  display:inline-grid !important;
  grid-template-columns:20px minmax(0,1fr) 14px !important;
  align-items:center !important;
  gap:8px !important;
  border:1px solid rgba(16,37,66,.13) !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.82) !important;
  color:#102542 !important;
  box-shadow:0 8px 22px rgba(16,37,66,.055),inset 0 1px 0 rgba(255,255,255,.94) !important;
  cursor:pointer !important;
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease !important;
}
.edupath-language-trigger:hover,
.edupath-language-menu.is-open .edupath-language-trigger{
  border-color:rgba(243,180,33,.58) !important;
  background:#fff !important;
  box-shadow:0 11px 28px rgba(16,37,66,.075),0 0 0 3px rgba(243,180,33,.08) !important;
}
.edupath-language-trigger:focus-visible{
  outline:3px solid rgba(243,180,33,.34) !important;
  outline-offset:2px !important;
}
.edupath-language-trigger .language-globe,
.edupath-language-trigger .language-chevron{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#8A6712 !important;
}
.edupath-language-trigger .language-globe svg{
  width:18px !important;
  height:18px !important;
}
.edupath-language-trigger .language-chevron svg{
  width:14px !important;
  height:14px !important;
  transition:transform .2s ease !important;
}
.edupath-language-menu.is-open .language-chevron svg{
  transform:rotate(180deg) !important;
}
.edupath-language-current{
  min-width:0 !important;
  display:flex !important;
  align-items:baseline !important;
  justify-content:space-between !important;
  gap:8px !important;
  white-space:nowrap !important;
}
.edupath-language-current-label{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  color:#102542 !important;
  font-size:12.5px !important;
  font-weight:800 !important;
  line-height:1 !important;
}
.edupath-language-current-code{
  color:rgba(16,37,66,.48) !important;
  font-family:"Inter","Segoe UI",Arial,sans-serif !important;
  font-size:9.5px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
}
.edupath-language-popover{
  position:absolute !important;
  top:calc(100% + 10px) !important;
  right:0 !important;
  z-index:1200 !important;
  width:202px !important;
  padding:7px !important;
  display:grid !important;
  gap:4px !important;
  border:1px solid rgba(16,37,66,.11) !important;
  border-radius:17px !important;
  background:rgba(255,255,255,.98) !important;
  box-shadow:0 22px 55px rgba(16,37,66,.16),inset 0 1px 0 rgba(255,255,255,.96) !important;
  -webkit-backdrop-filter:blur(20px) !important;
  backdrop-filter:blur(20px) !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateY(-6px) scale(.98) !important;
  transform-origin:top right !important;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease !important;
}
.edupath-language-menu.is-open .edupath-language-popover{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateY(0) scale(1) !important;
}
.edupath-language-popover .lang-btn{
  appearance:none !important;
  width:100% !important;
  min-height:46px !important;
  padding:5px 9px !important;
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) 20px !important;
  align-items:center !important;
  gap:10px !important;
  border:0 !important;
  border-radius:12px !important;
  background:transparent !important;
  color:#102542 !important;
  text-align:left !important;
  cursor:pointer !important;
  transition:background .16s ease,transform .16s ease !important;
}
.edupath-language-popover .lang-btn:hover{
  background:rgba(243,180,33,.09) !important;
}
.edupath-language-popover .lang-btn:focus-visible{
  outline:3px solid rgba(243,180,33,.30) !important;
  outline-offset:-1px !important;
}
.edupath-language-popover .lang-option-code{
  width:34px !important;
  height:30px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(16,37,66,.10) !important;
  border-radius:9px !important;
  background:#F7F8FA !important;
  color:rgba(16,37,66,.66) !important;
  font-family:"Inter","Segoe UI",Arial,sans-serif !important;
  font-size:10px !important;
  font-weight:900 !important;
  letter-spacing:.06em !important;
}
.edupath-language-popover .lang-option-label{
  min-width:0 !important;
  display:block !important;
  color:#102542 !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
}
.edupath-language-popover .lang-btn[data-lang="en"] .lang-option-label{
  font-family:"Inter","Segoe UI",Arial,sans-serif !important;
}
.edupath-language-popover .lang-btn[data-lang="fa"] .lang-option-label{
  font-family:"Vazirmatn",Tahoma,Arial,sans-serif !important;
  text-align:right !important;
}
.edupath-language-popover .lang-check{
  width:20px !important;
  height:20px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:50% !important;
  color:transparent !important;
  font-size:12px !important;
  font-weight:900 !important;
}
.edupath-language-popover .lang-btn.is-active{
  background:linear-gradient(145deg,rgba(255,248,226,.95),rgba(255,255,255,.96)) !important;
  box-shadow:inset 0 0 0 1px rgba(243,180,33,.24) !important;
}
.edupath-language-popover .lang-btn.is-active .lang-option-code{
  border-color:rgba(243,180,33,.34) !important;
  background:rgba(243,180,33,.13) !important;
  color:#755300 !important;
}
.edupath-language-popover .lang-btn.is-active .lang-check{
  color:#9A6D00 !important;
  background:rgba(243,180,33,.14) !important;
}
.edupath-site-header .edupath-shell-primary{
  min-height:44px !important;
  padding:0 20px !important;
  font-family:inherit !important;
  font-size:13px !important;
}
@media(max-width:900px){
  .edupath-language-trigger{min-width:118px !important;}
}
@media(max-width:680px){
  .edupath-language-trigger{
    min-width:48px !important;
    width:48px !important;
    min-height:42px !important;
    padding:0 !important;
    display:inline-flex !important;
    justify-content:center !important;
  }
  .edupath-language-trigger .language-globe,
  .edupath-language-trigger .language-chevron{display:none !important;}
  .edupath-language-current-label{display:none !important;}
  .edupath-language-current-code{
    color:#102542 !important;
    font-size:11px !important;
    letter-spacing:.04em !important;
  }
  .edupath-language-popover{
    right:0 !important;
    width:190px !important;
  }
}
@media(max-width:420px){
  .edupath-language-trigger{width:42px !important;min-width:42px !important;}
  .edupath-site-header .edupath-shell-primary{padding:0 12px !important;}
}





/* =========================================================
   HEADER V3 — one primary CTA + compact professional language menu
   ========================================================= */
.edupath-site-header,
.edupath-site-header button,
.edupath-site-header a{
  font-family:"Inter",Arial,sans-serif !important;
}
html[dir="rtl"] .edupath-site-header,
html[dir="rtl"] .edupath-site-header button,
html[dir="rtl"] .edupath-site-header a{
  font-family:"Vazirmatn",Tahoma,Arial,sans-serif !important;
}

/* Get Free Guidance is the only header CTA. */
.edupath-site-header [data-shell-en="Explore Programs"],
.edupath-site-header [data-i18n-en="Explore Programs"],
.edupath-site-header .edupath-shell-secondary,
.edupath-site-header .header-explore-programs,
.edupath-site-header .explore-programs-cta{
  display:none !important;
}
.edupath-site-header .edupath-header-actions{
  gap:10px !important;
}

/* Compact language control */
.edupath-site-header .edupath-language-menu.edupath-language-compact{
  position:relative !important;
  display:inline-flex !important;
  flex:0 0 auto !important;
  width:auto !important;
  min-width:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
  isolation:isolate;
}
.edupath-site-header .edupath-language-compact .edupath-language-trigger{
  width:64px !important;
  min-width:64px !important;
  height:44px !important;
  min-height:44px !important;
  padding:0 11px 0 13px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  border-radius:14px !important;
  border:1px solid rgba(16,37,66,.13) !important;
  background:rgba(255,255,255,.72) !important;
  color:#102542 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.88),
    0 8px 20px rgba(16,37,66,.055) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.08) !important;
  backdrop-filter:blur(14px) saturate(1.08) !important;
  cursor:pointer !important;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease !important;
  animation:none !important;
  clip-path:none !important;
  overflow:visible !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-trigger::before,
.edupath-site-header .edupath-language-compact .edupath-language-trigger::after{
  content:none !important;
  display:none !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-trigger:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(243,180,33,.48) !important;
  background:rgba(255,253,247,.96) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.94),
    0 10px 24px rgba(16,37,66,.075) !important;
}
.edupath-site-header .edupath-language-compact.is-open .edupath-language-trigger{
  border-color:rgba(243,180,33,.64) !important;
  background:#fffdf7 !important;
  box-shadow:0 0 0 4px rgba(243,180,33,.11), 0 10px 24px rgba(16,37,66,.075) !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-trigger:focus-visible{
  outline:3px solid rgba(243,180,33,.24) !important;
  outline-offset:2px !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-current-code{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:25px !important;
  color:#102542 !important;
  font-family:"Inter",Arial,sans-serif !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
}
html[dir="rtl"] .edupath-site-header .edupath-language-compact .edupath-language-current-code{
  font-family:"Inter",Arial,sans-serif !important;
  letter-spacing:.06em !important;
}
.edupath-site-header .edupath-language-compact .language-chevron{
  width:14px !important;
  height:14px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:rgba(16,37,66,.48) !important;
  transition:transform .18s ease !important;
}
.edupath-site-header .edupath-language-compact .language-chevron svg{
  width:14px !important;
  height:14px !important;
  display:block !important;
}
.edupath-site-header .edupath-language-compact.is-open .language-chevron{
  transform:rotate(180deg) !important;
}

.edupath-site-header .edupath-language-compact .edupath-language-popover{
  position:absolute !important;
  right:auto !important;
  left:auto !important;
  inset-inline-end:0 !important;
  inset-inline-start:auto !important;
  top:calc(100% + 10px) !important;
  width:168px !important;
  min-width:168px !important;
  padding:6px !important;
  display:grid !important;
  gap:3px !important;
  border:1px solid rgba(16,37,66,.10) !important;
  border-radius:17px !important;
  background:rgba(255,255,255,.97) !important;
  box-shadow:0 20px 48px rgba(16,37,66,.16), inset 0 1px 0 rgba(255,255,255,.94) !important;
  -webkit-backdrop-filter:blur(20px) saturate(1.1) !important;
  backdrop-filter:blur(20px) saturate(1.1) !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateY(-5px) scale(.98) !important;
  transform-origin:top right !important;
  transition:opacity .16s ease, transform .16s ease, visibility .16s ease !important;
  z-index:999 !important;
}
html[dir="rtl"] .edupath-site-header .edupath-language-compact .edupath-language-popover{
  transform-origin:top left !important;
}
.edupath-site-header .edupath-language-compact.is-open .edupath-language-popover{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateY(0) scale(1) !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-popover .lang-btn{
  width:100% !important;
  min-width:0 !important;
  min-height:43px !important;
  padding:7px 9px !important;
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) 18px !important;
  align-items:center !important;
  gap:9px !important;
  border:0 !important;
  border-radius:12px !important;
  background:transparent !important;
  color:#102542 !important;
  box-shadow:none !important;
  text-align:start !important;
  cursor:pointer !important;
  animation:none !important;
  clip-path:none !important;
  transition:background .16s ease, color .16s ease !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-popover .lang-btn::before,
.edupath-site-header .edupath-language-compact .edupath-language-popover .lang-btn::after{
  content:none !important;
  display:none !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-popover .lang-btn:hover,
.edupath-site-header .edupath-language-compact .edupath-language-popover .lang-btn:focus-visible{
  background:rgba(16,37,66,.055) !important;
  outline:none !important;
}
.edupath-site-header .edupath-language-compact .edupath-language-popover .lang-btn.is-active{
  background:linear-gradient(135deg,rgba(255,239,188,.72),rgba(255,250,235,.96)) !important;
}
.edupath-site-header .edupath-language-compact .lang-option-code{
  width:34px !important;
  height:28px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:9px !important;
  background:rgba(16,37,66,.065) !important;
  color:#102542 !important;
  font-family:"Inter",Arial,sans-serif !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
}
.edupath-site-header .edupath-language-compact .lang-btn.is-active .lang-option-code{
  background:#102542 !important;
  color:#fff !important;
}
.edupath-site-header .edupath-language-compact .lang-option-label{
  display:block !important;
  color:#102542 !important;
  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}
.edupath-site-header .edupath-language-compact .lang-btn[data-lang="en"] .lang-option-label{
  direction:ltr !important;
  text-align:left !important;
  font-family:"Inter",Arial,sans-serif !important;
}
.edupath-site-header .edupath-language-compact .lang-btn[data-lang="fa"] .lang-option-label{
  direction:rtl !important;
  text-align:right !important;
  font-family:"Vazirmatn",Tahoma,Arial,sans-serif !important;
}
.edupath-site-header .edupath-language-compact .lang-check{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#B47E00 !important;
  font-size:13px !important;
  font-weight:900 !important;
  opacity:0 !important;
}
.edupath-site-header .edupath-language-compact .lang-btn.is-active .lang-check{
  opacity:1 !important;
}

/* Keep the primary CTA visually dominant without making the header crowded. */
.edupath-site-header .edupath-shell-primary{
  min-height:46px !important;
  padding-inline:22px !important;
  white-space:nowrap !important;
}

@media(max-width:1100px){
  .edupath-site-header .edupath-header-nav{gap:20px !important;}
  .edupath-site-header .edupath-shell-primary{padding-inline:18px !important;}
}
@media(max-width:720px){
  .edupath-site-header .edupath-language-compact .edupath-language-trigger{
    width:48px !important;
    min-width:48px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 8px !important;
    gap:3px !important;
    border-radius:13px !important;
  }
  .edupath-site-header .edupath-language-compact .language-chevron{
    width:11px !important;
  }
  .edupath-site-header .edupath-language-compact .language-chevron svg{
    width:11px !important;
    height:11px !important;
  }
  .edupath-site-header .edupath-language-compact .edupath-language-current-code{
    min-width:22px !important;
    font-size:11px !important;
  }
  .edupath-site-header .edupath-language-compact .edupath-language-popover{
    width:158px !important;
    min-width:158px !important;
  }
  html[dir="rtl"] .edupath-site-header .edupath-language-compact .edupath-language-popover{
    inset-inline-start:auto !important;
    inset-inline-end:auto !important;
    right:auto !important;
    left:0 !important;
  }
}
@media(max-width:440px){
  .edupath-site-header .edupath-shell-primary{
    min-height:42px !important;
    padding-inline:14px !important;
  }
}
@media(prefers-reduced-motion:reduce){
  .edupath-site-header .edupath-language-compact *,
  .edupath-site-header .edupath-language-compact *::before,
  .edupath-site-header .edupath-language-compact *::after{
    transition:none !important;
  }
}



/* V5: official program names, category names and program tags stay English in every language. */
.english-program-name,
.english-category-name,
.english-program-tag,
html[dir="rtl"] .english-program-name,
html[dir="rtl"] .english-category-name,
html[dir="rtl"] .english-program-tag {
  direction:ltr !important;
  unicode-bidi:isolate !important;
  font-family:"Inter",Arial,sans-serif !important;
  letter-spacing:-.02em !important;
}
html[dir="rtl"] .sidebar-item.english-program-name,
html[dir="rtl"] .drawer-item.english-program-name,
html[dir="rtl"] .sheet-item.english-program-name,
html[dir="rtl"] .sidebar-category summary .english-category-name,
html[dir="rtl"] .drawer-category summary .english-category-name,
html[dir="rtl"] .sheet-category summary .english-category-name {
  text-align:left !important;
}
html[dir="rtl"] article.card .english-program-name,
html[dir="rtl"] article.card .english-program-tag,
html[dir="rtl"] .program-category-card .english-category-name {
  direction:ltr !important;
}
html[dir="rtl"] .program-category-card .program-content {
  justify-content:center !important;
  text-align:center !important;
}
html[dir="rtl"] .program-category-card .program-content .english-category-name {
  width:100% !important;
  text-align:center !important;
}

/* The carousel card is the frame; avoid a second hairline around its photo. */
.program-category-card .program-image {
  border:0 !important;
}

/* Keep the footer logo unboxed on the dark footer background. */
.edupath-site-footer .footer-logo-tile {
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}



.edupath-site-footer .footer-instagram-panel{
  min-height:116px !important;
  padding:24px 28px !important;
  gap:24px !important;
  background:
    radial-gradient(circle at 7% 20%,rgba(225,48,108,.16),transparent 28%),
    radial-gradient(circle at 92% 18%,rgba(252,175,69,.14),transparent 30%),
    linear-gradient(135deg,rgba(255,255,255,.095),rgba(255,255,255,.038)) !important;
}
.edupath-site-footer .footer-instagram-copy{
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
  min-width:0 !important;
}
.edupath-site-footer .footer-instagram-icon{
  width:54px !important;
  height:54px !important;
  flex:0 0 54px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
  border-radius:17px !important;
  background:linear-gradient(135deg,#833AB4 0%,#C13584 34%,#E1306C 58%,#F77737 79%,#FCAF45 100%) !important;
  box-shadow:0 16px 32px rgba(225,48,108,.20),inset 0 1px 0 rgba(255,255,255,.28) !important;
}
.edupath-site-footer .footer-instagram-icon svg{
  width:29px !important;
  height:29px !important;
}
.edupath-site-footer .footer-instagram-text{
  min-width:0 !important;
}
.edupath-site-footer .footer-instagram-panel .footer-eyebrow{
  margin-bottom:4px !important;
  color:#F3C85D !important;
}
.edupath-site-footer .footer-instagram-panel h2{
  margin:0 !important;
  font-size:clamp(22px,2.5vw,31px) !important;
  line-height:1.12 !important;
  letter-spacing:-.035em !important;
}
.edupath-site-footer .footer-instagram-handle{
  display:inline-block !important;
  margin-top:5px !important;
  color:rgba(220,228,239,.68) !important;
  font-family:Inter,Arial,sans-serif !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.01em !important;
}
.edupath-site-footer .footer-instagram-button{
  min-height:48px !important;
  padding:0 20px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.20) !important;
  color:#fff !important;
  background:rgba(255,255,255,.09) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 12px 28px rgba(0,0,0,.14) !important;
  -webkit-backdrop-filter:blur(14px) !important;
  backdrop-filter:blur(14px) !important;
  font-size:13px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease !important;
}
.edupath-site-footer .footer-instagram-button svg{
  width:20px !important;
  height:20px !important;
  flex:0 0 20px !important;
}
.edupath-site-footer .footer-instagram-button:hover{
  transform:translateY(-2px) !important;
  border-color:rgba(225,48,108,.58) !important;
  background:linear-gradient(135deg,rgba(131,58,180,.30),rgba(225,48,108,.28),rgba(252,175,69,.24)) !important;
  box-shadow:0 16px 34px rgba(225,48,108,.16),inset 0 1px 0 rgba(255,255,255,.18) !important;
}
html[dir="rtl"] .edupath-site-footer .footer-instagram-copy{
  direction:rtl !important;
}
html[dir="rtl"] .edupath-site-footer .footer-instagram-handle{
  direction:ltr !important;
  unicode-bidi:isolate !important;
}
@media(max-width:620px){
  .edupath-site-footer .footer-instagram-panel{
    min-height:0 !important;
    padding:22px 20px !important;
    gap:18px !important;
  }
  .edupath-site-footer .footer-instagram-icon{
    width:48px !important;
    height:48px !important;
    flex-basis:48px !important;
    border-radius:15px !important;
  }
  .edupath-site-footer .footer-instagram-icon svg{
    width:25px !important;
    height:25px !important;
  }
  .edupath-site-footer .footer-instagram-panel h2{
    font-size:22px !important;
  }
  .edupath-site-footer .footer-instagram-button{
    width:100% !important;
  }
}


/* Stage 1.1 audited safety overrides */
html{scroll-padding-top:88px}
:focus-visible{outline:3px solid rgba(243,180,33,.62);outline-offset:3px}
img[width][height]{height:auto}
[hidden]{display:none!important}
body.is-scroll-locked{overflow:hidden}
@media(max-width:620px){.programs-arrow{display:none!important}}

/* Legacy native guidance styles are retained for rollback; the live modal uses the CRM iframe below. */
.eligibility-warning{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:12px;
  align-items:start;
  padding:14px 15px;
  border:1px solid rgba(180,83,9,.24);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,248,228,.98),rgba(255,253,246,.94));
  color:#102542;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 24px rgba(180,83,9,.06);
}
.eligibility-warning-icon{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:linear-gradient(135deg,#ffe38a,#f3b421);
  color:#3b2b05;
  font-size:18px;
  font-weight:950;
  box-shadow:0 9px 20px rgba(243,180,33,.2);
}
.eligibility-warning strong{display:block;margin-bottom:4px;font-size:13px;line-height:1.3;font-weight:950}
.eligibility-warning small{display:block;color:rgba(16,37,66,.7);font-size:11.5px;line-height:1.55;font-weight:700}
.status-fieldset{min-inline-size:0;margin:0;padding:0;border:0}
.status-fieldset legend{margin:0 0 8px;color:#102542;font-size:13px;line-height:1.15;font-weight:900}
.form-honeypot{position:absolute!important;inset-inline-start:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-row:has(#guidanceEmail){grid-column:1/-1}
.consultation-call-option,.form-submit-error{grid-column:1/-1}
.form-submit-error{
  padding:11px 13px;
  border-radius:14px;
  border:1px solid rgba(190,50,35,.25);
  background:rgba(254,242,242,.96);
  color:#9f2d20;
  font-size:12px;
  line-height:1.5;
  font-weight:800;
}
.form-submit-error:empty{display:none}
.form-success a{color:inherit}
body.consultation-modal-open #consultationCard .consultation-modal-close{
  position:absolute!important;
  inset-inline-start:auto!important;
  inset-inline-end:18px!important;
}

@media(max-width:620px){
  .eligibility-warning{grid-template-columns:30px minmax(0,1fr);padding:12px 13px;border-radius:16px}
  .eligibility-warning-icon{width:30px;height:30px;border-radius:10px;font-size:16px}
}

@media(prefers-reduced-motion:reduce){
  .success-confetti,.success-sparkles{display:none!important}
  .success-check-wrap::before,.success-burst span,.form-success.is-visible{animation:none!important}
}

/* Stage 1.1 explicit keyboard focus treatment. */
.edupath-site-header a:focus-visible,.edupath-site-header button:focus-visible,.edupath-site-footer a:focus-visible,.hero a:focus-visible,.hero button:focus-visible,.consultation-card a:focus-visible,.consultation-card button:focus-visible,.consultation-card input:focus-visible,.consultation-card select:focus-visible,.consultation-card textarea:focus-visible,.journey-card:focus-visible{outline:3px solid rgba(243,180,33,.72);outline-offset:3px}

/* Auto-layout guidance cards: the active card sizes itself to its copy. */
.mission-step{box-sizing:border-box;min-width:0;overflow-wrap:anywhere}
@media(min-width:821px){
  .mission-flow{align-items:stretch!important}
  .mission-steps{height:auto!important;min-height:295px!important}
  .mission-step.is-active{position:relative!important;inset:auto!important;min-height:295px!important}
  .mission-progress{height:auto!important;min-height:295px!important;align-self:stretch!important}
}
@media(max-width:820px){
  .mission-steps{height:auto!important;min-height:240px!important}
  .mission-step.is-active{position:relative!important;inset:auto!important;min-height:240px!important}
}
@media(max-width:420px){
  .mission-steps{min-height:260px!important}
  .mission-step.is-active{min-height:260px!important}
}

/* Official Finance Maxim / GoHighLevel form. Submission stays inside the CRM. */
.home-ghl-embed{
  width:100%;
  min-height:974px;
  background:#fff;
}
.home-ghl-embed-frame{
  display:block;
  width:100%;
  height:974px;
  border:0;
  border-radius:0;
  background:#fff;
}
body.consultation-modal-open #consultationCard .home-ghl-embed{
  min-height:974px;
}
@media(max-width:820px){
  .home-ghl-embed,
  body.consultation-modal-open #consultationCard .home-ghl-embed{
    min-height:1200px;
  }
  .home-ghl-embed-frame{height:1200px}
}

/* Keep hero type crisp over video without an outlined/stroked edge. */
.hero-copy{
  filter:none!important;
}
.hero h1,
html[dir="rtl"] .hero h1{
  -webkit-text-stroke:0!important;
  text-shadow:0 4px 18px rgba(0,0,0,.56)!important;
}
.hero-copy p,
html[dir="rtl"] .hero-copy p{
  text-shadow:0 2px 10px rgba(0,0,0,.58)!important;
}

/* The changing step copy must not recenter the desktop video. */
@media(min-width:821px){
  .mission-grid{
    align-items:start!important;
  }
  .mission-video,
  .mission-video.youtube-preview-card,
  .mission-video.has-youtube{
    align-self:start!important;
    margin-top:clamp(96px,9vw,116px)!important;
    transform:none!important;
  }
}

/* Draw one direction-independent YouTube play mark in both locales. */
.mission-video.youtube-preview-card .youtube-play-button{
  direction:ltr!important;
  unicode-bidi:isolate!important;
  padding:0!important;
  font-size:0!important;
}
.mission-video.youtube-preview-card .youtube-play-button::before{
  content:""!important;
  display:block!important;
  width:0!important;
  height:0!important;
  border-top:11px solid transparent!important;
  border-bottom:11px solid transparent!important;
  border-left:18px solid #ff0033!important;
  transform:translateX(2px)!important;
}
@media(max-width:620px){
  .mission-video.youtube-preview-card .youtube-play-button::before{
    border-top-width:9px!important;
    border-bottom-width:9px!important;
    border-left-width:15px!important;
  }
}

/* The first two homepage carousel cards are live Sanity programs. */
.home-featured-program-card .program-image{
  min-height:150px;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  padding:14px!important;
  background-image:
    linear-gradient(180deg,rgba(8,26,50,.06),rgba(8,26,50,.42)),
    var(--program-img)!important;
  filter:saturate(.96) brightness(1.02)!important;
}
.home-featured-program-card .program-image::after{
  background:linear-gradient(135deg,rgba(255,255,255,.14),transparent 52%)!important;
}
.home-featured-program-label{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  min-height:32px;
  max-width:calc(100% - 2px);
  padding:7px 11px;
  border:1px solid rgba(255,226,139,.82);
  border-radius:999px;
  background:linear-gradient(135deg,rgba(255,238,180,.96),rgba(243,180,33,.92));
  color:#102542;
  box-shadow:0 8px 24px rgba(8,26,50,.22),inset 0 1px 0 rgba(255,255,255,.86);
  font-size:12px;
  line-height:1.2;
  font-weight:950;
  white-space:nowrap;
}
.home-featured-program-card .program-content{
  align-items:flex-start!important;
}
.home-featured-program-card .program-content h3{
  font-size:clamp(17px,1.55vw,21px)!important;
  line-height:1.28!important;
}
html[dir="rtl"] .home-featured-program-label{
  font-family:"Vazirmatn",Tahoma,Arial,sans-serif!important;
}
@media(max-width:620px){
  .home-featured-program-card .program-image{
    min-height:145px;
    padding:12px!important;
  }
  .home-featured-program-label{
    min-height:30px;
    padding:6px 10px;
    font-size:11px;
  }
  .home-featured-program-card .program-content h3{
    font-size:17px!important;
  }
}

/* Optional CMS-controlled featured-program card in the homepage hero. */
.hero-featured-program{
  width:min(100%,430px);
  justify-self:end;
  align-self:center;
  animation:heroEnterCard .9s cubic-bezier(.22,.61,.36,1) .22s both;
}
.hero-grid:has(> .hero-featured-program){
  grid-template-columns:minmax(0,1fr) minmax(330px,430px)!important;
  gap:clamp(28px,5vw,80px)!important;
  align-items:center!important;
}
.hero-featured-program a{
  --hero-feature-angle:0deg;
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:92px minmax(0,1fr) 38px;
  gap:14px;
  align-items:center;
  min-height:118px;
  padding:12px 14px 12px 12px;
  overflow:hidden;
  border:1px solid rgba(255,216,106,.8);
  border-radius:28px;
  background:
    radial-gradient(110% 145% at 12% 0%,rgba(255,255,255,.56),transparent 54%),
    linear-gradient(135deg,rgba(255,244,210,.88),rgba(235,222,202,.72));
  box-shadow:0 22px 52px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.84);
  color:#102542;
  -webkit-backdrop-filter:blur(20px) saturate(1.15);
  backdrop-filter:blur(20px) saturate(1.15);
  transition:transform .22s ease,box-shadow .22s ease;
}
.hero-featured-program a::before{
  position:absolute;
  inset:0;
  z-index:3;
  padding:1.5px;
  border-radius:inherit;
  background:conic-gradient(from var(--hero-feature-angle),rgba(213,148,0,.42),#fff4bd 22%,#f3b421 39%,rgba(213,148,0,.34) 57%,#fff 76%,rgba(213,148,0,.42));
  content:"";
  pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
  animation:heroFeaturedBorderSpin 5.2s linear infinite;
}
.hero-featured-program a:hover,
.hero-featured-program a:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 28px 62px rgba(0,0,0,.34),0 0 30px rgba(243,180,33,.2),inset 0 1px 0 rgba(255,255,255,.9);
}
.hero-featured-program__image{
  display:block;
  width:92px;
  height:92px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.86);
  border-radius:20px;
  background:rgba(255,255,255,.54);
  box-shadow:0 8px 22px rgba(16,37,66,.16);
}
.hero-featured-program__image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero-featured-program__copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
  gap:7px;
}
.hero-featured-program__copy small{
  color:#9a6800;
  font-size:12px;
  line-height:1.25;
  font-weight:950;
}
.hero-featured-program__copy strong{
  color:#102542;
  font-family:"Inter",Arial,sans-serif!important;
  font-size:clamp(24px,2.25vw,34px);
  line-height:1.03;
  letter-spacing:-.045em;
}
.hero-featured-program__arrow{
  display:grid;
  width:38px;
  height:52px;
  place-items:center;
  border-inline-start:1px solid rgba(154,104,0,.2);
  color:#b57b00;
  font-size:36px;
  line-height:1;
}
html[dir="rtl"] .hero-featured-program__copy{
  align-items:flex-end;
  text-align:right;
}
@property --hero-feature-angle{
  syntax:"<angle>";
  inherits:false;
  initial-value:0deg;
}
@keyframes heroFeaturedBorderSpin{to{--hero-feature-angle:360deg}}

/* Restore the original prominent hero CTA dimensions after changing its destination. */
.hero-actions .btn-primary{
  min-width:280px!important;
  min-height:62px!important;
  padding:18px 36px!important;
  font-size:clamp(17px,1.25vw,20px)!important;
  font-weight:900!important;
}

@media(max-width:820px){
  .hero-grid{
    grid-template-columns:1fr!important;
    gap:0!important;
  }
  .hero-featured-program{
    order:-1;
    width:min(100%,350px);
    margin-bottom:4px;
    justify-self:end;
  }
  .hero-featured-program a{
    grid-template-columns:76px minmax(0,1fr) 32px;
    gap:11px;
    min-height:98px;
    padding:10px 11px 10px 10px;
    border-radius:24px;
  }
  .hero-featured-program__image{
    width:76px;
    height:76px;
    border-radius:17px;
  }
  .hero-featured-program__copy small{font-size:10.5px}
  .hero-featured-program__copy strong{font-size:23px}
  .hero-featured-program__arrow{width:32px;height:44px;font-size:30px}
  .hero-actions{width:100%}
  .hero-actions .btn-primary{
    width:min(100%,320px)!important;
    min-width:0!important;
    min-height:58px!important;
    padding:16px 28px!important;
    font-size:16px!important;
  }
}

/* =========================================================
   FEATURED OFFER ATTENTION MOTION
   A layered, intermittent cue: gentle float, gold halo,
   surface sheen, image focus and arrow movement.
   ========================================================= */
@keyframes heroFeaturedGlowPulse{
  0%,54%,100%{filter:drop-shadow(0 0 0 rgba(243,180,33,0))}
  64%{filter:drop-shadow(0 8px 10px rgba(243,180,33,.18))}
  73%{filter:drop-shadow(0 10px 24px rgba(243,180,33,.52))}
  84%{filter:drop-shadow(0 8px 12px rgba(243,180,33,.2))}
}

@keyframes heroFeaturedImageFocus{
  0%,56%,100%{transform:scale(1)}
  68%{transform:scale(1.08)}
  80%{transform:scale(1.015)}
}

.hero-featured-program.is-floating{
  animation:
    heroEnterCard .9s cubic-bezier(.22,.61,.36,1) .12s both,
    heroFeaturedFloat 3.8s ease-in-out 1.05s infinite,
    heroFeaturedGlowPulse 5.6s ease-in-out 1.35s infinite!important;
  will-change:translate,filter;
}

.hero-featured-program.is-floating .hero-featured-program__image img{
  animation:heroFeaturedImageFocus 5.6s cubic-bezier(.22,.61,.36,1) 1.35s infinite;
  will-change:transform;
}

.hero-featured-program:hover .hero-featured-program__image img,
.hero-featured-program:focus-within .hero-featured-program__image img{
  animation-play-state:paused!important;
}

@media(prefers-reduced-motion:reduce){
  .hero-featured-program.is-floating,
  .hero-featured-program.is-floating a::before,
  .hero-featured-program.is-floating a::after,
  .hero-featured-program.is-floating .hero-featured-program__image img,
  .hero-featured-program.is-floating .hero-featured-program__arrow{
    animation:none!important;
    filter:none!important;
    translate:none!important;
    transform:none!important;
  }
}
@media(max-width:420px){
  .hero-featured-program{width:100%}
  .hero-featured-program a{
    grid-template-columns:68px minmax(0,1fr) 28px;
    min-height:90px;
  }
  .hero-featured-program__image{width:68px;height:68px}
  .hero-featured-program__copy strong{font-size:21px}
  .hero-actions .btn-primary{width:100%!important;max-width:320px}
}
@media(prefers-reduced-motion:reduce){
  .hero-featured-program,
  .hero-featured-program a::before{
    animation:none!important;
  }
}

/* =========================================================
   HOMEPAGE STRUCTURAL GRID PASS
   Keep the hero offer, hero copy and programs carousel on one
   predictable layout system instead of relying on auto-placement.
   ========================================================= */
@media(min-width:821px){
  .hero{
    min-height:clamp(620px,72vh,780px)!important;
    padding:clamp(54px,6vw,82px) 0!important;
    align-items:center!important;
  }

  .hero .container.hero-grid,
  .hero-grid:has(> .hero-featured-program){
    display:grid!important;
    width:min(1180px,calc(100% - 64px))!important;
    max-width:1180px!important;
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    grid-template-rows:auto!important;
    column-gap:clamp(18px,2vw,28px)!important;
    row-gap:0!important;
    align-items:end!important;
    direction:ltr!important;
  }

  .hero-grid > .hero-copy{
    grid-column:1 / span 6!important;
    grid-row:1!important;
    align-self:end!important;
    justify-self:start!important;
    width:100%!important;
    max-width:600px!important;
    direction:ltr!important;
  }

  .hero-grid > .hero-featured-program{
    grid-column:9 / -1!important;
    grid-row:1!important;
    align-self:end!important;
    justify-self:stretch!important;
    width:100%!important;
    max-width:400px!important;
    margin:0!important;
    direction:ltr!important;
  }

  html[dir="rtl"] .hero-grid > .hero-copy{
    grid-column:7 / -1!important;
    justify-self:end!important;
    direction:rtl!important;
  }

  html[dir="rtl"] .hero-grid > .hero-featured-program{
    grid-column:1 / span 4!important;
    justify-self:stretch!important;
    direction:rtl!important;
  }

  .hero-featured-program a{
    width:100%!important;
    min-height:112px!important;
  }

  .programs{
    padding-block:clamp(78px,7vw,104px)!important;
  }

  .programs > .container{
    width:min(1320px,calc(100% - 64px))!important;
    max-width:1320px!important;
    margin-inline:auto!important;
  }

  .programs-header{
    max-width:760px!important;
    margin:0 auto 44px!important;
  }

  .programs-carousel{
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr) 52px!important;
    gap:20px!important;
    align-items:center!important;
  }

  .programs-viewport{
    padding:4px 0 6px!important;
    margin:0!important;
  }

  .programs-track{
    gap:20px!important;
    align-items:stretch!important;
  }

  .program-category-card{
    flex:0 0 calc((100% - 40px) / 3)!important;
    height:330px!important;
    min-height:0!important;
    display:grid!important;
    grid-template-rows:190px minmax(0,1fr)!important;
    border-radius:24px!important;
  }

  .program-category-card .program-image,
  .home-featured-program-card .program-image{
    width:100%!important;
    height:190px!important;
    min-height:0!important;
  }

  .program-category-card .program-content{
    min-height:0!important;
    padding:22px 24px!important;
    align-items:center!important;
  }

  .program-category-card .program-content h3{
    width:100%;
    margin:0!important;
    font-size:clamp(19px,1.5vw,23px)!important;
    line-height:1.25!important;
  }

  .program-category-card:not(.home-featured-program-card) .program-content h3{
    text-align:center!important;
  }

  .programs-dots{
    margin-top:22px!important;
  }

  .programs-center-action{
    margin-top:22px!important;
  }

  .programs-center-action .btn{
    min-width:240px!important;
    min-height:56px!important;
    padding:15px 28px!important;
  }
}

@media(min-width:821px) and (max-width:1100px){
  .hero .container.hero-grid,
  .hero-grid:has(> .hero-featured-program){
    width:min(940px,calc(100% - 48px))!important;
  }

  .hero-grid > .hero-copy{
    grid-column:1 / span 7!important;
  }

  .hero-grid > .hero-featured-program{
    grid-column:9 / -1!important;
  }

  html[dir="rtl"] .hero-grid > .hero-copy{
    grid-column:6 / -1!important;
  }

  html[dir="rtl"] .hero-grid > .hero-featured-program{
    grid-column:1 / span 4!important;
  }

  .program-category-card{
    height:308px!important;
    grid-template-rows:172px minmax(0,1fr)!important;
  }

  .program-category-card .program-image,
  .home-featured-program-card .program-image{
    height:172px!important;
  }
}

@media(max-width:820px){
  .hero{
    min-height:auto!important;
    padding:clamp(44px,10vw,70px) 0 clamp(38px,9vw,62px)!important;
    align-items:center!important;
  }

  .hero .container.hero-grid,
  .hero-grid:has(> .hero-featured-program){
    display:grid!important;
    width:min(560px,calc(100% - 32px))!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-areas:"offer" "copy"!important;
    gap:22px!important;
    align-items:start!important;
  }

  .hero-grid > .hero-copy{
    grid-area:copy!important;
    width:100%!important;
    max-width:none!important;
  }

  .hero-grid > .hero-featured-program{
    grid-area:offer!important;
    order:initial!important;
    width:min(100%,350px)!important;
    max-width:350px!important;
    margin:0!important;
    align-self:start!important;
  }

  html:not([dir="rtl"]) .hero-grid > .hero-featured-program{
    justify-self:start!important;
  }

  html[dir="rtl"] .hero-grid > .hero-featured-program{
    justify-self:end!important;
  }

  .programs{
    padding-block:58px 68px!important;
  }

  .programs-header{
    margin-bottom:28px!important;
  }
}

@media(max-width:620px){
  .hero .container.hero-grid,
  .hero-grid:has(> .hero-featured-program){
    width:min(100% - 30px,440px)!important;
    gap:20px!important;
  }

  .hero-featured-program a{
    min-height:90px!important;
  }

  .programs > .container{
    width:min(100% - 28px,560px)!important;
  }

  .programs-center-action .btn{
    min-height:54px!important;
  }
}

/* =========================================================
   HERO FEATURED OFFER — compact upper-grid placement +
   intermittent attention motion. The card stays secondary to
   the hero CTA while remaining easy to notice.
   ========================================================= */
@keyframes heroFeaturedFloat{
  0%,100%{translate:0 0}
  50%{translate:0 -7px}
}

@keyframes heroFeaturedSheen{
  0%,52%{opacity:0;transform:translate3d(-175%,0,0) skewX(-18deg)}
  60%{opacity:.08}
  70%{opacity:.92}
  82%{opacity:.18}
  90%,100%{opacity:0;transform:translate3d(265%,0,0) skewX(-18deg)}
}

@keyframes heroFeaturedArrowCue{
  0%,58%,100%{opacity:.72;transform:translateX(0)}
  68%{opacity:1;transform:translateX(var(--hero-feature-arrow-shift,4px))}
  78%{opacity:.86;transform:translateX(0)}
}

@media(min-width:821px){
  .hero-grid > .hero-copy{
    position:relative!important;
    top:clamp(120px,10vw,160px)!important;
  }

  .hero-grid > .hero-featured-program{
    position:relative!important;
    top:clamp(-286px,-18.5vw,-190px)!important;
    width:100%!important;
    max-width:330px!important;
    justify-self:end!important;
    animation:
      heroEnterCard .9s cubic-bezier(.22,.61,.36,1) .22s both,
      heroFeaturedFloat 4.8s ease-in-out 1.35s infinite!important;
  }

  html[dir="rtl"] .hero-grid > .hero-featured-program{
    justify-self:start!important;
  }

  .hero-featured-program a{
    grid-template-columns:70px minmax(0,1fr) 28px!important;
    gap:10px!important;
    min-height:88px!important;
    padding:9px 10px 9px 9px!important;
    border-radius:23px!important;
  }

  .hero-featured-program__image{
    width:70px!important;
    height:70px!important;
    border-radius:16px!important;
  }

  .hero-featured-program__copy{
    gap:4px!important;
  }

  .hero-featured-program__copy small{
    font-size:10.5px!important;
  }

  .hero-featured-program__copy strong{
    font-size:clamp(21px,1.8vw,27px)!important;
  }

  .hero-featured-program__arrow{
    width:28px!important;
    height:42px!important;
    font-size:29px!important;
  }
}

.hero-featured-program a > span{
  position:relative;
  z-index:2;
}

.hero-featured-program a::after{
  position:absolute;
  inset:-30% auto -30% -58%;
  z-index:4;
  width:72%;
  border-radius:35%;
  background:linear-gradient(102deg,transparent 0%,rgba(255,215,80,.08) 20%,rgba(255,245,190,.82) 48%,rgba(243,180,33,.5) 62%,transparent 100%);
  content:"";
  pointer-events:none;
  opacity:0;
  filter:blur(2px);
  mix-blend-mode:screen;
  animation:heroFeaturedSheen 5.8s cubic-bezier(.22,.61,.36,1) 1.7s infinite;
}

.hero-featured-program__arrow{
  --hero-feature-arrow-shift:4px;
  animation:heroFeaturedArrowCue 5.8s ease-in-out 1.7s infinite;
}

html[dir="rtl"] .hero-featured-program__arrow{
  --hero-feature-arrow-shift:-4px;
}

.hero-featured-program:hover,
.hero-featured-program:focus-within,
.hero-featured-program:hover a::after,
.hero-featured-program:focus-within a::after,
.hero-featured-program:hover .hero-featured-program__arrow,
.hero-featured-program:focus-within .hero-featured-program__arrow{
  animation-play-state:paused!important;
}

@media(max-width:820px){
  .hero-grid > .hero-copy{
    top:auto!important;
  }

  .hero-grid > .hero-featured-program{
    top:auto!important;
    animation:
      heroEnterCard .9s cubic-bezier(.22,.61,.36,1) .22s both,
      heroFeaturedFloat 4.8s ease-in-out 1.35s infinite!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-grid > .hero-featured-program,
  .hero-featured-program a::after,
  .hero-featured-program__arrow{
    animation:none!important;
    translate:none!important;
    transform:none!important;
  }
}

/* =========================================================
   STICKY FEATURED OFFER + CAROUSEL IMAGE FRAME FIX
   Keep the optional offer visible throughout the landing page,
   and make each carousel link fill the complete card frame.
   ========================================================= */
.hero-featured-program.is-floating{
  position:fixed!important;
  inset-inline-start:auto!important;
  inset-inline-end:max(18px,calc((100vw - 1180px) / 2))!important;
  top:clamp(112px,12vw,190px)!important;
  z-index:900!important;
  width:430px!important;
  max-width:calc(100vw - 36px)!important;
  margin:0!important;
  transition:
    width .72s cubic-bezier(.16,1,.3,1),
    max-width .72s cubic-bezier(.16,1,.3,1)!important;
  will-change:width,max-width,translate,filter;
}

.hero-featured-program.is-floating a{
  width:100%!important;
  height:90px!important;
  min-height:90px!important;
  transition:
    grid-template-columns .72s cubic-bezier(.16,1,.3,1),
    gap .72s cubic-bezier(.16,1,.3,1),
    height .72s cubic-bezier(.16,1,.3,1),
    min-height .72s cubic-bezier(.16,1,.3,1),
    padding .72s cubic-bezier(.16,1,.3,1),
    border-radius .72s cubic-bezier(.16,1,.3,1),
    transform .22s ease,
    box-shadow .22s ease!important;
}

.hero-featured-program.is-floating .hero-featured-program__image{
  transition:
    width .72s cubic-bezier(.16,1,.3,1),
    height .72s cubic-bezier(.16,1,.3,1),
    border-radius .72s cubic-bezier(.16,1,.3,1)!important;
}

.hero-featured-program.is-floating .hero-featured-program__copy{
  opacity:1;
  transform:scale(1);
  transition:
    opacity .22s ease .16s,
    transform .52s cubic-bezier(.16,1,.3,1) .08s!important;
}

.hero-featured-program.is-floating .hero-featured-program__arrow{
  opacity:1;
  transition:opacity .22s ease .16s,color .18s ease!important;
}

.hero-featured-program__image img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center 45%!important;
}

@media(min-width:821px){
  .program-category-card{
    display:block!important;
    justify-content:stretch!important;
  }

  .program-category-card > a{
    display:grid!important;
    width:100%!important;
    height:100%!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:190px minmax(0,1fr)!important;
  }

  .program-category-card .program-image,
  .home-featured-program-card .program-image{
    width:100%!important;
    max-width:none!important;
    height:190px!important;
    background-size:cover!important;
    background-position:center!important;
  }
}

.hero-featured-program.is-floating.is-compact{
  width:88px!important;
  max-width:88px!important;
}

.hero-featured-program.is-floating.is-compact a{
  display:grid!important;
  width:100%!important;
  height:88px!important;
  min-height:88px!important;
  grid-template-columns:76px minmax(0,0fr) 0!important;
  gap:0!important;
  padding:5px!important;
  border-radius:23px!important;
}

.hero-featured-program.is-floating.is-compact .hero-featured-program__image{
  width:76px!important;
  height:76px!important;
  border-radius:18px!important;
}

.hero-featured-program.is-floating.is-compact .hero-featured-program__copy,
.hero-featured-program.is-floating.is-compact .hero-featured-program__arrow{
  position:relative!important;
  min-width:0!important;
  overflow:hidden!important;
  opacity:0!important;
  visibility:visible!important;
  pointer-events:none!important;
}

.hero-featured-program.is-floating.is-compact .hero-featured-program__copy{
  width:auto!important;
  height:auto!important;
  transform:scale(.96)!important;
  transition-delay:0s!important;
}

.hero-featured-program.is-floating.is-compact .hero-featured-program__arrow{
  width:0!important;
  height:42px!important;
  border-inline-start-color:transparent!important;
  transition-delay:0s!important;
}

@media(max-width:820px){
  .hero-featured-program.is-floating.is-compact{
    width:58px!important;
    max-width:58px!important;
  }

  .hero-featured-program.is-floating.is-compact a{
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    grid-template-columns:48px minmax(0,0fr) 0!important;
    padding:4px!important;
    border-radius:17px!important;
  }

  .hero-featured-program.is-floating.is-compact .hero-featured-program__image{
    width:48px!important;
    height:48px!important;
    border-radius:13px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-featured-program.is-floating,
  .hero-featured-program.is-floating a,
  .hero-featured-program.is-floating .hero-featured-program__image,
  .hero-featured-program.is-floating .hero-featured-program__copy,
  .hero-featured-program.is-floating .hero-featured-program__arrow{
    transition:none!important;
  }
}

/* Program names remain English in the Persian page, so preserve their
   reading order and align them independently from the surrounding RTL UI. */
html[dir="rtl"] .program-category-card .program-content h3{
  direction:ltr!important;
  unicode-bidi:isolate!important;
  text-align:left!important;
}

html[dir="rtl"] .program-category-card .program-content h3.english-category-name{
  direction:ltr!important;
  unicode-bidi:isolate!important;
  text-align:left!important;
}

@media(min-width:821px) and (max-width:1100px){
  .program-category-card > a{
    grid-template-rows:172px minmax(0,1fr)!important;
  }

  .program-category-card .program-image,
  .home-featured-program-card .program-image{
    height:172px!important;
  }
}

@media(max-width:820px){
  .hero-featured-program.is-floating{
    position:fixed!important;
    inset-inline-start:auto!important;
    inset-inline-end:12px!important;
    top:80px!important;
    width:236px!important;
    max-width:calc(100vw - 24px)!important;
    z-index:900!important;
  }

  .hero-featured-program.is-floating a{
    grid-template-columns:50px minmax(0,1fr) 22px!important;
    gap:7px!important;
    height:64px!important;
    min-height:64px!important;
    padding:6px 7px 6px 6px!important;
    border-radius:18px!important;
  }

  .hero-featured-program__image{
    width:50px!important;
    height:50px!important;
    border-radius:12px!important;
  }

  .hero-featured-program__copy{
    gap:2px!important;
  }

  .hero-featured-program__copy small{
    font-size:8.5px!important;
    line-height:1.15!important;
  }

  .hero-featured-program__copy strong{
    font-size:17px!important;
    line-height:1!important;
  }

  .hero-featured-program__arrow{
    width:22px!important;
    height:32px!important;
    font-size:23px!important;
  }

  .program-category-card > a{
    display:grid!important;
    width:100%!important;
    height:100%!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:148px minmax(0,1fr)!important;
  }

  .program-category-card .program-image,
  .home-featured-program-card .program-image{
    width:100%!important;
    max-width:none!important;
    background-size:cover!important;
    background-position:center!important;
  }
}

/* =========================================================
   PROGRAM CATEGORY CAPTIONS + POINTER SWIPE
   Keep category names in a compact LTR caption rail and let
   mouse, pen and touch users drag the desktop/tablet carousel.
   ========================================================= */
.program-category-card:not(.home-featured-program-card) .program-content{
  direction:ltr!important;
  justify-content:flex-start!important;
  text-align:left!important;
}

.program-category-card:not(.home-featured-program-card) .program-content h3,
html[dir="rtl"] .program-category-card:not(.home-featured-program-card) .program-content h3.english-category-name{
  width:100%!important;
  direction:ltr!important;
  unicode-bidi:isolate!important;
  text-align:left!important;
}

@media(min-width:1101px){
  .program-category-card:not(.home-featured-program-card){
    height:330px!important;
  }

  .program-category-card:not(.home-featured-program-card) > a{
    grid-template-rows:248px 82px!important;
  }

  .program-category-card:not(.home-featured-program-card) .program-image{
    height:248px!important;
  }

  .program-category-card:not(.home-featured-program-card) .program-content{
    min-height:0!important;
    padding:16px 20px!important;
    align-items:center!important;
  }

  .program-category-card:not(.home-featured-program-card) .program-content h3{
    font-size:20px!important;
    line-height:1.2!important;
  }
}

@media(min-width:821px) and (max-width:1100px){
  .program-category-card:not(.home-featured-program-card){
    height:308px!important;
  }

  .program-category-card:not(.home-featured-program-card) > a{
    grid-template-rows:226px 82px!important;
  }

  .program-category-card:not(.home-featured-program-card) .program-image{
    height:226px!important;
  }

  .program-category-card:not(.home-featured-program-card) .program-content{
    min-height:0!important;
    padding:16px 20px!important;
    align-items:center!important;
  }

  .program-category-card:not(.home-featured-program-card) .program-content h3{
    font-size:20px!important;
    line-height:1.2!important;
  }
}

@media(min-width:621px){
  .programs-viewport{
    cursor:grab;
    touch-action:pan-y;
    user-select:none;
  }

  .programs-carousel.is-pointer-ready .programs-viewport,
  .programs-carousel.is-dragging .programs-viewport{
    cursor:grabbing;
  }

  .programs-carousel.is-dragging .programs-track{
    transition:none!important;
  }

  .programs-carousel.is-dragging .program-category-card{
    pointer-events:none;
  }
}

@media(max-width:620px){
  .program-category-card:not(.home-featured-program-card) .program-content{
    align-items:center!important;
  }
}

/* Give the expanded hero offer a larger image and clearer visual hierarchy.
   Keep the existing compact card unchanged after leaving the hero. */
.hero-featured-program.is-floating:not(.is-compact){
  width:clamp(400px,42vw,560px)!important;
}
.hero-featured-program.is-floating:not(.is-compact) a{
  grid-template-columns:124px minmax(0,1fr) 42px!important;
  gap:16px!important;
  height:auto!important;
  min-height:156px!important;
  padding:14px!important;
  border:2px solid #f3c454;
  border-radius:30px!important;
  background:linear-gradient(125deg,#fffdf5 0%,#fff2ce 62%,#f8dfa0 100%);
  box-shadow:0 24px 60px rgba(0,0,0,.34),0 0 32px rgba(243,180,33,.24),inset 0 1px 0 #fff;
}
.hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__image{
  width:124px!important;
  height:124px!important;
  border-radius:20px!important;
}
.hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__copy{
  gap:10px!important;
}
.hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__copy small{
  color:#795000;
  font-size:14px!important;
  line-height:1.4!important;
}
.hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__copy strong{
  font-size:clamp(30px,2.8vw,40px)!important;
  line-height:1.08!important;
}
.hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__arrow{
  width:42px!important;
  height:42px!important;
  border:0;
  border-radius:50%;
  background:#f3b421;
  color:#102542;
  font-size:34px!important;
}
.hero-featured-program.is-floating:not(.is-compact):has(.hero-featured-program__details) a{
  height:auto!important;
}
.hero-featured-program__details{
  display:grid;
  grid-column:1/-1;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  padding-top:12px;
  border-top:1px solid rgba(154,104,0,.22);
  color:#102542;
  font-size:14px;
  font-weight:800;
  line-height:1.5;
}
.hero-featured-program__details > span{
  display:block;
  padding:8px 10px;
  border:1px solid rgba(154,104,0,.16);
  border-radius:10px;
  background:rgba(255,255,255,.65);
  text-align:start;
}
.hero-featured-program.is-compact .hero-featured-program__details{
  display:none;
}
/* Align the expanded offer with the opposite copy while retaining its compact
   floating state after the visitor leaves the hero. */
@media(min-width:821px){
  .hero-grid > .hero-copy{grid-column:1 / span 6!important}
  html[dir="rtl"] .hero-grid > .hero-copy{grid-column:7 / -1!important}
  .hero-featured-program.is-floating:not(.is-compact){
    top:var(--hero-featured-expanded-top,clamp(300px,36vh,460px))!important;
    inset-inline-end:var(--hero-featured-expanded-inset,32px)!important;
    max-width:var(--hero-featured-expanded-max-width,calc((100vw - 92px) / 2))!important;
  }
}
@media(max-width:820px){
  body:has(> .hero-featured-program.is-floating) .hero{
    padding-top:calc(var(--hero-featured-expanded-height,222px) + 18px)!important;
  }
  .hero-featured-program.is-floating:not(.is-compact){
    top:90px!important;
    width:min(344px,calc(100% - 24px))!important;
    inset-inline:0!important;
    margin-inline:auto!important;
  }
  .hero-featured-program.is-floating:not(.is-compact) a{
    grid-template-columns:78px minmax(0,1fr) 30px!important;
    gap:10px!important;
    height:auto!important;
    min-height:104px!important;
    padding:11px!important;
    border-radius:24px!important;
  }
  .hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__image{
    width:78px!important;
    height:78px!important;
    border-radius:16px!important;
  }
  .hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__copy{
    gap:5px!important;
  }
  .hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__copy small{
    font-size:12px!important;
  }
  .hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__copy strong{
    font-size:24px!important;
  }
  .hero-featured-program.is-floating:not(.is-compact) .hero-featured-program__arrow{
    width:30px!important;
    height:30px!important;
    font-size:26px!important;
  }
  .hero-featured-program__details{
    gap:6px;
    padding-top:10px;
    font-size:13px;
  }
  .hero-featured-program__details > span{
    padding:7px 8px;
  }
}

/* The short-programs page follows the categories as a regular carousel card. */
.program-category-card.home-short-programs-card .program-image{position:relative!important}
.program-category-card.home-short-programs-card .home-short-programs-names{position:absolute;inset:auto 12px 12px;z-index:2;padding:7px 10px;border:1px solid rgba(255,255,255,.55);border-radius:999px;background:rgba(255,253,245,.93);color:#102542;font:700 11px/1.5 Inter,Arial,sans-serif;text-align:center;backdrop-filter:blur(10px)}
.program-category-card.home-short-programs-card .program-content{padding:10px 16px!important;direction:ltr!important;text-align:left!important}
.program-category-card.home-short-programs-card .program-content h3{font-size:17px!important;line-height:1.4!important;letter-spacing:-.015em!important;white-space:normal!important}
html[dir="rtl"] .program-category-card.home-short-programs-card .program-content,html[dir="rtl"] .program-category-card.home-short-programs-card .program-content h3{direction:rtl!important;text-align:right!important;font-family:Vazirmatn,Tahoma,Arial,sans-serif!important;letter-spacing:0!important}
