html { scroll-behavior: smooth; }
    body { margin: 0; background: #0E0E12; }    .grain-bg { position: relative; isolation: isolate; }
    .grain-bg::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      opacity: 0.6;
      mix-blend-mode: soft-light;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='fg'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23fg)'/%3E%3C/svg%3E");
      background-size: 180px 180px;
    }
    @keyframes rollScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    @keyframes recPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
    @keyframes heroFade { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
    @keyframes lineUp { from { transform: translateY(112%); } to { transform: none; } }
    @keyframes faqOpen { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
    @keyframes wavePulse { from { transform: scaleY(0.28); } to { transform: scaleY(1); } }
    @keyframes keyGlow { 0%, 100% { opacity: 0; } 4%, 9% { opacity: 1; } 15% { opacity: 0; } }
    summary::marker { content: ""; }
    summary::-webkit-details-marker { display: none; }
    .faq-item.is-open .faq-plus { transform: rotate(45deg); }
    .faq-item.is-open summary { color: #FFFFFF; }
    .faq-aw { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.45s cubic-bezier(0.4, 0, 0.2, 1); }
    .faq-item.is-open .faq-aw { grid-template-rows: 1fr; }
    .faq-aw > .faq-answer { overflow: hidden; min-height: 0; opacity: 0; transition: opacity 0.35s ease 0.05s; }
    .faq-item.is-open .faq-aw > .faq-answer { opacity: 1; }
    #mcCursor { transition: top 0.8s cubic-bezier(0.22, 1, 0.36, 1), left 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.12s ease; }
    #mcCursor.click { transform: scale(0.8); }
    #mcRecordBtn { transition: background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease; }
    #mcRecordBtn.recording { background: #FF1744 !important; color: #FFFFFF !important; box-shadow: 0 0 30px rgba(255,23,68,0.8) !important; }
    #mcBookmarkBtn, #mcExportBtn { transition: background 0.2s ease; }
    #mcBookmarkBtn.hover, #mcExportBtn.hover { background: #333333; }
    [data-reveal] { opacity: 0; transform: translateY(44px); transition: opacity 1.4s cubic-bezier(0.22, 1, 0.36, 1), transform 1.4s cubic-bezier(0.22, 1, 0.36, 1); }
    [data-reveal].is-revealed { opacity: 1; transform: none; }
    @media (max-width: 760px) {
      .nav-link, .nav-badge { display: none !important; }
      .nav-cta { padding: 9px 16px !important; font-size: 12px !important; letter-spacing: 0.02em !important; }
      .hero-sec { padding-top: 56px !important; }
      .pad-lg { padding-top: 72px !important; padding-bottom: 64px !important; }
      .pad-b { padding-bottom: 72px !important; }
      .roll { height: 150px !important; }
      .faq-answer { padding-right: 12px !important; }
      .trust-row { flex-direction: column !important; gap: 8px !important; text-align: center; }
      .trust-sep { display: none !important; }
    }
.hv-1:hover { color: #FFFFFF !important; }
.hv-2:hover { filter: brightness(1.15) !important; transform: scale(1.03) !important; }
.hv-3:hover { filter: brightness(1.15) !important; transform: scale(1.04) !important; }
.hv-4:hover { border-color: #8E2DE2 !important; color: #FFFFFF !important; }
.hv-5:hover { filter: brightness(1.15) !important; transform: scale(1.02) !important; }

