* { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: #0A0A0A; color: #FFFFFF; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
  a { color: #FFFFFF; text-decoration: none; }
  @keyframes hs-reveal { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
  @keyframes hs-product { from { opacity: 0; transform: translateY(36px) scale(0.97); } to { opacity: 1; transform: none; } }
  [data-reveal] { animation: hs-reveal 700ms cubic-bezier(.16,1,.3,1) both; }
  [data-product] { animation: hs-product 800ms cubic-bezier(.16,1,.3,1) both; }
  @supports (animation-timeline: view()) {
    [data-reveal] { animation: hs-reveal linear both; animation-timeline: view(); animation-range: entry 0% entry 55%; }
    [data-product] { animation: hs-product linear both; animation-timeline: view(); animation-range: entry 0% entry 60%; }
  }
  @media (prefers-reduced-motion: reduce) { [data-reveal], [data-product] { animation: none !important; } }
  [data-mobile-only] { display: none; }
  [data-sticky-cta] { display: none; }
  @media (max-width: 980px) {
    [data-hide-sm] { display: none !important; }
    [data-tilt] { transform: none !important; }
    [data-mobile-only] { display: block; }
    [data-col2], [data-col3], [data-col4] { grid-template-columns: 1fr !important; }
    [data-col3] > [data-rule], [data-col4] > [data-rule] { border-left: none !important; padding: 26px 0 !important; }
    [data-col3] > [data-rule] + [data-rule], [data-col4] > [data-rule] + [data-rule] { border-top: 1px solid rgba(255,255,255,0.09); }
    [data-phone-col] img { width: min(260px, 34vw) !important; }
    [data-chapter] { min-height: 0 !important; padding: 88px 0 !important; }
    [data-hero-copy] { padding: 24px !important; }
    [data-step-head] { grid-template-columns: 1fr !important; gap: 12px !important; }
    [data-step-shot] { margin-left: 0 !important; height: 300px !important; padding: 16px !important; }
    [data-plans] { grid-template-columns: 1fr !important; }
    [data-step-rail] { display: none !important; }
    [data-step-tag] { display: inline !important; }
    [data-arrow] { width: 26px; height: 26px; line-height: 26px; margin: 8px auto; text-align: center; transform: rotate(90deg); }
    [data-sticky-cta] { display: block; }
    [data-pad-bottom] { padding-bottom: 96px !important; }
    footer { padding-bottom: 96px; }
  }
  @media (max-width: 700px) {
    [data-phone-col] img { width: min(280px, 72vw) !important; }
  }

/* hover states */
.hs-h1:hover { border-color:#FFFFFF !important; }
.hs-h2:hover { background:#8FFFFF !important; }
.hs-h3:hover { background:#8FFFFF !important; }
.hs-h4:hover { border-color:#FFFFFF !important; }
.hs-h5:hover { background:#8FFFFF !important; }
.hs-h6:hover { background:#8FFFFF !important; }
.hs-h7:hover { background:#8FFFFF !important; }
.hs-h8:hover { background:#8FFFFF !important; }
.hs-h9:hover { border-color:#FFFFFF !important; }
.hs-h10:hover { background:#8FFFFF !important; }
.hs-h11:hover { background:rgba(0,255,255,0.08) !important; }
.hs-h12:hover { border-color:#FFFFFF !important; }


  * { box-sizing: border-box; }
  body { margin: 0; background: #0A0A0A; color: #FFFFFF; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
  a { color: #FFFFFF; text-decoration: none; }
  input, select { font-family: inherit; }
  input::placeholder { color: #5E5E5E; }
  @keyframes hs-reveal { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
  [data-reveal] { animation: hs-reveal 700ms cubic-bezier(.16,1,.3,1) both; }
  @media (prefers-reduced-motion: reduce) { [data-reveal] { animation: none !important; } }
  @media (max-width: 980px) {
    [data-hide-sm] { display: none !important; }
    [data-demo-grid] { grid-template-columns: 1fr !important; gap: 64px !important; }
    [data-row2] { grid-template-columns: 1fr !important; }
  }

/* hover states */
.dm-h1:hover { border-color:#FFFFFF !important; }
.dm-h2:hover { border-color:#FFFFFF !important; }
.dm-h3:focus { border-color:rgba(0,255,255,0.5) !important; }
.dm-h4:focus { border-color:rgba(0,255,255,0.5) !important; }
.dm-h5:focus { border-color:rgba(0,255,255,0.5) !important; }
.dm-h6:focus { border-color:rgba(0,255,255,0.5) !important; }
.dm-h7:hover { background:#8FFFFF !important; }