/* Hero "one question" ask (Flowstate): pill input that morphs into a floating card. Same component as Icarus, Cartel theme. */
.hero.has-ha{height:auto;min-height:100dvh}
.hero.has-ha .hero-inner{padding-top:120px}
.hero.has-ha .toggle{margin-top:26px}
.ha{margin:30px auto 0;width:100%;max-width:580px;display:flex;flex-direction:column;align-items:center}
.ha-l{display:block;margin-bottom:12px;font-family:"JetBrains Mono",monospace;font-size:11.2px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#D6D9DD}
.ha-slot{position:relative;width:100%;min-height:62px}
.ha-box{--fg:#F5F5F5;--muted:#9AA1A7;--line:rgba(255,255,255,.14);--soft:rgba(255,255,255,.05);--acc:#4fbf91;--em:#267355;--dk:#0d261c;--ok:#4fbf91;
 position:relative;z-index:6;width:min(540px,100%);margin:0 auto;color:var(--fg);text-align:left;border-radius:999px;
 background:rgba(9,11,10,.74);-webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1);
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 30px 80px -40px rgba(0,0,0,.8);overflow:hidden;color-scheme:dark;
 transition:width .42s cubic-bezier(.2,.8,.2,1),height .42s cubic-bezier(.2,.8,.2,1),border-radius .42s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.ha-box:not(.open):focus-within{box-shadow:inset 0 0 0 1px rgba(79,191,145,.8),0 0 0 4px rgba(79,191,145,.18),0 30px 80px -40px rgba(0,0,0,.8)}
:where(.ha) button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
.ha-pill{display:flex;align-items:center;gap:8px;height:62px;padding:7px 7px 7px 24px}
.ha-pill input{flex:1;min-width:0;width:0;text-align:left;height:100%;border:0;outline:0;background:none;font:inherit;font-size:16.5px;color:var(--fg)}
.ha-pill input::placeholder{color:#8A9197}
.ha-go,.ha-wa,.ha-send{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;background:#F5F5F5;color:var(--dk);
 font-family:"JetBrains Mono",monospace;font-weight:700;font-size:11.2px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:transform .4s var(--expo,ease),background .3s,box-shadow .3s}
.ha-go{height:48px;padding:0 22px;flex:none}
.ha-go span,.ha-send .ar{color:var(--acc);transition:transform .4s var(--expo,ease)}
.ha-go:hover,.ha-wa:hover,.ha-send:hover{background:#fff;transform:translateY(-1px);box-shadow:0 0 0 1px var(--acc)}
.ha-go:hover span{transform:translateX(3px)}
.ha-box :focus-visible{outline:2px solid var(--acc);outline-offset:2px}
/* card */
.ha-box.open{width:min(620px,100%);border-radius:var(--r,18px);background:rgba(9,11,10,.9);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 40px 90px -30px rgba(0,0,0,.9)}
.ha-card{display:none}.ha-box.open .ha-pill{display:none}.ha-box.open .ha-card{display:block}
.ha-head{display:flex;align-items:center;gap:14px;padding:14px 14px 14px 22px;border-bottom:1px solid var(--line)}
.ha-ans{flex:1;min-width:0;width:0;font-weight:500;font-size:15.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#D6D9DD}
.ha-chg{height:32px;padding:0 13px;flex:none;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font-family:"JetBrains Mono",monospace;font-weight:700;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg);transition:box-shadow .2s,color .2s}
.ha-chg:hover{box-shadow:inset 0 0 0 1px var(--acc)}
.ha-stage{padding:22px 22px 24px;transition:opacity .22s ease,transform .22s ease}
.ha-stage.out{opacity:0;transform:translateY(6px)}
.ha-q{font-family:"Stack Sans Headline","Helvetica Neue",sans-serif;font-size:1.4rem;font-weight:500;letter-spacing:-.02em;line-height:1.15;margin:0 0 16px;color:var(--fg)}
.ha-box .ha-q:focus,.ha-box .ha-q:focus-visible{outline:0}
.ha-opts{display:flex;flex-wrap:wrap;gap:8px}
.ha-opt{display:inline-flex;align-items:center;gap:9px;height:42px;padding:0 17px;border-radius:999px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line);font-size:15px;font-weight:500;color:var(--fg);transition:background .18s,box-shadow .18s,color .18s}
.ha-opt svg{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.8}
.ha-opt:hover{box-shadow:inset 0 0 0 1px var(--acc);background:rgba(79,191,145,.1)}
.ha-opt[aria-pressed=true]{background:var(--acc);color:#080808;box-shadow:inset 0 0 0 1px var(--acc)}
.ha-ctas{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ha-cta{height:50px;padding:0 20px}
.ha-cta svg{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ha-call{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;color:var(--fg);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);
 font-family:"JetBrains Mono",monospace;font-weight:700;font-size:11.2px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:transform .4s var(--expo,ease),box-shadow .3s,background .3s}
.ha-call:hover{box-shadow:inset 0 0 0 1px var(--acc);background:rgba(79,191,145,.1);transform:translateY(-1px)}
.ha-wa svg{color:var(--acc)}
.ha-more{margin-top:18px}
/* Book a call */
.ha-p{color:var(--muted);font-size:15.5px;line-height:1.5;margin:-6px 0 16px}
.ha-book{display:grid;gap:12px}
.ha-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ha-f{display:grid;gap:7px;font-family:"JetBrains Mono",monospace;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ha-f em{font-style:normal;opacity:.75}
.ha-f input{width:100%;min-width:0;height:46px;padding:0 14px;border:0;border-radius:12px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--line);
 font-family:Barlow,system-ui,sans-serif;font-size:16px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--fg);-webkit-appearance:none;appearance:none;transition:box-shadow .18s}
.ha-f input::placeholder{color:#6f767c}
.ha-f input:focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--acc)}
.ha-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.ha-bact{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px}
.ha-back{height:40px;padding:0 4px;font-family:"JetBrains Mono",monospace;font-weight:700;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.ha-back:hover{color:var(--fg)}
.ha-send{min-width:200px}
.ha-send svg{color:var(--acc)}
.ha-send[disabled]{opacity:.65;cursor:progress;transform:none}
.ha-done>svg{display:block;width:38px;height:38px;margin-bottom:12px;stroke:var(--acc);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ha-done .ha-q{margin-bottom:10px}.ha-done .ha-p{margin:0 0 14px}
.ha-sum{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.06em;color:#C3C8CD;padding:11px 13px;border-radius:12px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line);overflow-wrap:anywhere}
@media(min-width:768px){.ha-box.open{position:absolute;top:0;left:50%;transform:translateX(-50%)}}
@media(max-width:767px){
 .ha{max-width:none}
 .ha-box,.ha-box.open{width:100%}
 .ha-pill{padding-left:20px}
 .ha-go{padding:0 18px}
 .ha-stage{padding:20px 18px 22px}
 .ha-head{padding-left:18px}
 .ha-ctas{grid-template-columns:1fr}
 .ha-send{flex:1;min-width:0}
 .ha-opt{font-size:14.5px;padding:0 15px}
}
@media(prefers-reduced-motion:reduce){
 .ha-box,.ha-stage,.ha-opt,.ha-go,.ha-chg,.ha-wa,.ha-call,.ha-send,.ha-f input,.ha-back{transition:none!important}
 .ha-stage.out{transform:none}
}
/* Flowstate details: selected chip in brand emerald, round arrow badge like the site buttons, card always in flow (hero grows instead of clipping) */
.ha-box{color:var(--fg)}
.ha-go,.ha-wa,.ha-send{color:var(--dk)}
.ha-go{padding:0 6px 0 22px;gap:14px}
.ha-go span{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--dk);color:#fff}
.ha-opt[aria-pressed=true]{background:var(--em);color:#fff;box-shadow:inset 0 0 0 1px var(--acc)}
.ha-wa svg,.ha-send svg{color:var(--em)}
.ha-box.open{position:relative!important;top:auto!important;left:auto!important;transform:none!important}
.ha-l{color:rgba(245,245,245,.82)}
.ha-q{font-weight:400;letter-spacing:-.01em}
@media(max-width:767px){.hero.has-ha .hero-inner{padding-top:104px;padding-bottom:64px}}
/* the ask pushes the headline higher up the photo, so deepen the scrim to keep text readable */
.hero.has-ha::after{background:linear-gradient(to bottom,rgba(0,0,0,.45) 0%,rgba(0,0,0,.22) 18%,rgba(0,0,0,.38) 38%,rgba(0,0,0,.7) 62%,rgba(0,0,0,.88) 100%)}
.hero.has-ha .lead{color:rgba(245,245,245,.86)}
@media(max-width:767px){.ha-pill input::placeholder{font-size:14.5px}.ha-go{padding:0 5px 0 16px;gap:10px}.ha-go span{width:34px;height:34px}.ha-pill{padding-left:18px}}
/* small phones: the placeholder needs the room, so "Next" collapses to the round arrow (button keeps the accessible name "Next") */
@media(max-width:480px){.ha-go{font-size:0;letter-spacing:0;gap:0;padding:0 6px}.ha-go span{font-size:15px;width:38px;height:38px}.ha-pill{padding-right:6px}}
@media(max-width:380px){.ha-pill input::placeholder{font-size:14px}}
.hero.has-ha h1,.hero.has-ha .lead,.hero.has-ha .ha-l{text-shadow:0 1px 18px rgba(0,0,0,.5)}
