*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --bg-dark:      #0b3528;
      --bg-darker:    #07261c;
      --bg-mid:       #144433;
      --accent:       #3ecf8e;
      --accent-dim:   #2aab72;
      --accent-glow:  rgba(62,207,142,.18);
      --card-bg:      #ffffff;
      --text-dark:    #0b1f18;
      --text-muted:   #5a7a6f;
      --input-bg:     #f3f8f5;
      --input-border: #cce5d8;
      --radius:       12px;
      --radius-sm:    8px;
      --shadow-card:  0 4px 28px rgba(0,0,0,.10);
      --shadow-glow:  0 0 32px rgba(62,207,142,.15);
      --error:        #dc2626;
    }
    html {
  scroll-behavior: smooth;
}

    body { font-family: 'Inter', sans-serif; background: var(--bg-dark); color: #e8f5ee; font-size: 16px; line-height: 1.6; }

    /* NAV */
    nav {
      background: var(--bg-darker); border-bottom: 1px solid rgba(62,207,142,.15);
      padding: 0 2rem; display: flex; align-items: center; justify-content: space-between;
      height: 64px; position: sticky; top: 0; z-index: 100;
    }
 .nav-logo { 
  height: 30px; 
  width: auto; /* Force a strict width to cut off the invisible space */
  object-fit: cover; /* Changes from contain to cover so it fills the strict width */
  object-position: left center; /* Keeps the logo pinned to the left edge */
}

    .nav-badge { background: var(--accent); color: var(--bg-darker); font-weight: 800; font-size: .85rem; padding: .25rem .65rem; border-radius: 6px; letter-spacing: .5px; }
    .nav-title { color: #fff; font-weight: 600; font-size: .95rem; }
    .nav-right { display: flex; align-items: center; gap: 1.5rem; }
    /* NAVBAR COUNTDOWN */
.nav-countdown {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(62, 207, 142, 0.12);
  border: 1px solid rgba(62, 207, 142, 0.3);
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--accent);
}

.nav-cd-label {
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.75);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.nav-cd-time {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--accent);
}

/* Mobile: hide countdown to save space */
@media (max-width: 900px) {
  .nav-countdown {
    display: none;
  }
}

    .nav-right a { color: rgba(255,255,255,.6); text-decoration: none; font-size: .88rem; }
    .nav-right a:hover { color: var(--accent); }
    .btn-nav { background: var(--accent); color: var(--bg-darker); border: none; padding: .45rem 1.2rem; border-radius: 8px; font-weight: 600; font-size: .88rem; cursor: pointer; font-family: inherit; transition: opacity .2s; }
    .btn-nav:hover { opacity: .88; }

    /* HERO */
    .hero {
      text-align: center; padding: 5rem 1.5rem 4rem;
      background: radial-gradient(ellipse 80% 55% at 50% 0%, rgba(62,207,142,.13), transparent 70%);
      position: relative; overflow: hidden;
    }
    .hero::before {
      content:''; position: absolute; inset: 0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cg fill='%233ecf8e' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
      pointer-events: none;
    }
    .hero-pill {
      display: inline-flex; align-items: center; gap: .5rem;
      background: rgba(62,207,142,.1); border: 1px solid rgba(62,207,142,.3); color: var(--accent);
      padding: .3rem .9rem; border-radius: 999px; font-size: .78rem; font-weight: 600;
      letter-spacing: .6px; text-transform: uppercase; margin-bottom: 1.5rem;
    }
    .hero-pill-dot { width: 6px; height: 6px; background: var(--accent); border-radius: 50%; animation: blink 1.8s ease-in-out infinite; }
    @keyframes blink { 0%,100%{opacity:1} 50%{opacity:.4} }
    .hero h1 { font-size: clamp(2rem, 5vw, 3.4rem); font-weight: 800; color: #fff; line-height: 1.15; margin-bottom: .75rem; letter-spacing: -.5px; }
    .hero h1 em { color: var(--accent); font-style: normal; }
    .hero-sub { color: rgba(255,255,255,.58); font-size: 1rem; max-width: 520px; margin: 0 auto 2.5rem; }
    .hero-stats { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 2rem; }
    .stat-chip { background: rgba(255,255,255,.06); border: 1px solid rgba(62,207,142,.2); border-radius: 10px; padding: .8rem 1.4rem; text-align: center; min-width: 110px; }
    .stat-val { font-size: 1.3rem; font-weight: 700; color: var(--accent); display: block; }
    .stat-val2 { font-size: 1.3rem; font-weight: 700; color: #ffffff; display: block; }
    .stat-val3 { font-size: 1.3rem; font-weight: 700; color:var(--accent); display: block;animation: blink 2s ease-in-out infinite; }
    .stat-lbl { font-size: .7rem; color: rgba(255,255,255,.45); text-transform: uppercase; letter-spacing: .5px; }
    .hero-tags { display: flex; justify-content: center; gap: .8rem; flex-wrap: wrap;margin-top: 3rem; }
    .tag { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.7); padding: .3rem .8rem; border-radius: 999px; font-size: .95rem; }
/* COUNTDOWN TIMER */
.countdown-wrap {
  margin-bottom: 2rem;
  text-align: center;
}
.countdown-label {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.6);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 0.8rem;
  font-weight: 600;
}
.countdown {
  display: inline-flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
}
.cd-box {
  background: rgba(62, 207, 142, 0.08);
  border: 1px solid rgba(62, 207, 142, 0.25);
  border-radius: 12px;
  padding: 0.75rem 1rem;
  min-width: 75px;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 0 15px rgba(62, 207, 142, 0.05);
  backdrop-filter: blur(4px);
}
.cd-val {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--accent);
  line-height: 1.1;
  font-variant-numeric: tabular-nums; /* Prevents numbers from jittering */
}
.cd-lbl {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.55);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 0.3rem;
  font-weight: 500;
}
/* MOBILE: Countdown in one line */
@media (max-width: 400px) {
  .countdown {
    display: flex;
    flex-wrap: nowrap;       /* force single line */
    gap: 0.4rem;
    justify-content: center;
  }

  .cd-box {
    min-width: 0;            /* remove fixed min-width */
    flex: 1;                 /* each box takes equal space */
    padding: 0.55rem 0.3rem;
  }

  .cd-val {
    font-size: 1.35rem;      /* slightly smaller numbers */
  }

  .cd-lbl {
    font-size: 0.6rem;       /* smaller labels */
    letter-spacing: 0.05em;
  }

  .countdown-label {
    font-size: 0.75rem;
    letter-spacing: 0.1em;
  }
}
.cd-sep {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--accent);
  align-self: center;
  margin-bottom: 1rem; /* aligns with numbers, not labels */
  opacity: 0.7;
}

@media (max-width: 520px) {
  .cd-sep {
    font-size: 1.4rem;
    margin-bottom: 0.8rem;
  }
}


    /* WRAPPER */
    .page-body { max-width: 860px; margin: 0 auto; padding: 3rem 1.25rem 5rem; }

    /* PROGRESS BAR */
    .progress-wrap { margin-bottom: 2.5rem; }
    .progress-steps { display: flex; gap: .4rem; margin-bottom: .5rem; }
    .step-bar { height: 4px; border-radius: 2px; flex: 1; background: rgba(255,255,255,.12); transition: background .4s; }
    .step-bar.active { background: var(--accent); }
    .progress-label { font-size: .78rem; color: rgba(255,255,255,.45); text-align: right; }
    .progress-label span { color: var(--accent); font-weight: 600; }

    /* FORM CARD */
    .form-card { background: var(--card-bg); border-radius: 16px; box-shadow: var(--shadow-card); color: var(--text-dark); overflow: hidden; }

    /* SECTION HEADER */
    .sec-header {
      display: flex; align-items: center; gap: 1rem;
      padding: 1.5rem 2rem; border-bottom: 1px solid #e8f0ec;
      background: linear-gradient(90deg, #f0faf5 0%, #fff 100%);
    }
    .sec-num {
      width: 36px; height: 36px; border-radius: 50%;
      background: linear-gradient(135deg, var(--accent), var(--accent-dim));
      color: white; font-weight: 700; font-size: .9rem;
      display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    }
    .sec-header-text h3 { font-size: 1rem; font-weight: 700; color: var(--text-dark); }
    .sec-header-text p { font-size: .82rem; color: var(--text-muted); margin-top: .1rem; }
    .sec-star { color: #f59e0b; margin-left: .3rem; }

    /* SECTION BODY */
    .sec-body { padding: 1.75rem 2rem; border-bottom: 1px solid #f0f5f2; }
    .sec-body:last-child { border-bottom: none; }

    /* FORM GRID */
    .fg { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1.2rem; }
    .fg:last-child { margin-bottom: 0; }
    .fg.half { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
    .fg.third { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1rem; }
    .fg.col { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 0; }
    @media(max-width:580px) { .fg.half, .fg.third { grid-template-columns: 1fr; } nav .nav-title { display: none; } }

    label.lbl { font-size: .88rem; font-weight: 500; color: var(--text-dark); display: block; margin-bottom: .35rem; }
    label.lbl .req { color: var(--error); margin-left: 2px; }
    label.lbl .hint { font-weight: 400; color: var(--text-muted); font-size: .8rem; margin-left: .4rem; }

    input[type="text"], input[type="email"], input[type="tel"], select, textarea {
      width: 100%; background: var(--input-bg); border: 1.5px solid var(--input-border);
      border-radius: var(--radius-sm); padding: .6rem .9rem; font-size: .9rem;
      font-family: inherit; color: var(--text-dark); outline: none;
      transition: border-color .2s, box-shadow .2s; -webkit-appearance: none;
    }
    input:focus, select:focus, textarea:focus {
      border-color: var(--accent-dim); box-shadow: 0 0 0 3px rgba(62,207,142,.13);
    }
    textarea { resize: vertical; min-height: 100px; }
    select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%235a7a6f'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .8rem center; padding-right: 2.5rem; cursor: pointer; }

    /* Error state */
    .fg-error { display: none; font-size: .77rem; color: var(--error); margin-top: .2rem; }
    .invalid input, .invalid select, .invalid textarea { border-color: var(--error) !important; }
    .invalid .fg-error { display: block; }

    /* MEMBER CARD */
    .member-block {
      background: #f8fdf9; border: 1.5px solid #cce5d8; border-radius: var(--radius);
      padding: 1.4rem; margin-bottom: 1rem;
    }
    .member-block.conditional { display: none; }
    .member-block-hdr {
      display: flex; align-items: center; justify-content: space-between;
      margin-bottom: 1.25rem;
    }
    .member-title { font-size: .82rem; font-weight: 700; color: var(--accent-dim); text-transform: uppercase; letter-spacing: .5px; display: flex; align-items: center; gap: .5rem; }
    .member-badge { background: var(--accent-dim); color: white; border-radius: 6px; padding: .1rem .5rem; font-size: .72rem; }
    .required-tag { background: #fee2e2; color: var(--error); border-radius: 6px; padding: .1rem .5rem; font-size: .72rem; font-weight: 600; }
    .optional-tag { background: #e0f2fe; color: #0369a1; border-radius: 6px; padding: .1rem .5rem; font-size: .72rem; font-weight: 600; }

    /* CHOICE BUTTONS (2/3 members, leader, domain) */
    .choice-group { display: flex; flex-wrap: wrap; gap: .6rem; }
    .choice-input { display: none; }
    .choice-btn {
      padding: .45rem 1.1rem; border: 1.5px solid var(--input-border);
      border-radius: 999px; font-size: .88rem; font-weight: 500;
      color: var(--text-dark); cursor: pointer; transition: all .18s;
      background: var(--input-bg); user-select: none;
      font-family: inherit;
    }
    .choice-input:checked + .choice-btn {
      border-color: var(--accent-dim); background: rgba(62,207,142,.1);
      color: var(--accent-dim);
    }

    /* DOMAIN GRID */
    .domain-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: .6rem; }
    .domain-option { display: none; }
    .domain-label {
      display: flex; flex-direction: column; align-items: center; gap: .3rem;
      border: 1.5px solid var(--input-border); border-radius: var(--radius);
      padding: .75rem .5rem; cursor: pointer; text-align: center;
      transition: all .18s; background: var(--input-bg);
    }
    .domain-option:checked + .domain-label {
      border-color: var(--accent-dim); background: rgba(62,207,142,.08);
    }
    .domain-icon { font-size: 1.3rem; }
    .domain-name { font-size: .78rem; font-weight: 600; color: var(--text-dark); }

    /* SCALE */
    .scale-wrap { display: flex; flex-direction: column; gap: .6rem; }
    .scale-labels { display: flex; justify-content: space-between; font-size: .75rem; color: var(--text-muted); }
    .scale-btns { display: flex; gap: .5rem; }
    .scale-radio { display: none; }
    .scale-btn {
      flex: 1; text-align: center; padding: .5rem .2rem; border: 1.5px solid var(--input-border);
      border-radius: 8px; font-size: .9rem; font-weight: 600; cursor: pointer;
      color: var(--text-muted); background: var(--input-bg); transition: all .18s;
      font-family: inherit;
    }
    .scale-radio:checked + .scale-btn {
      border-color: var(--accent-dim); background: rgba(62,207,142,.1);
      color: var(--accent-dim);
    }

    /* WORD COUNT */
    .wc-bar { display: flex; justify-content: space-between; align-items: center; margin-top: .3rem; }
    .wc-text { font-size: .76rem; }
    .wc-ok    { color: var(--accent-dim); }
    .wc-warn  { color: #f59e0b; }
    .wc-error { color: var(--error); }
    .wc-dot { width: 28px; height: 5px; border-radius: 3px; background: #e8f0ec; overflow: hidden; }
    .wc-fill { height: 100%; border-radius: 3px; background: var(--accent-dim); transition: width .3s; }

    /* CHECKBOX ROWS */
    .check-row {
      display: flex; align-items: flex-start; gap: .75rem;
      background: #f8fdf9; border: 1px solid #ddeee6; border-radius: var(--radius-sm);
      padding: .9rem 1rem; margin-bottom: .75rem;
    }
    .check-row input[type="checkbox"] { width: 18px; height: 18px; margin-top: .15rem; flex-shrink: 0; accent-color: var(--accent-dim); cursor: pointer; }
    .check-row-text { font-size: .88rem; color: var(--text-dark); }
    .check-row-text span { font-weight: 600; color: var(--accent-dim); }
    .check-row.invalid-check { border-color: var(--error); background: #fff5f5; }
    /* Style for the Rules download link inside checkbox */
.rules-link {
  color: var(--accent-dim);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
  position: relative;
  z-index: 10;
}

.rules-link:hover {
  color: var(--accent);
}


    /* SUBMIT */
    .form-footer { padding: 1.5rem 2rem; background: #f8fdf9; border-top: 1px solid #e8f0ec; }
    .btn-submit {
      width: 100%; background: linear-gradient(135deg, var(--accent), var(--accent-dim));
      color: white; border: none; padding: 1rem; border-radius: var(--radius);
      font-size: 1rem; font-weight: 700; cursor: pointer; font-family: inherit;
      display: flex; align-items: center; justify-content: center; gap: .6rem;
      transition: opacity .2s, transform .15s; box-shadow: 0 4px 16px rgba(62,207,142,.3);
    }
    .btn-submit:hover { opacity: .9; transform: translateY(-1px); }
    .btn-submit:active { transform: translateY(0); }
    .form-disclaimer { font-size: .78rem; color: var(--text-muted); text-align: center; margin-top: .75rem; }
    .form-disclaimer a { color: var(--accent-dim); text-decoration: none; }

    /* CONDITIONAL */
    .conditional-field { display: none; }

    /* MODAL */
    #modal {
      display: none; position: fixed; inset: 0;
      background: rgba(7,38,28,.88); z-index: 200;
      align-items: center; justify-content: center;
    }
    #modal.open { display: flex; }
    .modal-box { background: #fff; border-radius: 16px; padding: 2.5rem; max-width: 440px; width: 92%; text-align: center; }
    .modal-icon { width: 64px; height: 64px; background: linear-gradient(135deg, var(--accent), var(--accent-dim)); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.25rem; }
    .modal-icon svg { width: 32px; height: 32px; fill: white; }
    .modal-box h2 { color: var(--text-dark); font-size: 1.3rem; margin-bottom: .5rem; }
    .modal-box p { color: var(--text-muted); font-size: .88rem; margin-bottom: 1.5rem; line-height: 1.6; }
    .modal-close { background: var(--bg-dark); color: #fff; border: none; padding: .65rem 2rem; border-radius: 8px; cursor: pointer; font-family: inherit; font-weight: 600; }

    /* FOOTER */
    footer { background: var(--bg-darker); border-top: 1px solid rgba(62,207,142,.1); text-align: center; padding: 2rem; color: rgba(255,255,255,.38); font-size: .8rem; }
    footer span { color: var(--accent); }
    /* FOOTER SOCIAL ICONS */
.footer-content {
  text-align: center;
  padding: 2rem 1.25rem;
}

.footer-social {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.85);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.social-link:hover {
  background: linear-gradient(135deg, rgba(62, 207, 142, 0.25), rgba(42, 171, 114, 0.15));
  border-color: rgba(62, 207, 142, 0.5);
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 12px 35px rgba(62, 207, 142, 0.4);
}

.social-icon {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  transition: inherit;
}



    /* Reveal */
    .reveal { opacity: 0; transform: translateY(18px); transition: opacity .5s, transform .5s; }
    .reveal.visible { opacity: 1; transform: translateY(0); }
  
    /* Logo images */
   .nav-brand {
  display: flex;
  align-items: center;
  text-decoration: none;
  margin-right: 1rem; /* Forces space between the logo container and the links */
  flex-shrink: 0;
}

    .nav-brand-logos { display: flex; align-items: center; gap: .5rem; }
    .nav-brand-logos img { display: block; height: 34px; width: auto; object-fit: contain; }
    .nav-sep { color: rgba(255,255,255,.25); font-weight: 600; font-size: 1.2rem; margin: 0 4px; }
/* Reduce navbar padding on mobile */
@media (max-width: 520px) {
  nav {
    padding: 0 1rem; /* Less side padding on small screens */
  }

  .nav-right {
    gap: 0.75rem; /* Tighten gap between links */
  }

  .nav-right a {
    font-size: 0.82rem; /* Slightly smaller link text */
  }

  .btn-nav {
     display: none;
  }

  .nav-logo {
    height: 25px; /* Slightly smaller logo on mobile */
    width: auto;
  }
  .nav-right a[href="#overview"]{
   font-size: 0.82rem; 
  }
}

    .hero-logos { display: flex; justify-content: center; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; position: relative; z-index: 2; }
    .hero-logos img { display: block; object-fit: contain; }
    .hero-logos .logo-iace { 
  height: 88px;
  position: relative;
  
}
    .hero-logos .logo-intellect { height: 100px; opacity: .95; } .logo-library { height: 80px; opacity: .95; }
/* TRACKS SECTION - Connected Path Flow */
.tracks-section {
  padding: 5rem 1.25rem 4rem;
  background: var(--bg-darker);
  position: relative;
  overflow: hidden;
}

.tracks-container {
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.tracks-header {
  text-align: center;
  margin-bottom: 4rem;
}

.tracks-badge {
  display: inline-block;
  padding: 0.35rem 1.2rem;
  background: rgba(62, 207, 142, 0.1);
  color: var(--accent);
  border: 1px solid rgba(62, 207, 142, 0.3);
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  margin-bottom: 1rem;
}
.closedin-badge {
  padding: 0.35rem 1.2rem;
  background: rgba(62, 207, 142, 0.1);
  color: var(--accent);
  border: 1px solid rgba(62, 207, 142, 0.3);
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  margin-bottom: 1rem;
}

.tracks-title {
  font-size: clamp(2rem, 5vw, 2.8rem);
  font-weight: 800;
  color: #fff;
  margin-bottom: 1rem;
}

.tracks-sub {
  color: rgba(255, 255, 255, 0.65);
  font-size: 1.1rem;
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.6;
}

/* The Flow */
.process-flow {
  position: relative;
  padding-left: 3rem;
}

/* The continuous vertical line */
.process-line {
  position: absolute;
  left: 28px;
  top: 0;
  bottom: 0;
  width: 4px;
  background: linear-gradient(to bottom, rgba(62, 207, 142, 0.1), var(--accent) 50%, rgba(245, 158, 11, 0.8));
  border-radius: 4px;
  box-shadow: 0 0 15px rgba(62, 207, 142, 0.4);
}

.process-step {
  position: relative;
  margin-bottom: 4rem;
  display: flex;
  align-items: center;
}

.process-step:last-child {
  margin-bottom: 0;
}

/* The Glowing Nodes */
.process-node {
  position: absolute;
  left: -3rem; /* Aligns with the line */
  width: 60px;
  height: 60px;
  background: var(--bg-dark);
  border: 2px solid var(--accent);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

.node-icon {
  font-size: 1.5rem;
  position: relative;
  z-index: 3;
}

.node-glow {
  position: absolute;
  inset: -8px;
  background: var(--accent);
  border-radius: 50%;
  filter: blur(12px);
  opacity: 0.3;
  z-index: 1;
  transition: opacity 0.3s;
}

.process-step:hover .node-glow {
  opacity: 0.6;
}

.final-glow {
  background: #f59e0b; /* Amber glow for final step */
  opacity: 0.4;
}
.process-step:hover .final-glow {
  opacity: 0.7;
}
.process-step:last-child .process-node {
  border-color: #f59e0b;
}

/* Step Content Cards */
.process-content {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01));
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  padding: 2rem 2.5rem;
  width: 100%;
  margin-left: 2rem;
  backdrop-filter: blur(10px);
  transition: transform 0.3s ease, border-color 0.3s ease;
}

.process-step:hover .process-content {
  transform: translateX(8px);
  border-color: rgba(62, 207, 142, 0.4);
}

.process-step:last-child:hover .process-content {
  border-color: rgba(245, 158, 11, 0.5);
}

.step-label {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 0.5rem;
}
.step-label-3 {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  color: #f59e0b;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 0.5rem;
}



.process-content h3 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.8rem;
}

.process-content p {
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Mobile Adjustments */
@media (max-width: 650px) {
  .process-flow {
    padding-left: 2rem;
  }
  .process-line {
    left: 14px;
  }
  .process-node {
    left: -2rem;
    width: 45px;
    height: 45px;
  }
  .node-icon {
    font-size: 1.1rem;
  }
  .process-content {
    margin-left: 1.5rem;
    padding: 1.5rem;
  }
}

/* IMPORTANT DATES TIMELINE (Green Theme) */
:root {
  --tl-accent: #3ecf8e;      /* main green accent */
  --tl-accent-dim: #2aab72;  /* darker green */
  --tl-text: rgba(255,255,255,.88);
  --tl-muted: rgba(255,255,255,.45);
}

.dates {
  max-width: 980px;
  margin: 0 auto;
  padding: 2.2rem 1.25rem 0.5rem;
}

.dates-head {
  text-align: center;
  margin-bottom: 2rem;
  margin-top: 2rem;
}

.dates-title {
  font-size: clamp(2.1rem, 3vw, 2.4rem);
  font-weight: 800;
  letter-spacing: .2px;
  color: #ffffff;
}

.dates-underline {
  width: 150px;
  height: 3px;
  background: #3ecf8e;
  margin: .75rem auto 0;
  border-radius: 999px;
  box-shadow: 0 0 18px rgba(62,207,142,.35);
}

.dates-wrap {
  position: relative;
  padding: 1.2rem 0 2.5rem;
}

.dates-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(to bottom,
    rgba(62,207,142,.0),
    rgba(62,207,142,.55),
    rgba(62,207,142,.0)
  );
  box-shadow: 0 0 26px rgba(62,207,142,.15);
}

.dates-item {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 34px 1fr;
  align-items: start;
  margin: 0.9rem 0 2.2rem;
}

.dates-item.left .dates-card { grid-column: 1; justify-self: end; text-align: left; }
.dates-item.right .dates-card { grid-column: 3; justify-self: start; text-align: left; }

.dates-dot {
  grid-column: 2;
  justify-self: center;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: var(--tl-accent);
  box-shadow:
    0 0 0 6px rgba(62,207,142,.12),
    0 0 22px rgba(62,207,142,.55);
  margin-top: 10px;
  
}

/* Optional: Make the final dot stand out (e.g. orange/amber) or keep it green */
.dates-dot.final {
  background: #f59e0b; /* Amber */
  box-shadow:
    0 0 0 6px rgba(245,158,11,.12),
    0 0 22px rgba(245,158,11,.55);
  animation: blink 2.5s ease-in-out infinite;
}

.dates-card {
  width: min(420px, 100%);
  padding: 1rem 1.1rem;
}

.dates-badge {
  display: inline-block;
  padding: .32rem .7rem;
  border-radius: 8px;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .9px;
  color: #3ecf8e;
  background: rgba(62,207,142,.14);
  border: 1px solid rgba(62,207,142,.32);
  text-transform: uppercase;
  box-shadow: 0 0 18px rgba(62,207,142,.12);
  
}
.dates-badge-f {
  display: inline-block;
  padding: .32rem .7rem;
  border-radius: 8px;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .9px;
  color: #f59e0b;
  background: rgba(245, 158, 11,.14);
  border: 1px solid rgba(245, 158, 11,.32);
  text-transform: uppercase;
  box-shadow: 0 0 18px rgba(62,207,142,.12);
  
}

.dates-date {
  margin-top: .65rem;
  font-size: 1.35rem;
  font-weight: 800;
  color: #fff;
}

.dates-desc {
  margin-top: .55rem;
  font-size: .95rem;
  color: var(--tl-muted);
  line-height: 1.55;
}

/* Mobile: stack cards under the line */
@media (max-width: 820px) {
  .dates-item {
    grid-template-columns: 34px 1fr;
  }
  .dates-line { left: 17px; transform: none; }
  .dates-dot { grid-column: 1; justify-self: center; }
  .dates-item.left .dates-card,
  .dates-item.right .dates-card {
    grid-column: 2;
    justify-self: start;
    padding-left: .75rem;
  }
}
/* FAQ SECTION – modern cards */
.faq-section {
  padding: 4.2rem 1.25rem 5rem;
  background: radial-gradient(circle at top, rgba(62, 207, 142, 0.17), transparent 55%) var(--bg-darker);
}

.faq-container {
  max-width: 660px;
  margin: 0 auto;
}

.faq-title {
  text-align: center;
  font-size: clamp(1.7rem, 3vw, 2.2rem);
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 0.35rem;
}

.faq-sub {
  text-align: center;
  color: rgba(230, 244, 238, 0.7);
  font-size: 0.95rem;
  margin-bottom: 2.4rem;
}

.faq-list {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}

.faq-item {
  border-radius: 18px;
  background: linear-gradient(
    135deg,
    rgba(9, 44, 32, 0.96),
    rgba(8, 30, 23, 0.96)
  );
  border: 1px solid rgba(148, 216, 189, 0.18);
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.6),
    0 0 0 1px rgba(0, 0, 0, 0.45);
  overflow: hidden;
  backdrop-filter: blur(18px);
}

/* Question button */
.faq-question {
  width: 100%;
  border: none;
  background: transparent;
  padding: 1.15rem 1.4rem 1.15rem 1.1rem;
  display: grid;
  grid-template-columns: 4px minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  cursor: pointer;
  font-family: inherit;
}

.faq-question span {
  font-size: 0.98rem;
  font-weight: 600;
  color: #f5fff9;
}

/* Accent bar on the left */
.faq-question::before {
  content: "";
  width: 4px;
  height: 26px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--accent), var(--accent-dim));
  box-shadow: 0 0 16px rgba(62, 207, 142, 0.8);
}

/* Icon */
.faq-icon {
  color: rgba(188, 230, 210, 0.85);
  transition: transform 0.25s ease, color 0.25s ease;
}

.faq-question:hover .faq-icon {
  color: var(--accent);
}

.faq-question[aria-expanded="true"] .faq-icon {
  transform: rotate(180deg);
  color: var(--accent);
}

/* Answer */
.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.25s ease-out;
  border-top: 1px solid rgba(137, 199, 171, 0.24);
}

.faq-answer p {
  padding: 0 1.6rem 1.1rem 1.6rem;
  font-size: 0.9rem;
  color: rgba(223, 242, 235, 0.9);
  line-height: 1.7;
}

/* Responsive tweaks */
@media (max-width: 600px) {
  .faq-section {
    padding-inline: 1.1rem;
  }
  .faq-question {
    padding-inline: 1.1rem;
    gap: 0.8rem;
  }
  .faq-answer p {
    padding-inline: 1.25rem;
  }
}