/* ============ BUTTONS ============ */
  .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      padding: 10px 26px;
      border-radius: 999px;
      border: 1px solid transparent;
      font-size: 12px;
      font-weight: 400;
      white-space: nowrap;
      font-family: var(--fontfamily);
      transition: transform .2s cubic-bezier(.2, .8, .2, 1), box-shadow .2s ease, background .2s ease, border-color .2s ease;
  }
    .btnStart {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      background: var(--ink);
      color: white;
      padding: 10px 26px;
      border-radius: 999px;
      border: 1px solid transparent;
      font-size: 12px;
      font-weight: 400;
      white-space: nowrap;
      font-family: var(--fontfamily);
      transition: transform .2s cubic-bezier(.2, .8, .2, 1), box-shadow .2s ease, background .2s ease, border-color .2s ease;
  }
.btnStart:hover{
    background: var(--teal-dark);
color: white;
text-decoration: none;
      transform: translateY(-3px) scale(1.02);
      box-shadow: 0 20px 36px -12px rgba(2, 179, 159, 0.6);
}
  .btn-teal {
      background: var(--teal);
      color: #fff;
      box-shadow: 0 16px 30px -12px rgba(2, 179, 159, 0.55);
  }

  .btn-teal:hover {
      background: var(--teal-dark);
color: white;
      transform: translateY(-3px) scale(1.02);
      box-shadow: 0 20px 36px -12px rgba(2, 179, 159, 0.6);
  }

  .btn-navy {
      background: var(--navy);
      color: #fff;
      text-decoration: none;
      transition: 0.2s ease-in-out;
      box-shadow: 0 16px 30px -12px rgba(4, 39, 79, 0.5);
  }

  .btn-navy:hover {
      background: #062f5e;
      color: white;
      text-decoration: none;
      transition: 0.2s ease-in-out;
      transform: translateY(-3px) scale(1.02);
      box-shadow: 0 20px 36px -12px rgba(4, 39, 79, 0.55);
  }

  .btn-white {
      background: #fff;
      color: var(--navy);
  }

  .btn-white:hover {
      background: var(--navy-soft);
      transform: translateY(-3px) scale(1.02);
  }

  .btn-outline {
      background: rgba(255, 255, 255, 0.08);
      color: #fff;
      border-color: rgba(255, 255, 255, 0.5);
      backdrop-filter: blur(6px);
  }

  .btn-outline:hover {
      background: rgba(255, 255, 255, 0.18);
  }

  .btn-ghost {
      background: var(--navy-soft);
      color: var(--navy);
  }

  .btn-ghost:hover {
      background: var(--navy-mist);
  } 

  .pill {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 5px 16px;
      border-radius: var(--r-pill);
      font-size: 0.8em;
      font-weight: 700; 
  }

  .pill-navy {
      background: var(--navy-soft);
      color: var(--navy);
  }

  .pill-teal {
      background: var(--teal-light);
      color: var(--teal-dark);
  }

  .pill-orange {
      background: var(--orange-light);
      color: #A05A00;
  }

  /* ============ SECTION HEAD ============ */
  .section-head {  
  }

  .section-head h2 {
      font-size: clamp(2em, 3.2vw, 2.7em); 
      color: var(--navy);
      line-height: 1.12;
      padding-bottom: 5px;
      font-weight: 600;
  }

  .section-head p {
      color: var(--ink-soft); 
      margin: 0;
      text-align: left;
      font-size: 1em;
  }