html { scroll-behavior: smooth; }
    body { font-family: 'Atkinson Hyperlegible', sans-serif; background: #ffffff; color: #1a1c0e; }
    .font-main { font-family: 'Lexend Deca', sans-serif; }
    .font-text  { font-family: 'Atkinson Hyperlegible', sans-serif; }

    /* ── Hero ── */
    .hero-bg {
      background-color: #2e3316;
      background-image:
        radial-gradient(ellipse 70% 55% at 65% 35%, rgba(140,150,122,0.16) 0%, transparent 65%),
        radial-gradient(ellipse 38% 42% at 8%  80%, rgba(162,78,46,0.14)  0%, transparent 55%),
        radial-gradient(ellipse 50% 30% at 90% 90%, rgba(61,68,30,0.4)    0%, transparent 60%);
    }

    /* Subtle grain */
    .grain::after {
      content:'';
      position:absolute;
      inset:0;
      background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
      pointer-events:none;
      z-index:0;
      border-radius:inherit;
    }

    /* ── Marquee ── */
    .marquee-track {
      display:flex;
      gap:0;
      width:max-content;
      animation: marquee-scroll 38s linear infinite;
    }
    .marquee-track:hover { animation-play-state: paused; }
    @keyframes marquee-scroll {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }
    .marquee-wrap {
      overflow:hidden;
      -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
      mask-image:         linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
    }

    /* ── Glass card ── */
    .glass {
      background: rgba(255,255,255,0.55);
      backdrop-filter: blur(18px) saturate(1.6);
      -webkit-backdrop-filter: blur(18px) saturate(1.6);
      border: 1px solid rgba(255,255,255,0.75);
    }
    .glass-dark {
      background: rgba(45,50,22,0.55);
      backdrop-filter: blur(18px) saturate(1.4);
      -webkit-backdrop-filter: blur(18px) saturate(1.4);
      border: 1px solid rgba(255,255,255,0.10);
    }
    .glass-subtle {
      background: rgba(255,255,255,0.72);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid rgba(61,68,30,0.08);
    }

    /* ── Animations ── */
    @keyframes fadeUp {
      from { opacity:0; transform:translateY(24px); }
      to   { opacity:1; transform:translateY(0); }
    }
    .fade-up          { animation: fadeUp .65s ease both; }
    .delay-1          { animation-delay:.10s; }
    .delay-2          { animation-delay:.22s; }
    .delay-3          { animation-delay:.36s; }
    .delay-4          { animation-delay:.50s; }

    /* ── Bento ── */
    .bento-card {
      border-radius: 20px;
      border: 1px solid rgba(61,68,30,0.09);
      background: #ffffff;
      overflow: hidden;
      transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
    }
    .bento-card:hover {
      box-shadow: 0 12px 40px rgba(61,68,30,0.10);
      transform: translateY(-2px);
      border-color: rgba(61,68,30,0.16);
    }
    .bento-card-dark {
      background: #3d441e;
      border-color: rgba(255,255,255,0.06);
    }
    .bento-card-dark:hover { border-color: rgba(255,255,255,0.12); }
    .bento-card-accent {
      background: #a24e2e;
      border-color: rgba(255,255,255,0.08);
    }

    /* ── Pill ── */
    .pill {
      display:inline-flex; align-items:center; gap:6px;
      background:rgba(61,68,30,0.07); border:1px solid rgba(61,68,30,0.14);
      color:#3d441e; font-family:'Lexend Deca',sans-serif;
      font-size:.70rem; font-weight:700; letter-spacing:.07em;
      text-transform:uppercase; padding:4px 12px; border-radius:99px;
    }
    .pill-light {
      background:rgba(255,255,255,0.12); border-color:rgba(255,255,255,0.22);
      color:rgba(255,255,255,0.80);
    }

    /* ── Pricing ── */
    .pricing-featured {
      border: 2px solid #a24e2e;
      position: relative;
    }
    .pricing-featured::before {
      content:'Most Popular';
      position:absolute; top:-13px; left:50%; transform:translateX(-50%);
      background:#a24e2e; color:#fff;
      font-family:'Lexend Deca',sans-serif; font-size:.68rem; font-weight:700;
      letter-spacing:.08em; text-transform:uppercase;
      padding:3px 14px; border-radius:99px;
    }

    /* ── Nav ── */
    .nav-scrolled { box-shadow:0 2px 24px rgba(61,68,30,0.09); background:#fff !important; }

    /* ── CTA section ── */
    .cta-bg {
      background:#2e3316;
      background-image: radial-gradient(ellipse 55% 70% at 85% 50%, rgba(162,78,46,0.22) 0%, transparent 65%);
    }

    /* Mockup rows */
    .row-pass { background:rgba(61,68,30,0.06); }
    .row-fail { background:rgba(162,78,46,0.08); }
    .row-gap  { background:rgba(140,150,122,0.10); }

    /* Testimonial */
    .testimonial-card {
      background:#fff;
      border:1px solid rgba(61,68,30,0.09);
      border-radius:20px;
    }

    /* Section divider */
    .section-divider {
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(61,68,30,0.10), transparent);
    }

    /* Alert pulse */
    @keyframes pulse-ring {
      0%   { transform: scale(1);   opacity:.6; }
      70%  { transform: scale(1.5); opacity:0;  }
      100% { transform: scale(1.5); opacity:0;  }
    }
    .pulse-ring {
      animation: pulse-ring 2s ease-out infinite;
    }

    /* Scroll-triggered fade (CSS only approach) */
    @keyframes slideInLeft {
      from { opacity:0; transform:translateX(-20px); }
      to   { opacity:1; transform:translateX(0); }
    }
    .slide-in { animation: slideInLeft .5s ease both; }