/* Midnyte v9 hero — Fastshot-inspired: full-bleed night video, one headline, glass composer = the Alex chat. */
.v9{--u:min(0.06410256vw,0.12400794vh);--vu:0.09920635vh;--inset-top:41;--inset-bottom:96;
 --f:Inter,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
 --e-primary:cubic-bezier(.16,1,.3,1);--e-soft:cubic-bezier(.22,1,.36,1)}
@supports (height:100dvh){.v9{--u:min(0.06410256vw,0.12400794dvh);--vu:0.09920635dvh}}
@media (min-width:1561px){.v9{--inset-top:27;--inset-bottom:70}}
body.v9{background:#070b10;font-family:var(--f);font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
.v9-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.v9-stage{position:relative;height:100vh;height:100svh;min-height:520px;overflow:hidden;background:#070b10}
.v9-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.v9-stage:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,8,12,.35) 0%,rgba(5,8,12,0) 22%,rgba(5,8,12,0) 70%,rgba(5,8,12,.55) 100%)}
.v9-frame{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;padding:calc(var(--inset-top)*var(--vu)) calc(225*var(--u)) calc(var(--inset-bottom)*var(--vu))}
#v9-menu{position:absolute;opacity:0;width:0;height:0;pointer-events:none}

/* Nav */
.v9-nav{position:relative;flex:none;height:calc(43*var(--u));display:flex;align-items:center;justify-content:space-between}
.v9-brand{display:inline-flex;align-items:center;gap:calc(12*var(--u));color:#fff;text-decoration:none;font-family:var(--f);font-variation-settings:"opsz" 32;font-size:calc(19.5*var(--u));font-weight:560;letter-spacing:-.02em;line-height:1}
.v9-mark{width:calc(34*var(--u));height:calc(34*var(--u));flex:none}
.v9-word{transform:translateY(calc(1*var(--u)));text-shadow:0 calc(1*var(--u)) calc(10*var(--u)) rgba(0,0,0,.3)}
.v9-links{position:absolute;left:50%;top:calc(9.5*var(--u));transform:translateX(-50%);display:flex;gap:calc(46*var(--u));list-style:none;margin:0;padding:0}
.v9-links a{display:block;color:#fff;text-decoration:none;font-size:calc(19*var(--u));font-weight:400;letter-spacing:-.0115em;line-height:1.2;text-shadow:0 calc(1*var(--u)) calc(12*var(--u)) rgba(0,0,0,.32);transition:opacity .18s ease}
.v9-links a:hover{opacity:.72}
.v9-cta{align-self:flex-start;margin-top:calc(1*var(--u));display:inline-flex;align-items:center;justify-content:center;width:calc(150*var(--u));height:calc(43*var(--u));border:0;border-radius:calc(12*var(--u));cursor:pointer;
 font-family:var(--f);font-size:calc(15.7*var(--u));font-weight:520;letter-spacing:-.0127em;line-height:1;color:#fff;
 background:linear-gradient(180deg,#3a3e42 0%,#1b1e21 100%);box-shadow:inset 0 calc(1*var(--u)) 0 rgba(255,255,255,.10),0 calc(2*var(--u)) calc(14*var(--u)) rgba(0,0,0,.28);transition:filter .18s ease,transform .1s ease}
.v9-cta span{transform:translateY(calc(1*var(--u)))}
.v9-cta:hover{filter:brightness(1.16)}.v9-cta:active{transform:translateY(1px)}
.v9-burger,.v9-sheet{display:none}

/* Hero */
.v9-hero{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(48*var(--vu));padding-bottom:calc(4*var(--vu))}
.v9-h1{margin:0;font-family:var(--f);font-variation-settings:"opsz" 32;font-size:calc(36.25*var(--u));font-weight:420;line-height:1.1;letter-spacing:.0018em;color:#fff;text-align:center;text-shadow:0 calc(2*var(--u)) calc(22*var(--u)) rgba(0,0,0,.35)}
.v9-sub{margin:calc(-30*var(--vu)) 0 0;max-width:calc(640*var(--u));font-size:calc(15*var(--u));line-height:1.5;color:rgba(255,255,255,.82);text-align:center;text-shadow:0 1px 12px rgba(0,0,0,.45)}

/* Composer card (absolute toolbar, measured like the reference) */
.v9-card{position:relative;flex:none;width:calc(708*var(--u));height:calc(143*var(--u));margin:0 calc(3*var(--u)) 0 0;border-radius:calc(26*var(--u));
 background:rgba(20,26,32,.93);-webkit-backdrop-filter:blur(calc(26*var(--u))) saturate(112%);backdrop-filter:blur(calc(26*var(--u))) saturate(112%);
 box-shadow:inset 0 0 0 1px rgba(214,228,255,.14),0 calc(22*var(--u)) calc(60*var(--u)) rgba(0,0,0,.35)}
.v9-ph{position:absolute;left:calc(27*var(--u));top:calc(29*var(--u));right:calc(24*var(--u));height:calc(40*var(--u));padding:0;border:0;background:none;resize:none;overflow:hidden;
 font-family:var(--f);font-size:calc(11.5*var(--u));font-weight:400;line-height:1.35;letter-spacing:.007em;color:#eeeae0;outline:none}
.v9-ph::placeholder{color:#8B8C8E}
.v9-tools{position:absolute;left:calc(19*var(--u));top:calc(92*var(--u));right:calc(-1*var(--u));height:calc(30*var(--u))}
.v9-chips{display:flex;align-items:center;gap:calc(5.5*var(--u));height:100%}
.v9-chip{display:inline-flex;align-items:center;flex:none;width:calc(var(--cw)*var(--u));height:calc(30*var(--u));padding:0 0 0 calc(var(--pl)*var(--u));gap:calc(var(--ig)*var(--u));border-radius:calc(9*var(--u));cursor:pointer;
 font-family:var(--f);font-size:calc(9.2*var(--u));font-weight:500;line-height:1;color:#9a9b9e;white-space:nowrap;
 background:linear-gradient(180deg,rgba(255,255,255,.088) 0%,rgba(255,255,255,.050) 45%,rgba(255,255,255,.038) 100%);border:1px solid rgba(255,255,255,.05);transition:color .18s ease,background .18s ease}
.v9-chip:hover{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.07));color:#d6d3cb}
.v9-chip svg{width:calc(12*var(--u));height:auto;fill:currentColor;flex:none}
.v9-chip span{transform:translateY(calc(1*var(--u)))}
.v9-right{position:absolute;inset:0;pointer-events:none}
.v9-right>*{position:absolute;pointer-events:auto}
.v9-model{left:calc(430*var(--u));top:calc(15.5*var(--u));font-size:calc(10.4*var(--u));line-height:1;color:#98999C;white-space:nowrap}
.v9-attach{left:calc(599.15*var(--u));top:calc(10.14*var(--u));padding:0;border:0;background:none;color:#A9AAAD;cursor:pointer;line-height:0;transition:color .18s ease}
.v9-attach svg{width:calc(19.79*var(--u));height:auto;fill:currentColor}
.v9-attach:hover{color:#fff}
.v9-send{left:calc(640*var(--u));top:calc(2*var(--u));width:calc(35*var(--u));height:calc(35*var(--u));padding:0;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;
 background:linear-gradient(163deg,#f5d5a3 0%,#deb780 46%,#c9955a 100%);box-shadow:0 calc(3*var(--u)) calc(12*var(--u)) rgba(201,149,90,.38);transition:filter .18s ease,transform .12s ease}
.v9-send svg{width:calc(11.66*var(--u));height:auto;fill:#14191c}
.v9-send:hover{filter:brightness(1.07)}.v9-send:active{transform:scale(.95)}

/* Proof */
.v9-proof{flex:none;display:flex;flex-direction:column;align-items:center;gap:calc(34*var(--vu))}
.v9-by{margin:0;font-family:var(--f);font-variation-settings:"opsz" 32;font-size:calc(14*var(--u));font-weight:480;letter-spacing:.0065em;color:rgba(255,255,255,.92);text-shadow:0 calc(1*var(--u)) calc(12*var(--u)) rgba(0,0,0,.4)}
.v9-logos{display:flex;align-items:center;gap:calc(44*var(--u));list-style:none;margin:0;padding:0}
.v9-logos li{font-family:var(--f);font-variation-settings:"opsz" 32;font-size:calc(19*var(--u));font-weight:560;letter-spacing:-.02em;color:#fff;white-space:nowrap;text-shadow:0 calc(1*var(--u)) calc(10*var(--u)) rgba(0,0,0,.35)}

/* Chat overlay: the real Alex desk */
.v9-chat{position:fixed;inset:0;z-index:100;overflow:auto;padding:70px 16px 40px;background:rgba(5,8,12,.86);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.v9-chat[hidden]{display:none}
.v9-chat-close{position:fixed;top:16px;right:18px;z-index:101;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(20,26,32,.9);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.v9-chat .workspace-wrap:not(.expanded){width:min(780px,100%);margin:0 auto}
body.v9-chat-open{overflow:hidden}

/* Tablet: fluid desktop */
@media (min-width:600px) and (max-width:1180px) and (min-height:600px){
 .v9{--u:1px}
 .v9-frame{padding:clamp(24px,3.4vh,44px) clamp(28px,4.2vw,60px) clamp(26px,4.4vh,56px)}
 .v9-links{gap:clamp(18px,3vw,36px)}.v9-links a{font-size:clamp(14px,1.6vw,17px)}
 .v9-h1{font-size:clamp(27px,4.3vw,44px);line-height:1.12}
 .v9-card{width:min(100%,clamp(516px,74vw,760px));height:auto;margin-right:0;padding:clamp(15px,1.9vw,24px);border-radius:clamp(17px,2.1vw,26px);display:flex;flex-direction:column;gap:clamp(20px,3.2vh,44px)}
 .v9-ph{position:static;height:auto;min-height:1.4em;font-size:clamp(13px,1.5vw,15px);line-height:1.4}
 .v9-tools{position:static;height:auto;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:clamp(10px,1.4vw,18px)}
 .v9-chips{flex-wrap:nowrap;gap:clamp(6px,.85vw,10px);height:auto}
 .v9-chip{width:auto;height:clamp(29px,3.4vh,34px);padding:0 clamp(7px,1vw,13px);font-size:clamp(9.6px,1.12vw,12.5px)}
 .v9-right{position:static;display:flex;align-items:center;margin-left:auto;gap:0}
 .v9-right>*{position:static}
 .v9-model{font-size:clamp(9.8px,1.12vw,12.5px)}
 .v9-attach{margin-left:clamp(9px,1.4vw,20px)}
 .v9-send{margin-left:clamp(9px,1.3vw,18px);width:clamp(32px,3.5vw,38px);height:clamp(32px,3.5vw,38px)}
 .v9-proof{gap:clamp(15px,2.5vh,30px)}
 .v9-logos{gap:clamp(18px,3vw,40px)}.v9-logos li{font-size:clamp(14px,1.7vw,19px)}
}
/* Compact: phones and short landscape */
@media (max-width:599px),(max-height:599px) and (max-width:1180px){
 .v9{--u:1px}
 .v9-frame{padding:max(18px,env(safe-area-inset-top)) max(clamp(18px,5.2vw,40px),env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(clamp(18px,5.2vw,40px),env(safe-area-inset-left))}
 .v9-links,.v9-nav>.v9-cta{display:none}
 .v9-mark{width:30px;height:30px}
 .v9-burger{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);cursor:pointer}
 .v9-burger svg{width:17px;height:12px;stroke:#fff;stroke-width:1.8;stroke-linecap:round}
 .v9-sheet{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s cubic-bezier(.4,0,.2,1);flex:none;position:relative;z-index:3}
 .v9-sheet>div{overflow:hidden;min-height:0}
 .v9-panel{margin-top:12px;padding:14px;border-radius:16px;background:rgba(24,24,27,.86);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.09);display:flex;flex-direction:column;gap:4px}
 .v9-panel a{color:#fff;text-decoration:none;font-size:15px;padding:9px 6px}
 .v9-panel .v9-cta{width:auto;align-self:stretch;height:40px;border-radius:11px;font-size:15px;margin-top:8px}
 #v9-menu:checked~.v9-sheet{grid-template-rows:1fr}
 .v9-h1{width:100%;max-width:15ch;font-size:clamp(29px,7.6vw,50px);line-height:1.14;letter-spacing:-.012em}
 .v9-sub{margin-top:-8px;font-size:15px}
 .v9-card{width:100%;max-width:600px;height:auto;margin-right:0;display:flex;flex-direction:column;gap:clamp(16px,4.6vh,34px);padding:clamp(13px,3.4vw,18px);border-radius:20px}
 .v9-ph{position:static;height:auto;min-height:2.8em;font-size:16px;line-height:1.4}
 .v9-tools{position:static;height:auto;display:flex;flex-direction:column;align-items:stretch;gap:12px}
 .v9-chips{flex-wrap:wrap;gap:6px;height:auto}
 .v9-chip{width:auto;height:32px;padding:0 11px;font-size:12px}
 .v9-right{position:static;display:flex;align-items:center;justify-content:flex-start}
 .v9-right>*{position:static}
 .v9-model{font-size:12px}
 .v9-attach{margin-left:auto}
 .v9-send{margin-left:14px;width:40px;height:40px}
 .v9-proof{gap:12px}
 .v9-logos{flex-wrap:wrap;justify-content:center;gap:6px 18px}.v9-logos li{font-size:14px}
}
@media (max-width:1180px) and (max-height:560px){.v9-hero{gap:16px}.v9-h1{font-size:clamp(24px,5.4vh,34px)}.v9-proof{gap:10px}.v9-frame{padding-top:10px}}

/* Entrance: once */
@keyframes v9-down{from{opacity:0;transform:translateY(calc(-5*var(--u)))}}
@keyframes v9-up{from{opacity:0;transform:translateY(calc(6*var(--u)))}}
@keyframes v9-focus{from{opacity:0;transform:translateY(calc(14*var(--u)));filter:blur(calc(6*var(--u)))}to{filter:blur(0)}}
@keyframes v9-panel{from{opacity:0;transform:translateY(calc(18*var(--u))) scale(.985)}}
@keyframes v9-pop{from{opacity:0;transform:translateY(calc(4*var(--u)))}}
@keyframes v9-send{from{transform:scale(.82)}}
@media (prefers-reduced-motion:no-preference){
 .anim .v9-brand{animation:v9-down .58s var(--e-soft) .06s both}
 .anim .v9-links li{animation:v9-down .5s var(--e-soft) both}
 .anim .v9-links li:nth-child(1){animation-delay:.16s}.anim .v9-links li:nth-child(2){animation-delay:.21s}.anim .v9-links li:nth-child(3){animation-delay:.26s}.anim .v9-links li:nth-child(4){animation-delay:.31s}
 .anim .v9-nav>.v9-cta{animation:v9-down .55s var(--e-soft) .34s both}
 .anim .v9-h1{animation:v9-focus 1s var(--e-primary) .3s both}
 .anim .v9-card{animation:v9-panel .9s var(--e-primary) .62s both}
 .anim .v9-ph{animation:v9-pop .5s var(--e-soft) .88s both}
 .anim .v9-chips{animation:v9-pop .5s var(--e-soft) .94s both}
 .anim .v9-right{animation:v9-pop .5s var(--e-soft) 1s both}
 .anim .v9-send{animation:v9-send .5s var(--e-primary) 1s both}
 .anim .v9-by{animation:v9-up .55s var(--e-soft) 1.08s both}
 .anim .v9-logos li{animation:v9-up .55s var(--e-soft) both}
 .anim .v9-logos li:nth-child(1){animation-delay:1.16s}.anim .v9-logos li:nth-child(2){animation-delay:1.22s}.anim .v9-logos li:nth-child(3){animation-delay:1.28s}.anim .v9-logos li:nth-child(4){animation-delay:1.34s}
}
@media (prefers-reduced-motion:reduce){.v9 *{animation-duration:.01ms!important;transition-duration:.01ms!important}}
