/* Scaler: a shared Alike-inspired visual system for the full landing page. */
@font-face{font-family:Geist;src:url('fonts/geist-light.ttf') format('truetype');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Geist;src:url('fonts/geist-regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Geist;src:url('fonts/geist-medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Libre Caslon Condensed';src:url('fonts/libre-caslon-condensed-semibold-italic.woff2') format('woff2');font-weight:600;font-style:italic;font-display:swap}
:root{--ink:#000;--paper:#fafafa;--muted:#a3a3a3;--line:#303030;--accent:#ff330f;--font-heading:Geist,Arial,sans-serif;--font-body:Geist,Arial,sans-serif;color-scheme:dark}
body{background:#000;color:var(--paper)}
::selection{background:#ff330f;color:#000}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #ff765c;outline-offset:5px}
.header.wrap{width:calc(100% - 64px);max-width:1200px;min-height:80px;border:0;border-bottom:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:space-between}
.header .brand-logo{width:54px;height:54px}
.header .button{background:#f1f0ed;color:#000;border:1px solid #f1f0ed;border-radius:999px;padding:12px 23px;min-height:44px;font:400 14px/1.2 var(--font-body);letter-spacing:0;box-shadow:none}
.header .button:hover{background:#fff;transform:none}
.hero.wrap{width:100%;max-width:none;padding:48px 24px 8px;text-align:center;background:#000}
.hero::before,.hero::after{display:none}
.hero h1{max-width:900px;margin:0 auto;font:300 58px/1.12 var(--font-heading);letter-spacing:-2px;color:#fff;text-wrap:balance}
.hero h1 em{font-family:'Libre Caslon Condensed',Georgia,serif;font-weight:600;font-style:italic;letter-spacing:-1.7px;color:var(--accent)}
.hero .hero-offer{max-width:570px;margin:28px auto 0;font:400 18px/1.55 var(--font-body);letter-spacing:-.2px;color:#a3a3a3;text-wrap:balance}
.sample-offer{max-width:570px;margin:18px auto 0;scroll-margin-top:60px}
.sample-form{border:1px solid #404040;border-radius:21px;padding:4px;text-align:left;background:#050505}
.sample-input-row{display:flex;align-items:center;gap:13px;padding:0 20px;min-height:66px}
.sample-input-row svg{width:20px;height:20px;flex:none;fill:none;stroke:#a3a3a3;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sample-input-row input{width:100%;min-width:0;border:0;background:transparent;color:#fff;font:400 16px/1.5 var(--font-body);padding:16px 0;border-radius:3px;box-shadow:none}
.sample-input-row input::placeholder{color:#949494;opacity:1}
.sample-input-row input:focus-visible{outline:0}
.sample-input-row:focus-within{outline:2px solid #ff765c;outline-offset:-3px;border-radius:16px}
.sample-submit{display:block;width:100%;min-height:50px;padding:14px 20px;border:0;border-radius:16px;background:#ff330f;color:#fff;font:500 14px/1.4 var(--font-body);transition:background .2s}
.sample-submit:hover{background:#ff573a}
.sample-preview-note{margin:14px 0 0;font:400 12px/1.5 var(--font-body);color:#999;text-align:center}
.sample-url-summary{display:flex;align-items:center;gap:16px;margin:8px 20px 0;padding:8px 0 12px;border-bottom:1px solid #262626;font-size:12px;color:#aaa}
.sample-url-summary span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.sample-url-summary button{flex:none;background:none;border:0;padding:5px 0;color:#f5f5f5;font:400 12px var(--font-body);text-decoration:underline;text-underline-offset:3px}
.sample-error,.sample-result{font:400 13px/1.5 var(--font-body);margin:0;padding:0 20px 14px;color:#ff947f}
.sample-result{padding-top:14px;color:#bbb}
.sample-form [hidden]{display:none!important}
.hero-production{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:6px;margin:24px auto 0}
.production-thumbnails{flex-shrink:0;display:flex;align-items:center;justify-content:center}
.production-thumbnails img{display:block;flex:none;width:34px;height:34px;border:2px solid #000;border-radius:50%;object-fit:cover;object-position:50% 25%;background:#242424}
.production-thumbnails img+img{margin-left:-10px}
.hero .hero-production p{margin:0;font:400 15px/1.45 var(--font-body);letter-spacing:-.15px;color:#dedede}
@media(max-width:700px){.production-thumbnails img{width:30px;height:30px}.hero .hero-production p{font-size:14px}}
/* An arc of real examples: rotation follows each card's distance from the centre. */
.video-showcase{padding:12px 0 24px;overflow:hidden;background:#000}
.video-reel{display:flex;gap:18px;overflow-x:auto;overflow-y:hidden;position:relative;padding:38px 24px 30px;scrollbar-width:none;overscroll-behavior-x:contain;scroll-behavior:auto;touch-action:pan-x pan-y;isolation:isolate}
.video-reel::-webkit-scrollbar{display:none}
.video-reel:focus-visible{outline:2px solid #ff765c;outline-offset:-4px}
.reel-card{position:relative;flex:0 0 clamp(184px,16vw,245px);aspect-ratio:9/16;border:1px solid #272727;border-radius:16px;overflow:hidden;background:#151515;transform-origin:center center;transform:perspective(1000px) translateY(var(--card-lift,0px)) rotateY(var(--card-turn,0deg)) rotateZ(var(--card-tilt,0deg));box-shadow:none;backface-visibility:hidden}
.reel-card video{display:block;width:100%;height:100%;object-fit:cover}
.reel-error{position:absolute;inset:auto 10px 45%;margin:0;padding:10px;border-radius:8px;background:#000d;color:#ddd;text-align:center;font-size:13px;pointer-events:none}
.reel-error[hidden]{display:none}





@media(max-width:700px){
 .header.wrap{width:calc(100% - 40px);min-height:78px}.header .brand-logo{width:46px;height:46px}.header .button{font-size:13px;padding:11px 18px}
 .hero.wrap{padding:36px 22px 8px}.hero h1{font-size:38px;line-height:1.14;letter-spacing:-1.3px}.hero h1 em{letter-spacing:-1px}.hero .hero-offer{font-size:16px;line-height:1.5;max-width:570px;margin-top:28px}
 .sample-offer{margin-top:10px}.sample-input-row{padding-inline:15px;min-height:62px;gap:10px}.sample-input-row input{font-size:16px}.sample-submit{min-height:48px}.sample-url-summary{margin-inline:15px}
 .video-showcase{padding-top:6px;padding-bottom:12px}.video-reel{gap:14px;padding:26px 22px 24px}.reel-card{flex-basis:53vw;max-width:240px;border-radius:13px}
}
@media(prefers-reduced-motion:reduce){.sample-submit{transition:none}.reel-card{transform:none}.motion-ready [data-reveal]{opacity:1;transform:none;transition:none}}

/* Shared typography and open compositions carry the hero through the whole page. */
:root{--section-title:58px;--section-copy:18px}
.launch-system.wrap,.creative-comparison.wrap{max-width:1200px;width:calc(100% - 64px);border:0;padding-block:48px}
.launch-heading{margin-bottom:52px}
.launch-heading #speed-title{font:300 clamp(24px,2.9vw,40px)/1.18 var(--font-heading);letter-spacing:-1.25px;max-width:none;margin:0 auto;text-align:center;white-space:nowrap;color:#fafafa}
.launch-heading #speed-title em,.comparison-layout>h2 em,.contact h2 em{font-family:'Libre Caslon Condensed',Georgia,serif;font-weight:600;font-style:italic;color:var(--accent);letter-spacing:-.025em}
.animated-flow{margin:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.flow-stages{gap:40px;grid-template-columns:repeat(4,minmax(0,1fr))}
.animated-flow .flow-step{display:flex;flex-direction:column;align-items:center;padding:0;color:var(--accent)}
.flow-number{font:400 12px/1.4 var(--font-body);color:#888;margin-bottom:20px}
.flow-step svg{width:48px;height:48px;stroke-width:1.7}
.animated-flow .flow-description{font:400 16px/1.6 var(--font-body);color:#a3a3a3;letter-spacing:-.15px;max-width:24ch;margin:24px auto 0;text-align:center;padding:0}
.flow-connector{top:62px;left:calc(50% + 37px);width:calc(100% - 34px);height:1px;background:#303030}
.flow-connector i{background:#ff593c;box-shadow:none}
.creative-comparison.wrap{padding-top:32px;padding-bottom:48px}
.comparison-layout>h2{font:300 44px/1.12 var(--font-heading);letter-spacing:-1.5px;color:#fff;text-align:left;margin:24px 0 24px;text-wrap:balance}
#comparison-title s{color:#858585}
#comparison-title s::after{background:#aaa;height:1.5px}
.comparison-layout{grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.comparison-pair{gap:18px;padding:14px 6px;background:transparent;border:0;border-radius:0;box-shadow:none}
.comparison-pair:hover{box-shadow:none;border-color:transparent}
.comparison-card{background:#141414;border:1px solid #333;border-radius:18px;box-shadow:none}
.comparison-basic{transform:rotate(-2deg) scale(.94);opacity:.8}
.comparison-refined{transform:rotate(2deg);border-color:#444}
.comparison-card figcaption{top:12px;padding:8px 13px;font:400 12px/1.3 var(--font-body);background:#151515e8;color:#eee}
.comparison-refined figcaption{background:#ff330f;color:#000}
.comparison-caption{font:400 12px/1.5 var(--font-body);color:#888;margin-top:20px}
.comparison-copy h3{font:300 36px/1.17 var(--font-heading);letter-spacing:-1.1px;margin-bottom:24px;color:#fafafa}
.comparison-copy>p{font:400 var(--section-copy)/1.6 var(--font-body);letter-spacing:-.2px;color:#a3a3a3;margin-bottom:20px}
.comparison-copy ul{margin:30px 0 0;padding-top:24px;border-top:1px solid #252525}
.comparison-copy li{font:400 14px/1.6 var(--font-body);color:#ccc;padding-left:25px;margin-bottom:12px}
.comparison-copy li:last-child{margin-bottom:0}
.comparison-copy li::before{color:#ff765c}
.dashboard-section.wrap{padding:0 32px 32px;background:#000;border:0}
.dashboard-section::before{display:none}
.system-comparison .system-differences{max-width:1200px;border:1px solid #303030;border-radius:20px;box-shadow:none;background:#080808}
.system-table th{padding:28px 32px;background:#080808;color:#9a9a9a;border-bottom:1px solid #303030;font:300 26px/1.2 var(--font-heading);letter-spacing:-.8px}
.system-table th:last-child{background:#111;color:#fafafa;border-left:1px solid #303030}
.system-table th em{font:600 30px/1 'Libre Caslon Condensed',Georgia,serif;color:#ff330f;letter-spacing:-.6px}
.system-status{display:none}
.system-table td{padding:25px 32px;background:#080808;color:#999;border-color:#252525;font:400 16px/1.6 var(--font-body);letter-spacing:-.15px}
.system-table td:last-child{background:#111;color:#dedede;border-color:#303030;padding-left:62px}
.system-table tbody tr:nth-child(even) td:first-child{background:#080808}
.system-table tbody tr:nth-child(even) td:last-child{background:#111}
.system-table tbody tr:hover td{background:#121212}
.system-table tbody tr:hover td:last-child{background:#191919}
.system-check{left:31px;color:#ff765c;font-size:18px}
.contact{padding:32px 0 48px;background:#000;color:#fafafa;border:0}
.contact>.wrap{max-width:1200px;width:calc(100% - 64px)}
.contact h2{font:300 var(--section-title)/1.12 var(--font-heading);letter-spacing:-2px;max-width:850px;margin:0 auto 32px;text-wrap:balance;color:#fff}
.contact #booking{max-width:570px;margin:0 auto;padding:30px;background:#050505;border:1px solid #363636;border-radius:21px;color:#fafafa;box-shadow:none;color-scheme:dark;scroll-margin-top:36px}
.qualification-dialog legend{font:300 26px/1.2 var(--font-heading);letter-spacing:-.65px;color:#fafafa}
.qualification-dialog label{font:400 14px/1.5 var(--font-body);color:#bdbdbd;margin:24px 0}
.qualification-inline input,.qualification-inline select{min-height:52px;padding:13px 15px;background:#090909;color:#f5f5f5;border:1px solid #383838;border-radius:12px;font:400 16px/1.5 var(--font-body);margin-top:10px}
.qualification-inline input::placeholder{color:#828282;opacity:1}
.qualification-inline input:focus,.qualification-inline select:focus{border-color:#ff765c;box-shadow:none}
.qualification-inline input:focus-visible,.qualification-inline select:focus-visible{outline:2px solid #ff765c;outline-offset:3px}
.qualification-dialog progress{height:3px;accent-color:#ff330f}
.qualification-dialog progress::-webkit-progress-bar{background:#292929;border-radius:3px}
.qualification-dialog progress::-webkit-progress-value{background:#ff330f;border-radius:3px}
.contact .qualification-inline p{color:#999;font:400 14px/1.6 var(--font-body)}
.contact #booking #form-step-label{font-size:12px;margin:12px 0 25px;letter-spacing:0}
.form-actions{align-items:center;gap:14px;margin-top:28px}
.contact .button-dark{flex:1;border:0;border-radius:14px;background:#ff330f;color:#000;min-height:50px;font:500 14px/1.4 var(--font-body);padding:15px 22px}
.contact .button-dark:hover{background:#ff573a;transform:none}
.form-back{border-radius:999px;padding:12px 16px;font:400 14px/1.4 var(--font-body);color:#bbb}
.contact #form-error{color:#ff947f}
#form-complete h3{font:300 26px/1.2 var(--font-heading);letter-spacing:-.65px}
footer.wrap{max-width:1200px;width:calc(100% - 64px);border-top:1px solid #252525;padding-block:28px}
footer>.brand .brand-logo{width:44px;height:44px}
footer>span{font:400 12px/1.5 var(--font-body);color:#888}
@media(max-width:950px){
 .launch-system.wrap,.creative-comparison.wrap{width:calc(100% - 64px);padding-block:32px}
 .flow-stages{gap:24px}.animated-flow .flow-description{font-size:15px}.comparison-layout{gap:40px}.comparison-copy h3{font-size:32px}.comparison-copy>p{font-size:17px}
 .dashboard-section.wrap{padding:0 32px 32px}.system-table th{padding:25px}.system-table td{padding:22px 25px}.system-table td:last-child{padding-left:52px}.system-check{left:25px}
}
@media(max-width:700px){
 :root{--section-title:38px;--section-copy:17px}
 .launch-system.wrap,.creative-comparison.wrap{width:calc(100% - 44px);padding-block:24px}
 .launch-heading{margin-bottom:36px}.launch-heading #speed-title{font-size:28px;line-height:1.2;letter-spacing:-.8px;white-space:normal;max-width:420px;text-wrap:balance}
 .flow-stages{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 22px}.flow-number{margin-bottom:14px}.flow-step svg{width:42px;height:42px}.animated-flow .flow-description{font-size:14px;line-height:1.55;max-width:22ch;margin-top:19px}.flow-connector{display:none}
 .creative-comparison.wrap{padding-top:56px;padding-bottom:36px}.comparison-layout>h2{font-size:38px;letter-spacing:-1.3px;line-height:1.15;margin-bottom:24px;text-align:left}
 .comparison-layout{grid-template-columns:1fr;gap:28px}.comparison-pair{max-width:440px;margin:auto;gap:14px;padding:10px 4px}.comparison-card{border-radius:15px}.comparison-card figcaption{font-size:11px;padding:7px 11px}.comparison-caption{font-size:11px;margin-top:16px}.comparison-copy{max-width:500px;margin:auto}.comparison-copy h3{font-size:30px;letter-spacing:-.9px}.comparison-copy>p{font-size:17px}.comparison-copy ul{margin-top:26px;padding-top:22px}
 .dashboard-section.wrap{padding:0 22px 24px}.system-comparison .system-differences{border-radius:16px}.system-table th{font-size:19px;letter-spacing:-.5px;padding:20px 15px}.system-table th em{font-size:23px}.system-table td{font-size:14px;line-height:1.55;padding:20px 15px}.system-table td:last-child{padding-left:15px}.system-check{position:static;display:block;margin-bottom:7px;font-size:16px}
 .contact{padding:24px 0 40px}.contact>.wrap{width:calc(100% - 44px)}.contact h2{font-size:38px;line-height:1.16;letter-spacing:-1.3px;margin-bottom:32px}.contact #booking{padding:24px 20px;margin:0 auto}.qualification-dialog legend{font-size:24px}.qualification-dialog label{margin:22px 0}.form-back{padding-inline:12px}
 footer.wrap{width:calc(100% - 44px);padding-block:24px}footer>.brand .brand-logo{width:38px;height:38px}footer>span{font-size:11px}
}
@media(max-width:380px){
 .flow-stages{gap:30px 16px}.animated-flow .flow-description{font-size:13px}.comparison-layout>h2{font-size:34px}.contact h2{font-size:34px}.system-table th{font-size:17px;padding-inline:12px}.system-table th em{font-size:21px}.system-table td{font-size:13px;padding-inline:12px}.system-table td:last-child{padding-left:12px}
}

/* A short, one-time inward entrance; retain each card's resting tilt. */
.comparison-layout{--comparison-arrival-distance:24px}
@media(prefers-reduced-motion:no-preference){
 .motion-ready .comparison-layout[data-reveal]{transform:none;transition:opacity .18s ease}
 .comparison-layout.is-visible .comparison-basic{animation:comparison-arrive-left .46s cubic-bezier(.22,.61,.36,1) both}
 .comparison-layout.is-visible .comparison-refined{animation:comparison-arrive-right .46s cubic-bezier(.22,.61,.36,1) both}
 @keyframes comparison-arrive-left{
  from{transform:translateX(calc(-1 * var(--comparison-arrival-distance))) rotate(-2deg) scale(.94)}
  to{transform:translateX(0) rotate(-2deg) scale(.94)}
 }
 @keyframes comparison-arrive-right{
  from{transform:translateX(var(--comparison-arrival-distance)) rotate(2deg)}
  to{transform:translateX(0) rotate(2deg)}
 }
}
@media(max-width:700px){.comparison-layout{--comparison-arrival-distance:14px}}

/* Demo CTA: illuminated click badge inspired by the supplied reference. */
.header .button.nav-demo{display:inline-flex;align-items:center;gap:9px;padding:4px 17px 4px 4px;min-height:44px;border:1.5px solid #e5e5e5;border-radius:999px;background:#fff;color:#171717;font:500 15px/1.2 var(--font-body);transition:background .2s,border-color .2s,box-shadow .2s}
.nav-demo-icon{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:linear-gradient(155deg,#fff 5%,#ececec 48%,#c6c6c6 100%);box-shadow:inset 0 1px 0 #ffffff45;position:relative;isolation:isolate}
.nav-demo-icon::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 14px #ffffff65;opacity:.3;animation:demo-glow 3s ease-in-out infinite;z-index:-1}
.nav-demo-icon svg{width:22px;height:22px;overflow:visible}
.nav-demo-rays{animation:demo-rays 3s ease-in-out infinite;transform-origin:14px 11px}
/* White surface with a restrained, breathing orange edge. */
.header .button.nav-demo:hover,.header .button.nav-demo:focus-visible{background:#fff;border-color:#ff785e;transform:none;animation:demo-border-pulse 2.4s ease-in-out infinite}
@keyframes demo-border-pulse{0%,100%{border-color:#ff987f;box-shadow:0 0 0 1px #ff330f10,0 0 7px #ff330f14}50%{border-color:#ff5938;box-shadow:0 0 0 1px #ff330f25,0 0 14px #ff330f30}}
@media(prefers-reduced-motion:reduce){.header .button.nav-demo:hover,.header .button.nav-demo:focus-visible{animation:none;box-shadow:0 0 8px #ff330f20}}
@keyframes demo-glow{0%,100%{opacity:.25}50%{opacity:.85}}
@keyframes demo-rays{0%,70%,100%{opacity:.65}80%,90%{opacity:1}}
@media(max-width:700px){.header .button.nav-demo{min-height:44px;padding:4px 15px 4px 4px;gap:8px;font-size:14px}.nav-demo-icon{width:30px;height:30px}.nav-demo-icon svg{width:21px;height:21px}}
@media(prefers-reduced-motion:reduce){.nav-demo-icon::before,.nav-demo-rays{animation:none}.header .button.nav-demo{transition:none}}

@media(max-width:380px){.hero-production{gap:6px}.production-thumbnails img{width:26px;height:26px}.hero .hero-production p{font-size:12px;white-space:nowrap}}

/* Inline previews have no native player surface or tap-to-fullscreen action. */
.reel-card video,.comparison-card video{pointer-events:none;-webkit-user-select:none;user-select:none}
video::-webkit-media-controls,video::-webkit-media-controls-enclosure,video::-webkit-media-controls-panel,video::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none}

/* Consistent content edges and text rhythm between the main compositions. */
.comparison-copy>p:last-child{margin-bottom:0}
.system-comparison .system-differences{margin-top:0}
@media(min-width:701px) and (max-width:999px){
 .creative-comparison.wrap,.contact>.wrap{max-width:650px;width:calc(100% - 44px)}
 .comparison-layout{grid-template-columns:1fr;gap:32px}
 .comparison-pair{max-width:460px;margin-inline:auto}
 .comparison-copy{max-width:600px;margin-inline:auto}
 .system-comparison .system-differences{max-width:650px}
 .dashboard-section.wrap{padding-inline:22px}
}

/* Keep demo button contents stationary; hover changes color only. */
.header .button.nav-demo span,.header .button.nav-demo:hover span{transform:none;transition:none}
.nav-demo-icon::before,.nav-demo-rays{animation:none}

/* The comparison appears as one composition, without color changes. */
@media(prefers-reduced-motion:no-preference){
.system-table.table-arrived{animation:table-fade-in .65s ease-out both}
@keyframes table-fade-in{from{opacity:0}to{opacity:1}}
}

/* A compact headline, offer field, and proof line share one center axis. */
.hero .sample-offer{max-width:560px;margin-top:24px}
.hero .hero-production{margin-top:18px}
#sample-url-step .sample-input-row{position:relative;min-height:56px}
#sample-url-step .sample-input-row>svg{position:absolute;left:20px}
#sample-url{text-align:left;padding:10px 0 10px 36px}
.sample-url-prompt{position:absolute;left:56px;right:20px;text-align:left;font:400 16px/1.4 var(--font-body);color:#949494;pointer-events:none;text-wrap:initial;display:none}
#sample-url:placeholder-shown+.sample-url-prompt{display:block}
@media(max-width:700px){
 .hero .sample-offer{margin-top:20px}
 .hero .hero-production{margin-top:16px}
 #sample-url-step .sample-input-row{min-height:56px;padding-inline:10px}
 #sample-url-step .sample-input-row>svg{display:none}
 .sample-url-prompt{left:14px;right:14px;font-size:14px;line-height:1.45}
 #sample-url{padding:10px 8px}
}

/* Editorial metrics strip: aligned figures, quiet dividers, no extra cards. */
.performance-metrics{max-width:1200px;width:calc(100% - 64px);margin:0 auto;padding:8px 0 40px}
.metrics-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;border-top:1px solid #292929;border-bottom:1px solid #292929;padding:32px 0}
.proof-metric{display:flex;flex-direction:column-reverse;gap:10px;text-align:center;padding:0 20px;min-width:0}
.proof-metric+.proof-metric{border-left:1px solid #292929}
.proof-metric dt{font:400 14px/1.4 var(--font-body);color:#a3a3a3}
.proof-metric dd{margin:0;font:300 clamp(38px,4.5vw,60px)/1.1 var(--font-heading);letter-spacing:-2px;font-variant-numeric:tabular-nums;color:#fafafa;white-space:nowrap}
.proof-metric-affix{color:#ff5938;font-size:.72em}
#metrics-note{margin:12px 0 0;text-align:center;font:400 11px/1.5 var(--font-body);color:#777}
@media(max-width:700px){.performance-metrics{width:calc(100% - 44px);padding:0 0 28px}.metrics-grid{padding:24px 0}.proof-metric{padding:0 7px;gap:8px}.proof-metric dd{font-size:clamp(25px,7vw,40px);letter-spacing:-1px}.proof-metric dt{font-size:11px;line-height:1.4}#metrics-note{font-size:10px}}

/* Metrics belong to the right-hand comparison narrative. */
.comparison-copy .performance-metrics{width:100%;max-width:none;margin:24px 0 0;padding:0}
.comparison-copy .metrics-grid{padding:18px 0}
.comparison-copy .proof-metric{padding:0 10px;gap:7px}
.comparison-copy .proof-metric dd{font-size:clamp(30px,3.1vw,42px);letter-spacing:-1.3px}
.comparison-copy .proof-metric dt{font-size:12px}
.comparison-copy #metrics-note{margin-top:9px;font-size:10px}
@media(max-width:700px){.comparison-copy .proof-metric{padding:0 5px}.comparison-copy .proof-metric dd{font-size:clamp(24px,7vw,36px);letter-spacing:-1px}.comparison-copy .proof-metric dt{font-size:11px}}

@media(min-width:1000px){.creative-comparison.wrap{padding-top:72px;padding-bottom:80px}}

/* Read heading, media, copy, metrics in the stacked layout. */
@media(min-width:1000px){
 .comparison-layout{grid-template-rows:auto 1fr;row-gap:0}
 .comparison-layout>.comparison-media{grid-column:1;grid-row:1 / span 2}
 .comparison-layout>h2{grid-column:2;grid-row:1}
 .comparison-layout>.comparison-copy{grid-column:2;grid-row:2}
}
@media(max-width:999px){
 .comparison-layout{grid-template-columns:1fr;gap:28px}
 .comparison-layout>h2{margin:0;text-align:center}
}

.sample-url-prompt{color:#737373}

.sample-submit{font-weight:700}

@media(min-width:1000px){.comparison-layout>#comparison-title{font-size:clamp(30px,3vw,38px);white-space:nowrap;text-wrap:nowrap;letter-spacing:-1.3px}}

/* Approved creative-system motion, replacing the comparison videos. */
.comparison-media.creative-motion{position:relative;min-width:0;width:100%;align-self:start;background:#090909;border:1px solid #242424;border-radius:16px;overflow:hidden}
#creative-system-motion{display:block;width:100%;height:auto;aspect-ratio:600/520}
.creative-motion-toggle{position:absolute;right:12px;bottom:9px;padding:4px 6px;border:0;background:transparent;color:#92928d;font:400 10px/1.2 var(--font-body);cursor:pointer}
.creative-motion-toggle:hover{color:#eee}.creative-motion-toggle:focus-visible{outline:1px solid #ff5738;outline-offset:2px}
@media(max-width:999px){.comparison-media.creative-motion{max-width:600px;margin-inline:auto}}

/* OneShot text-only identity. */
.header .brand-logo{width:174px;height:58px;object-fit:contain}.brand:hover .brand-logo{transform:none}footer>.brand .brand-logo{width:144px;height:48px;object-fit:contain}
@media(max-width:700px){.header .brand-logo{width:138px;height:46px}footer>.brand .brand-logo{width:120px;height:40px}}