/* design3 */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
:where(html:not(.landing)){color-scheme:dark;--bg0:rgb(12,11,10);--bg1:rgb(18,17,16);--t1:rgb(237,235,232);--t2:rgb(179,176,170);--line:rgba(255,255,255,.16);--gold:rgb(212,160,23);--on-gold:rgb(23,18,10);--r2:8px;--font:Inter,system-ui,sans-serif}
@media(prefers-color-scheme:light){:where(html:not(.landing)){color-scheme:light;--bg0:rgb(250,249,247);--bg1:rgb(255,255,255);--t1:rgb(32,31,29);--t2:rgb(78,75,70);--line:rgba(0,0,0,.2);--gold:rgb(118,82,0);--on-gold:rgb(255,255,255)}}
:where(html:not(.landing)) *{box-sizing:border-box}:where(html:not(.landing)) body{margin:0;background:var(--bg0);color:var(--t1);font:16px/1.7 var(--font)}:where(html:not(.landing)) a{color:inherit;text-underline-offset:.2em}:where(html:not(.landing)) a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}:where(html:not(.landing)) header, :where(html:not(.landing)) footer{border-bottom:1px solid var(--line);background:var(--bg1)}:where(html:not(.landing)) footer{border-top:1px solid var(--line);border-bottom:0}:where(html:not(.landing)) nav, :where(html:not(.landing)) .wrap{max-width:1080px;margin:auto;padding:20px 24px}:where(html:not(.landing)) nav{display:flex;gap:24px;align-items:center;flex-wrap:wrap}:where(html:not(.landing)) nav a:first-child{font-weight:700;text-decoration:none;margin-right:auto}:where(html:not(.landing)) .wrap{max-width:850px;padding-top:48px;padding-bottom:64px}:where(html:not(.landing)) h1, :where(html:not(.landing)) h2, :where(html:not(.landing)) h3{line-height:1.2;letter-spacing:-.025em}:where(html:not(.landing)) h1{font-size:clamp(2rem,5vw,3.5rem)}:where(html:not(.landing)) h2{font-size:1.5rem;margin-top:2.5em}:where(html:not(.landing)) p, :where(html:not(.landing)) li{color:var(--t2)}:where(html:not(.landing)) .lead{font-size:1.15rem;color:var(--t1)}:where(html:not(.landing)) .button{display:inline-block;padding:12px 18px;background:var(--gold);color:var(--on-gold);border-radius:var(--r2);text-decoration:none;font-weight:700}:where(html:not(.landing)) .panel{background:var(--bg1);border:1px solid var(--line);border-radius:var(--r2);padding:20px;margin:16px 0}:where(html:not(.landing)) .scroll{overflow-x:auto}:where(html:not(.landing)) table{border-collapse:collapse;width:100%;min-width:570px}:where(html:not(.landing)) th, :where(html:not(.landing)) td{text-align:left;vertical-align:top;padding:12px;border-bottom:1px solid var(--line)}:where(html:not(.landing)) th{color:var(--t1)}:where(html:not(.landing)) td{color:var(--t2)}:where(html:not(.landing)) .crumb{font-size:.9rem;color:var(--t2)}:where(html:not(.landing)) footer .wrap{padding-top:24px;padding-bottom:24px}@media(max-width:390px){:where(html:not(.landing)) nav, :where(html:not(.landing)) .wrap{padding-left:18px;padding-right:18px}:where(html:not(.landing)) nav{gap:14px}:where(html:not(.landing)) .wrap{padding-top:32px}}
/* design3 — subconjunto de styles/design-v3/tokens.css para o formulário estático. */
[data-design="3"] {
  color-scheme: dark;
  --bg0: rgb(12, 11, 10);
  --bg2: rgb(25, 24, 22);
  --l3: rgba(255, 255, 255, .16);
  --t1: rgb(237, 235, 232);
  --gold: rgb(240, 180, 41);
  --gold-text: rgb(245, 196, 81);
  --on-gold: rgb(23, 18, 10);
  --r2: 8px;
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
[data-design="3"][data-theme="light"] {
  color-scheme: light;
  --bg0: rgb(246, 245, 242);
  --bg2: rgb(241, 239, 234);
  --l3: rgba(28, 26, 23, .18);
  --t1: rgb(28, 26, 23);
  --gold: rgb(227, 165, 14);
  --gold-text: rgb(138, 99, 0);
  --on-gold: rgb(28, 21, 0);
}

/*design3*/
:where(html.landing) { color-scheme:dark; --bg0:#0c0b0a; --bg1:#121110; --bg2:#191816; --bg3:#211f1c; --line:rgba(255,255,255,.14); --text:#edebe8; --muted:#b6b3ad; --gold:#d4a017; --on-gold:#17120a; --radius:10px; --font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
:where(html.landing) * { box-sizing:border-box; }
:where(html.landing) { scroll-behavior:smooth; scroll-padding-top:88px; }
:where(html.landing) body { margin:0; background:var(--bg0); color:var(--text); font-family:var(--font); font-size:16px; line-height:1.6; }
:where(html.landing) a { color:inherit; text-decoration:none; }
:where(html.landing) button, :where(html.landing) input, :where(html.landing) select { font:inherit; }
:where(html.landing) button, :where(html.landing) a, :where(html.landing) summary { touch-action:manipulation; }
:where(html.landing) button { cursor:pointer; }
:where(html.landing) img { display:block; max-width:100%; height:auto; }
:where(html.landing) h1, :where(html.landing) h2, :where(html.landing) h3, :where(html.landing) p { margin:0; }
:where(html.landing) h1, :where(html.landing) h2, :where(html.landing) h3 { line-height:1.1; letter-spacing:-.045em; }
:where(html.landing) h1 { font-size:clamp(3rem,5.2vw,5.4rem); font-weight:700; }
:where(html.landing) h1 em { color:var(--muted); font-style:normal; }
:where(html.landing) h2 { font-size:clamp(2.25rem,3.8vw,4rem); font-weight:600; }
:where(html.landing) h3 { font-size:1.25rem; letter-spacing:-.025em; }
:where(html.landing) .wrap { width:min(100% - 64px,1320px); margin-inline:auto; }
:where(html.landing) .skip { position:fixed; left:12px; top:-100px; background:var(--gold); color:var(--on-gold); padding:12px; z-index:100; }
:where(html.landing) .skip:focus { top:12px; }
:where(html.landing) :focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
:where(html.landing) .nav { position:fixed; inset:0 0 auto; z-index:20; background:var(--bg0); border-bottom:1px solid var(--line); }
:where(html.landing) .nav-inner { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
:where(html.landing) .brand { display:inline-flex; align-items:center; gap:8px; font-weight:800; letter-spacing:.04em; white-space:nowrap; }
:where(html.landing) .brand svg { width:29px; height:29px; color:var(--gold); }
:where(html.landing) .brand span { font-weight:400; color:var(--muted); }
:where(html.landing) nav { display:flex; align-items:center; gap:clamp(14px,1.7vw,28px); font-size:.82rem; color:var(--muted); }
:where(html.landing) nav a:hover, :where(html.landing) .text-link:hover, :where(html.landing) .footer-links a:hover { color:var(--text); }
:where(html.landing) .button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:50px; padding:12px 20px; border:1px solid var(--line); border-radius:8px; font-size:.88rem; font-weight:700; line-height:1.25; text-align:center; }
:where(html.landing) .button-gold { background:var(--gold); color:var(--on-gold); border-color:var(--gold); }
:where(html.landing) .button-gold:hover { filter:brightness(1.1); }
:where(html.landing) .button-outline { background:transparent; color:var(--text); }
:where(html.landing) .menu-toggle { display:none; }
:where(html.landing) .hero { min-height:780px; padding-top:160px; padding-bottom:100px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:4vw; }
:where(html.landing) .eyebrow { font-size:.7rem; font-weight:700; letter-spacing:.16em; color:var(--muted); margin-bottom:22px; }
:where(html.landing) .lead, :where(html.landing) .module-copy>p:not(.eyebrow), :where(html.landing) .section-heading>p:not(.eyebrow), :where(html.landing) .demo-intro>p:not(.eyebrow), :where(html.landing) .price>p:not(.eyebrow) { font-size:1.08rem; line-height:1.75; color:var(--muted); max-width:590px; margin-top:24px; }
:where(html.landing) .actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
:where(html.landing) .hero-proof { color:var(--muted); font-size:.9rem; margin-top:34px; }
:where(html.landing) .hero-visual { position:relative; padding:30px 20px 50px 0; }
:where(html.landing) .laptop, :where(html.landing) .mock-screen { border:1px solid var(--line); border-radius:10px; background:var(--bg1); overflow:hidden; }
:where(html.landing) .laptop { transform:rotate(-2deg); }
:where(html.landing) .screen-top { height:34px; display:flex; align-items:center; gap:5px; padding:0 12px; border-bottom:1px solid var(--line); background:var(--bg2); }
:where(html.landing) .screen-top span { width:6px; height:6px; border-radius:50%; background:var(--muted); }
:where(html.landing) .screen-top small { margin-left:auto; color:var(--muted); font-size:.55rem; letter-spacing:.12em; }
:where(html.landing) .phone { position:absolute; right:-10px; bottom:5px; width:170px; min-height:310px; padding:22px 12px 16px; border:5px solid var(--bg3); border-radius:24px; background:var(--bg1); box-shadow:0 14px 35px rgba(0,0,0,.45); font-size:.62rem; }
:where(html.landing) .phone-notch { width:54px; height:10px; position:absolute; top:4px; left:50%; transform:translateX(-50%); border-radius:0 0 8px 8px; background:var(--bg3); }
:where(html.landing) .phone small { font-size:.54rem; color:var(--muted); }
:where(html.landing) .phone p { margin-top:14px; color:var(--muted); }
:where(html.landing) .phone>strong { font-size:1.2rem; }
:where(html.landing) .phone-card { margin-top:12px; padding:10px; border:1px solid var(--line); border-radius:8px; display:grid; gap:4px; }
:where(html.landing) .phone-card b { font-size:1.4rem; }
:where(html.landing) .phone-row { display:flex; justify-content:space-between; gap:4px; padding:12px 0; border-bottom:1px solid var(--line); }
:where(html.landing) .visual-caption { display:flex; justify-content:space-between; margin-top:28px; font-size:.6rem; letter-spacing:.12em; color:var(--muted); }
:where(html.landing) .numbers { border-block:1px solid var(--line); background:var(--bg1); padding:30px 0; }
:where(html.landing) .numbers-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:22px; }
:where(html.landing) .numbers-grid>div { border-left:1px solid var(--line); padding-left:20px; }
:where(html.landing) .numbers strong { display:block; font-size:clamp(1.5rem,2.5vw,2.5rem); letter-spacing:-.05em; line-height:1.1; font-variant-numeric:tabular-nums; }
:where(html.landing) .numbers span, :where(html.landing) .numbers-note { color:var(--muted); font-size:.75rem; }
:where(html.landing) .numbers-note { margin-top:22px; }
:where(html.landing) .section { padding-top:130px; padding-bottom:130px; }
:where(html.landing) .section-heading { max-width:760px; margin-bottom:60px; }
:where(html.landing) .steps { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
:where(html.landing) .step { padding:30px 24px 20px 0; border-right:1px solid var(--line); }
:where(html.landing) .step+.step { padding-left:24px; }
:where(html.landing) .step p { color:var(--muted); font-size:.9rem; margin-top:12px; }
:where(html.landing) .step-icon { height:75px; display:flex; justify-content:space-between; color:var(--muted); font-size:.75rem; }
:where(html.landing) .step-icon i { display:block; width:34px; height:34px; border:1px solid var(--muted); transform:rotate(45deg); margin-right:12px; }
:where(html.landing) .module-list { border-top:1px solid var(--line); }
:where(html.landing) .module { min-height:650px; display:grid; grid-template-columns:1fr 1.05fr; gap:8%; align-items:center; padding-block:110px; border-bottom:1px solid var(--line); }
:where(html.landing) .module.reverse .module-copy { order:2; }
:where(html.landing) .module-copy ul { list-style:none; padding:0; margin:28px 0; }
:where(html.landing) .module-copy li { position:relative; padding:11px 0 11px 25px; border-bottom:1px solid var(--line); font-size:.91rem; }
:where(html.landing) .module-copy li:before { content:'↗'; position:absolute; left:0; color:var(--muted); }
:where(html.landing) .text-link { font-weight:700; font-size:.85rem; color:var(--muted); }
:where(html.landing) .module-visual { padding:30px; background:var(--bg2); border:1px solid var(--line); border-radius:var(--radius); }
:where(html.landing) .mock-ui { padding:24px; min-height:330px; }
:where(html.landing) .mock-head { display:flex; justify-content:space-between; gap:20px; font-size:.65rem; letter-spacing:.1em; border-bottom:1px solid var(--line); padding-bottom:18px; }
:where(html.landing) .mock-head b, :where(html.landing) .mock-kicker, :where(html.landing) .mock-foot { color:var(--muted); font-weight:400; }
:where(html.landing) .mock-kicker { font-size:.62rem; letter-spacing:.1em; margin-top:28px; }
:where(html.landing) .mock-ui .mock-title { font-size:1.35rem; margin:10px 0 20px; }
:where(html.landing) .mock-rows>div { display:flex; justify-content:space-between; gap:20px; padding:12px 0; border-top:1px solid var(--line); font-size:.77rem; }
:where(html.landing) .mock-rows span { color:var(--muted); }
:where(html.landing) .mock-rows strong { text-align:right; }
:where(html.landing) .mock-foot { margin-top:25px; font-size:.58rem; letter-spacing:.1em; }
:where(html.landing) .table-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); }
:where(html.landing) table { width:100%; border-collapse:collapse; min-width:760px; text-align:left; font-size:.88rem; }
:where(html.landing) th, :where(html.landing) td { padding:20px; border-bottom:1px solid var(--line); }
:where(html.landing) thead { background:var(--bg2); }
:where(html.landing) td { color:var(--muted); }
:where(html.landing) td:nth-child(2) { color:var(--text); font-weight:700; }
:where(html.landing) tbody tr:last-child>* { border-bottom:0; }
:where(html.landing) .audience { border-top:1px solid var(--line); }
:where(html.landing) .audience-grid, :where(html.landing) .quotes { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
:where(html.landing) .quotes { grid-template-columns:repeat(3,1fr); }
:where(html.landing) .panel { background:var(--bg1); border:1px solid var(--line); border-radius:var(--radius); padding:32px; }
:where(html.landing) .panel h3 { font-size:1.6rem; }
:where(html.landing) .panel p:not(.eyebrow) { color:var(--muted); margin-top:20px; }
:where(html.landing) .quotes .panel p { font-size:1.1rem; color:var(--text); margin:0 0 30px; }
:where(html.landing) .quotes strong, :where(html.landing) .quotes small { display:block; }
:where(html.landing) .quotes small { color:var(--muted); margin-top:8px; }
:where(html.landing) .faq { display:grid; grid-template-columns:1fr 1fr; gap:10%; border-top:1px solid var(--line); }
:where(html.landing) details { border-bottom:1px solid var(--line); }
:where(html.landing) summary { display:flex; justify-content:space-between; gap:20px; padding:22px 0; cursor:pointer; font-weight:600; list-style:none; }
:where(html.landing) summary::-webkit-details-marker { display:none; }
:where(html.landing) summary span { font-size:1.4rem; color:var(--muted); }
:where(html.landing) details[open] summary span { transform:rotate(45deg); }
:where(html.landing) details p { color:var(--muted); padding:0 25px 24px 0; }
:where(html.landing) .price { border-block:1px solid var(--line); text-align:center; }
:where(html.landing) .price h2, :where(html.landing) .price>p:not(.eyebrow) { margin-inline:auto; max-width:850px; }
:where(html.landing) .price .button { margin-top:32px; }
:where(html.landing) .demo { display:grid; grid-template-columns:1fr 1fr; gap:10%; }
:where(html.landing) .demo-intro a, :where(html.landing) .form-note a { text-decoration:underline; }
:where(html.landing) .demo-form { background:var(--bg1); padding:32px; border:1px solid var(--line); border-radius:var(--radius); }
:where(html.landing) .fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
:where(html.landing) .fields label { display:grid; gap:7px; font-size:.8rem; font-weight:600; }
:where(html.landing) .fields input, :where(html.landing) .fields select { width:100%; min-width:0; min-height:48px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--bg2); color:var(--text); font-size:1rem; }
:where(html.landing) .form-note { font-size:.76rem; color:var(--muted); margin:24px 0; }
:where(html.landing) .demo-form .button { width:100%; }
:where(html.landing) #form-status { font-size:.8rem; color:var(--muted); margin-top:8px; }
:where(html.landing) footer { border-top:1px solid var(--line); padding:55px 0; color:var(--muted); font-size:.85rem; }
:where(html.landing) .footer-grid { display:flex; justify-content:space-between; gap:30px; }
:where(html.landing) .footer-grid p { margin:12px 0; }
:where(html.landing) .footer-links { display:flex; flex-wrap:wrap; align-content:start; gap:24px; }
:where(html.landing) dialog { width:min(900px,calc(100% - 32px)); padding:24px; border:1px solid var(--line); border-radius:10px; background:var(--bg1); color:var(--text); }
:where(html.landing) dialog::backdrop { background:rgba(0,0,0,.85); }
:where(html.landing) .dialog-head { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:18px; }
:where(html.landing) .dialog-head h2 { font-size:1.25rem; }
:where(html.landing) .dialog-head button { border:0; background:none; color:var(--text); font-size:2rem; line-height:1; }
:where(html.landing) video { display:block; width:100%; aspect-ratio:16/9; background:var(--bg0); }
:where(html.landing) .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (prefers-reduced-motion:no-preference) {
  :where(html.landing.js-motion) .reveal { opacity:0; transform:translateY(18px); transition:opacity .65s ease,transform .65s ease; }
  :where(html.landing.js-motion) .reveal.visible { opacity:1; transform:none; }
}
@media (max-width:1000px) {
  :where(html.landing) .wrap { width:min(100% - 40px,1320px); }
  :where(html.landing) .nav-inner { min-height:68px; }
  :where(html.landing) .menu-toggle { display:block; background:none; color:var(--text); border:1px solid var(--line); border-radius:8px; padding:8px 12px; }
  :where(html.landing) .menu-toggle span { margin-left:8px; }
  :where(html.landing) nav { display:none; position:absolute; top:68px; left:0; right:0; padding:20px; background:var(--bg1); border-bottom:1px solid var(--line); flex-direction:column; align-items:stretch; }
  :where(html.landing) nav.open { display:flex; }
  :where(html.landing) nav a { padding:6px; }
  :where(html.landing) .hero { grid-template-columns:1fr; padding-top:130px; gap:40px; }
  :where(html.landing) .hero-visual { max-width:700px; }
  :where(html.landing) .module { gap:5%; }
  :where(html.landing) .module-visual { padding:15px; }
}
@media (max-width:700px) {
  :where(html.landing) .wrap { width:calc(100% - 36px); }
  :where(html.landing) .hero { padding-top:120px; padding-bottom:70px; min-height:0; }
  :where(html.landing) h1 { font-size:clamp(2.8rem,12vw,4.3rem); }
  :where(html.landing) h2 { font-size:2.35rem; }
  :where(html.landing) .hero-visual { padding-right:35px; }
  :where(html.landing) .phone { width:125px; min-height:250px; right:0; padding:20px 8px 10px; }
  :where(html.landing) .phone-card { margin-top:7px; padding:7px; }
  :where(html.landing) .phone-row { padding:7px 0; }
  :where(html.landing) .numbers-grid { grid-template-columns:repeat(2,1fr); gap:24px; }
  :where(html.landing) .numbers-grid>div { padding-left:12px; }
  :where(html.landing) .section { padding-block:80px; }
  :where(html.landing) .section-heading { margin-bottom:38px; }
  :where(html.landing) .steps { grid-template-columns:1fr 1fr; }
  :where(html.landing) .step, :where(html.landing) .step+.step { padding:22px 15px 22px 0; }
  :where(html.landing) .step:nth-child(even) { padding-left:15px; border-right:0; }
  :where(html.landing) .step:nth-child(n+3) { border-top:1px solid var(--line); }
  :where(html.landing) .module { grid-template-columns:1fr; min-height:0; gap:35px; padding-block:80px; }
  :where(html.landing) .module.reverse .module-copy { order:0; }
  :where(html.landing) .module-visual { padding:14px; }
  :where(html.landing) .mock-ui { min-height:280px; padding:18px; }
  :where(html.landing) .audience-grid, :where(html.landing) .quotes, :where(html.landing) .faq, :where(html.landing) .demo { grid-template-columns:1fr; }
  :where(html.landing) .faq, :where(html.landing) .demo { gap:30px; }
  :where(html.landing) .fields { grid-template-columns:1fr; }
  :where(html.landing) .demo-form { padding:22px; }
  :where(html.landing) .footer-grid { flex-direction:column; }
  :where(html.landing) .footer-links { gap:16px; }
  :where(html.landing) .actions .button { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  :where(html.landing) { scroll-behavior:auto; }
  :where(html.landing) *, :where(html.landing) *::before, :where(html.landing) *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
}
/*Mockups e movimento*/
:where(html.landing) .step-icon svg { width: 38px; height: 38px; margin-right: 12px; }
:where(html.landing) .app-visual { display: flex; justify-content: center; align-items: center; min-height: 430px; }
:where(html.landing) .app-phone { position: relative; inset: auto; width: 200px; min-height: 350px; }
@media (prefers-reduced-motion: no-preference) {
  :where(html.landing.js-motion) .step { transition-delay: calc(var(--i, 0) * 90ms); }
  :where(html.landing.js-motion) .module .module-copy li, :where(html.landing.js-motion) .module .mock-rows > div { opacity: 0; transform: translateY(12px); transition: opacity .5s ease, transform .5s ease; transition-delay: calc(var(--i, 0) * 90ms + 120ms); }
  :where(html.landing.js-motion) .module.visible .module-copy li, :where(html.landing.js-motion) .module.visible .mock-rows > div { opacity: 1; transform: none; }
  :where(html.landing.js-motion) .hero-visual .laptop { opacity: 0; transform: translateY(24px) rotate(-2deg); transition: opacity .8s ease, transform .8s ease; }
  :where(html.landing.js-motion) .hero-visual .phone { opacity: 0; transform: translateY(28px); transition: opacity .8s ease .25s, transform .8s ease .25s; }
  :where(html.landing.js-motion) .hero-visual.visible .laptop { opacity: 1; transform: rotate(-2deg); }
  :where(html.landing.js-motion) .hero-visual.visible .phone { opacity: 1; transform: none; }
}

/* vídeo no topo (hero) */
:where(html.landing) .hero-video { margin:0; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--bg1); box-shadow:0 28px 70px rgba(0,0,0,.5); }
:where(html.landing) .hero-video video { display:block; width:100%; aspect-ratio:16/9; background:#000; }
:where(html.landing) .hero-video figcaption { display:flex; justify-content:space-between; gap:12px; padding:10px 14px; border-top:1px solid var(--line); background:var(--bg2); color:var(--muted); font-size:.6rem; letter-spacing:.14em; }
@media (prefers-reduced-motion: no-preference) {
  :where(html.landing.js-motion) .hero-visual .hero-video { opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s ease; }
  :where(html.landing.js-motion) .hero-visual.visible .hero-video { opacity:1; transform:none; }
}