:root{
    --ink:        #0F172A;   /* primary text */
    --ink-soft:   #5B6472;   /* muted text */
    --teal:       #0E7C66;   /* primary brand */
    --teal-dark:  #0B5C4D;   /* hover state */
    --coral:      #FF6B4A;   /* CTA accent */
    --coral-dark: #E8542F;   /* CTA hover */
    --mist:       #F2FAF7;   /* pale tint, hover bg */
    --line:       #E7ECEA;   /* hairline border */
    --white:      #FFFFFF;
  }

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

  body{
    font-family:'Inter', sans-serif;
    color:var(--ink);
    background:var(--white);
  }

  a{ text-decoration:none; color:inherit; }
  ul{ list-style:none; }

  /* ===== HEADER ===== */

  .site-header{
    position:sticky;
    top:0;
    z-index:100;
    background:var(--white);
    border-bottom:1px solid var(--line);
  }

  .topbar{
    height:4px;
    background:linear-gradient(90deg, var(--teal) 0%, var(--coral) 100%);
  }

  .menu-toggle{ display:none; }

  .header-inner{
    max-width:1200px;
    margin:0 auto;
    display:flex;
    align-items:center;
    gap:32px;
    padding:14px 24px;
  }

  /* ---- Logo ---- */

  .logo{
    display:flex;
    align-items:center;
    gap:10px;
    font-family:'Sora', sans-serif;
    font-weight:700;
    font-size:20px;
    letter-spacing:-0.01em;
    transition:opacity .2s ease;
  }
  .logo:hover{ opacity:.85; }
  .logo-mark{ flex-shrink:0; }

  /* ---- Main nav ---- */

  .main-nav{
    flex:1;
  }
  .main-nav > ul{
    display:flex;
    align-items:center;
    gap:30px;
  }
  .main-nav a{
    font-size:15px;
    font-weight:500;
    color:var(--ink);
    padding:10px 0;
    position:relative;
  }
  .main-nav > ul > li > a::after{
    content:"";
    position:absolute;
    left:0; bottom:4px;
    width:0%;
    height:2px;
    background:var(--teal);
    transition:width .25s ease;
  }
  .main-nav > ul > li > a:hover::after{ width:100%; }
  .main-nav > ul > li > a:hover{ color:var(--teal-dark); }

  .has-dropdown{ position:relative; }
  .chevron{
    display:inline-block;
    margin-left:4px;
    transition:transform .2s ease;
  }
  .has-dropdown:hover .chevron{ transform:rotate(180deg); }

  .dropdown{
    position:absolute;
    top:calc(100% + 6px);
    left:0;
    min-width:220px;
    background:var(--white);
    border:1px solid var(--line);
    border-radius:12px;
    box-shadow:0 14px 32px rgba(15,23,42,.10);
    padding:8px;
    opacity:0;
    visibility:hidden;
    transform:translateY(6px);
    transition:opacity .2s ease, transform .2s ease, visibility .2s;
  }
  .has-dropdown:hover .dropdown,
  .has-dropdown:focus-within .dropdown{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
  }
  .dropdown li a{
    display:block;
    padding:10px 12px;
    border-radius:8px;
    font-size:14.5px;
    font-weight:500;
    color:var(--ink-soft);
  }
  .dropdown li a:hover{
    background:var(--mist);
    color:var(--teal-dark);
  }

  /* ---- CTA buttons ---- */

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

  .btn{
    font-family:'Inter', sans-serif;
    font-size:14.5px;
    font-weight:600;
    padding:10px 20px;
    border-radius:9px;
    transition:all .2s ease;
    white-space:nowrap;
  }

  .btn-ghost{
    color:var(--ink);
    border:1.5px solid var(--line);
    background:transparent;
  }
  .btn-ghost:hover{
    border-color:var(--teal);
    background:var(--mist);
    color:var(--teal-dark);
  }

  .btn-solid{
    color:var(--white);
    background:var(--coral);
    box-shadow:0 6px 16px rgba(255,107,74,.30);
  }
  .btn-solid:hover{
    background:var(--coral-dark);
    transform:translateY(-1px);
    box-shadow:0 8px 20px rgba(255,107,74,.38);
  }

  /* ---- Hamburger (mobile) ---- */

  .hamburger{
    display:none;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    width:26px;
    height:20px;
    cursor:pointer;
  }
  .hamburger span{
    height:2px;
    background:var(--ink);
    border-radius:2px;
    transition:all .25s ease;
  }

  /* ---- Mobile nav drawer ---- */

  .mobile-nav{
    max-height:0;
    overflow:hidden;
    background:var(--white);
    border-top:1px solid transparent;
    transition:max-height .3s ease;
  }
  .mobile-nav ul{
    padding:8px 24px 4px;
  }
  .mobile-nav li{ border-bottom:1px solid var(--line); }
  .mobile-nav li a{
    display:block;
    padding:14px 4px;
    font-size:15px;
    font-weight:500;
  }
  .mobile-nav .mobile-sub{
    padding-left:14px;
  }
  .mobile-nav .mobile-sub a{
    color:var(--ink-soft);
    font-size:14px;
    padding:10px 4px;
  }
  .mobile-actions{
    display:flex;
    gap:10px;
    padding:16px 24px 20px;
  }
  .mobile-actions .btn{ flex:1; text-align:center; }

  .menu-toggle:checked ~ .mobile-nav{
    max-height:560px;
    border-top:1px solid var(--line);
  }
  .menu-toggle:checked ~ .header-inner .hamburger span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }
  .menu-toggle:checked ~ .header-inner .hamburger span:nth-child(2){
    opacity:0;
  }
  .menu-toggle:checked ~ .header-inner .hamburger span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }

  /* ===== Responsive ===== */

  @media (max-width: 880px){
    .main-nav, .header-actions{ display:none; }
    .hamburger{ display:flex; }
    .header-inner{ padding:14px 20px; }
  }