.kexevo-device{opacity:clamp(0,calc((var(--k-flight,0) - .1)*6),1)}
.waveform{animation-play-state:paused}.call-timer{letter-spacing:.15em}
/* Keep the play icon and its label in separate, non-shrinking slots. */
.hero-buttons .pill-outline{display:inline-flex;gap:12px;isolation:isolate;min-height:48px}
.hero-buttons .play-mini{position:static;flex:0 0 24px;width:24px;height:24px;line-height:1;display:grid;place-items:center;padding:0;border-radius:50%}
.hero-buttons .play-mini::before{content:"";width:0;height:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid currentColor;margin-left:2px}
.hero-buttons [data-t="heroDemo"]{position:static;display:block;line-height:1.3}
.hero-monogram img{filter:drop-shadow(5px 16px 18px #0009)}
.contact-section{padding:72px 0;background:#f8f5ef}
.contact-section .container{max-width:1050px;display:grid;grid-template-columns:.8fr 1.2fr;column-gap:70px;align-items:start}
.contact-section .eyebrow,.contact-section h2,.contact-section .container>p{grid-column:1}
.contact-section h2{font-size:clamp(32px,4vw,52px);line-height:1.12;margin:18px 0}
.contact-section .container>p{margin:0;max-width:280px}
#contact-form{grid-column:2;grid-row:1/5;margin:0;padding:28px;border:1px solid #cdbb9e70;border-radius:22px;background:#fffefa;gap:16px;box-shadow:0 12px 40px #17332a06}
#contact-form input,#contact-form textarea{background:#f8f5ef;border-color:#deddd4;padding:12px}
#contact-form button{font-size:12px;padding:14px 20px}
@media(max-width:760px){.contact-section .container{display:block}.contact-section .container>p{max-width:none}#contact-form{margin-top:26px;padding:22px;grid-template-columns:1fr}.hero-buttons .pill-outline{gap:12px}.hero-buttons .play-mini{flex-basis:24px}}

/* Vector reconstruction: preserve the traced reference proportions. */
.hero-monogram{aspect-ratio:133/126}
.brand img,.call-logo img,.dialog-logo img,.dialog-head img{object-fit:contain}

/* Reserve a separate band for the scroll hint, below both hero actions. */
.hero .hero-core{top:auto;bottom:150px}
.hero .hero-buttons .pill-outline{display:inline-flex;align-items:center;gap:12px}
.hero .hero-buttons .play-mini{position:static;display:flex;align-items:center;justify-content:center;flex:0 0 24px;width:24px;height:24px;padding:0;transform:none}
.hero .hero-buttons .play-mini::before{content:none}
.hero .hero-buttons .play-mini svg{display:block;flex:none;width:12px;height:12px}
.hero .hero-stage>.scroll-cue{bottom:64px;gap:10px}
.hero .scroll-line{height:28px}
@media(max-width:600px){
  .hero .hero-core{top:auto;bottom:104px}
  .hero .hero-stage>.scroll-cue{bottom:22px}
  .hero .hero-buttons .pill-outline{min-height:48px}
}
@media(max-height:700px){
  .hero .hero-monogram{top:29%;width:min(58vw,32svh);height:auto}
  .hero h1{margin-top:10px;margin-bottom:12px}
  .hero .hero-buttons{margin-top:14px}
}
/* Scroll movement stays on compositor layers: no live blur or SVG rotation. */
.hero .hero-monogram{filter:none;perspective:none;transition:none;will-change:transform,opacity}
.hero .hero-monogram img{filter:none;transform:none;transition:none}
.cinematic-mark{filter:none;transition:none;will-change:transform,opacity}
.kexevo-device{opacity:0;transition:none;will-change:transform,opacity;backface-visibility:hidden}
.stage-title{filter:none;transition:opacity .35s ease,transform .45s ease}
.scroll-meter span{width:100%;transform-origin:left;transition:none}
#progressFill{width:100%;transform-origin:left;transition:none}
.finale h2 .alma-name{font-family:Inter,Arial,sans-serif;font-weight:550;letter-spacing:.025em}
@media(prefers-reduced-motion:reduce){.hero .hero-monogram,.cinematic-mark,.kexevo-device{will-change:auto}.stage-title{transition:none}}
/* Deliberate text entrances, with a staggered champagne second line. */
.stage-title{filter:none;transition:none;will-change:transform,opacity;line-height:1.12;letter-spacing:-.055em}
.stage-title span{display:inline-block;will-change:transform,opacity}
.cinematic-heading{top:30%;left:7%;width:40%;max-width:540px;text-align:left}
.cinematic-heading .eyebrow{margin-bottom:24px}
.stage-title{top:44px;font-size:clamp(38px,4.8vw,72px)}
.phone-scenery{left:70%;top:53%;transform:translate(-50%,-50%) scale(.9)}
.cinematic-mark{left:70%;top:53%}
.kexevo-device{border-radius:38px;box-shadow:0 2px 3px #fff6,inset 0 0 0 1px #d8dfd366,8px 25px 55px #18382d35,0 55px 80px -40px #18382d60}
.kexevo-device:before{border-radius:31px}
.phone-halo{opacity:.45;border-color:#bdac8860}
.phone-halo:after{border-color:#bdac8833}
.phone-shadow{opacity:.6;filter:blur(20px)}
@media(min-width:901px) and (max-height:760px){
 .phone-scenery{transform:translate(-50%,-50%) scale(.76)}
 .cinematic-heading{top:29%}
}
@media(min-width:601px) and (max-width:900px){
 .cinematic-heading{left:6%;width:42%;top:29%}
 .stage-title{font-size:clamp(34px,5.3vw,47px)}
 .phone-scenery{left:73%;transform:translate(-50%,-50%) scale(.72)}
 .cinematic-mark{left:73%;width:240px}
}
@media(max-width:600px){
 .cinematic-topline{top:85px;left:22px;right:22px}
 .cinematic-heading{top:14%;left:22px;right:22px;width:auto;max-width:none;text-align:center}
 .cinematic-heading .eyebrow{font-size:9px;letter-spacing:.18em;margin-bottom:14px}
 .stage-title{top:26px;left:0;right:0;font-size:clamp(30px,8.1vw,40px);max-width:none;line-height:1.08}
 .phone-scenery{left:50%;top:64%;transform:translate(-50%,-50%) scale(.64)}
 .cinematic-mark{left:50%;top:64%;width:200px}
 .phone-halo{width:460px;height:460px;opacity:.35}
 .progress-step{bottom:30px}
 .stage-footer{bottom:12px;font-size:8px}
}
@media(max-width:600px) and (max-height:740px){
 .cinematic-heading{top:16%}
 .stage-title{font-size:30px}
 .phone-scenery{top:65%;transform:translate(-50%,-50%) scale(.53)}
 .cinematic-mark{top:65%;width:175px}
}
@media(prefers-reduced-motion:reduce){
 .stage-title,.stage-title span{will-change:auto;transition:none}
 .cinematic-heading .stage-title{display:block}
 .cinematic-heading .stage-title:not(.active){display:none}
 .cinematic-heading .stage-title.active{opacity:1;transform:none}
}

/* Desktop-only logo sizing keeps the entire K clear of navigation and copy. */
@media(min-width:601px){
 .hero .hero-monogram{top:var(--desktop-logo-top,30%);width:var(--desktop-logo-width,240px);height:auto;aspect-ratio:133/126}
}

/* Desktop sections retain their opening label and generous space below navigation. */
@media(min-width:601px){
 .pricing-section{padding-top:120px}
 .cinematic-topline{top:110px}
 .cinematic-heading{top:32%}
}