/* NAVBAR */
    .navbar {
      position: fixed;
      top: 0;
      width: 100%;
      background: rgba(255,255,255,0.95);
      backdrop-filter: blur(20px);
      z-index: 1000;
      padding: 1rem 0;
      transition: all 0.3s ease;
    }
    .nav-container{
      max-width:1200px;
      margin:0 auto;
      padding:0 2rem;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
    }
    .logo{ font-size:1.5rem; font-weight:700; color:var(--secondary-color); text-decoration:none; display:flex; align-items:center; gap:.75rem;}
    .nav-links{ display:flex; gap:2rem; list-style:none; margin:0; padding:0; align-items:center; }
    .nav-links a{ text-decoration:none; color:#30343F; font-weight:500; transition:color .3s; }
    .nav-links a:hover{ color:var(--secondary-color); }

    /* hamburger / drawer */
    .hamburger{
      display:none;
      width:44px;
      height:44px;
      border-radius:8px;
      background:transparent;
      border:none;
      align-items:center;
      justify-content:center;
      cursor:pointer;
    }
    .hamburger .bar{ width:20px; height:2px; background:#30343F; display:block; position:relative; transition:transform .25s ease; }
    .hamburger .bar::before,
    .hamburger .bar::after{
      content:"";
      position:absolute;
      left:0;
      width:20px;
      height:2px;
      background:#30343F;
      transition:transform .25s ease, opacity .2s ease;
    }
    .hamburger .bar::before{ top:-6px; }
    .hamburger .bar::after{ top:6px; }

    /* drawer (right-side) */
    .drawer {
      position: fixed;
      top: 0;
      right: -320px; /* hidden offscreen */
      width: 320px;
      height: 100vh;
      background: rgba(255,255,255,0.98);
      backdrop-filter: blur(10px);
      box-shadow: -20px 0 40px rgba(0,0,0,0.12);
      transition: right .32s cubic-bezier(.2,.9,.2,1);
      z-index: 1500;
      padding: 2rem 1.5rem;
      display:flex;
      flex-direction:column;
      gap:1.25rem;
    }
    .drawer.open { right: 0; }
    .drawer .close-btn{
      align-self:flex-end;
      background:transparent;
      border:none;
      font-size:1.5rem;
      cursor:pointer;
    }
    .drawer nav{ display:flex; flex-direction:column; gap:1rem; margin-top:1rem; }
    .drawer nav a{ text-decoration:none; color:#30343F; font-weight:600; padding:.6rem .8rem; border-radius:8px; }
    .drawer nav a:hover{ color:var(--secondary-color); background: rgba(0,0,0,0.02); }

    .cta-button{
      display:inline-block;
      background: linear-gradient(135deg, var(--primary-color) 0%, #ffc61a 100%);
      color: #30343F;
      padding:1rem 3rem;
      border-radius:50px;
      text-decoration:none;
      font-weight:700;
      font-size:1.1rem;
      transition: all .3s ease;
      box-shadow: 0 10px 40px rgba(245,183,0,0.3);
      position:relative;
      overflow:hidden;
    }
    .cta-button::before{
      content:"";
      position:absolute; top:0; left:-100%; width:100%; height:100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
      transition: left .5s;
    }
    .cta-button:hover::before{ left:100%; }
    .cta-button:hover{ transform:translateY(-2px); box-shadow: 0 15px 50px rgba(245,183,0,0.4); }