1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7018],{9358:(e,n,t)=>{Promise.resolve().then(t.t.bind(t,14175,23)),Promise.resolve().then(t.bind(t,99420)),Promise.resolve().then(t.bind(t,85486)),Promise.resolve().then(t.bind(t,24095)),Promise.resolve().then(t.bind(t,67514))},14175:()=>{},24095:(e,n,t)=>{"use strict";t.d(n,{default:()=>G});var r=t(95155),a=t(12115),o=t(20063),i=t(886),l=t(24033),s=t(90368),d=t(27937),m=t(12108),p=t(65229),c=t(67514);function h(e){let n=e.currentTarget,t=n.getBoundingClientRect();n.style.setProperty("--mx","".concat(e.clientX-t.left,"px")),n.style.setProperty("--my","".concat(e.clientY-t.top,"px"))}function g(e){let{size:n=90,color:t="var(--owl-accent-primary)"}=e;return(0,r.jsx)("span",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-0 rounded-[inherit] opacity-0 transition-opacity duration-300 group-hover:opacity-100",style:{background:"radial-gradient(".concat(n,"px circle at var(--mx, 50%) var(--my, 50%), color-mix(in oklch, ").concat(t," 38%, transparent), transparent 62%)")}})}let u=[{name:"Sela Talons",title:"Sales Assistant",img:"/images/nightowls/sela-talons.png",listingId:"00000000-1157-4000-8000-000000000001",summary:"Qualifies leads, drafts outreach, and keeps your pipeline moving without you chasing follow-ups.",skills:["Lead qualification","Cold outreach drafting","CRM updates","Meeting scheduling","Pipeline tracking"]},{name:"Warren Feathers",title:"Financial Analyst",img:"/images/nightowls/warren-feathers.png",listingId:"00000000-1157-4000-8000-000000000002",summary:"Turns raw numbers into clear financial insight â forecasts, reports, and the occasional hard truth about your burn rate.",skills:["Financial modeling","Budget forecasting","Expense analysis","Report generation","KPI tracking"]},{name:"Justice Hootley",title:"Legal Counsel",img:"/images/nightowls/justice-hootley.png",listingId:"00000000-1157-4000-8000-000000000003",summary:"Reviews contracts, flags risk, and keeps your paperwork from becoming a problem later.",skills:["Contract review","Compliance checks","Risk flagging","Policy drafting","Legal research"]},{name:"Marlo Plume",title:"Marketing Strategist",img:"/images/nightowls/marlo-plume.png",listingId:"00000000-1157-4000-8000-000000000004",summary:"Plans campaigns, writes copy, and tracks what's actually working â not just what looks good on a dashboard.",skills:["Campaign planning","Copywriting","Content calendars","Performance analysis","A/B testing"]},{name:"Ada Nightingale",title:"Data Scientist",img:"/images/nightowls/ada-nightingale.png",listingId:"00000000-1157-4000-8000-000000000005",summary:"Digs through your data to find the patterns that actually matter, then explains them in plain English.",skills:["Data analysis","Predictive modeling","Dashboard building","SQL queries","Trend reporting"]},{name:"Etta Quill",title:"Executive Assistant",img:"/images/nightowls/etta-quill.png",listingId:"00000000-1157-4000-8000-000000000006",summary:"Runs your calendar, triages your inbox, and handles the logistics so you can focus on decisions, not scheduling.",skills:["Calendar management","Inbox triage","Travel booking","Meeting prep","Task coordination"]},{name:"Sunny Beak",title:"Customer Support Lead",img:"/images/nightowls/sunny-beak.png",listingId:"00000000-1157-4000-8000-000000000007",summary:"Answers tickets, resolves issues, and keeps customers happy around the clock.",skills:["Ticket resolution","Live chat support","FAQ management","Escalation handling","Customer sentiment tracking"]},{name:"Talia Sourcer",title:"Recruiter",img:"/images/nightowls/talia-sourcer.png",listingId:"00000000-1157-4000-8000-000000000008",summary:"Sources candidates, screens resumes, and keeps your hiring pipeline from going cold.",skills:["Candidate sourcing","Resume screening","Outreach messaging","Interview scheduling","Pipeline management"]},{name:"Ledger Owlbright",title:"Accountant",img:"/images/nightowls/ledger-owlbright.png",listingId:"00000000-1157-4000-8000-000000000009",summary:"Keeps the books straight â invoicing, reconciliation, and reports that are actually ready when you need them.",skills:["Bookkeeping","Invoice processing","Reconciliation","Tax prep support","Financial reporting"]},{name:"Otto Swift",title:"Operations Manager",img:"/images/nightowls/otto-swift.png",listingId:"00000000-1157-4000-8000-00000000000a",summary:"Keeps the day-to-day running â workflows, vendor coordination, and the small stuff that piles up fast.",skills:["Process optimization","Vendor coordination","Workflow automation","Team scheduling","SOP documentation"]}],b=[{title:"Neon Portrait",kind:"image",background:"radial-gradient(circle at 26% 34%,rgba(255,218,96,.95) 0 8%,transparent 9%),linear-gradient(135deg,#7a104f 0%,#d84283 62%,#ee7b91 100%)"},{title:"Ocean Film",kind:"video",background:"radial-gradient(circle at 76% 25%,rgba(84,199,233,.88) 0 10%,transparent 11%),linear-gradient(135deg,#0c315a 0%,#245b88 58%,#91bfcc 100%)"},{title:"Night Mix",kind:"audio",background:"radial-gradient(circle at 50% 55%,rgba(252,1,153,.25),transparent 46%),linear-gradient(135deg,#170d23 0%,#44205c 55%,#8b3476 100%)"},{title:"Studio Render",kind:"3d",background:"radial-gradient(circle at 50% 50%,rgba(71,255,255,.12),transparent 42%),linear-gradient(135deg,#14213d 0%,#294d64 52%,#286d76 100%)"},{title:"Motion Study",kind:"motion",background:"linear-gradient(25deg,transparent 0 37%,rgba(255,255,255,.15) 38% 40%,transparent 41%),linear-gradient(135deg,#35142a 0%,#78304f 52%,#c76868 100%)"}],x=[{title:"Analytics App",type:"App",subtitle:"Featured build"}
1,{title:"Commerce Site",type:"Website",subtitle:"Featured build"},{title:"Agent Workspace",type:"App",subtitle:"Featured build"},{title:"Workflow App",type:"App",subtitle:"Featured build"},{title:"Research Console",type:"App",subtitle:"Featured build"}],f=["Media Market","Nightowl","App Market"],w=[.78,1.6,.78],v=w[0]+w[1]+w[2],y=[0,w[0]/v*100,(w[0]+w[1])/v*100],k=w.map(e=>e/v*100);function j(e){let{label:n,direction:t,active:a,onClick:o}=e;return(0,r.jsxs)("button",{type:"button","aria-label":n,onPointerDown:e=>e.stopPropagation(),onClick:e=>{e.stopPropagation(),o()},onMouseMove:h,className:"group relative isolate z-20 flex h-full w-5 shrink-0 cursor-pointer items-center justify-center overflow-hidden sm:w-7 ".concat("up"===t?"rounded-l-lg":"rounded-r-lg"," transition-[color,background-color,opacity,box-shadow] duration-200 ").concat(a?"text-white/78 hover:bg-[#39FF14]/[0.055] hover:text-white hover:shadow-[inset_0_0_14px_rgba(57,255,20,0.07)]":"text-owl-neutral-inverse-300 opacity-[0.34] hover:opacity-[0.58]"),children:[(0,r.jsx)(g,{size:66,color:"#39FF14"}),"up"===t?(0,r.jsx)(m.default,{className:"relative z-10 h-3.5 w-3.5",strokeWidth:1.6}):(0,r.jsx)(l.default,{className:"relative z-10 h-3.5 w-3.5",strokeWidth:1.6})]})}function N(e){var n,t;let{owls:l=u,isOuterCentered:m=!0,onOuterPrevious:w,onOuterNext:v,onOuterCenterSelf:N}=e,F=(0,o.useRouter)(),[T,z]=(0,a.useState)(0),[A,C]=(0,a.useState)(0),[E,I]=(0,a.useState)(0),[M,O]=(0,a.useState)(1),[_,L]=(0,a.useState)(1),[S,P]=(0,a.useState)(1),[R,W]=(0,a.useState)("Nightowl"),[B,D]=(0,a.useState)(!1),[H,K]=(0,a.useState)(!1),[G,U]=(0,a.useState)(null),X=(0,a.useRef)(null),[V,Y]=(0,a.useState)(!1),[q,Z]=(0,a.useState)(null),$=(0,a.useRef)(!1),Q=(0,a.useRef)(null),J=f.indexOf(R),ee=(e,n,t)=>t>0?(e+n+t)%t:0,en=Array.from({length:Math.min(5,l.length)},(e,n)=>l[(T+n)%l.length]).filter(e=>!!e),et=Array.from({length:b.length},(e,n)=>b[(A+n)%b.length]),er=Array.from({length:x.length},(e,n)=>x[(E+n)%x.length]),ea=(e,n)=>{W(e);let t=n>=0?1:-1;if("Media Market"===e){L(t),C(e=>ee(e,n,b.length));return}if("Nightowl"===e){O(t),z(e=>ee(e,n,l.length));return}P(t),I(e=>ee(e,n,x.length))},eo=e=>{"number"==typeof e&&W(f[(e=>{let n=X.current;if(!n)return J;let t=n.getBoundingClientRect(),r=Math.max(0,Math.min(100,(e-t.left)/t.width*100)),a=y[1],o=y[2];return r<a?0:r<o?1:2})(e)]),Y(!1),Z(null),$.current=!1,Q.current=null};(0,a.useEffect)(()=>{if(l.length<2||G)return;let e=window.setInterval(()=>{O(1),z(e=>ee(e,1,l.length))},4500);return()=>window.clearInterval(e)},[l.length,G]),(0,a.useEffect)(()=>{if(G)return;let e=!1,n=[],t=e=>new Promise(t=>{let r=window.setTimeout(t,e);n.push(r)});return(async()=>{for(;!e;){if(await t(5e3),e||(W("App Market"),await t(2e3),e)||(W("Nightowl"),await t(5e3),e)||(W("Media Market"),await t(2e3),e))return;W("Nightowl")}})(),()=>{e=!0,n.forEach(e=>window.clearTimeout(e))}},[G]);let ei=e=>{let n=R===e;return"flex min-w-0 flex-col p-0.5 transition-opacity duration-300 sm:p-1 ".concat(n?"opacity-100":"Media Market"===e?"opacity-[0.33] hover:opacity-[0.59]":"opacity-[0.66] hover:opacity-[0.85]")};return(0,r.jsxs)("section",{className:"relative z-20 w-full",onMouseEnter:()=>D(!0),onMouseLeave:()=>D(!1),children:[w&&(0,r.jsx)("button",{type:"button","aria-label":m?"Show Organization Execution":"Center Parliament Marketplace",onPointerDown:e=>e.stopPropagation(),onClick:e=>{if(e.stopPropagation(),!m&&N)return void N();w()},className:"hero-outer-carousel-arrow pointer-events-auto absolute left-[clamp(0.72rem,1.25vw,0.95rem)] top-[clamp(0.72rem,1.25vw,0.95rem)] z-[220] flex h-8 w-8 cursor-pointer items-center justify-center rounded-[9px] border border-transparent bg-white/[0.012] text-white/58 transition-[border-color,background-color,color,box-shadow] duration-200 hover:border-white/[0.16] hover:bg-white/[0.045] hover:text-white hover:shadow-[inset_0_0_14px_rgba(255,255,255,0.04),0_5px_16px_rgba(0,0,0,0.28)] focus-visible:border-white/[0.16] focus-visible:bg-white/[0.045] focus-visible:text-white",children:(0,r.jsx)(s.default,{className:"h-4 w-4",strokeWidth:1.55})}),v&&(0,r.jsx)("button",{type:"button","aria-label":m?"Show Skill Tree Execution":"Center Parliament Marketplace",onPointerDown:e=>e.stopPropagation(),onClick:e=>{if(e.stopPropagation(),!m&&N)return void N();v()},className:"hero-outer-carousel-arrow pointer-events-auto absolute right-[clamp(0.72rem,1.25vw,0.95rem)] top-[clamp(0.72rem,1.25vw,0.95rem)] z-[220] flex h-8 w-8 cursor-pointer items-center justify-center rounded-[9px] border border-transparent bg-white/[0.012] text-white/58 transition-[border-color,background-color,color,box-shadow] duration-200 hover:border-white/[0.16] hover:bg-white/[0.045] hover:text-white hover:shadow-[inset_0_0_14px_rgba(255,255,255,0.04),0_5px_16px_rgba(0,0,0,0.28)] focu
1s-visible:border-white/[0.16] focus-visible:bg-white/[0.045] focus-visible:text-white",children:(0,r.jsx)(d.default,{className:"h-4 w-4",strokeWidth:1.55})}),(0,r.jsx)("div",{role:"tooltip","aria-hidden":!H,style:{backgroundColor:"rgba(255,255,255,0.03)"},className:"hero-other-tooltip-glass pointer-events-none absolute left-1/2 top-[-2.65rem] z-[200] w-[min(32rem,90vw)] -translate-x-1/2 rounded-xl border border-white/[0.10] bg-white/[0.03] px-3 py-1.5 text-center font-body text-[0.68rem] font-normal leading-[1.45] text-owl-neutral-inverse-300 shadow-[0_10px_28px_rgba(0,0,0,0.46)] transition-all duration-200 ".concat(H?"translate-y-0 opacity-100":"translate-y-1 opacity-0"),children:"Explore pre-built Nightowls you can hire for skilled work, plus AI-generated media and apps created by the Nightowl Community."}),(0,r.jsx)(i.P.div,{"aria-hidden":!0,className:"pointer-events-none absolute left-1/2 top-[-2.75rem] -z-10 h-[12rem] w-[96%] -translate-x-1/2 rounded-full blur-[30px]",animate:{opacity:B?1:.68},transition:{duration:.3,ease:"easeOut"},style:{background:"radial-gradient(ellipse at center, rgba(57,255,20,0.11250) 0%, rgba(57,255,20,0.0703125) 28%, rgba(57,255,20,0.0328125) 52%, transparent 76%)"}}),(0,r.jsx)(i.P.div,{"aria-hidden":!0,className:"pointer-events-none absolute left-1/2 top-[2.2rem] -z-10 h-[13rem] w-[72%] -translate-x-1/2 rounded-full blur-[42px]",animate:{opacity:B?1:.68},transition:{duration:.3,ease:"easeOut"},style:{background:"radial-gradient(ellipse at center, rgba(57,255,20,0.0703125) 0%, rgba(57,255,20,0.035625) 34%, rgba(57,255,20,0.0140625) 58%, transparent 78%)"}}),(0,r.jsxs)("div",{className:"relative z-10 overflow-hidden rounded-[20px] border p-[clamp(0.75rem,1.4vw,1rem)] backdrop-blur-2xl",style:{backgroundColor:B?"rgba(2,13,6,0.88)":"rgba(2,10,5,0.92)",backgroundImage:"radial-gradient(ellipse 84% 54% at 50% 4%, rgba(57,255,20,0.10625) 0%, rgba(57,255,20,0.050) 34%, rgba(57,255,20,0.020) 58%, transparent 78%)",borderColor:B?"rgba(255,255,255,0.189)":"rgba(255,255,255,0.142)",boxShadow:B?"inset 0 1px 0 rgba(255,255,255,0.135), 0 16px 50px rgba(0,0,0,0.32)":"inset 0 1px 0 rgba(255,255,255,0.081), 0 16px 50px rgba(0,0,0,0.32)",transition:"background-color 300ms ease, border-color 300ms ease, box-shadow 300ms ease"},children:[(0,r.jsx)(i.P.div,{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-[35] rounded-[20px]",animate:{opacity:B?1:.9},transition:{duration:.3,ease:"easeOut"},style:{padding:"1px",background:"linear-gradient(to bottom, rgba(255,255,255,0.459) 0%, rgba(255,255,255,0.337) 2.5%, rgba(255,255,255,0.199) 7%, rgba(255,255,255,0.130) 14%, rgba(255,255,255,0.115) 22%, rgba(255,255,255,0.115) 100%)",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",maskComposite:"exclude"}}),(0,r.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-[36] rounded-[20px]",style:{padding:"1px",background:"radial-gradient(ellipse 58% 118% at 100% 0%, rgba(252,1,153,0.27) 0%, rgba(252,1,153,0.17) 20%, rgba(252,1,153,0.082) 38%, rgba(252,1,153,0.036) 56%, rgba(252,1,153,0.013) 72%, transparent 86%)",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",maskComposite:"exclude"}}),(0,r.jsx)(i.P.div,{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-30 rounded-[inherit] bg-black",animate:{opacity:.11*!B},transition:{duration:.3,ease:"easeOut"}}),(0,r.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-0",style:{opacity:B?1:.72,transition:"opacity 300ms ease",background:"radial-gradient(ellipse 72% 42% at 50% 5%, rgba(57,255,20,0.150) 0%, rgba(57,255,20,0.085) 27%, rgba(57,255,20,0.035) 48%, transparent 72%), radial-gradient(ellipse 58% 52% at 50% 38%, rgba(57,255,20,0.0575) 0%, rgba(57,255,20,0.02625) 42%, transparent 72%)"}}),(0,r.jsx)("div",{className:"relative z-[140] mb-[clamp(0.78rem,1.45vw,0.92rem)] pt-[clamp(0.16rem,0.28vw,0.22rem)] text-center",children:(0,r.jsx)("button",{type:"button","aria-label":"About Parliament Marketplace","aria-expanded":H,onMouseEnter:()=>K(!0),onMouseLeave:()=>K(!1),onFocus:()=>K(!0),onBlur:()=>K(!1),className:"font-mono text-[clamp(0.64rem,2.8vw,0.80rem)] uppercase tracking-[0.18em] text-[#39FF14] sm:text-[clamp(0.72rem,1.8vw,0.94rem)] sm:tracking-[0.27em] lg:text-[clamp(0.72rem,1.2vw,1rem)]",children:"Parliament Marketplace"})}),(0,r.jsxs)("div",{className:"relative z-10",style:{opacity:B?1:.92,transition:"opacity 300ms ease"},children:[(0,r.jsxs)("div",{ref:X,className:"relative mb-3 grid min-h-[3.1rem] grid-cols-[minmax(0,0.78fr)_minmax(0,1.6fr)_minmax(0,0.78fr)] overflow-hidden rounded-xl border border-transparent bg-black/[0.24] py-1 shadow-[inset_0_1px_0_rgba(255,255,255,0.035),0_10px_26px_rgba(0,0,0,0.18)] backdrop-blur-xl",style:{touchAction:"pan-y"},onPointerDown:e=>{Y(!0),Q.current=e.clientX,$.current=!1,e.currentTarget.setPointerCapture(e.pointerId)},onPointerMove:e=>{V&&null!==Q.current&&(!(3>Math.abs(e.clientX-Q.current))||$.current)&&($.current=!0,Z((e=>{var n,t;let r=X.current;if(!r)return null!=(n=y[J])?n:0;let a=r.getBoundingClientRect(),o=(e-a.left)/a.width*100,i=null!=(t=k[J])?t
1:0;return Math.max(0,Math.min(100-i,o-i/2))})(e.clientX)))},onPointerUp:e=>eo(e.clientX),onPointerCancel:()=>eo(),children:[(0,r.jsx)(i.P.span,{"aria-hidden":!0,className:"pointer-events-none absolute bottom-1 top-1 rounded-lg border backdrop-blur-2xl transition-[background,border-color,box-shadow] duration-300 ".concat(B?"border-[#39FF14]/30 bg-[linear-gradient(180deg,rgba(57,255,20,0.18),rgba(57,255,20,0.078))] shadow-[inset_0_1px_0_rgba(255,255,255,0.11),0_8px_22px_rgba(0,0,0,0.24),0_0_26px_rgba(57,255,20,0.10)]":"border-white/[0.16] bg-[linear-gradient(180deg,rgba(57,255,20,0.15),rgba(57,255,20,0.065))] shadow-[inset_0_1px_0_rgba(255,255,255,0.10),0_8px_22px_rgba(0,0,0,0.24),0_0_22px_rgba(57,255,20,0.08)]"),animate:{left:"".concat(null!==q?q:null!=(n=y[J])?n:0,"%"),width:"".concat(null!=(t=k[J])?t:0,"%")},transition:V?{duration:0}:{duration:.6,ease:[.42,0,.58,1]}}),f.map(e=>{let n=e===R;return(0,r.jsxs)("div",{className:"relative z-10 flex min-w-0 items-stretch justify-center overflow-hidden rounded-lg",children:[(0,r.jsx)(j,{label:"Previous ".concat("Nightowl"===e?"Nightowls":e),direction:"up",active:n,onClick:()=>ea(e,-1)}),(0,r.jsx)("button",{type:"button",onPointerDown:e=>e.stopPropagation(),onClick:()=>W(e),className:"relative z-10 flex min-w-0 flex-1 items-center justify-center px-[clamp(0.2rem,0.65vw,0.6rem)] py-2 text-center font-heading text-[clamp(0.68rem,2.9vw,0.86rem)] leading-none tracking-[-0.015em] sm:text-[clamp(0.80rem,1.9vw,1rem)] lg:text-[clamp(0.87rem,2.75vw,1.06rem)] transition-[color,opacity] duration-200 ".concat(n?"font-[400] text-white opacity-100":"font-[400] text-owl-neutral-inverse-300 opacity-[0.51] hover:opacity-[0.72]"),children:"Nightowl"===e?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"font-[400] sm:hidden",children:"Hire"}),(0,r.jsxs)("span",{className:"hidden min-w-0 items-center justify-center whitespace-nowrap sm:inline-flex",children:[(0,r.jsx)("span",{className:"shrink-0 font-[400]",children:"Hire your"}),(0,r.jsx)("span",{"aria-hidden":!0,className:"w-[0.42em] shrink-0"}),(0,r.jsx)("img",{src:"/nightowl-wordmark.png",alt:"Nightowl",className:"block h-[0.78em] w-auto max-w-[6.5rem] shrink-0 self-center object-contain translate-y-[0.015em]"})]})]}):"Media Market"===e?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"font-[400] sm:hidden",children:"Media"}),(0,r.jsx)("span",{className:"hidden whitespace-nowrap font-[400] sm:inline",children:"Media Market"})]}):(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"font-[400] sm:hidden",children:"Apps"}),(0,r.jsx)("span",{className:"hidden whitespace-nowrap font-[400] sm:inline",children:"App Market"})]})}),(0,r.jsx)(j,{label:"Next ".concat("Nightowl"===e?"Nightowls":e),direction:"down",active:n,onClick:()=>ea(e,1)})]},e)})]}),(0,r.jsxs)("div",{className:"grid grid-cols-[minmax(0,0.78fr)_minmax(0,1.6fr)_minmax(0,0.78fr)] items-stretch gap-1 sm:gap-1.5 lg:gap-3",children:[(0,r.jsx)("div",{className:ei("Media Market"),onPointerDown:()=>W("Media Market"),children:(0,r.jsx)(i.P.div,{initial:{y:_>0?18:-18,opacity:.62},animate:{y:0,opacity:1},transition:{duration:.34,ease:[.22,1,.36,1]},className:"relative flex h-[clamp(18.5rem,36vh,22rem)] flex-col gap-2 overflow-hidden",children:et.map((e,n)=>(0,r.jsxs)("button",{type:"button","aria-label":e.title,style:{background:e.background,...4===n?{WebkitMaskImage:"linear-gradient(to bottom, black 0%, rgba(0,0,0,.82) 28%, rgba(0,0,0,.28) 72%, transparent 100%)",maskImage:"linear-gradient(to bottom, black 0%, rgba(0,0,0,.82) 28%, rgba(0,0,0,.28) 72%, transparent 100%)"}:{}},className:"group/media relative flex min-h-0 flex-1 min-w-0 items-center justify-center overflow-hidden rounded-xl border border-white/[0.12] transition-[border-color,filter,transform] duration-200 hover:border-white/[0.25] hover:brightness-110",children:["video"===e.kind&&(0,r.jsx)("span",{"aria-hidden":!0,className:"flex h-9 w-9 items-center justify-center rounded-full border border-white/50 bg-black/45 shadow-[0_4px_18px_rgba(0,0,0,.45)] backdrop-blur-md",children:(0,r.jsx)("svg",{viewBox:"0 0 24 24",className:"ml-0.5 h-4 w-4 fill-white","aria-hidden":!0,
1children:(0,r.jsx)("path",{d:"M8 5.5v13l10-6.5z"})})}),"audio"===e.kind&&(0,r.jsx)("span",{"aria-hidden":!0,className:"flex h-11 w-11 items-center justify-center rounded-full border border-white/20 bg-black/25 text-white/90 shadow-[0_4px_20px_rgba(0,0,0,.35)] backdrop-blur-sm",children:(0,r.jsxs)("svg",{viewBox:"0 0 24 24",className:"h-6 w-6 fill-none stroke-current",strokeWidth:"1.7",children:[(0,r.jsx)("path",{d:"M9 18V6.8L18 5v10.6"}),(0,r.jsx)("circle",{cx:"6.6",cy:"18.1",r:"2.6"}),(0,r.jsx)("circle",{cx:"15.6",cy:"15.7",r:"2.6"})]})}),"3d"===e.kind&&(0,r.jsx)("span",{"aria-hidden":!0,className:"flex h-11 w-11 items-center justify-center text-white/88 drop-shadow-[0_4px_14px_rgba(0,0,0,.35)]",children:(0,r.jsxs)("svg",{viewBox:"0 0 24 24",className:"h-8 w-8 fill-none stroke-current",strokeWidth:"1.35",children:[(0,r.jsx)("path",{d:"m12 3 7 4-7 4-7-4 7-4Z"}),(0,r.jsx)("path",{d:"m5 7 7 4 7-4v9l-7 5-7-5V7Z"}),(0,r.jsx)("path",{d:"M12 11v10"})]})}),"motion"===e.kind&&(0,r.jsx)("span",{"aria-hidden":!0,className:"flex items-end gap-1",children:[18,30,22,38,26].map((e,n)=>(0,r.jsx)("span",{className:"w-1 rounded-full bg-white/72 shadow-[0_0_8px_rgba(255,255,255,.12)]",style:{height:e}},n))}),"image"===e.kind&&(0,r.jsx)("span",{"aria-hidden":!0,className:"absolute bottom-2 right-2 rounded-md border border-white/20 bg-black/28 px-1.5 py-1 backdrop-blur-sm",children:(0,r.jsxs)("svg",{viewBox:"0 0 24 24",className:"h-3.5 w-3.5 fill-none stroke-white/80",strokeWidth:"1.5",children:[(0,r.jsx)("rect",{x:"3.5",y:"4.5",width:"17",height:"15",rx:"2"}),(0,r.jsx)("circle",{cx:"9",cy:"9.5",r:"1.4"}),(0,r.jsx)("path",{d:"m5.5 17 4.2-4.3 3 2.8 2.2-2.1 3.6 3.6"})]})})]},e.title))},"media-".concat(A))}),(0,r.jsx)("div",{className:ei("Nightowl"),onPointerDown:()=>W("Nightowl"),children:(0,r.jsx)(i.P.div,{initial:{y:M>0?18:-18,opacity:.62},animate:{y:0,opacity:1},transition:{duration:.34,ease:[.22,1,.36,1]},className:"relative flex h-[clamp(18.5rem,36vh,22rem)] min-w-0 flex-col gap-2 overflow-hidden",children:en.map((e,n)=>(0,r.jsxs)("div",{role:"button",tabIndex:0,"aria-label":"About ".concat(e.name,", ").concat(e.title),onClick:()=>U(e),onKeyDown:n=>{("Enter"===n.key||" "===n.key)&&U(e)},style:4===n?{WebkitMaskImage:"linear-gradient(to bottom, black 0%, rgba(0,0,0,.82) 28%, rgba(0,0,0,.28) 72%, transparent 100%)",maskImage:"linear-gradient(to bottom, black 0%, rgba(0,0,0,.82) 28%, rgba(0,0,0,.28) 72%, transparent 100%)"}:void 0,className:"grid min-h-0 flex-1 cursor-pointer grid-cols-[2.45rem_minmax(0,1fr)_2.35rem] items-stretch gap-1 overflow-hidden rounded-xl border border-white/[0.12] bg-black/[0.38] p-0 transition-[border-color,background-color] hover:border-white/[0.22] sm:grid-cols-[2.65rem_minmax(0,1fr)_2.55rem] sm:gap-1 md:grid-cols-[2.85rem_minmax(0,1fr)_2.75rem] lg:grid-cols-[4rem_minmax(0,1fr)_4.25rem] lg:gap-3",children:[(0,r.jsx)("div",{className:"relative h-full w-full min-h-0 overflow-hidden bg-black",children:(0,r.jsx)("img",{src:e.img,alt:"".concat(e.name," â ").concat(e.title),draggable:!1,loading:"lazy",className:"h-full w-full select-none object-cover object-top"})}),(0,r.jsxs)("div",{className:"min-w-0 self-center py-1.5",children:[(0,r.jsx)("div",{className:"truncate font-heading text-[0.60rem] font-[500] leading-tight text-white sm:text-[0.66rem] md:text-[0.72rem] lg:text-[clamp(0.80rem,1.15vw,0.94rem)]",children:e.name}),(0,r.jsx)("div",{className:"mt-0.5 truncate font-mono text-[0.34rem] uppercase tracking-[0.055em] text-[#39FF14] sm:text-[0.39rem] sm:tracking-[0.07em] md:text-[0.43rem] md:tracking-[0.09em] lg:mt-1 lg:text-[clamp(0.48rem,0.72vw,0.58rem)] lg:tracking-[0.13em]",children:e.title})]}),(0,r.jsxs)("button",{type:"button",onMouseMove:h,onClick:n=>{n.stopPropagation(),F.push("/parliament/listing/".concat(e.listingId))},"aria-label":"Hire ".concat(e.name,", ").concat(e.title),className:"group relative isolate my-0.5 mr-0.5 flex h-[calc(100%-0.25rem)] w-full min-w-0 items-center justify-center overflow-hidden rounded-l-[10px] rounded-r-[9px] border border-[#39FF14]/65 bg-[linear-gradient(180deg,rgba(57,255,20,0.10),rgba(57,255,20,0.035))] font-mono font-[400] uppercase text-white transition-[background-color,border-color,box-shadow,transform] duration-200 hover:border-[#39FF14] hover:bg-[#39FF14]/[0.12] hover:shadow-[inset_0_0_18px_rgba(57,255,20,0.10),0_0_10px_rgba(57,255,20,0.08)] text-[0.50rem] tracking-[0.025em] sm:rounded-l-[10px] sm:rou
1nded-r-[9px] sm:text-[0.54rem] sm:tracking-[0.03em] md:text-[0.57rem] md:tracking-[0.035em] lg:rounded-l-[12px] lg:rounded-r-[10px] lg:text-[clamp(0.80rem,1.15vw,0.94rem)] lg:tracking-[0.08em]",children:[(0,r.jsx)(g,{size:100,color:"#39FF14"}),(0,r.jsx)("span",{className:"relative z-10",children:"HIRE"})]})]},e.name))},"nightowls-".concat(T))}),(0,r.jsx)("div",{className:ei("App Market"),onPointerDown:()=>W("App Market"),children:(0,r.jsx)(i.P.div,{initial:{y:S>0?18:-18,opacity:.62},animate:{y:0,opacity:1},transition:{duration:.34,ease:[.22,1,.36,1]},className:"relative flex h-[clamp(18.5rem,36vh,22rem)] flex-col gap-2 overflow-hidden",children:er.map((e,n)=>{let t=x.indexOf(e);return(0,r.jsxs)("button",{type:"button",style:4===n?{WebkitMaskImage:"linear-gradient(to bottom, black 0%, rgba(0,0,0,.82) 28%, rgba(0,0,0,.28) 72%, transparent 100%)",maskImage:"linear-gradient(to bottom, black 0%, rgba(0,0,0,.82) 28%, rgba(0,0,0,.28) 72%, transparent 100%)"}:void 0,className:"group/app flex min-h-0 flex-1 min-w-0 flex-col items-stretch rounded-xl border border-white/[0.12] bg-white/[0.018] p-1 text-left transition-[border-color,background-color] hover:border-white/[0.22] hover:bg-white/[0.035] sm:p-1.5",children:[(0,r.jsxs)("span",{"aria-hidden":!0,className:"flex h-[clamp(2.35rem,3.8vw,2.8rem)] w-full flex-col overflow-hidden rounded-lg border border-white/[0.10] bg-[#090b0d] p-1.25",children:[(0,r.jsx)("span",{className:"mb-1 h-1.5 w-full rounded-full bg-white/[0.10]"}),(0,r.jsxs)("span",{className:"grid flex-1 grid-cols-[1fr_1.6fr] gap-1",children:[(0,r.jsx)("span",{className:"rounded bg-[#FC0199]/15"}),(0,r.jsxs)("span",{className:"grid grid-rows-2 gap-1",children:[(0,r.jsx)("span",{className:"rounded bg-white/[0.08]"}),(0,r.jsx)("span",{className:"rounded ".concat(1===t?"bg-[#39FF14]/18":2===t?"bg-[#47FFFF]/12":"bg-[#39FF14]/12")})]})]})]}),(0,r.jsxs)("span",{className:"mt-1.5 min-w-0",children:[(0,r.jsx)("span",{className:"block truncate font-heading text-[0.48rem] font-[500] leading-tight text-white sm:text-[0.58rem] md:text-[0.64rem] lg:text-[0.72rem]",children:e.title}),(0,r.jsxs)("span",{className:"mt-0.5 flex min-w-0 items-center gap-0.5 font-body text-[0.36rem] leading-tight text-white/35 sm:text-[0.42rem] md:text-[0.47rem] lg:gap-1 lg:text-[0.54rem]",children:[(0,r.jsx)("span",{className:"shrink-0 font-mono uppercase tracking-[0.08em] text-white/34",children:e.type}),(0,r.jsx)("span",{className:"text-white/20",children:"\xb7"}
1),(0,r.jsx)("span",{className:"truncate",children:e.subtitle})]})]})]},e.title)})},"apps-".concat(E))})]})]}),G&&(0,r.jsx)("div",{className:"absolute inset-0 z-[160] flex items-center justify-center rounded-[20px] bg-black/70 backdrop-blur-sm",onClick:()=>U(null),children:(0,r.jsxs)("div",{className:"relative w-[min(90%,360px)] overflow-hidden rounded-2xl border border-[#39FF14]/60 bg-black/95 shadow-[0_18px_50px_-12px_rgba(0,0,0,0.85)]",onClick:e=>e.stopPropagation(),children:[(0,r.jsx)("button",{type:"button","aria-label":"Close",onClick:()=>U(null),className:"absolute right-2 top-2 z-10 flex h-7 w-7 items-center justify-center rounded-full bg-black/60 text-white/70 hover:text-white",children:(0,r.jsx)(p.default,{className:"h-4 w-4"})}),(0,r.jsxs)("div",{className:"flex items-center gap-3 p-4 pb-2",children:[(0,r.jsx)("img",{src:G.img,alt:"".concat(G.name," â ").concat(G.title),draggable:!1,loading:"lazy",className:"h-16 w-16 shrink-0 select-none rounded-xl object-cover object-top"}),(0,r.jsxs)("div",{className:"min-w-0 text-left",children:[(0,r.jsx)("span",{className:"block font-heading text-[1.05rem] font-medium leading-tight text-white",children:G.name}),(0,r.jsx)("span",{className:"mt-0.5 block font-mono text-[0.62rem] uppercase tracking-[0.16em] text-[#39FF14]",children:G.title})]})]}),(0,r.jsx)("p",{className:"px-4 pb-3 text-left font-body text-[0.72rem] leading-relaxed text-owl-neutral-inverse-300",children:G.summary}),(0,r.jsx)("div",{className:"flex flex-wrap gap-1.5 px-4 pb-4",children:G.skills.map(e=>(0,r.jsx)("span",{className:"rounded-full border border-white/10 bg-white/[0.04] px-2.5 py-1 font-mono text-[0.6rem] text-owl-neutral-inverse-300",children:e},e))}),(0,r.jsx)("div",{className:"px-4 pb-4",children:(0,r.jsxs)(c.GlassLink,{as:"button",type:"button",surface:!0,sheenSize:110,sheenColor:"#39FF14","aria-label":"Hire ".concat(G.name,", ").concat(G.title),onClick:e=>{e.stopPropagation(),F.push("/parliament/listing/".concat(G.listingId))},className:"flex h-9 w-full items-center justify-center rounded-lg border border-[#39FF14] font-mono text-[0.72rem] font-bold uppercase tracking-[0.16em] text-white transition-colors",children:["Hire ",G.name.split(" ")[0]]})})]})})]})]})}var F=t(92270);let T="smart",z="Nightowl AI",A=(e,n)=>e.sort-n.sort||e.key.localeCompare(n.key),C=e=>({value:e.key,label:e.label,company:e.company});function E(e){let n=new Map;for(let r of e){var t;let e=null!=(t=r.company)?t:"Other",a=n.get(e);a?a.push(r):n.set(e,[r])}return[...n.entries()].map(e=>{let[n,t]=e;return{company:n,models:[...t].sort(A)}}).sort((e,n)=>A(e.models[0],n.models[0])).map(e=>({company:e.company,options:e.models.map(C)}))}function I(e,n,t,r){return{id:e,title:n,groups:r?E(t):[{company:null,options:function(e){let n=new Set;return e.filter(e=>"primary"===e.section).sort(A).filter(e=>{var t;let r=null!=(t=e.company)?t:"Other";return!n.has(r)&&(n.add(r),!0)}).map(C)}(t)}]}}let M={id:"nightowl",title:"Nightowl",groups:[{company:null,options:[{value:"nightowl-ai",label:"Nightowl AI",company:z,note:"Nightowl's house model"},{value:T,label:"Smart Routing",company:z,note:"Best model selected for your prompt",recommended:!0}]}]},O={id:"default",title:null,groups:[{company:null,options:[{value:"",label:"Default",company:z,note:"Best available model for this type",recommended:!0}]}]},_=e=>e.groups.some(e=>e.options.length>0);function L(e,n,t){let r=e.filter(e=>e.modality===n);if("llm"===n){let e=r.filter(e=>e.company!==z);return[M,I("open_source","Open Source",e.filter(e=>e.openSource),t),I("frontier","Frontier",e.filter(e=>!e.openSource),t)].filter(_)}return[O,{id:"media",title:null,groups:[...E(r.filter(e=>"primary"===e.section)),...t?E(r.filter(e=>"more"===e.section)):[]]}].filter(_)}let S=e=>e.reduce((e,n)=>e+n.groups.reduce((e,n)=>e+n.options.length,0),0);var P=t(51797);function R(e){let{muted:n}=e;return(0,r.jsx)(i.P.a,{href:"#platform","aria-label":"Scroll to explore","aria-hidden":n,tabIndex:n?-1:void 0,initial:{opacity:0}
1,animate:{opacity:1},transition:{delay:.8,duration:.6},className:"pointer-events-auto text-owl-neutral-inverse-300 transition-colors duration-300 hover:text-owl-accent-primary",children:(0,r.jsx)(i.P.span,{className:"block",animate:{y:[0,8,0]},transition:{duration:1.7,repeat:1/0,ease:"easeInOut"},children:(0,r.jsx)(l.default,{className:"h-6 w-6",strokeWidth:2.35})})})}let W=[{key:"tokens",verb:"Keep",tail:" your tokens",accent:"#47FFFF",tooltip:(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"block hero-promise-tooltip-line",children:"Take ownership of compute you don't use as"}),(0,r.jsxs)("span",{className:"block hero-promise-tooltip-line",children:[(0,r.jsx)("span",{className:"text-[#47FFFF]",children:"Nightowl Tokens (OWL)"}),", the US-native digital asset"]}),(0,r.jsx)("span",{className:"block hero-promise-tooltip-line",children:"tokenizing AI inference. Nest to earn more."}),(0,r.jsx)("span",{className:"mt-1 block hero-promise-tooltip-line text-owl-neutral-inverse-500",children:"(Coming Soon)"})]})},{key:"agents",verb:"Earn",tail:" from agents",accent:"#39FF14",tooltip:(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"block hero-promise-tooltip-line",children:"Hatch, hire, and monetize AI employees that remember,"}),(0,r.jsxs)("span",{className:"block hero-promise-tooltip-line",children:["form organizations, & use your tools in ",(0,r.jsx)("span",{className:"text-white",children:"Nightowl OS"}),"."]}),(0,r.jsxs)("span",{className:"block hero-promise-tooltip-line",children:["List in the ",(0,r.jsx)("span",{className:"text-[#39FF14]",children:"Parliament Marketplace"})," to earn."]}),(0,r.jsx)("span",{className:"mt-1 block hero-promise-tooltip-line text-owl-neutral-inverse-500",children:"(Beta)"})]})},{key:"models",verb:"Work",tail:" across models",accent:"#FC0199",tooltip:(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)("span",{className:"block",children:["Choose the job, then the model. Chat privately, create media, build apps, compare answers, & run"," ",(0,r.jsx)("span",{className:"font-[700] text-[#FC0199]",children:"Nightowls"})," ","(your native agents) â all using the right model for the work."]}),(0,r.jsxs)("span",{className:"mt-1 block text-owl-neutral-inverse-500",children:["(Identity ",(0,r.jsx)("span",{className:"text-[#FFFF33]",children:"NFTs"})," coming soon)"]})]})}];function B(){let[e,n]=(0,a.useState)(null);return(0,r.jsx)("div",{className:"hero-promise-row relative mt-[clamp(2.4rem,3.8vh,2.85rem)] -translate-y-[1.35rem] grid w-[calc(94vw-2rem)] max-w-[42rem] grid-cols-3 items-start gap-[clamp(0.15rem,0.45vw,0.4rem)] sm:translate-y-0 sm:flex sm:w-auto sm:max-w-none sm:items-start sm:justify-center sm:gap-[2rem] lg:gap-[2.4rem]",children:W.map((t,a)=>{let o=e===t.key;return(0,r.jsxs)("div",{"data-promise-key":t.key,className:"group/promise relative flex min-w-0 justify-center sm:w-auto sm:flex-none",onPointerEnter:e=>{"mouse"===e.pointerType&&n(t.key)},onPointerLeave:e=>{"mouse"===e.pointerType&&n(e=>e===t.key?null:e)},children:[a>0&&(0,r.jsx)("span",{"aria-hidden":!0,className:"pointer-events-none absolute left-[-1rem] top-1/2 hidden h-[0.28125rem] w-[0.28125rem] -translate-x-1/2 -translate-y-1/2 rounded-full bg-owl-accent-primary shadow-[0_0_8px_2px_var(--owl-accent-primary)] sm:block lg:left-[-1.2rem]"}),(0,r.jsx)("button",{type:"button","aria-expanded":o,onClick:()=>n(e=>e===t.key?null:t.key),style:{touchAction:"manipulation",WebkitTapHighlightColor:"transparent"},className:"relative inline-flex w-full min-w-0 flex-col items-center justify-center gap-0 rounded-xl border border-transparent bg-transparent px-[clamp(0.15rem,0.5vw,0.5rem)] py-[clamp(0.3rem,0.6vh,0.48rem)] text-center font-heading text-[clamp(0.86rem,4.15vw,1.04rem)] leading-[1.08] tracking-[-0.025em] shadow-none sm:w-auto sm:text-[clamp(0.98rem,2.6vw,1.18rem)] lg:text-[clamp(1.18rem,1.30vw,1.34rem)] lg:leading-none",children:(0,r.jsx)("span",{className:"block w-full text-center",children:(0,r.jsxs)("span",{"data-bump-active":o?"true":"false",className:"hero-promise-bump relative inline-block font-[400]",children:[(0,r.jsx)("span",{className:"block sm:inline",style:{color:o?t.accent:"#FFFFFF",transition:"color 90ms ease-out"},children:(0,r.jsxs)("span",{className:"relative inline-block",children:[t.verb,(0,r.jsx)("span",{"aria-hidden":"true",className:"hero-mobile-tooltip-marker pointer-events-none absolute right-[-1.18rem] top-[-0.12rem] inline-flex h-[0.90rem] w-[0.90rem] items-center justify-center rounded-full border border-white/[0.30] bg-white/[0.025] shadow-[0_0_7px_rgba(255,255,255,0.05)] sm:hidden",children:(0,r.jsx)("span",{className:"h-[0.40rem] w-px rounded-full bg-white/65"})})]})}),(0,r.jsx)("span",{className:"block text-[#B4B6BD] sm:inline",children:t.tail})]})})}),(0,r.jsx)("div",{role:"tooltip",style:{backgroundColor:"rgba(255,255,255,0.03)"},className:"hero-top-promise-tooltip absolute left-1/2 top-[calc(100%+0.38rem)] z-[12
10] ".concat("tokens"===t.key?"w-[min(19.35rem,86vw)]":"agents"===t.key?"w-[min(21rem,86vw)]":"w-[min(24.75rem,92vw)]"," -translate-x-1/2 rounded-2xl border border-white/[0.10] bg-white/[0.03] px-4 py-3 text-center font-body text-[0.72rem] font-normal leading-relaxed sm:text-[0.76rem] tracking-normal text-owl-neutral-inverse-200 shadow-[0_10px_28px_rgba(0,0,0,0.46)] backdrop-blur-md transition-all duration-200 ").concat(o?"pointer-events-auto translate-y-0 scale-100 opacity-100":"pointer-events-none -translate-y-1 scale-[0.985] opacity-0"),children:t.tooltip})]},t.key)})})}let D="/images/hero-owl-background.webp";function H(e){let{src:n,side:t,isCentered:o,onPrevious:i,onNext:l,onCenterSelf:m,onTwoCenteredPlays:p}=e,c=(0,a.useRef)(null),h=(0,a.useRef)(null),g=(0,a.useRef)(null),u=(0,a.useRef)(null),b=(0,a.useRef)(!1),x=(0,a.useRef)(!1),f=(0,a.useRef)(0),w=(0,a.useRef)(5e3),v=(0,a.useRef)(0),[y,k]=(0,a.useState)(!1),j=e=>{null!==e.current&&(clearTimeout(e.current),e.current=null)},N=()=>{j(h),j(g),j(u)},F=()=>{let e=c.current;if(!e||b.current||(j(h),j(u),e.readyState<2))return;try{e.currentTime=0}catch(e){}let n=e.play();n&&"function"==typeof n.catch&&n.catch(()=>{u.current=setTimeout(()=>{u.current=null,x.current&&F()},350)})},T=e=>{j(h),h.current=setTimeout(()=>{h.current=null,F()},e)};return(0,a.useEffect)(()=>{b.current=window.matchMedia("(prefers-reduced-motion: reduce)").matches;let e=c.current;if(e&&(e.muted=!0,e.defaultMuted=!0,e.playsInline=!0,e.load()),b.current){if(e){e.pause();try{e.currentTime=.001}catch(e){}}return N}return g.current=setTimeout(()=>{g.current=null,x.current=!0,F()},3e3),N},[n]),(0,a.useEffect)(()=>{o||(v.current=0)},[o]),(0,r.jsxs)("div",{className:"hero-fog-protected hero-parliament-video-zone group/parliament-video pointer-events-auto relative block h-full min-h-0 w-full overflow-hidden rounded-[20px] border border-white/[0.11] bg-black/[0.88] shadow-[inset_0_1px_0_rgba(255,255,255,0.055),0_16px_50px_rgba(0,0,0,0.30)] backdrop-blur-xl",onPointerEnter:()=>k(!0),onPointerLeave:()=>k(!1),style:{opacity:y?1:.35,transition:"opacity 350ms ease-out"},children:[(0,r.jsx)("button",{type:"button","aria-label":o?"left"===t?"
1Show Skill Tree Execution":"Return to Parliament Marketplace":"Center ".concat("left"===t?"Organization Execution":"Skill Tree Execution"),onPointerDown:e=>{e.stopPropagation()},onClick:e=>{if(e.stopPropagation(),!o)return void m();i()},className:"hero-outer-carousel-arrow pointer-events-auto absolute left-[clamp(0.72rem,1.25vw,0.95rem)] top-[clamp(0.72rem,1.25vw,0.95rem)] z-[200] flex h-8 w-8 cursor-pointer items-center justify-center rounded-[9px] border border-transparent bg-white/[0.012] text-white/58 transition-[border-color,background-color,color,box-shadow] duration-200 hover:border-white/[0.16] hover:bg-white/[0.045] hover:text-white hover:shadow-[inset_0_0_14px_rgba(255,255,255,0.04),0_5px_16px_rgba(0,0,0,0.28)] focus-visible:border-white/[0.16] focus-visible:bg-white/[0.045] focus-visible:text-white",children:(0,r.jsx)(s.default,{className:"h-4 w-4",strokeWidth:1.55})}),(0,r.jsx)("button",{type:"button","aria-label":o?"left"===t?"Return to Parliament Marketplace":"Show Organization Execution":"Center ".concat("left"===t?"Organization Execution":"Skill Tree Execution"),onPointerDown:e=>{e.stopPropagation()},onClick:e=>{if(e.stopPropagation(),!o)return void m();l()},className:"hero-outer-carousel-arrow pointer-events-auto absolute right-[clamp(0.72rem,1.25vw,0.95rem)] top-[clamp(0.72rem,1.25vw,0.95rem)] z-[200] flex h-8 w-8 cursor-pointer items-center justify-center rounded-[9px] border border-transparent bg-white/[0.012] text-white/58 transition-[border-color,background-color,color,box-shadow] duration-200 hover:border-white/[0.16] hover:bg-white/[0.045] hover:text-white hover:shadow-[inset_0_0_14px_rgba(255,255,255,0.04),0_5px_16px_rgba(0,0,0,0.28)] focus-visible:border-white/[0.16] focus-visible:bg-white/[0.045] focus-visible:text-white",children:(0,r.jsx)(d.default,{className:"h-4 w-4",strokeWidth:1.55})}),(0,r.jsx)("div",{className:"pointer-events-none absolute top-[clamp(0.72rem,1.25vw,0.95rem)] z-[190] flex h-8 items-center justify-center whitespace-nowrap rounded-[9px] border border-white/[0.08] bg-black/75 px-3 text-center font-mono text-[0.62rem] font-medium uppercase leading-none tracking-[0.14em] text-white/80 shadow-[0_6px_18px_rgba(0,0,0,0.36)] backdrop-blur-md ".concat("left"===t?"right-[calc(clamp(0.72rem,1.25vw,0.95rem)+2.45rem)]":"left-[calc(clamp(0.72rem,1.25vw,0.95rem)+2.45rem)]"),children:"left"===t?"Organization Execution":"Skill Tree Execution"}),(0,r.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-0",style:{background:"radial-gradient(ellipse 72% 62% at 50% 48%, rgba(255,255,255,0.025) 0%, rgba(255,255,255,0.010) 48%, transparent 78%)"}}),(0,r.jsx)("div",{className:"absolute inset-0 z-[1] overflow-hidden rounded-[inherit]",children:(0,r.jsx)("video",{ref:c,src:n,muted:!0,playsInline:!0,preload:"auto",tabIndex:-1,onEnded:()=>{if(!b.current){if(o&&(v.current+=1,v.current>=2&&(v.current=0,p())),"left"===t){let e=w.current;w.current=5e3===e?3e3:5e3,T(e);return}f.current+=1,f.current<2?T(0):(f.current=0,T(5e3))}},onCanPlay:()=>{var e;x.current&&(null==(e=c.current)?void 0:e.paused)&&F()},className:"absolute max-w-none select-none object-cover saturate-[0.88] transition-[filter] duration-[350ms] ease-out ".concat("opacity-[0.84] brightness-[0.90]"," group-hover/parliament-video:brightness-100 group-hover/parliament-video:saturate-100"),style:{width:"left"===t?"100%":"calc(100% + 130px)",left:"left"===t?"0px":"-130px",top:"left"===t?"0%":"7%",height:"left"===t?"100%":"112%",objectFit:"left"===t?"contain":"cover",objectPosition:"left"===t?"left center":"center top",willChange:"filter"}})}),"left"===t&&(0,r.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute right-0 top-[8%] z-[30] h-[9rem] w-[8rem]",style:{background:"linear-gradient(to right, transparent 0%, rgba(0,0,0,0.34) 18%, rgba(0,0,0,0.82) 34%, #000 48%, #000 100%)"}}),(0,r.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-10 rounded-[20px]",style:{padding:"1px",background:"linear-gradient(to bottom, rgba(255,255,255,0.20) 0%, rgba(255,255,255,0.10) 5%, rgba(255,255,255,0.045) 16%, rgba(255,255,255,0.025) 100%)",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",maskComposite:"exclude"}})]})}function K(){let[e,n]=(0,a.useState)(1),t=e=>{n(e)};
1return(0,r.jsx)("div",{className:"hero-parliament-carousel-viewport pointer-events-auto relative z-[35] mx-auto w-full overflow-hidden lg:overflow-visible",style:{"--hero-parliament-panel-width":"min(47rem, calc(100vw - 1.25rem))","--hero-parliament-panel-gap":"var(--hero-owl-to-parliament-visible-gap)"},children:(0,r.jsxs)("div",{className:"hero-parliament-framing-row pointer-events-auto relative left-1/2 flex w-max items-stretch transition-transform duration-[520ms] ease-[cubic-bezier(0.22,0.72,0.24,1)]",style:{transform:"translateX(calc(-50% + ".concat(0===e?"calc(var(--hero-parliament-panel-width) + var(--hero-parliament-panel-gap))":2===e?"calc((var(--hero-parliament-panel-width) + var(--hero-parliament-panel-gap)) * -1)":"0px","))"),willChange:"transform"},children:[(0,r.jsx)("div",{className:"relative z-[50] shrink-0 pointer-events-auto",style:{width:"var(--hero-parliament-panel-width)"},children:(0,r.jsx)(H,{src:"/videos/hero-organizations-no-audio.mp4",side:"left",isCentered:0===e,onPrevious:()=>t(2),onNext:()=>t(1),onCenterSelf:()=>t(0),onTwoCenteredPlays:()=>t(1)})}),(0,r.jsx)("div",{"aria-hidden":"true",className:"hero-carousel-scroll-gap relative z-[60] block shrink-0",style:{width:"var(--hero-parliament-panel-gap)"}}),(0,r.jsx)("div",{className:"relative z-[40] shrink-0 pointer-events-auto",style:{width:"var(--hero-parliament-panel-width)"},children:(0,r.jsx)(N,{isOuterCentered:1===e,onOuterPrevious:()=>t(0),onOuterNext:()=>t(2),onOuterCenterSelf:()=>t(1)})}),(0,r.jsx)("div",{"aria-hidden":"true",className:"hero-carousel-scroll-gap relative z-[60] block shrink-0",style:{width:"var(--hero-parliament-panel-gap)"}}),(0,r.jsx)("div",{className:"relative z-[40] shrink-0 pointer-events-auto",style:{width:"var(--hero-parliament-panel-width)"},children:(0,r.jsx)(H,{src:"/videos/hero-skill-tree-no-audio.mp4",side:"right",isCentered:2===e,onPrevious:()=>t(1),onNext:()=>t(0),onCenterSelf:()=>t(2),onTwoCenteredPlays:()=>t(1)})})]})})}function G(e){let{headlineLead:n="Agents you own.",headlineTail:t="Tokens you keep.",tagline:o="Agent Creation. Tokenized Intelligence.",ctaLabel:i="Request Access",ctaHref:l="#mission",fundraisingNote:s="Parliament Marketplace",modelCatalog:d=[]}=e,[m,p]=(0,a.useState)(!1),[c,h]=(0,a.useState)(!1),g=(0,a.useRef)(null),u=(0,a.useRef)({x:-24,y:108}),b=(0,a.useRef)({x:-24,y:108}),x=(0,a.useRef)(null),f=(0,a.useRef)(!0),w=(0,a.useRef)({rx:.01,ry:.01}),v=(0,a.useRef)({rx:.01,ry:.01}),y=(0,a.useRef)(null),k=(0,a.useRef)(!1),j=()=>{let e=g.current;if(!e){x.current=null;return}let n=b.current,t=u.current,r=w.current,a=v.current;if(n.x+=(t.x-n.x)*.095,n.y+=(t.y-n.y)*.095,r.rx+=(a.rx-r.rx)*.1,r.ry+=(a.ry-r.ry)*.1,e.style.setProperty("--fog-x","".concat(n.x,"%")),e.style.setProperty("--fog-y","".concat(n.y,"%")),e.style.setProperty("--fog-rx","".concat(Math.max(.01,r.rx),"rem")),e.style.setProperty("--fog-ry","".concat(Math.max(.01,r.ry),"rem")),.035>Math.abs(t.x-n.x)&&.035>Math.abs(t.y-n.y)&&.02>Math.abs(a.rx-r.rx)&&.02>Math.abs(a.ry-r.ry)){n.x=t.x,n.y=t.y,r.rx=a.rx,r.ry=a.ry,e.style.setProperty("--fog-x","".concat(n.x,"%")),e.style.setProperty("--fog-y","".concat(n.y,"%")),e.style.setProperty("--fog-rx","".concat(Math.max(.01,r.rx),"rem")),e.style.setProperty("--fog-ry","".concat(Math.max(.01,r.ry),"rem")),x.current=null;return}x.current=requestAnimationFrame(j)},N=()=>{null===x.current&&(x.current=requestAnimationFrame(j))},F=(e,n)=>{let t=g.current;if(!t)return;let r=t.getBoundingClientRect();if(!r.width||!r.height)return;let a=Math.max(0,Math.min(100,(e-r.left)/r.width*100)),o=Math.max(0,Math.min(100,(n-r.top)/r.height*100)),i=window.innerWidth>=2300?{rx:14.46,ry:13.9725}:{rx:12.05,ry:11.64375};if(y.current={x:e,y:n},k.current=!1,t.dataset.fogActive="true",f.current){b.current={x:a,y:o},u.current={x:a,y:o},w.current={rx:.01,ry:.01},v.current=i,t.style.setProperty("--fog-x","".concat(a,"%")),t.style.setProperty("--fog-y","".concat(o,"%")),t.style.setProperty("--fog-rx","0.01rem"),t.style.setProperty("--fog-ry","0.01rem"),f.current=!1,N();return}u.current={x:a,y:o},v.current=i,N()};return(0,a.useEffect)(()=>()=>{null!==x.current&&cancelAnimationFrame(x.current)},[]),(0,r.jsxs)("section",{id:"hero",className:"relative isolate w-full min-h-[100dvh] overflow-hidden bg-black pb-[clamp(5rem,11vh,8rem)] pt-16",onPointerMove:e=>{if("touch"===e.pointerType)return;let n=e.currentTarget.getBoundingClientRect(),t=(e.clientX-n.left)/n.width*100,r=(e.clientY-n.top)/n.height*100;h(t>=16&&t<=27.5&&r>=11&&r<=31.5);let a=e.target;if(null==a?void 0:a.closest(".hero-fog-protected")){let n=g.current,t=null==a?void 0:a.closest(".hero-fog-protected");if(n)if(n.dataset.fogActive="false",!k.current&&t){let r=t.getBoundingClientRect(),a=n.getBoundingClientRect();if(a.width&&a.height){let t=e.clientX,o=e.clientY,i=Math.max(r.left,Math.min(r.right,t)),l=Math.max(r.top,Math.min(r.bottom,o)),s=Math.abs(t-r.left),d=Math.abs(r.right-t),m=Math.abs(o-r.top),p=Math.min(s,d,m,Math.abs(r.bottom-o)),c=i,h=l;p===s?c=r.left:p===d?c=r.right:h=p===m?r.top:r.bottom;let g=Math.max(0,Math.min(100,(c-a.left)/a.width*100)),x=Math.max(0,Math.min(100,(h-a.top)/a.height*100));b.current={x:g,y:x},u.current={x:g,y:x},n.style.setProperty("--fog-x","".concat(g,"%")),n.style.setProperty("--fog-y","".concat(x,"%"))}k.current=!0}else u.current={...b.current};v.current={rx:.01,ry:.01},f.current=!0,N();return}F(e.clientX,e.clientY)},onPointerLeave:()=>{h(!1),k.current=!1;let e=g.current;e&&(e.dataset.fogActive="false",u.current={...b.current},v.current={rx:.01,ry:.01},f.current=!0,y.current=null,N())},children:[(0,r.jsx)("div",{"aria-hidden":"true",className:"hero-nature-background pointer-events-none absolute inset-0 z-0 overflow-hidden",children:(0,r.jsxs)("div",{className:"hero-background-plate absolute left-0 top-0 w-full",children:[(0,r.jsx)("div",{className:"hero-nature-background-image absolute inset-0",style:{backgroundImage:'url("'.concat(D,'")')}}),(0,r.jsxs)("div",{ref:g,"aria-hidden":"true","data-fog-active":"false",className:"hero-interactive-atmosphere pointer-events-none absolute inset-0 z-[1]",children:[(0,r.jsx)("div",{className:"hero-interactive-blackout absolute inset-0 z-0"}),(0,r.jsx)("div",{"aria-hidden":"true","data-owl-hovered":c?"true":"false",className:"hero-owl-reveal-base hero-owl-rest-silhouette pointer-events-none absolute inset-0 z-[3]",style:{backgroundImage:'url("'.concat(D,'")')}}),(0,r.jsx)("div",{"aria-hidden":"true","data-owl-hovered":c?"true":"false",className:"hero-owl-reveal-base hero-owl-lower-through-smoke pointer-events-none absolute inset-0 z-[3]",style:{backgroundImage:'url("'.concat(D,'")')}}),(0,r.jsx)("div",{className:"hero-background-fog-mask pointer-events-none absolute inset-0 z-[2] overflow-hidden",children:(0,r.jsx)("video",{src:"/videos/fog-loop-7.mp4",autoPlay:!0,muted:!0,loop:!0,playsInl
1ine:!0,preload:"auto",disablePictureInPicture:!0,"aria-hidden":"true",tabIndex:-1,onLoadedMetadata:e=>{e.currentTarget.defaultPlaybackRate=.5,e.currentTarget.playbackRate=.5},onPlay:e=>{e.currentTarget.playbackRate=.5},className:"hero-background-fog-video pointer-events-none absolute inset-0 h-full w-full select-none"})})]}),(0,r.jsx)("div",{"aria-hidden":"true","data-owl-hovered":c?"true":"false",className:"hero-owl-reveal-base hero-owl-upper-persistent pointer-events-none absolute inset-0 z-[2]",style:{backgroundImage:'url("'.concat(D,'")')}}),(0,r.jsx)("div",{"aria-hidden":"true",className:"hero-moon-darkener pointer-events-none absolute inset-0 z-[3]"}),(0,r.jsx)("div",{"aria-hidden":"true",className:"hero-copy-darkener pointer-events-none absolute inset-0 z-[3]"}),(0,r.jsxs)("div",{className:"hero-cabin-fire-light absolute",children:[(0,r.jsx)("div",{className:"hero-cabin-window-flicker absolute inset-0"}),(0,r.jsx)("div",{className:"hero-cabin-fire-bloom absolute inset-0"}),(0,r.jsx)("div",{className:"hero-cabin-fire-core absolute"}),(0,r.jsx)("div",{className:"hero-cabin-fire-reflection absolute"})]}),(0,r.jsx)("div",{className:"hero-background-bottom-fade absolute inset-x-0 bottom-0"})]})}),(0,r.jsxs)("div",{className:"hero-layout relative z-20 flex w-full flex-col gap-3 py-6 sm:gap-8 sm:py-8 lg:grid lg:h-[calc(100dvh-4rem)] lg:grid-cols-1 lg:grid-rows-[minmax(0,0.45fr)_auto_minmax(0,1.55fr)] lg:gap-0 lg:py-0",children:[(0,r.jsx)("div",{className:"hero-headline-band relative z-50 flex items-center justify-center px-2 sm:px-6 lg:col-start-1 lg:row-start-1",children:(0,r.jsxs)("div",{className:"hero-fog-protected hero-headline-inner flex translate-y-[clamp(0.5rem,0.9vh,0.72rem)] flex-col items-center justify-center text-center",children:[(0,r.jsx)("h1",{className:"mx-auto max-w-[min(96vw,72rem)] whitespace-nowrap text-center font-heading text-[clamp(1.05rem,5vw,1.48rem)] font-[400] leading-[1.04] tracking-[-0.045em] sm:text-[clamp(1.75rem,4.6vw,2.21rem)] lg:text-[clamp(1.73rem,3.05vw,2.21rem)] lg:leading-[1.02]",children:(0,r.jsxs)("span",{className:"group/nest relative inline-block",onPointerEnter:e=>{"mouse"===e.pointerType&&p(!0)},onPointerLeave:e=>{"mouse"===e.pointerType&&p(!1)},children:[(0,r.jsxs)("button",{type:"button","aria-expanded":m,onClick:()=>p(e=>!e),style:{touchAction:"manipulation",WebkitTapHighlightColor:"transparent"},"data-bump-active":m?"true":"false",className:"hero-nest-bump relative inline-block bg-transparent p-0 text-center font-inherit",children:[(0,r.jsx)("span",{className:"text-white",children:"Own"}),(0,r.jsx)("span",{className:"text-[#BFC1C8]",children:" your AI. "}),(0,r.jsx)("span",{className:"text-white",children:"\xa0Privately"}),(0,r.jsx)("span",{className:"text-[#BFC1C8]",children:". "}),(0,r.jsx)("span",{className:"text-[#BFC1C8]",children:"\xa0All in one "}),(0,r.jsx)("span",{className:"text-white",children:"Nest"}),(0,r.jsx)("span",{className:"text-[#BFC1C8]",children:"."}),(0,r.jsx)("span",{"aria-hidden":"true",className:"hero-mobile-tooltip-marker pointer-events-none absolute right-[-1.12rem] top-[-0.30rem] inline-flex h-[0.92rem] w-[0.92rem] items-center justify-center rounded-full border border-white/[0.30] bg-white/[0.025] shadow-[0_0_7px_rgba(255,255,255,0.05)] sm:hidden",children:(0,r.jsx)("span",{className:"h-[0.42rem] w-px rounded-full bg-white/65"})})]}),(0,r.jsxs)("div",{role:"tooltip","aria-hidden":!m,style:{backgroundColor:"rgba(255,255,255,0.03)"},className:"hero-top-promise-tooltip hero-nest-tooltip absolute left-1/2 top-[calc(100%+1.25rem)] z-[130] w-[min(30rem,88vw)] -translate-x-1/2 whitespace-normal break-words [text-wrap:balance] rounded-2xl border border-white/[0.10] bg-white/[0.03] px-4 py-3 text-center font-body text-[0.72rem] font-normal leading-relaxed tracking-normal text-owl-neutral-inverse-200 shadow-[0_10px_28px_rgba(0,0,0,0.46)] transition-all duration-200 sm:text-[0.76rem] ".concat(m?"pointer-events-auto translate-y-0 scale-100 opacity-100":"pointer-events-none -translate-y-1 scale-[0.985] opacity-0"),children:["Your Nest: one private place for all your AI. We don't train on, access or sell your chats. We want to 1) give you one subscription for private chats, ",(0,r.jsx)("span",{className:"font-bold text-[#FC0199]",children:"agents"}),", media, and apps across models, 2) enable you to ",(0,r.jsx)("span",{className:"font-bold text-[#39FF14]",children:"earn"})," from your work, and 3) ",(0,r.jsx)("span",{className:"font-bold text-[#47FFFF]",children:"own"})," your subscription value you don't use each month."]})]})}),(0,r.jsx)(B,{})]})}
1),(0,r.jsxs)("div",{className:"hero-hatch-center relative isolate translate-y-0 flex items-center justify-center px-2 sm:translate-y-[clamp(1.08rem,1.75vh,1.36rem)] sm:px-6 lg:col-start-1 lg:row-start-2 lg:z-10 lg:mt-[clamp(0.15rem,0.35vh,0.30rem)]",children:[(0,r.jsx)("div",{"aria-hidden":"true",className:"hero-pre-owl-reveal-strip pointer-events-auto absolute bottom-full left-0 right-0 z-[5] hidden h-[1.65rem] sm:block lg:h-[1.85rem]",onPointerEnter:e=>{"touch"!==e.pointerType&&F(e.clientX,e.clientY)},onPointerMove:e=>{"touch"!==e.pointerType&&(e.stopPropagation(),F(e.clientX,e.clientY))}}),(0,r.jsx)(ea,{modelCatalog:d})]}),(0,r.jsx)("div",{className:"hero-parliament-band translate-y-[clamp(1.08rem,1.75vh,1.36rem)] mt-0 flex flex-col justify-start px-2 sm:mt-4 sm:px-6 lg:col-start-1 lg:row-start-3 lg:mt-0",children:(0,r.jsx)(K,{})})]}),(0,r.jsxs)("div",{className:"hero-arrows pointer-events-none relative hidden h-6 pt-2 pb-8 box-content lg:block",children:[(0,r.jsx)("div",{className:"pointer-events-auto absolute left-[35%] top-2 -translate-x-1/2",children:(0,r.jsx)(R,{})}),(0,r.jsx)("div",{className:"pointer-events-auto absolute left-[65%] top-2 -translate-x-1/2",children:(0,r.jsx)(R,{muted:!0})})]}),(0,r.jsx)("style",{children:'\n /*\n * SHARED OWL AI / PARLIAMENT SPACING\n * -----------------------------------\n * The horizontal gap between Organization | Parliament | Skill Tree now\n * uses the exact same computed distance as the visible vertical gap from\n * the OWL AI box to the Parliament box.\n *\n * The vertical gap is Parliament\'s margin-top PLUS its small spacer div.\n */\n #hero {\n --hero-owl-to-parliament-visible-gap: 1rem;\n }\n\n\n /*\n * WIDE / SHALLOW DESKTOP FOLD FIT\n * -------------------------------\n * 1920\xd71080-class and similarly shallow wide screens need less dead space\n * above OWL AI. Tighten only the vertical allocation; component sizes and\n * horizontal proportions remain unchanged.\n */\n @media (min-width: 1024px) and (max-height: 1050
1px) {\n #hero .hero-layout {\n grid-template-rows: minmax(0,0.34fr) auto minmax(0,1.66fr) !important;\n }\n\n #hero .hero-headline-inner {\n transform: translateY(clamp(0.12rem,0.25vh,0.24rem)) !important;\n }\n\n #hero .hero-hatch-center {\n margin-top: 0 !important;\n }\n }\n\n /*\n * PARLIAMENT FRAMING CAROUSEL\n * ---------------------------\n * The second Hero row is one horizontal 3-panel carousel:\n * Organization | Parliament | Skill Tree.\n * Parliament is centered by default. Its inset header chevrons slide the\n * adjacent video panels into the center on desktop, tablet, and mobile.\n */\n #hero .hero-parliament-video-zone {\n isolation: isolate;\n backface-visibility: hidden;\n -webkit-backface-visibility: hidden;\n }\n\n @media (min-width: 640px) {\n #hero .hero-parliament-carousel-viewport {\n --hero-parliament-panel-width: min(47rem, calc(100vw - 3rem)) !important;\n }\n }\n\n #hero .hero-outer-carousel-arrow {\n pointer-events: auto !important;\n -webkit-tap-highlight-color: transparent;\n }\n\n #hero .hero-parliament-video-zone {\n pointer-events: auto !important;\n position: relative;\n z-index: 40;\n }\n\n #hero .hero-parliament-framing-row,\n #hero .hero-parliament-carousel-viewport {\n pointer-events: auto;\n }\n\n #hero .hero-parliament-framing-row > div {\n pointer-events: auto;\n }\n\n /*\n * CAROUSEL GAP SCROLL CUES\n * ------------------------\n * These live inside the two REAL horizontal gap columns, so they cannot\n * drift away from the midpoint as panel widths/gaps or carousel position change.\n */\n #hero .hero-carousel-scroll-gap {\n align-self: stretch;\n min-width: var(--hero-parliament-panel-gap);\n }\n\n #hero .hero-carousel-scroll-gap > div {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n /*\n * FOLD-LOCKED CAROUSEL CHEVRONS\n * -----------------------------\n * These are viewport-fixed rather than sticky inside the tall Parliament row.\n * That avoids the browser placing them below the visible fold. The vertical\n * offset is deliberately conservative: about 72 rendered pixels above the fold.\n *\n * The site\'s body zoom changes the effective viewport coordinate system, so\n * use the same inverse-zoom fractions already used elsewhere in the Hero.\n */\n #hero .hero-carousel-fixed-cues {\n top: calc(100dvh - 5.25rem);\n height: 2rem;\n }\n\n @media (min-width: 1280px) {\n #hero .hero-carousel-fixed-cues {\n top: calc(95.2381dvh - 5.0rem);\n }\n }\n\n @media (min-width: 1450px) {\n #hero .hero-carousel-fixed-cues {\n top: calc(90.9091dvh - 4.8rem);\n }\n }\n\n @media (min-width: 1600px) {\n #hero .hero-carousel-fixed-cues {\n top: calc(86.9565dvh - 4.6rem);\n }\n }\n\n @media (min-width: 1760px) {\n #hero .hero-carousel-fixed-cues {\n top: calc(83.3333dvh - 4.45rem);\n }\n }\n\n @media (min-width: 1920px) {\n #hero .hero-carousel-fixed-cues {\n top: calc(80dvh - 4.3rem);\n }\n }\n\n @media (min-width: 2300px) {\n #hero .hero-carousel-fixed-cues {\n top: calc(76.9231dvh - 4.15rem);\n }\n }\n\n @media (min-width: 2800px) {\n #hero .hero-carousel-fixed-cues {\n top: calc(74.0741dvh - 4.0rem);\n }\n }\n\n #hero .hero-carousel-fixed-cue {\n top: 0;\n }\n\n /*\n * CINEMATIC NIGHTOWL BACKGROUND\n * -----------------------------\n * Uses the supplied production WebP as the static plate with layered,\n * independent fog motion over it. The middle stays intentionally near-black\n * so the headline, promise row and OWL AI box remain the focal hierarchy.\n */\n #hero .hero-background-plate {\n /* Source artwork is 16:9. This preserves the entire composition and\n makes its width exactly equal to the hero width at every resolution. */\n aspect-ratio: 16 / 9;\n height: auto;\n z-index: 0;\n }\n\n #hero .hero-nature-background-image {\n background-size: 100% 100%;\n background-repeat: no-repeat;\n background-position: center top;\n opacity: 1;\n transform: none;\n filter: none;\n }\n\n /*\n * LOCAL BACKGROUND HIERARCHY\n * --------------------------\n * Moon: a tight 25%-black core over the moon, feathered outward so there\n * is no visible painted circle.\n *\n * Hero copy: a broad 25%-black elliptical pocket centered behind\n * "Own your AI..." + the promise row, fading naturally into the night sky.\n */\n /*\n * LEFT TREE + OWL VISUAL BALANCE\n * ------------------------------\n * One continuous feathered dimmer replaces the previous separate trunk\n * shadow and right-side owl light. It lowers the visual weight of the\n * entire left tree canopy while also gently correcting the owl itself:\n * because the baked owl is brighter on its LEFT side, the left-to-right\n * falloff darkens that side a little more and equal
1izes the logo.\n *\n * There are no hard edges or local boxes around the owl.\n */\n #hero .hero-moon-darkener {\n /*\n * Keep the darkener tightly confined to the visible lunar disc.\n * A broader ellipse was tinting the cloud bank asymmetrically, making\n * the clouds left of the moon look unnaturally darker than the right.\n */\n background:\n radial-gradient(\n ellipse 4.6% 8.2% at 82.8% 20.5%,\n rgba(0,0,0,0.50) 0%,\n rgba(0,0,0,0.50) 40%,\n rgba(0,0,0,0.30) 56%,\n rgba(0,0,0,0.12) 70%,\n rgba(0,0,0,0.035) 82%,\n transparent 100%\n );\n }\n\n #hero .hero-copy-darkener {\n /*\n * Plate-relative darkeners are disabled. They drift vertically when the\n * viewport aspect ratio changes. The headline and promise-row darkeners\n * below are attached directly to the text rows themselves.\n */\n background: none;\n }\n\n /*\n * ROW-LOCKED COPY DARKENERS\n * -------------------------\n * These follow the real rendered text rows at every resolution.\n * They protect readability during mouse reveal, while leaving the entire\n * gap below Keep/Earn/Work available for the background reveal.\n */\n #hero .hero-headline-inner h1,\n #hero .hero-promise-row {\n position: relative;\n isolation: isolate;\n }\n\n #hero .hero-headline-inner h1::before {\n content: "";\n pointer-events: none;\n position: absolute;\n z-index: -1;\n left: -12%;\n right: -12%;\n top: -0.62em;\n bottom: -0.62em;\n border-radius: 999px;\n filter: blur(10px);\n background:\n radial-gradient(\n ellipse 58% 72% at 50% 50%,\n rgba(0,0,0,0.82) 0%,\n rgba(0,0,0,0.76) 34%,\n rgba(0,0,0,0.58) 50%,\n rgba(0,0,0,0.34) 65%,\n rgba(0,0,0,0.14) 78%,\n rgba(0,0,0,0.04) 88%,\n transparent 100%\n );\n }\n\n #hero .hero-promise-row::before {\n content: "";\n pointer-events: none;\n position: absolute;\n z-index: -1;\n left: -16%;\n right: -16%;\n top: -0.48em;\n bottom: -0.78em;\n border-radius: 999px;\n filter: blur(10px);\n background:\n radial-gradient(\n ellipse 62% 72% at 50% 42%,\n rgba(0,0,0,0.76) 0%,\n rgba(0,0,0,0.70) 34%,\n rgba(0,0,0,0.52) 50%,\n rgba(0,0,0,0.30) 65%,\n rgba(0,0,0,0.12) 78%,\n rgba(0,0,0,0.035) 88%,\n transparent 100%\n );\n }\n\n /*\n * INTERACTIVE DARK FOG\n * --------------------\n * A uniform black veil + the existing smoke video sit above the woodland.\n * The veil has NO vertical reveal gradient. Instead, a soft elliptical CSS\n * mask follows the pointer and removes the atmosphere locally, revealing\n * the untouched background image underneath.\n *\n * Registered custom properties let Chromium ease the mask behind the mouse\n * slightly, which creates a smoke-displacement feel without a canvas or an\n * always-running JavaScript animation loop.\n */\n @property --fog-x {\n syntax: "<percentage>";\n inherits: true;\n initial-value: -24%;\n }\n\n @property --fog-y {\n syntax: "<percentage>";\n inherits: true;\n initial-value: 108%;\n }\n\n @property --fog-rx {\n syntax: "<length>";\n inherits: true;\n initial-value: 15rem;\n }\n\n @property --fog-ry {\n syntax: "<length>";\n inherits: true;\n initial-value: 12rem;\n }\n\n #hero .hero-interactive-atmosphere {\n --fog-x: -24%;\n --fog-y: 108%;\n --fog-rx: 0.01rem;\n --fog-ry: 0.01rem;\n }\n\n /*\n * TRUE REVEAL HOLE\n * ----------------\n * Apply the same mask to the blackout and an UNTRANSFORMED wrapper\n * around the smoke video. The video itself is shifted/scaled to move dense\n * smoke upward; masking the transformed video directly would displace the\n * reveal hole away from the mouse. The wrapper keeps both holes in the\n * exact same Hero coordinate system.\n * The long outer feather keeps the transition fog-like instead of looking\n * like a circular flashlight.\n * The visual center is biased upward by 10% of the current vertical radius,\
1n * keeping the pointer reveal focused more on the owl head than the body.\n */\n #hero .hero-interactive-blackout,\n #hero .hero-background-fog-mask {\n -webkit-mask-image:\n radial-gradient(\n ellipse var(--fog-rx) var(--fog-ry) at var(--fog-x) calc(var(--fog-y) - 1.164375rem),\n transparent 0%,\n transparent 34%,\n rgba(0,0,0,0.035) 43%,\n rgba(0,0,0,0.10) 52%,\n rgba(0,0,0,0.22) 61%,\n rgba(0,0,0,0.39) 70%,\n rgba(0,0,0,0.58) 79%,\n rgba(0,0,0,0.74) 87%,\n rgba(0,0,0,0.88) 94%,\n #000 100%\n );\n mask-image:\n radial-gradient(\n ellipse var(--fog-rx) var(--fog-ry) at var(--fog-x) calc(var(--fog-y) - 1.164375rem),\n transparent 0%,\n transparent 34%,\n rgba(0,0,0,0.035) 43%,\n rgba(0,0,0,0.10) 52%,\n rgba(0,0,0,0.22) 61%,\n rgba(0,0,0,0.39) 70%,\n rgba(0,0,0,0.58) 79%,\n rgba(0,0,0,0.74) 87%,\n rgba(0,0,0,0.88) 94%,\n #000 100%\n );\n will-change: -webkit-mask-image, mask-image;\n }\n\n #hero .hero-interactive-atmosphere[data-fog-active="false"] {\n /* Position and radius are eased by the lightweight RAF low-pass above. */\n }\n\n #hero .hero-interactive-blackout {\n /*\n * The prior 76% full-screen veil was still making the left-side tree\n * read like it had a separate black patch even after the dedicated\n * left-tree dimmer was removed. Back it off so branch structure is\n * visible at rest; the tighter copy darkener below still protects text.\n */\n background: rgba(0,0,0,0.62);\n }\n\n /*\n * PERSISTENT OWL PEEK\n * -------------------\n * A subtle local copy of the original plate keeps the owl/logo readable\n * through the resting fog without exposing the surrounding woodland.\n */\n /*\n * SPLIT OWL REVEAL\n * ----------------\n * The upper owl stays above the fog for brand readability.\n * The lower owl sits beneath the real smoke footage so the moving fog\n * naturally covers and reveals the body over time.\n */\n #hero .hero-owl-reveal-base {\n background-size: 100% 100%;\n background-position: center top;\n background-repeat: no-repeat;\n opacity: 1;\n filter: saturate(0) brightness(0.90) contrast(1.02);\n transition: filter 240ms ease-out;\n }\n\n #hero .hero-owl-reveal-base[data-owl-hovered="true"] {\n filter: saturate(0) brightness(1.68) contrast(1.08);\n }\n\n /*\n * Lower body gets a modest independent lift because it now sits beneath\n * the real smoke video. This keeps the fog visibly in front while making\n * the chest / wings / feet easier to perceive through thinner smoke.\n */\n #hero .hero-owl-lower-through-smoke {\n opacity: 1;\n filter: saturate(0) brightness(1.18) contrast(1.035);\n }\n\n #hero .hero-owl-lower-through-smoke[data-owl-hovered="true"] {\n filter: saturate(0) brightness(1.68) contrast(1.08);\n }\n\n /*\n * RESTING OWL SILHOUETTE\n * ----------------------\n * Keep a dim grayscale hint of the lower body / feet / branch visible\n * through the black veil so users know there is more owl to reveal.\n * This layer stays beneath the moving fog and brightens on desktop hover.\n */\n #hero .hero-owl-rest-silhouette {\n opacity: 1;\n filter: saturate(0) brightness(0.82) contrast(1.02);\n transition: opacity 240ms ease-out, filter 240ms ease-out;\n -webkit-mask-image:\n radial-gradient(\n ellipse 3.905% 7.514% at 21.25% 24.214%,\n #000 0%,\n #000 34%,\n rgba(0,0,0,0.88) 52%,\n rgba(0,0,0,0.58) 70%,\n rgba(0,0,0,0.28) 84%,\n transparent 100%\n );\n mask-image:\n radial-gradient(\n ellipse 3.905% 7.514% at 21.25% 24.214%,\n #000 0%,\n #000 34%,\n rgba(0,0,0,0.88) 52%,\n rgba(0,0,0,0.58) 70%,\n rgba(0,0,0,0.28) 84%,\n transparent 100%\n );\n }\n\n #hero .hero-owl-rest-silhouette[data-owl-hovered="true"] {\n opacity: 1;\n filter: saturate(0) brightness(1.68) contrast(1.08);\n }\n\n /* Head / sunglasses / upper chest: always readable above the fog. */\n #hero .hero-owl-upper-persistent {\n -webkit-mask-image:\n radial-gradient(\n ellipse 3.50% 4.65% at 21.10% 18.45%,\n #000 0%,\n #000 38%,\n rgba(0,0,0,0.96) 48%,\n rgba(0,0,0,0.80) 60%,\n rgba(0,0,0,0.56) 72%,\n rgba(0,0,0,0.34) 83%,\n rgba(0,0,0,0.14) 92%,\n transparent 100%\n );\n mask-image:\n radial-gradient(\n ellipse 3.50% 4.65% at 21.10% 18.45%,\n #000 0%,\n #000 38%,\n rgba(0,0,0,0.96) 48%,\n rgba(0,0,0,0.80) 60%,\n rgba(0,0,0,0.56) 72%,\n rgba(0,0,0,0.34) 83%,\n rgba(0,0,0,0.14) 92%,\n transparent 100%\n );\n }\n\n /* Lower body: same previously approved reveal size, but physically placed\n underneath the smoke layer so the video itself controls visibility. */\n #hero .hero-owl-lower-through-smoke {\n -webkit-mask-image:\n radial-gradient(\n ellipse 2.80% 3.3665625% at 21.25% 19.5165625%,\n #000 0%,\n #000 42%,\n rgba(0,0,0,0.98) 52%,\n rgba(0,0,0,0.82) 64%,\n rgba(0,0,0,0.54) 77%,\n rgba(0,0,0,0.24) 88%,\n transparent 100%\n );\n mask-image:\n radial-gradient(\n ellipse 2.80% 3.3665625% at 21.25% 19.5165625%,\n #000 0%,\n #000 42%,\n rgba(0,0,0,0.98) 52%,\n rgba(0,0,0,0.82) 64%,\n rgba(0,0,0,0.54) 77%,\n rgba(0,0,0,0.24) 88%,\n transparent 100%\n );\n }\n\n /*\n * TABLET ATMOSPHERE\n * -----------------\n * On tablets, hide the static woodland background entirely and keep only\n * the mov
1ing fog / atmospheric treatment. This avoids any misplaced baked\n * owl while preserving the smoky cinematic look.\n */\n /*\n * Extended below 640px too (was tablet-only): the plate is width-fitted\n * at 16:9, so on phones it is only ~210-350px tall and the fixed 64px\n * navbar decapitates the baked owl â Pro-Max-width phones showed just\n * the talons poking out under the bar. Same "misplaced baked owl"\n * problem this rule already solved for tablets.\n */\n @media (max-width: 1023px) {\n #hero .hero-nature-background-image {\n display: none !important;\n }\n\n #hero .hero-owl-upper-persistent,\n #hero .hero-owl-lower-through-smoke,\n #hero .hero-owl-rest-silhouette {\n display: none !important;\n }\n\n /*\n * No reveal hole on tablet because there is no static image underneath\n * to reveal. Keep the fog and blackout continuous across the Hero.\n */\n #hero .hero-interactive-blackout,\n #hero .hero-background-fog-mask {\n -webkit-mask-image: none !important;\n mask-image: none !important;\n }\n }\n\n /*\n * PROTECTED UI ZONES\n * ------------------\n * OWL AI, Parliament, both execution-video panels, AND the complete\n * headline/promise region suppress the background reveal while the pointer\n * is inside them. Because headline + Keep/Earn/Work share one protected\n * wrapper, the entire vertical space BETWEEN those two text rows is also\n * protected. The class is only used for hit-testing; it does not alter\n * visual styling.\n */\n #hero .hero-fog-protected {\n pointer-events: auto;\n }\n\n /*\n * REVEAL STRIP ABOVE OWL AI\n * -------------------------\n * This invisible hit area occupies roughly one row of text immediately\n * above the OWL AI shell. It is intentionally NOT fog-protected, so the\n * normal pointer reveal remains available in that otherwise empty band.\n * It changes interaction only â never spacing or visual layout.\n */\n #hero .hero-pre-owl-reveal-strip {\n background: transparent;\n }\n\n #hero .hero-background-fog-video {\n object-fit: cover;\n object-position: center center;\n\n /*\n * Bring the denser lower portion of the existing smoke footage upward\n * into the headline / Keep-Earn-Work region. A modest scale prevents an\n * empty strip from appearing at the bottom while the upward translation\n * makes the upper half of the Hero visibly foggier.\n */\n opacity: 0.95;\n filter: brightness(0.705) contrast(1.16);\n mix-blend-mode: screen;\n transform: translate3d(0,-15%,0) scale(1.20);\n transform-origin: 50% 50%;\n\n /*\n * No second mask here: the interactive reveal mask above is the single\n * source of truth. This guarantees a fully clear mouse pocket through\n * BOTH the blackout and fog video.\n */\n backface-visibility: hidden;\n -webkit-backface-visibility: hidden;\n }\n\n #hero .hero-background-bottom-fade {\n height: 30%;\n z-index: 4;\n background:\n linear-gradient(\n to bottom,\n rgba(0,0,0,0) 0%,\n rgba(0,0,0,0.12) 28%,\n rgba(0,0,0,0.46) 62%,\n rgba(0,0,0,0.86) 88%,\n #000 100%\n );\n }\n\n #hero .hero-fog-layer {\n pointer-events: none;\n background-repeat: no-repeat;\n mix-blend-mode: screen;\n will-change: transform, opacity;\n transform: translate3d(0,0,0);\n }\n\n #hero .hero-fog-layer-a {\n opacity: 0.24;\n filter: blur(30px);\n background:\n radial-gradient(ellipse 32% 18% at 18% 58%, rgba(207,220,232,0.22) 0%, rgba(170,187,202,0.11) 42%, transparent 72%),\n radial-gradient(ellipse 38% 20% at 62% 63%, rgba(190,205,219,0.18) 0%, rgba(151,169,186,0.08) 46%, transparent 74%),\n radial-gradient(ellipse 26% 15% at 86% 52%, rgba(211,221,232,0.16) 0%, transparent 70%);\n animation: hero-fog-drift-a 18s ease-in-out infinite alternate;\n }\n\n #hero .hero-fog-layer-b {\n opacity: 0.17;\n filter: blur(42px);\n background:\n radial-gradient(ellipse 34% 16% at 35% 42%, rgba(205,218,230,0.16) 0%, rgba(162,179,194,0.07) 44%, transparent 74%),\n radial-gradient(ellipse 30% 14% at 74% 38%, rgba(215,225,235,0.13) 0%, transparent 72%),\n radial-gradient(ellipse 22% 12% at 52% 74%, rgba(188,205,220,0.11) 0%, transparent 72%);\n animation: hero-fog-drift-b 26s ease-in-out infinite alternate;\n }\n\n #hero .hero-fog-layer-c {\n opacity: 0.12;\n filter: blur(50px);\n background:\n radial-gradient(ellipse 42% 14% at 20% 78%, rgba(227,233,240,0.15) 0%, transparent 72%),\n radial-gradient(ellipse 38% 13% at 74% 82%, rgba(217,225,235,0.13) 0%, transparent 72%);\n animation: hero-fog-drift-c 32s ease-in-out infinite alternate;\n }\n\n /*\n * Ridge fog: a little faster than the broad valley fog, so gusts appear\n * to pull mist between the mountain layers rather than sliding one flat\n * cloud sheet across the whole image.\n */\n #hero .hero-fog-ridge {\n opacity: 0.18;\n filter: blur(26px);\n background:\n radial-gradient(ellipse 28% 10% at 13% 50%, rgba(218,229,239,0.19) 0%, rgba(177,194,209,0.07) 48%, transparent 75%),\n radial-gradient(ellipse 34% 11% at 47% 5
15%, rgba(224,233,241,0.15) 0%, rgba(169,187,202,0.055) 52%, transparent 76%),\n radial-gradient(ellipse 29% 10% at 82% 51%, rgba(215,226,237,0.16) 0%, transparent 74%);\n animation: hero-fog-ridge-drift 15s cubic-bezier(.42,0,.58,1) infinite alternate;\n }\n\n /*\n * Lake skim: very low horizontal mist moving independently across the\n * water surface. It remains below the focal UI visually.\n */\n #hero .hero-fog-lake {\n opacity: 0.17;\n filter: blur(23px);\n background:\n radial-gradient(ellipse 44% 8% at 5% 79%, rgba(231,237,243,0.18) 0%, rgba(192,207,220,0.055) 48%, transparent 74%),\n radial-gradient(ellipse 52% 8% at 48% 82%, rgba(224,232,240,0.15) 0%, rgba(181,199,214,0.04) 50%, transparent 77%),\n radial-gradient(ellipse 40% 8% at 92% 76%, rgba(234,239,244,0.16) 0%, transparent 72%);\n animation: hero-fog-lake-drift 22s ease-in-out infinite alternate;\n }\n\n /*\n * Wind veils: stretched, nearly transparent wisps. They move faster than\n * the fog and in slightly different vertical directions, creating the\n * impression that a cold wind is actively shaping the atmosphere.\n */\n #hero .hero-wind-layer {\n pointer-events: none;\n mix-blend-mode: screen;\n will-change: transform, opacity;\n transform: translate3d(0,0,0);\n }\n\n #hero .hero-wind-layer-a {\n opacity: 0.10;\n filter: blur(16px);\n background:\n linear-gradient(106deg, transparent 0%, transparent 24%, rgba(208,222,234,0.11) 38%, transparent 51%, transparent 100%),\n linear-gradient(101deg, transparent 0%, transparent 51%, rgba(221,231,239,0.075) 62%, transparent 74%, transparent 100%);\n animation: hero-wind-sweep-a 12s ease-in-out infinite alternate;\n }\n\n #hero .hero-wind-layer-b {\n opacity: 0.068;\n filter: blur(22px);\n background:\n linear-gradient(78deg, transparent 0%, transparent 18%, rgba(196,213,227,0.09) 31%, transparent 44%, transparent 100%),\n linear-gradient(83deg, transparent 0%, transparent 58%, rgba(218,229,238,0.07) 70%, transparent 82%, transparent 100%);\n animation: hero-wind-sweep-b 17s ease-in-out infinite alternate;\n }\n\n /*\n * HERO PAINT ISOLATION\n * --------------------\n * Keep all atmospheric animation inside the hero\'s paint/compositor scope.\n * The previous full-screen canvas + JS fire loops forced frequent large\n * repaints that could make the fixed navbar sheen/icons flicker, especially\n * with the site\'s body zoom. No requestAnimationFrame loops remain.\n */\n #hero .hero-nature-background {\n contain: paint;\n isolation: isolate;\n }\n\n /*\n * CINEMATIC LIVE MIST\n * -------------------\n * The prior pass used single soft ellipses, which read like moving smudges.\n * These are long irregular fog ribbons made from many overlapping cloud\n * pockets. Each layer has a different density, height, direction and speed.\n * Only transform is animated, so this remains compositor-friendly and does\n * not reintroduce the fixed-navbar repaint problem.\n */\n #hero .hero-live-fog {\n z-index: 3;\n pointer-events: none;\n will-change: transform;\n backface-visibility: hidden;\n -webkit-backface-visibility: hidden;\n transform: translate3d(0,0,0);\n background-repeat: no-repeat;\n }\n\n /*\n * HIGH LEFT MIST â prominent around the owl/tree.\n * Multiple cool silver pockets create gaps and curls instead of one blob.\n */\n #hero .hero-live-fog-a {\n left: -82vw;\n top: 4%;\n width: 78vw;\n height: 30%;\n opacity: 0.62;\n filter: blur(13px);\n background:\n radial-gradient(ellipse 18% 32% at 8% 54%, rgba(199,216,230,0.34) 0%, rgba(176,198,216,0.18) 38%, transparent 72%),\n radial-gradient(ellipse 25% 38% at 22% 43%, rgba(210,224,235,0.30) 0%, rgba(170,194,213,0.14) 43%, transparent 73%),\n radial-gradient(ellipse 16% 25% at 38% 63%, rgba(188,208,224,0.26) 0%, rgba(154,182,203,0.10) 45%, transparent 72%),\n radial-gradient(ellipse 28% 34% at 51% 39%, rgba(207,221,232,0.29) 0%, rgba(171,193,211,0.12) 43%, transparent 74%),\n radial-gradient(ellipse 19% 28% at 68% 58%, rgba(188,207,223,0.24) 0%, rgba(157,181,201,0.09) 44%, transparent 72%),\n radial-gradient(ellipse 24% 31% at 83% 42%, rgba(216,228,237,0.25) 0%, rgba(176,197,214,0.10) 42%, transparent 74%),\n radial-gradient(ellipse 13% 22% at 95% 65%, rgba(186,207,223,0.20) 0%, transparent 70%);\n -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 19%, #000 78%, transparent 100%);\n mask-image: linear-gradient(to bottom, transparent 0%, #000 19%, #000 78%, transparent 100%);\n animation: hero-live-fog-a 26s linear infinite;\n }\n\n /*\n * DARK MID-DEPTH FOG â the key "night fog" layer.\n * It doesn\'t look gray; it acts like drifting shadow and briefly swallows\n * pieces of the forest/mountains before releasing them again.\n */\n #hero .hero-live-fog-b {\n right: -88vw;\n top: 17%;\n width: 82vw;\n height: 38%;\n opacity: 0.78;\n filter: blur(18px);\n background:\n radial-gradient(ellipse 22% 30% at 7% 48%, rgba(0,0,0,0.76) 0%, rgba(0,0,0,0.43) 43%, transparent 73%),\n radial-gradient(ellipse 31% 42% at 24% 61%, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.34) 45%, transparent 75%),\n radial-gradient(ellipse 18% 28% at 39% 39%, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.30) 46%, transparent 72%),\n radial-gradient(ellipse 34% 39% at 53% 58%, rgba(0,0,0,0.64) 0%, rgba(0,0,0,0.31) 44%, transparent 76%),\n radial-gradient(ellipse 20% 31% at 70% 41%, rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.32) 44%, transparent 73%),\n radial-gradient(ellipse 30% 37% at 86% 59%, rgba(0,0,0,0.66) 0%, rgba(0,0,0,0.27) 45%, transparent 75%),\n radial-gradient(ellipse 15% 24% at 98% 38%, rgba(0,0,0,0.62) 0%, transparent 71%);\n -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 15%, #000 82%, transparent 100%);\n mask-image: linear-gradient(to bottom, transparent 0%, #000 15%, #000 82%, transparent 100%);\n animation: hero-live-fog-b 34s linear infinite;\n }\n\n /*\n * VALLEY MIST â flatter, whiter and lower, like moisture collecting just\n * above the tree line. This gives the background actual atmospheric planes.\n */\n #hero .hero-live-fog-c {\n left: -96vw;\n top: 43%;\n width: 90vw;\n height: 27%;\n opacity: 0.50;\n filter: blur(15px);\n background:\n radial-gradient(ellipse 25% 22% at 5% 56%, rgba(210,223,233,0.26) 0%, rgba(177,197,213,0.12) 42%, transparent 73%),\n radial-gradient(ellipse 35% 26% at 24% 47%, rgba(198,214,227,0.27) 0%, rgba(165,188,207,0.11) 43%, transparent 76%),\n radial-gradient(ellipse 21% 20% at 43% 61%, rgba(217,228,237,0.23) 0%, rgba(178,199,215,0.09) 43%, transparent 72%),\n radial-gradient(ellipse 37% 27% at 60% 46%, rgba(198,215,228,0.25) 0%, rgba(164,188,207,0.10) 44%, transparent 76%),\n radial-gradient(ellipse 24% 21% at 79% 59%, rgba(216,227,236,0.22) 0%, rgba(178,198,214,0.08) 44%, transparent 73%),\n radial-gradient(ellipse 29% 24% at 95% 45%, rgba(195,213,227,0.22) 0%, transparent 73%);\n -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 24%, #000 72%, transparent 100%);\n mask-image: linear-gradient(to bottom, transparent 0%, #000 24%, #000 72%, transparent 100%);\n animation: hero-live-fog-c 39s linear infinite;\n }\n\n /*\n * LOW DARK GROUND FOG â moves behind Parliament and across the lake/rocks.\n * It is broad and low-contrast, mostly perceived as depth changes.\n */\n #hero .hero-live-fog-d {\n right: -100vw;\n top: 62%;\n width: 94vw;\n height: 24%;\n opacity: 0.68;\n filter: blur(17px);\n background:\n radial-gradient(ellipse 29% 24% at 9% 52
1%, rgba(0,0,0,0.58) 0%, rgba(0,0,0,0.26) 45%, transparent 74%),\n radial-gradient(ellipse 39% 28% at 29% 60%, rgba(0,0,0,0.62) 0%, rgba(0,0,0,0.28) 45%, transparent 76%),\n radial-gradient(ellipse 24% 22% at 49% 43%, rgba(0,0,0,0.53) 0%, rgba(0,0,0,0.22) 44%, transparent 73%),\n radial-gradient(ellipse 40% 29% at 68% 58%, rgba(0,0,0,0.60) 0%, rgba(0,0,0,0.27) 44%, transparent 76%),\n radial-gradient(ellipse 27% 23% at 89% 45%, rgba(0,0,0,0.55) 0%, transparent 73%);\n -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 22%, #000 76%, transparent 100%);\n mask-image: linear-gradient(to bottom, transparent 0%, #000 22%, #000 76%, transparent 100%);\n animation: hero-live-fog-d 46s linear infinite;\n }\n\n /*\n * FAST WIND WISP â thin and broken. This is the cue that tells the eye the\n * air itself is moving, without making the whole scene look stormy.\n */\n #hero .hero-live-fog-e {\n left: -68vw;\n top: 21%;\n width: 62vw;\n height: 13%;\n opacity: 0.42;\n filter: blur(9px);\n background:\n radial-gradient(ellipse 18% 28% at 9% 55%, rgba(221,231,239,0.27) 0%, transparent 69%),\n radial-gradient(ellipse 24% 34% at 30% 42%, rgba(194,213,228,0.24) 0%, rgba(163,190,209,0.08) 43%, transparent 72%),\n radial-gradient(ellipse 15% 24% at 51% 62%, rgba(222,232,240,0.22) 0%, transparent 68%),\n radial-gradient(ellipse 27% 36% at 73% 44%, rgba(193,212,226,0.21) 0%, rgba(160,186,206,0.07) 44%, transparent 72%),\n radial-gradient(ellipse 14% 23% at 94% 58%, rgba(218,229,238,0.19) 0%, transparent 68%);\n -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 26%, #000 70%, transparent 100%);\n mask-image: linear-gradient(to bottom, transparent 0%, #000 26%, #000 70%, transparent 100%);\n animation: hero-live-fog-e 20s linear infinite;\n }\n\n @keyframes hero-live-fog-a {\n 0% { transform: translate3d(0, 0, 0); }\n 50% { transform: translate3d(92vw, 1.8vh, 0); }\n 100% { transform: translate3d(188vw, -0.8vh, 0); }\n }\n\n @keyframes hero-live-fog-b {\n 0% { transform: translate3d(0, 0, 0); }\n 50% { transform: translate3d(-98vw, -1.2vh, 0); }\n 100% { transform: translate3d(-198vw, 0.8vh, 0); }\n }\n\n @keyframes hero-live-fog-c {\n 0% { transform: translate3d(0, 0, 0); }\n 50% { transform: translate3d(102vw, -0.8vh, 0); }\n 100% { transform: translate3d(206vw, 0.6vh, 0); }\n }\n\n @keyframes hero-live-fog-d {\n 0% { transform: translate3d(0, 0, 0); }\n 50% { transform: translate3d(-104vw, 0.5vh, 0); }\n 100% { transform: translate3d(-212vw, -0.5vh, 0); }\n }\n\n @keyframes hero-live-fog-e {\n 0% { transform: translate3d(0, 0, 0) skewX(-2deg); }\n 50% { transform: translate3d(94vw, -1.4vh, 0) skewX(1deg); }\n 100% { transform: translate3d(192vw, 0.7vh, 0) skewX(-1deg); }\n }\n\n /*\n * DARK MOVING FOG OVERLAY\n * -----------------------\n * Unlike the pale mist layers, these large translucent black cloud banks\n * sit above the background and visibly darken different regions as they\n * move. This makes the atmosphere unmistakably alive and adds depth even\n * on displays where subtle light fog is hard to see.\n */\n #hero .hero-dark-fog-overlay {\n pointer-events: none;\n z-index: 2;\n will-change: transform, opacity;\n transform: translate3d(0,0,0);\n filter: blur(42px);\n }\n\n #hero .hero-dark-fog-overlay-a {\n display: none;\n opacity: 0.58;\n background:\n radial-gradient(ellipse 30% 24% at 8% 22%, rgba(0,0,0,0.76) 0%, rgba(0,0,0,0.46) 43%, transparent 74%),\n radial-gradient(ellipse 38% 25% at 42% 54%, rgba(0,0,0,0.60) 0%, rgba(0,0,0,0.32) 48%, transparent 76%),\n radial-gradient(ellipse 34% 24% at 88% 48%, rgba(0,0,0,0.66) 0%, rgba(0,0,0,0.30) 46%, transparent 74%);\n animation: hero-dark-fog-drift-a 14s ease-in-out infinite alternate;\n }\n\n #hero .hero-dark-fog-overlay-b {\n display: none;\n opacity: 0.42;\n filter: blur(58px);\n background:\n radial-gradient(ellipse 34% 22% at 22% 68%, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.34) 47%, transparent 76%),\n radial-gradient(ellipse 42% 25% at 70% 28%, rgba(0,0,0,0.56) 0%, rgba(0,0,0,0.26) 48%, transparent 77%),\n radial-gradient(ellipse 30% 20% at 96% 76%, rgba(0,0,0,0.65) 0%, transparent 74%);\n animation: hero-dark-fog-drift-b 21s ease-in-out infinite alternate;\n }\n\n @keyframes hero-dark-fog-drift-a {\n 0% { transform: translate3d(-10%, 1.5%, 0) scale(1.02); opacity: 0.46; }\n 48% { transform: translate3d(0%, -1.5%, 0) scale(1.07); opacity: 0.62; }\n 100% { transform: translate3d(11%, 0.8%, 0) scale(1.03); opacity: 0.50; }\n }\n\n @keyframes hero-dark-fog-drift-b {\n 0% { transform: translate3d(9%, -1.0%, 0) scale(1.04); opacity: 0.34; }\n 52% { transform: translate3d(0%, 1.3%, 0) scale(1.01); opacity: 0.47; }\n 100% { transform: translate3d(-10%, -0.4%, 0) scale(1.06); opacity: 0.36; }\n }\n\n /*\n * EDGE-WEIGHTED FOREGROUND FOG\n * ----------------------------\n * This is the clearly visible motion layer. The left bank is intentionally\n * stronger around the tree/owl zone; the center is transparent so typography\n * and the prompt remain crisp.\n */\n #hero .hero-foreground-fog {\n pointer-events: none;\n z-index: 2;\n mix-blend-mode: screen;\n will-change: transform, opacity;\n }\n\n #hero .hero-foreground-fog-left {\n display: none;\n opacity: 0.44;\n filter: blur(24px);\n background:\n radial-gradient(ellipse 28% 30% at 6% 20%,\n rgba(217,229,239,0.34) 0%,\n rgba(183,201,216,0.18) 34%,\n rgba(159,179,197,0.075) 55%,\n transparent 75%),\n radial-gradient(ellipse 32% 20% at 16% 42%,\n rgba(224,233,241,0.23) 0%,\n rgba(181,199,214,0.10) 44%,\n transparent 74%);\n animation: hero-foreground-fog-left-drift 13s ease-in-out infinite alternate;\n }\n\n #hero .hero-foreground-fog-sides {\n display: none;\n opacity: 0.18;\n filter: blur(34px);\n background:\n radial-gradient(ellipse 28% 24% at -2% 59%,\n rgba(224,233,241,0.24) 0%,\n rgba(173,191,207,0.08) 48%,\n transparent 74%),\n radial-gradient(ellipse 28% 25% at 101% 54%,\n rgba(218,229,238,0.20) 0%,\n rgba(172,191,207,0.065) 48%,\n transparent 74%);\n animation: hero-foreground-fog-sides-drift 19s ease-in-out infinite alternate;\n }\n\n #hero .hero-moon-haze {\n pointer-events: none;\n opacity: 0.13;\n background:\n radial-gradient(ellipse 23% 14% at 87% 15%, rgba(221,231,240,0.18) 0%, rgba(187,204,219,0.065) 45%, transparent 76%);\n filter: blur(28px);\n mix-blend-mode: screen;\n animation: hero-moon-haze-drift 22s ease-in-out infinite alternate;\n will-change: transform, opacity;\n }\n\n @keyframes hero-fog-drift-a {\n 0% { transform: translate3d(-5%, 0.5%, 0) scale(1.02); }\n 50% { transform: translate3d(1.5%, -1.0%, 0) scale(1.045); }\n 100% { transform: translate3d(6.5%, 0.8%, 0) scale(1.025); }\n }\n\n @keyframes hero-fog-drift-b {\n 0% { transform: translate3d(5.0%, -0.5%, 0) scale(1.04); }\n 50% { transform: translate3d(0%, 1.0%, 0) scale(1.02); }\n 100% { transform: translate3d(-6.5%, -0.8%, 0) scale(1.05); }\n }\n\n @keyframes hero-fog-drift-c {\n 0% { transform: translate3d(-2.0%, 1.2%, 0) scale(1.02); }\n 50% { transform: translate3d(2.0%, -0.6%, 0) scale(1.04); }\n 100% { transform: translate3d(4.5%, 0.4%, 0) scale(1.025); }\n }\n\n @keyframes hero-fog-ridge-drift {\n 0% { transform: translate3d(-6%, 0.5%, 0) scale(1.02); opacity: 0.075; }\n 42% { transform: translate3d(-1%, -1.0%, 0) scale(1.045); opacity: 0.12; }\n 100% { transform: translate3d(7%, 0.7%, 0) scale(1.025); opacity: 0.09; }\n }\n\n @keyframes hero-fog-lake-drift {\n 0% { transform: translate3d(6%, 0.4%, 0) scaleX(1.03); opacity: 0.085; }\n 50% { transform: translate3d(0%, -0.5%, 0) scaleX(1.06); opacity: 0.125; }\n 100% { transform: translate3d(-7%, 0.2%, 0) scaleX(1.035); opacity: 0.10; }\n }\n\n @keyframes hero-wind-sweep-a {\n 0% { transform: translate3d(-8%, 1.8%, 0) skewX(-1.5deg); opacity: 0.035; }\n 42% { transform: translate3d(1%, -1.0%, 0) skewX(0.5deg); opacity: 0.080; }\n 100% { transform: translate3d(9%, -2.0%, 0) skewX(1.0deg); opacity: 0.045; }\n }\n\n @keyframes hero-wind-sweep-b {\n 0% { transform: translate3d(7%, -1.5%, 0) skewX(1deg); opacity: 0.025; }\n 55% { transform: translate3d(0%, 0.7%, 0) skewX(-0.6deg); opacity: 0.055; }\n 100% { transform: translate3d(-9%, 1.7%, 0) skewX(-1deg); opacity: 0.030; }\n }\n\n @keyframes hero-foreground-fog-left-drift {\n 0% { transform: translate3d(-8%, 2%, 0) scale(1.02); opacity: 0.23; }\n 45% { transform: translate3d(1%, -1.5%, 0) scale(1.08); opacity: 0.38; }\n 100% { transform: translate3d(8%, 0.5%, 0) scale(1.04); opacity: 0.28; }\n }\n\n @keyframes hero-foreground-fog-sides-drift {\n 0% { transform: translate3d(5%, -1%, 0) scale(1.02); opacity: 0.13; }\n 52% { transform: translate3d(0%, 1%, 0) scale(1.06); opacity: 0.21; }\n 100% { transform: translate3d(-6%, -0.5%, 0) scale(1.035); opacity: 0.15; }\n }\n\n @keyframes hero-moon-haze-drift {\n 0% { transform: translate3d(2%, -0.5%, 0) scale(1.00); opacity: 0.09; }\n 48% { transform: translate3d(-1.5%, 0.6%, 0) scale(1.05); opacity: 0.16; }\n 100% { transform: translate3d(-4%, -0.3%, 0) scale(1.02); opacity: 0.11; }\n }\n\n #hero .hero-nature-background-shade {\n background:\n radial-gradient(\n ellipse 47% 38% at 50% 25%,\n rgba(0,0,0,0.92) 0%,\n rgba(0,0,0,0.84) 34%,\n rgba(0,0,0,0.54) 55%,\n rgba(0,0,0,0.18) 73%,\n transparent 100%\n ),\n linear-gradient(\n to bottom,\n rgba(0,0,0,0.08) 0%,\n rgba(0,0,0,0.03) 36%,\n rgba(0,0,0,0.02) 66%,\n rgba(0,0,0,0.10) 100%\n );\n }\n\n /*\n * CABIN FIREPLACE FLICKER\n * -----------------------\n * The baked office/cabin lighting in the image is never altered. These are\
1n * small additive amber layers aligned over the cabin so the room feels like\n * it also contains a fireplace. Two unsynchronized flickers avoid a visible\n * repeating "light bulb" pulse.\n */\n #hero .hero-cabin-fire-light {\n contain: paint;\n will-change: opacity;\n /*\n * Tight, low window/fire zone. Keep the warm cabin glow BEHIND the\n * interactive blackout + fog layer. At rest the fog fully covers it;\n * when the mouse clears the atmosphere, the glow is revealed together\n * with the underlying woodland/cabin image.\n */\n right: 2.15%;\n top: 21.4%;\n width: 7.8%;\n height: 7.6%;\n z-index: 0;\n pointer-events: none;\n mix-blend-mode: screen;\n transform: translate3d(0,0,0);\n overflow: visible;\n }\n\n #hero .hero-cabin-fire-light {\n animation: hero-cabin-local-flicker 3.4s steps(11,end) infinite;\n }\n\n @keyframes hero-cabin-local-flicker {\n 0%, 100% { opacity: 0.66; }\n 8% { opacity: 0.92; }\n 17% { opacity: 0.72; }\n 28% { opacity: 1.00; }\n 39% { opacity: 0.76; }\n 50% { opacity: 0.94; }\n 61% { opacity: 0.69; }\n 73% { opacity: 1.00; }\n 84% { opacity: 0.78; }\n 94% { opacity: 0.95; }\n }\n\n\n #hero .hero-cabin-window-flicker {\n border-radius: 38%;\n background:\n radial-gradient(ellipse 46% 38% at 55% 58%,\n rgba(255,210,132,0.52) 0%,\n rgba(255,142,48,0.31) 36%,\n rgba(255,82,19,0.10) 60%,\n transparent 78%);\n filter: blur(7px);\n opacity: 0.46;\n animation: hero-cabin-window-flicker 2.65s steps(9,end) infinite;\n }\n\n #hero .hero-cabin-fire-bloom {\n border-radius: 50%;\n background:\n radial-gradient(ellipse 42% 34% at 54% 60%,\n rgba(255,164,61,0.34) 0%,\n rgba(255,112,28,0.18) 34%,\n rgba(255,91,20,0.012) 60%,\n transparent 78%);\n filter: blur(11px);\n animation: hero-cabin-fire-bloom 4.7s steps(8,end) infinite;\n }\n\n #hero .hero-cabin-fire-core {\n left: 43%;\n top: 48%;\n width: 24%;\n height: 31%;\n border-radius: 46%;\n background:\n radial-gradient(ellipse at center,\n rgba(255,232,177,0.58) 0%,\n rgba(255,157,52,0.34) 32%,\n rgba(255,92,24,0.035) 60%,\n transparent 78%);\n filter: blur(5px);\n animation: hero-cabin-fire-core 3.35s steps(7,end) infinite;\n }\n\n #hero .hero-cabin-fire-reflection {\n left: 31%;\n top: 66%;\n width: 48%;\n height: 20%;\n border-radius: 50%;\n background:\n radial-gradient(ellipse at center,\n rgba(255,139,42,0.22) 0%,\n rgba(255,96,22,0.09) 48%,\n transparent 76%);\n filter: blur(8px);\n animation: hero-cabin-fire-reflection 5.9s steps(9,end) infinite;\n }\n\n @keyframes hero-cabin-window-flicker {\n 0%, 100% { opacity: 0.34; transform: scale(0.985); }\n 9% { opacity: 0.58; transform: scale(1.018); }\n 21% { opacity: 0.42; transform: scale(0.996); }\n 35% { opacity: 0.66; transform: scale(1.026); }\n 47% { opacity: 0.45; transform: scale(1.004); }\n 61% { opacity: 0.72; transform: scale(1.030); }\n 75% { opacity: 0.48; transform: scale(0.998); }\n 88% { opacity: 0.62; transform: scale(1.021); }\n }\n\n @keyframes hero-cabin-fire-bloom {\n 0%, 100% { opacity: 0.42; transform: scale(0.98); }\n 12% { opacity: 0.58; transform: scale(1.015); }\n 29% { opacity: 0.46; transform: scale(0.995); }\n 43% { opacity: 0.66; transform: scale(1.025); }\n 61% { opacity: 0.50; transform: scale(1.005); }\n 78% { opacity: 0.62; transform: scale(1.018); }\n 91% { opacity: 0.47; transform: scale(0.99); }\n }\n\n @keyframes hero-cabin-fire-core {\n 0%, 100% { opacity: 0.38;
1 transform: translate3d(0,0,0) scale(0.97); }\n 15% { opacity: 0.64; transform: translate3d(0,-1px,0) scale(1.06); }\n 31% { opacity: 0.45; transform: translate3d(1px,0,0) scale(1.00); }\n 49% { opacity: 0.72; transform: translate3d(-1px,-1px,0) scale(1.08); }\n 67% { opacity: 0.50; transform: translate3d(0,0,0) scale(1.01); }\n 84% { opacity: 0.67; transform: translate3d(1px,-1px,0) scale(1.05); }\n }\n\n @keyframes hero-cabin-fire-reflection {\n 0%, 100% { opacity: 0.28; transform: scaleX(0.98); }\n 19% { opacity: 0.38; transform: scaleX(1.02); }\n 37% { opacity: 0.31; transform: scaleX(1.00); }\n 58% { opacity: 0.43; transform: scaleX(1.035); }\n 76% { opacity: 0.33; transform: scaleX(1.01); }\n 90% { opacity: 0.39; transform: scaleX(1.025); }\n }\n\n #hero .hero-nature-background-brand-light {\n opacity: 0.20;\n background:\n radial-gradient(\n ellipse 25% 18% at 76% 50%,\n rgba(252,1,153,0.035) 0%,\n transparent 72%\n ),\n radial-gradient(\n ellipse 24% 18% at 24% 70%,\n rgba(57,255,20,0.018) 0%,\n transparent 72%\n );\n }\n\n @media (max-width: 639px) {\n #hero .hero-nature-background-image {\n background-size: 100% 100%;\n background-position: center top;\n opacity: 1;\n filter: none;\n transform: none;\n }\n\n #hero .hero-background-fog-video {\n opacity: 0.92;\n filter: brightness(0.675) contrast(1.14);\n mix-blend-mode: screen;\n transform: translate3d(0,-11%,0) scale(1.15);\n }\n\n /* Touch devices do not have a persistent hover pointer; keep the reveal\n parked off-canvas while preserving a clearly visible fog layer. */\n #hero .hero-interactive-blackout {\n background: rgba(0,0,0,0.74);\n }\n\n #hero .hero-background-bottom-fade {\n height: 36%;\n }\n\n #hero .hero-fog-layer-a { opacity: 0.10; }\n #hero .hero-fog-layer-b { opacity: 0.065; }\n #hero .hero-fog-layer-c { opacity: 0.045; }\n #hero .hero-fog-ridge { opacity: 0.065; }\n #hero .hero-fog-lake { opacity: 0.072; }\n\n /* Keep phones smooth: retain one wind veil and hide the second. */\n #hero .hero-wind-layer-a { opacity: 0.032; }\n #hero .hero-wind-layer-b { display: none; }\n #hero .hero-moon-haze { opacity: 0.075; }\n\n #hero .hero-cabin-fire-light {\n opacity: 0.42;\n }\n\n #hero .hero-nature-background-shade {\n background:\n linear-gradient(\n to bottom,\n rgba(0,0,0,0.74) 0%,\n rgba(0,0,0,0.56) 28%,\n rgba(0,0,0,0.48) 72%,\n rgba(0,0,0,0.70) 100%\n );\n }\n\n #hero .hero-nature-background-brand-light {\n opacity: 0.12;\n }\n\n #hero .hero-live-fog-a { opacity: 0.32; }\n #hero .hero-live-fog-b { opacity: 0.42; }\n #hero .hero-live-fog-c { opacity: 0.25; }\n #hero .hero-live-fog-d { opacity: 0.34; }\n #hero .hero-live-fog-e { opacity: 0.20; }\n\n #hero .hero-dark-fog-overlay-a {\n opacity: 0.26;\n }\n\n #hero .hero-dark-fog-overlay-b {\n opacity: 0.18;\n }\n\n #hero .hero-foreground-fog-left {\n opacity: 0.18;\n }\n\n #hero .hero-foreground-fog-sides {\n opacity: 0.08;\n }\n\n }\n\n @media (prefers-reduced-motion: reduce) {\n #hero .hero-background-fog-video {\n display: none;\n }\n\n #hero .hero-interactive-atmosphere {\n transition: none !important;\n }\n\n #hero .hero-fog-layer,\n #hero .hero-wind-layer,\n #hero .hero-moon-haze,\n #hero .hero-foreground-fog,\n #hero .hero-dark-fog-overlay,\n #hero .hero-cabin-window-flicker,\n #hero .hero-cabin-fire-bloom,\n #hero .hero-cabin-fire-core,\n #hero .hero-cabin-fire-reflection,\n #hero .hero-live-fog,\n #hero .hero-cabin-fire-light {\n animation: none !important;\n }\n }\n\n /*\n * DESKTOP SCROLL CUES\n * -------------------\n * Keep the bouncing chevrons physically above the first-viewport fold even\n * though the site uses CSS zoom at larger desktop widths. Each viewport\n * fraction below is the inverse of the matching body zoom band.\n *\n * --hero-scroll-outset is also inverse-scaled so each arrow moves exactly\n * ~50 rendered pixels farther away from center at every desktop zoom level.\n */\n/* Cross-browser viewport fallback: 100vh works everywhere; browsers\n that support dynamic viewport units use 100dvh on top of it. */\n #hero {\n min-height: 100vh;\n min-height: 100dvh;\n }\n\n #hero .hero-prompt-submit,\n #hero .hero-prompt-submit::before,\n #hero .hero-prompt-submit::after {\n animation: none !important;\n animation-name: none !important;\n }\n\n #hero .hero-prompt-submit {\n box-shadow: none !important;\n }\n\n /*\n * TAKE-OFF PROGRESS\n * -----------------\n * Staged bar under the "Preparing for take off⦠/ Taking flightâ¦"\n * placeholder while the post-submit route change is in flight. Width\n * is driven from useTakeoffProgress; the gradient shimmers slowly so\n * it reads as live even between stage steps. The submit button\'s\n * spinner is replaced by a gently drifting â â that rule above kills\n * animations on the button itself, not on its children.\n */\n #hero .hero-takeoff-fill {\n background: linear-gradient(90deg, #FC0199 0%, #39FF14 50%, #FC0199 100%);\n background-size: 200% 100%;\n box-shadow: 0 0 10px rgba(252,1,153,0.55), 0 0 18px rgba(57,255,20,0.25);\n transition: width 900ms cubic-bezier(0.22, 0.72, 0.24, 1);\n animation: hero-takeoff-shimmer 0.8s ease-in-out infinite alternate;\n }\n\n @keyframes hero-takeoff-shimmer {\n 0% { background-position: 0% 50%; }\n 100% { background-position: 100% 50%; }\n }\n\n #hero .hero-takeoff-arrow {\n animation: hero-takeoff-drift 0.9s ease-in-out infinite alternate;\n }\n\n @keyframes hero-takeoff-drift {\n 0% { transform: translate(-1px, 1px); opacity: 0.75; }\n 100% { transform: translate(2px, -2px); opacity: 1; }\n }\n\n @media (prefers-reduced-motion: reduce) {\n #hero .hero-takeoff-fill,\n #hero .hero-takeoff-arrow {\n animation: none !important;\n }\n }\n\n #hero .hero-prompt-submit[data-ready="true"]:hover {\n box-shadow: 0 0 5px #FC0199, 0 0 16px #FC0199 !important;\n }\n\n /*\n * PIXEL-LOCKED DIAGONAL BUMP\n * --------------------------\n * body zoom makes ordinary 1px movement land on fractional rendered\n * pixels (1px becomes 1.25px at the 125% site scale). That was why the\n * underline looked thick while moving and thinner after it settled.\n *\n * These values compensate for the exact global zoom bands. The bump moves\n * two RENDERED pixels up/right in two discrete 1-rendered-pixel steps, so\n * the underline keeps exactly the same rasterized thickness throughout.\n */\n #hero {\n --hero-bump-distance: 2px;\n }\n\n @media (min-width: 1280px) {\n #hero { --hero-bump-distance: 1.904762px; } /* 2 / 1.05 */\n }\n\n @media (min-width: 1450px) {\n #hero { --hero-bump-distance: 1.818182px; } /* 2 / 1.10 */\n }\n\n @media (min-width: 1600px) {\n #hero { --hero-bump-distance: 1.739130px; } /* 2 / 1.15 */\n }\n\n @media (min-width: 1760px) {\n #hero { --hero-bump-distance: 1.666667px; } /* 2 / 1.20 */\n }\n\n @media (min-width: 1920px) {\n #hero { --hero-bump-distance: 1.6px; } /* 2 / 1.25 */\n }\n\n @media (min-width: 2300px) {\n #hero { --hero-bump-distance: 1.538462px; } /* 2 / 1.30 */\n }\n\n @media (min-width: 2800px) {\n #hero { --hero-bump-distance: 1.481481px; } /* 2 / 1.35 */\n }\n\n #hero .hero-promise-bump,\n #hero .hero-nest-bump {\n top: 0;\n left: 0;\n transition:\n top 80ms steps(2, end),\n left 80ms steps(2, end);\n }\n\n #hero .hero-promise-bump[data-bump-active="true"],\n #hero .hero-nest-bump[data-bump-active="true"] {\n top: calc(-1 * var(--hero-bump-distance));\n left: var(--hero-bump-distance);\n }\n\n /*\n * MODEL hover tooltip remains the visual reference:\n * 3% white fill + 12px backdrop blur.\n */\n #hero .hero-model-reference-tooltip {\n background: rgba(255,255,255,0.03) !important;\n background-color: rgba(255,255,255,0.03) !important;\n background-image: none !important;\n border-color: rgba(255,255,255,0.10) !important;\n -webkit-backdrop-filter: blur(12px) !important;\n backdrop-filter: blur(12px) !important;\n box-shadow: 0 10px 28px rgba(0,0,0,0.46) !important;\n mix-blend-mode: normal !important;\n }\n\n /*\n * KEEP / EARN TOOLTIP LINE CAP\n * ----------------------------\n * On smaller desktop/tablet monitors the generic width could visually\n * compress these boxes, causing their intended lines to wrap again.\n * Keep and Earn now use explicit line structure and a slightly wider\n * responsive width so neither can ever exceed four lines.\n */\n @media (min-width: 640px) {\n #hero [data-promise-key="tokens"] > .hero-top-promise-tooltip {\n width: min(21.25rem, calc(100vw - 3rem)) !important;\n }\n\n #hero [data-promise-key="agents"] > .hero-top-promise-tooltip {\n width: min(23rem, calc(100vw - 3rem)) !important;\n }\n\n #hero [data-promise-key="tokens"] .hero-promise-tooltip-line,\n #hero [data-promise-key="agents"] .hero-promise-tooltip-line {\n white-space: nowrap !important;\n }\n }\n\n /*\n * Nest / Keep / Earn / Work keep their previously approved glass treatment.\n * These four were NOT part of the later transparency experiment.\n */\n #hero .hero-top-promise-tooltip {\n background: rgba(255,255,255,0.03) !important;\n background-color: rgba(255,255,255,0.03) !important;\n background-image: none !important;\n border-color: rgba(255,255,255,0.10) !important;\n -webkit-backdrop-filter: blur(12px) !important;\n backdrop-filter: blur(12px) !important;\n box-shadow: 0 10px 28px rgba(0,0,0,0.46) !important;\n mix-blend-mode: normal !important;\n }\n\n /*\n * NEST TOOLTIP FRONT-STACK FIX\n * ----------------------------\n * The Nest tooltip lives inside the headline\'s own isolated stacking\n * context, unlike the three Keep/Earn/Work tooltips. Explicitly elevate\n * the headline context while the Nest tooltip is open, and then elevate\n * the tooltip itself above every Hero atmosphere/fog layer.\n */\n #hero .hero-headline-band:has(.hero-nest-tooltip[aria-hidden="false"]) {\
1n z-index: 500 !important;\n }\n\n #hero .hero-headline-inner:has(.hero-nest-tooltip[aria-hidden="false"]) {\n z-index: 520 !important;\n isolation: isolate;\n }\n\n #hero .hero-headline-inner h1:has(.hero-nest-tooltip[aria-hidden="false"]) {\n z-index: 540 !important;\n overflow: visible !important;\n }\n\n #hero .hero-nest-tooltip {\n z-index: 600 !important;\n isolation: isolate !important;\n mix-blend-mode: normal !important;\n }\n\n /*\n * Other tooltips keep the SAME 3% fill but do not blur/smear the colored\n * magenta/green surface behind them into the panel. That backdrop sampling\n * was why identical alpha looked much more opaque than the MODEL tooltip.\n */\n #hero .hero-other-tooltip-glass {\n background: rgba(255,255,255,0.03) !important;\n background-color: rgba(255,255,255,0.03) !important;\n background-image: none !important;\n border-color: rgba(255,255,255,0.10) !important;\n -webkit-backdrop-filter: none !important;\n backdrop-filter: none !important;\n box-shadow: 0 10px 28px rgba(0,0,0,0.46) !important;\n mix-blend-mode: normal !important;\n }\n\n /*\n * MODEL MENU SCROLLBAR\n * --------------------\n * Mirrors the app picker (model-dropdown.tsx): thin, slate-at-27%\n * thumb on a transparent track, brighter on hover. The app relies on\n * globals.css for the webkit half of this; the landing page doesn\'t\n * load that file, so the rules live here.\n */\n #hero .hero-model-menu-list::-webkit-scrollbar {\n width: 6px;\n }\n\n #hero .hero-model-menu-list::-webkit-scrollbar-track {\n background: transparent;\n }\n\n #hero .hero-model-menu-list::-webkit-scrollbar-thumb {\n background-color: #64748B44;\n border-radius: 999px;\n border: 1px solid transparent;\n background-clip: padding-box;\n }\n\n #hero .hero-model-menu-list::-webkit-scrollbar-thumb:hover {\n background-color: #64748B88;\n }\n\n /* MODEL choice menu is intentionally NOT glass. Force a solid dark\n readability surface even if surrounding hero styles change. */\n #hero .hero-model-menu {\n /*\n * Expanded model picker: intentionally near-opaque black.\n * Use a true 94% black surface plus a strong backdrop darken/blur so\n * magenta Hero glow or background detail cannot visually bleed through.\n */\n background: #050506 !important;\n background-color: #050506 !important;\n background-image: none !important;\n opacity: 1 !important;\n -webkit-backdrop-filter: blur(18px) brightness(0.18) !important;\n backdrop-filter: blur(18px) brightness(0.18) !important;\n mix-blend-mode: normal !important;\n isolation: isolate !important;\n }\n\n #hero .hero-model-menu::before {\n content: "";\n position: absolute;\n inset: -2px;\n z-index: 0;\n pointer-events: none;\n border-radius: calc(1rem + 2px);\n background: #050506;\n }\n\n #hero .hero-model-menu > * {\n position: relative;\n z-index: 1;\n }\n\n /*\n * MODEL MENU STACKING FIX\n * -----------------------\n * The menu itself was already opaque, but the headline band is z-50 while\n * the hatch row is its own lower stacking context. That caused headline /\n * promise text to be painted ON TOP of the dark menu, which visually looked\n * exactly like transparency. Raise only the hatch row while the menu is open.\n */\n #hero .hero-hat
1ch-center:has(.hero-model-menu) {\n z-index: 90 !important;\n }\n\n #hero .hero-prompt-inner-shell:has(.hero-model-menu) {\n z-index: 5000 !important;\n isolation: isolate;\n\n /*\n * The horizontal line still visible through the menu was not\n * transparency in the menu itself â it was the inner OWL AI prompt\n * shell\'s own border crossing underneath/through the expanded popup.\n * Temporarily suppress that shell border while the model menu is open.\n * The menu has its own border, so the composition still reads cleanly.\n */\n border-color: transparent !important;\n box-shadow: none !important;\n }\n\n #hero .hero-prompt-inner-shell:has(.hero-model-menu) .hero-model-selector {\n z-index: 6000 !important;\n }\n\n #hero .hero-prompt-inner-shell:has(.hero-model-menu) .hero-model-menu {\n z-index: 7000 !important;\n }\n\n /*\n * OUTER OWL AI EDGE OVERLAY FIX\n * -----------------------------\n * The horizontal line in the latest screenshot is the OUTER OWL AI\n * catchlight/border overlay (z-8/z-9), not the inner prompt border.\n * Because the form uses backdrop-filter, it forms a stacking context;\n * descendants of that form cannot paint above these outer-wrapper\n * decorative siblings regardless of how large their child z-index is.\n *\n * While the model menu is open, temporarily hide ONLY those decorative\n * outer edge/corner overlays. The menu keeps its own border, and the\n * actual OWL AI panel remains visually intact underneath.\n */\n #hero .hero-fog-protected:has(.hero-model-menu) > .hero-owl-outer-edge-overlay {\n opacity: 0 !important;\n visibility: hidden !important;\n }\n\n /*\n * SEGMENTED SHORTCUT SELECTED OUTLINES\n * ------------------------------------\n * All breakpoints use the same clean inset selected ring as the other\n * segmented controls. The previous outer box-shadow was clipped by the\n * shared overflow-hidden containers and produced broken/misaligned\n * magenta edges on both tablet and mobile.\n */\n #hero {\n --hero-shortcut-selected-shadow-owl:\n inset 0 0 0 1.5px #FC0199,\n 0 0 10px rgba(252,1,153,0.22);\n --hero-shortcut-selected-shadow:\n inset 0 0 0 1.5px #FC0199,\n 0 0 10px rgba(252,1,153,0.30);\n }\n\n /*\n * MOBILE MAIN-SLIDER FLICKER FIX\n * ------------------------------\n * The moving Chat/Hatch/Build thumb was combining left-position animation,\n * backdrop-filter and a white inset reflection. On mobile GPU compositing\n * that can briefly rasterize as a white flash. Keep the same bright plum\n * fill + magenta border/glow, but remove only those two compositing-heavy\n * effects below 640px.\n */\n @media (max-width: 639px) {\n #hero .hero-mode-slider-thumb {\n -webkit-backdrop-filter: none !important;\n backdrop-filter: none !important;\n box-shadow:\n 0 8px 22px rgba(0,0,0,0.24),\n 0 0 24px rgba(252,1,153,0.12) !important;\n backface-visibility: hidden;\n -webkit-backface-visibility: hidden;\n }\n }\n\n /*\n * MOBILE MODE-CONTROL ROW LOCK\n * ----------------------------\n * Use a real second-row wrapper instead of a zero-height flex-break item.\n * The old break item created its own empty flex line, which doubled the\n * vertical gap when Nightowl or Build hid the media controls.\n */\n @media (max-width: 639px) {\n #hero .hero-owl-tools[data-owl-active="false"] {\n display: none !important;\n width: 0 !important;\n opacity: 0 !important;\n transform: none !important;\n }\n\n #hero .hero-secondary-controls {\n display: flex !important;\n flex: 0 0 100%;\n min-width: 0;\n align-items: center;\n gap: clamp(0.55rem, 0.9vw, 0.75rem);\n }\n\n #hero .hero-secondary-controls .hero-model-selector {\n min-width: 0;\n }\n\n #hero .hero-secondary-controls .hero-prompt-submit {\n margin-left: auto !important;\n }\n }\n\n /*\n * OWL AI TOOLTIP LINE LOCK\n * ------------------------\n * TooltipCopy emits one or tw
1o balanced spans. Keep each span intact at\n * every breakpoint so no tooltip can accidentally become 3â4 lines.\n */\n #hero .hero-prompt-control-tooltip > span,\n #hero .hero-model-reference-tooltip > span {\n white-space: nowrap;\n }\n\n /* Chat / Hatch / Build descriptions are intentionally one-line tooltips.\n Do not route these three through the generic balanced two-line splitter. */\n #hero .hero-mode-tooltip-copy {\n white-space: nowrap !important;\n }\n\n #hero .hero-prompt-control-tooltip:has(.hero-mode-tooltip-copy) {\n width: max-content !important;\n max-width: none !important;\n white-space: nowrap !important;\n text-wrap: nowrap !important;\n }\n\n @media (max-width: 639px) {\n #hero .hero-prompt-control-tooltip:has(.hero-mode-tooltip-copy) {\n font-size: 0.60rem !important;\n line-height: 1.25 !important;\n }\n }\n\n /*\n * MOBILE PROMPT-CONTROL TOOLTIPS\n * ------------------------------\n * Bottom-row tooltips live inside the prompt field above the complete\n * controls block. They use a solid black reading surface and are bounded\n * by the prompt box itself, so they cannot cover the buttons or spill\n * beyond the phone viewport.\n */\n @media (max-width: 639px) {\n #hero .hero-prompt-control-tooltip-mobile-above {\n left: 0.75rem !important;\n right: auto !important;\n max-width: calc(100% - 1.5rem) !important;\n transform: translateY(-100%) !important;\n background: #050506 !important;\n background-color: #050506 !important;\n background-image: none !important;\n border-color: rgba(255,255,255,0.18) !important;\n -webkit-backdrop-filter: none !important;\n backdrop-filter: none !important;\n color: rgba(255,255,255,0.86) !important;\n box-shadow:\n 0 10px 28px rgba(0,0,0,0.72),\n inset 0 1px 0 rgba(255,255,255,0.055) !important;\n }\n\n #hero .hero-model-reference-tooltip {\n width: max-content !important;\n max-width: calc(100vw - 2rem) !important;\n }\n\n #hero .hero-model-reference-tooltip span {\n white-space: nowrap !important;\n }\n\n #hero .hero-prompt-control-tooltip-mobile-slider {\n transform: translateY(-100%) !important;\n max-width: calc(100% - 1.5rem) !important;\n background: #050506 !important;\n background-color: #050506 !important;\n background-image: none !important;\n border-color: rgba(255,255,255,0.18) !important;\n -webkit-backdrop-filter: none !important;\n backdrop-filter: none !important;\n color: rgba(255,255,255,0.86) !important;\n box-shadow:\n 0 10px 28px rgba(0,0,0,0.72),\n inset 0 1px 0 rgba(255,255,255,0.055) !important;\n }\n\n /* The copy is deliberately split into at most two balanced lines.\n Do NOT let either line wrap again, otherwise a two-line tooltip can\n become three or four lines on a phone. */\n #hero .hero-prompt-control-tooltip-mobile-above span,\n #hero .hero-prompt-control-tooltip-mobile-slider span {\n white-space: nowrap !important;\n }\n }\n\n /*\n * MOBILE TOP-MESSAGING TOOLTIP SAFETY\n * ------------------------------------\n * The promise row is a three-column grid on phones. Centering a nearly\n * viewport-wide tooltip on the first/last column pushes it off-screen.\n * Anchor the outside tooltips inward and cap every top tooltip to the\n * visible viewport, while keeping the middle tooltip centered.\n */\n @media (max-width: 639px) {\n #hero .hero-top-promise-tooltip {\n width: calc(100vw - 2.5rem) !important;\n max-width: calc(100vw - 2.5rem) !important;\n }\n\n #hero [data-promise-key="tokens"] > .hero-top-promise-tooltip {\n left: 0 !important;\n right: auto !important;\n width: calc((100vw - 2.5rem) * 0.85) !important;\n max-width: calc((100vw - 2.5rem) * 0.85) !important;\n --tw-translate-x: 0px !important;\n }\n\n #hero [data-promise-key="agents"] > .hero-top-promise-tooltip {\n left: 50% !important;\n right: auto !important;\n --tw-translate-x: -50% !important;\n }\n\n #hero [data-promise-key="models"] > .hero-top-promise-tooltip {\n left: auto !important;\n right: 0 !important;\n --tw-translate-x: 0px !important;\n }\n\n #hero .hero-nest-tooltip {\n left: 50% !important;\n right: auto !important;\n width: calc(100vw - 2.5rem) !important;\n max-width: calc(100vw - 2.5rem) !important;\n --tw-translate-x: -50% !important;\n }\n }\n\n /*\n * TABLET LAYOUT SAFETY\n * --------------------\n * Keep the prompt controls inside the prompt box at 640â1023px and\n * keep the wide Nest tooltip inside the viewport. Desktop/mobile\n * compositions remain untouched.\n */\n @media (min-width: 640px) and (max-width: 1023px) {\n #hero .hero-nest-tooltip {\n left: auto !important;\n right: 0;\n width: min(30rem, calc(100vw - 3rem));\n --tw-translate-x: 0px !important;\n }
1\n\n #hero .hero-prompt-controls {\n width: 100%;\n min-width: 0;\n flex-wrap: nowrap;\n gap: 0.25rem;\n }\n\n #hero .hero-mode-shortcuts {\n gap: 0.125rem;\n }\n\n #hero .hero-mode-shortcuts > button {\n width: 2rem;\n }\n\n #hero .hero-owl-tools {\n --owl-tools-width: 10rem;\n }\n\n #hero .hero-owl-tools button {\n width: 2rem;\n }\n\n #hero .hero-model-selector {\n min-width: 0;\n flex: 1 1 auto;\n }\n\n #hero .hero-model-trigger {\n width: 100%;\n min-width: 0;\n gap: 0.25rem;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n font-size: 0.66rem;\n }\n\n #hero .hero-model-menu {\n left: auto;\n right: 0;\n width: min(20rem, calc(100vw - 3rem));\n }\n\n #hero .hero-attach-control {\n width: 2rem;\n }\n\n #hero .hero-prompt-submit {\n margin-left: 0 !important;\n padding-left: 0.7rem !important;\n padding-right: 0.7rem !important;\n font-size: clamp(0.72rem, 1.8vw, 0.94rem) !important;\n }\n }\n\n /*\n * HEADLINE AIR â OPTICALLY EQUAL ABOVE + BELOW\n * ---------------------------------------------\n * The visual black space from the navbar/fold-side top rhythm to the\n * "Own your AI..." text is mirrored below that headline before the\n * visible Keep / Earn / Work text.\n *\n * We subtract the promise button\'s top padding because the requested\n * equality is text-to-text / visible black space, not merely box-to-box.\n * Mobile\'s existing -1.35rem promise translation is also compensated\n * mathematically so it does not break the equality.\n */\n #hero {\n --hero-promise-pad-y: clamp(0.3rem, 0.6vh, 0.48rem);\n --hero-headline-air: calc(1.5rem + clamp(0.5rem, 0.9vh, 0.72rem));\n }\n\n /* <640px: py-6 above + existing headline translate; compensate the\n promise row\'s -1.35rem visual translation. */\n #hero .hero-promise-row {\n margin-top: calc(\n var(--hero-headline-air) + 1.35rem - var(--hero-promise-pad-y)\n ) !important;\n }\n\n /* 640â1023px: sm:py-8 above + the same headline translate; the promise\n row no longer has the negative translation at sm+. */\n @media (min-width: 640px) and (max-width: 1023px) {\n #hero {\n --hero-headline-air: calc(2rem + clamp(0.5rem, 0.9vh, 0.72rem));\n }\n\n #hero .hero-promise-row {\n margin-top: calc(\n var(--hero-headline-air) - var(--hero-promise-pad-y)\n ) !important;\n }\n }\n\n /*\n * DESKTOP HERO RHYTHM â ONE AUTHORITATIVE SYSTEM\n * ------------------------------------------------\n * Do NOT alter #hero padding-top here. The section\'s pt-16 is the fixed\n * navbar clearance and must remain intact at every desktop resolution.\n *\n * Previous versions mixed viewport-height bands, grid fractions, negative\n * margins and #hero padding overrides. That is
1why 1920x1080 could become\n * too tight while 3440x1440 became too loose.\n *\n * From 1024px upward, use one simple vertical flow with bounded REM gaps.\n * Because the site\'s global zoom scales these REM values together with the\n * rest of the UI, the visual spacing stays consistent from laptops through\n * ultrawide / 4K-class displays without resolution-specific patches.\n */\n @media (min-width: 1024px) {\n #hero .hero-layout {\n display: flex !important;\n flex-direction: column;\n height: auto !important;\n min-height: calc(100dvh - 4rem);\n gap: 0 !important;\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n }\n\n /* Navbar -> headline. */\n #hero .hero-headline-band {\n flex: none;\n align-items: flex-start;\n padding-top: 2.75rem;\n }\n\n #hero .hero-headline-inner {\n transform: none !important;\n }\n\n /* Headline -> Keep / Earn / Work.\n Match the visible black space above the headline exactly. */\n #hero {\n --hero-headline-air: 2.75rem;\n }\n\n #hero .hero-promise-row {\n margin-top: calc(\n var(--hero-headline-air) - var(--hero-promise-pad-y)\n ) !important;\n transform: none !important;\n }\n\n /* Keep / Earn / Work -> OWL AI.\n This is intentionally much tighter than the old flexible grid band. */\n #hero .hero-hat
1ch-center {\n flex: none;\n margin-top: 2.75rem !important;\n transform: none !important;\n }\n\n /*\n * OWL AI -> Parliament.\n * ONE shared token controls this vertical gap AND both horizontal\n * Organization/Parliament/Skill Tree gaps.\n */\n #hero {\n --hero-owl-to-parliament-visible-gap: 3.5rem;\n }\n\n #hero .hero-parliament-band {\n flex: none;\n margin-top: var(--hero-owl-to-parliament-visible-gap) !important;\n padding-top: 0 !important;\n transform: none !important;\n }\n }\n\n /*\n * TALL / SQUARER DESKTOPS\n * -----------------------\n * 1152x864, 1280x1024, 1600x1200 and 1720x1440 need more vertical\n * breathing room than 16:9 / ultrawide screens. Target the SHAPE of the\n * viewport instead of hard-coding each resolution.\n *\n * 1024x768 and the short 1280x720/800 cases intentionally stay on the\n * base rhythm, which closely matches the approved 800x600 screenshot.\n */\n @media\n (min-width: 1024px) and (min-height: 850px) and (max-aspect-ratio: 8/5) {\n #hero .hero-headline-band {\n padding-top: 4rem;\n }\n\n #hero {\n --hero-headline-air: 4rem;\n }\n\n #hero .hero-promise-row {\n margin-top: calc(\n var(--hero-headline-air) - var(--hero-promise-pad-y)\n ) !important;\n }
1\n\n #hero .hero-hatch-center {\n margin-top: 3.5rem !important;\n }\n\n #hero {\n --hero-owl-to-parliament-visible-gap: 4.25rem;\n }\n }\n\n /*\n * 768â1023px desktop-like windows (including an 800x600 monitor):\n * keep the approved spacing/composition, only scale the oversized top\n * typography down so it reads more proportionally.\n */\n @media (min-width: 768px) and (max-width: 1023px) {\n #hero .hero-headline-inner h1 {\n font-size: clamp(1.55rem, 3.6vw, 1.8rem) !important;\n }\n\n #hero .hero-promise-row button {\n font-size: clamp(0.84rem, 2vw, 0.96rem) !important;\n }\n }\n\n /*\n * WIDE + VERTICALLY SHORT DESKTOP PROFILE\n * ---------------------------------------\n * Only affects 1600px+ displays that are 1100px tall or shorter\n * (e.g. 1920x1080). Component sizes remain unchanged; only the vertical\n * rhythm is compressed so Parliament is visible above the fold.\n */\n @media (min-width: 1600px) and (max-height: 1100px) {\n /* Tighten the promise-row ->
1 OWL AI gap. */\n #hero .hero-hatch-center {\n margin-top: 1.75rem !important;\n }\n\n /*\n * Keep OWL AI -> Parliament and BOTH horizontal side-panel gaps equal.\n * One shared token controls all three distances.\n */\n #hero {\n --hero-owl-to-parliament-visible-gap: 2.25rem;\n }\n\n #hero .hero-parliament-band {\n margin-top: var(--hero-owl-to-parliament-visible-gap) !important;\n }\n }\n\n /*\n * LARGE / DARK MONITOR PROFILE â 2300px+\n * ---------------------------------------\n * This profile is intentionally isolated from all smaller monitors.\n * It compensates for the larger physical composition without changing the\n * approved 1024â2299px experience.\n */\n @media (min-width: 2300px) {\n /* Owl: retain a stronger invitation at rest on physically larger/darker displays. */\n #hero .hero-owl-rest-silhouette {\n filter: saturate(0) brightness(0.98) contrast(1.02) !important;\n }\n\n #hero .hero-owl-lower-through-smoke {\n filter: saturate(0) brightness(1.70) contrast(1.035) !important;\n }\n\n /* When hovered, the WHOLE owl becomes uniformly brighter than at rest. */\n #hero .hero-owl-reveal-base[data-owl-hovered="true"],\n #hero .hero-owl-lower-through-smoke[data-owl-hovered="true"],\n #hero .hero-owl-rest-silhouette[data-owl-hovered="true"] {\n filter: saturate(0) brightness(1.78) contrast(1.08) !important;\n }\n\n /* Fog: undo part of the 25%-darkened treatment only on large monitors. */\n #hero .hero-background-fog-video {\n opacity: 0.97;\n filter: brightness(0.84) contrast(1.14);\n transform: translate3d(0,-24%,0) scale(1.32);\n }\n\n /*\n * Keep OWL AI -> Parliament and BOTH side-panel gaps mathematically equal.\n * The same single token is already consumed vertically and horizontally.\n */\n #hero {\n --hero-owl-to-parliament-visible-gap: 4rem;\n }\n\n /*\n * Organization source framing: shift the focal point right within the\n * existing video shell without moving or resizing the panel itself.\n */\n #hero .hero-parliament-video-zone {\n /* Organization uses contain + left-center in the inline video style. */\n }\n\n /*\n * Cap the CINEMATIC BACKGROUND REGION on giant displays.\n * The Hero section itself can continue for Parliament/content, but the\n * forest/fog plate fades to black after roughly one viewport + a small\n * continuation instead of stretching deep below the fold.\n */\n #hero .hero-nature-background {\n inset: 0 auto auto 0 !important;\n width: 100%;\n height: calc(100dvh + 8rem);\n overflow: hidden;\n -webkit-mask-image:\n linear-gradient(\n to bottom,\n #000 0%,\n #000 78%,\n rgba(0,0,0,0.94) 84%,\n rgba(0,0,0,0.70) 90%,\n rgba(0,0,0,0.34) 96%,\n transparent 100%\n );\n mask-image:\n linear-gradient(\n to bottom,\n #000 0%,\n #000 78%,\n rgba(0,0,0,0.94) 84%,\n rgba(0,0,0,0.70) 90%,\n rgba(0,0,0,0.34) 96%,\n transparent 100%\n );\n }\n }\n\n '})]})}let U=["Owl AI","Nightowl","App / Website"],X={Chat:"llm",Image:"image",Video:"video",Audio:"audio","3D":"3d"},V=["I need an automated email and phone response agent","I need a financial analyst","Hatch me a trip planner agent","Can you make me a customer support Nightowl?"],Y=["Click here to chat privately with OWL AI. Ask it anything. Choose your model (LLM) below. Create agents, images, videos, music, 3D renderings, and apps.",'Describe agent needs to "Hatch a Nightowl". Describe your app to start building. To focus your work choose an output type button below.',"How is Nightowl AI different? It's the US-first platform building an agentic marketplace for AI labor, tokenizing AI subscription value, and expanding human agency over AI."],q=[{at:0,label:"Preparing for take offâ¦",width:18},{at:600,label:"Preparing for take offâ¦",width:55},{at:1500,label:"Taking flightâ¦",width:78},{at:3200,label:"Taking flightâ¦",width:90}];function Z(e){let n=e.currentTarget,t=n.getBoundingClientRect(),r=e.clientX-t.left,a=e.clientY-t.top;
1n.querySelectorAll("[data-hero-sheen]").forEach(e=>{var n,t;let o=Number(null!=(n=e.dataset.sheenSize)?n:"58"),i=null!=(t=e.dataset.sheenColor)?t:"var(--owl-accent-primary)";e.style.background="radial-gradient(".concat(o,"px circle at ").concat(r,"px ").concat(a,"px, color-mix(in srgb, ").concat(i," 48%, transparent), transparent 58%)")})}function $(e){let{size:n=90,color:t="var(--owl-accent-primary)"}=e,a=Math.max(36,Math.round(.65*n));return(0,r.jsx)("span",{"aria-hidden":!0,"data-hero-sheen":!0,"data-sheen-size":a,"data-sheen-color":t,className:"pointer-events-none absolute inset-0 z-[5] rounded-[inherit] opacity-0 transition-opacity duration-150 group-hover:opacity-100",style:{background:"radial-gradient(".concat(a,"px circle at 50% 50%, color-mix(in srgb, ").concat(t," 48%, transparent), transparent 58%)")}})}let Q=new Set(["Talk to OWL AI for private, multi-model chat and creation.","Build Apps / Websites : Coming Soon","Chat with the selected model using text and reasoning.","Create or edit images.","Generate video.","Create music, sound, or other audio.","Generate 3D concepts and renderings."]);function J(e){let n=e.trim().replace(/\s+/g," ");if(Q.has(n))return[n];let t=n.split(" ").filter(Boolean);if(n.length<=31||t.length<=3)return[n];let r=1,a=1/0;for(let e=1;e<t.length;e+=1){let n=t.slice(0,e).join(" "),o=t.slice(e).join(" "),i=Math.abs(n.length-o.length);i<a&&(a=i,r=e)}return[t.slice(0,r).join(" "),t.slice(r).join(" ")]}function ee(e){let{text:n}=e,t=J(n);return(0,r.jsx)(r.Fragment,{children:t.map((e,n)=>(0,r.jsx)("span",{className:"block whitespace-nowrap",children:e},"".concat(e,"-").concat(n)))})}function en(e,n){return Math.min(Math.max(96,n),Math.max(96,Math.ceil(5.2*Math.max(...J(e).map(e=>e.length))+24)))}function et(e){let{company:n}=e,t=(0,P.O4)(n),a=(0,P.u3)(t);return(0,r.jsx)("span",{"aria-hidden":!0,className:"inline-flex h-4 w-4 shrink-0 items-center justify-center",children:t&&(0,r.jsx)("img",{src:t,alt:"",width:16,height:16,className:"block h-full w-full object-contain",style:{transform:(null==a?void 0:a.scale)?"scale(".concat(a.scale,")"):void 0,borderRadius:null==a?void 0:a.radius}})})}function er(e){let{catalog:n,modality:t,value:o,onChange:i,disabled:s,disabledReason:d}=e,[m,p]=(0,a.useState)(!1),[c,h]=(0,a.useState)(!1),g=(0,a.useRef)(null),u=(0,a.useRef)(null);(0,a.useEffect)(()=>{m||h(!1)},[m]);let b=(0,a.useMemo)(()=>L(n,t,c),[n,t,c]),x=(0,a.useMemo)(()=>S(L(n,t,!0))>S(L(n,t,!1)),[n,t]),f=(0,a.useMemo)(()=>{var e;return null!=(e=function(e,n,t){for(let r of L(e,n,!0))for(let e of r.groups){let n=e.options.find(e=>e.value===t);if(n)return n}return null}(n,t,o))?e:{value:o,label:o||"Default",company:null}},[n,t,o]);return(0,a.useEffect)(()=>{if(!m)return;let e=e=>{var n,t;let r=e.target;(null==(n=u.current)?void 0:n.contains(r))||(null==(t=g.current)?void 0:t.contains(r))||p(!1)},n=e=>"Escape"===e.key&&p(!1);return document.addEventListener("mousedown",e),document.addEventListener("keydown",n),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("keydown",n)}},[m]),(0,r.jsxs)("div",{className:"hero-model-selector group/model relative z-[9999] max-w-full",children:[(0,r.jsxs)("button",{ref:g,type:"button",disabled:s,onClick:()=>!s&&p(e=>!e),onMouseMove:Z,"aria-label":"Select AI model","aria-haspopup":"listbox","aria-expanded":m&&!s,className:"hero-model-trigger group relative isolate flex h-9 max-w-full items-center gap-1.5 overflow-hidden rounded-[9px] border px-3 font-mono text-[0.72rem] uppercase tracking-[0.08em] transition-colors ".concat(s?"cursor-not-allowed border-white/[0.10] bg-white/[0.018] text-owl-neutral-inverse-500":"border-white/[0.12] bg-white/[0.025] text-[#999aa1] hover:bg-white/[0.045] hover:text-owl-neutral-inverse-100"),children:[!s&&(0,r.jsx)($,{size:120}),(0,r.jsx)("span",{className:"relative z-10 font-mono text-[0.70rem] font-[700] uppercase tracking-[0.12em] text-white",children:"Model:"}),(0,r.jsx)("span",{className:"relative z-10 max-w-[8.5rem] truncate whitespace-nowrap font-mono font-[400] uppercase text-[#DBDDE7] sm:max-w-none",children:f.label}),(0,r.jsx)(l.default,{className:"relative z-10 h-3.5 w-3.5 shrink-0 transition-transform ".concat(m&&!s?"rotate-180":""," ").concat(s?"text-owl-neutral-inverse-500":"text-owl-neutral-inverse-300")})]}),s?(0,r.jsx)("div",{className:"hero-model-reference-tooltip pointer-events-none absolute left-0 top-[calc(100%+0.55rem)] z-50 whitespace-normal break-words [text-wrap:balance] -translate-y-1 rounded-xl border border-white/[0.10] bg-white/[0.03] px-3 py-2 text-left font-body text-[0.72rem] leading-relaxed text-owl-neutral-inverse-300 opacity-0 shadow-[0_10px_28px_rgba(0,0,0,0.46)] backdrop-blur-md transition-all duration-200 group-hover/model:translate-y-0 group-hover/model:opacity-100",style:{width:"max-content",backgroundColor:"rgba(255,255,255,0.03)"},children:(0,r.jsx)(ee,{text:d})}):m?null:(0,r.jsx)("div",{className:"hero-model-reference-tooltip pointer-events-none absolute left-0 top-[calc(100%+0.55rem)] z-50 whitespace-normal break-words [text-wrap:balance] -translate-y-1 rounded-xl border border-white/[0.10] bg-white/[0.03] px-3 py-2 text-left font-body text-[0.72rem] leading-relaxed text-owl-neutral-inverse-300 opacity-0 shadow-[0_10px_28px_rgba(0,0,0,0.46)] backdrop-blur-md transition-all duration-200 group-hover/model:translate-y-0 group-hover/model:opacity-100",style:{width:"max-content",backgroundColor:"rgba(255,255,255,0.03)"}
1,children:(0,r.jsx)(ee,{text:"Choose the AI model for this prompt, or leave Smart Routing on to select the best model automatically."})}),m&&!s&&(0,r.jsxs)("div",{ref:u,role:"listbox",className:"hero-model-menu absolute bottom-[calc(100%+0.55rem)] left-0 z-[10000] w-[min(20rem,82vw)] max-w-[calc(100vw-1.5rem)] overflow-hidden rounded-2xl border border-white/[0.22] bg-[#08080a] p-1 text-left opacity-100 ",style:{background:"#050506",backgroundColor:"#050506",backgroundImage:"none",opacity:1,isolation:"isolate",WebkitBackdropFilter:"blur(18px) brightness(0.18)",backdropFilter:"blur(18px) brightness(0.18)",mixBlendMode:"normal",boxShadow:"0 22px 80px rgba(0,0,0,0.98), 0 0 0 1px rgba(0,0,0,0.92), inset 0 0 0 999px rgba(0,0,0,0.06), 0 0 20px rgba(252,1,153,0.08)"},children:[(0,r.jsx)("div",{className:"border-b border-white/[0.08] px-3 py-2 font-mono text-[0.82rem] uppercase tracking-[0.16em] text-owl-neutral-inverse-500",children:"Choose model"}),(0,r.jsx)("div",{className:"hero-model-menu-list max-h-[18rem] overflow-y-auto py-1",style:{scrollbarWidth:"thin",scrollbarColor:"#64748B44 transparent"},children:b.map(e=>(0,r.jsxs)("div",{className:"py-1",children:[e.title&&(0,r.jsxs)("div",{className:"flex items-center gap-2 px-3 pb-1 pt-2 font-mono text-[0.72rem] font-[700] uppercase tracking-[0.18em] text-owl-neutral-inverse-100",children:[(0,r.jsx)("span",{className:"whitespace-nowrap",children:e.title}),(0,r.jsx)("span",{"aria-hidden":!0,className:"h-px flex-1 bg-white/[0.14]"})]}),e.groups.map(e=>{var n;return(0,r.jsxs)("div",{children:[e.company&&(0,r.jsxs)("div",{className:"flex items-center gap-2 px-3 pb-0.5 pt-1.5 font-mono text-[0.62rem] font-[700] uppercase tracking-[0.14em] text-owl-neutral-inverse-500",children:[(0,r.jsx)("span",{className:"whitespace-nowrap",children:e.company}),(0,r.jsx)("span",{"aria-hidden":!0,className:"h-px flex-1 bg-white/[0.08]"})]}),e.options.map(n=>{let t=n.value===o;return(0,r.jsxs)("button",{type:"button",role:"option","aria-selected":t,onClick:()=>{i(n.value),p(!1)},className:"flex w-full items-center gap-2.5 py-2 pr-3 text-left font-body text-[0.82rem] transition-colors ".concat(e.company?"pl-5":"pl-3"," ").concat(t?"bg-owl-accent-primary/12 text-owl-neutral-inverse-50":"text-owl-neutral-inverse-300 hover:bg-white/[0.055] hover:text-owl-neutral-inverse-50"),children:[(0,r.jsx)(et,{company:n.company}),(0,r.jsxs)("span",{className:"min-w-0 flex-1",children:[(0,r.jsx)("span",{className:"block truncate font-[600]",children:n.label}),n.note&&(0,r.jsx)("span",{className:"block truncate text-[0.68rem] font-[400] text-owl-neutral-inverse-500",children:n.note})]}),t&&!n.recommended&&(0,r.jsx)("span",{className:"shrink-0 text-owl-accent-primary",children:"â"})]},n.value)})]},null!=(n=e.company)?n:"_")})]},e.id))}),x&&(0,r.jsxs)("button",{type:"button",onClick:()=>h(e=>!e),className:"flex w-full items-center justify-between border-t border-white/[0.08] px-3 py-2.5 font-body text-[0.82rem] font-[600] text-owl-neutral-inverse-200 transition-colors hover:bg-white/[0.055] hover:text-owl-neutral-inverse-50",children:[c?"Show fewer":"View all models",(0,r.jsx)("span",{"aria-hidden":!0,children:c?"â":"â"})]})]})]})}function ea(e){var n;let{modelCatalog:t}=e,l=(0,o.useRouter)(),[s,d]=(0,a.useState)(""),[m,p]=(0,a.useState)(!1),[c,h]=(0,a.useState)("Owl AI"),[g,u]=(0,a.useState)("Chat"),[b,x]=(0,a.useState)({llm:T,image:"",video:"",audio:"","3d":""}),f=X[g],w=b[f],[v,y]=(0,a.useState)(!1),k=(0,a.useRef)(null),[j,N]=(0,a.useState)(null),z=(0,a.useRef)(null),[A,C]=(0,a.useState)(!1),[E,I]=(0,a.useState)(null),M=(0,a.useRef)(null),O=(0,a.useRef)(!1),_=(0,a.useRef)(!1),[L,S]=(0,a.useState)(!1),P=(0,a.useRef)([]),R=function(e){let[n,t]=(0,a.useState)("");return(0,a.useEffect)(()=>{let n,r=0,a=0,o=!1,i=()=>{let l=e[r];if(l){if(o){if(a--,t(l.slice(0,a)),0===a){o=!1,r=(r+1)%e.length,n=setTimeout(i,2e3);return}}else if(a++,t(l.slice(0,a)),a===l.length){o=!0,n=setTimeout(i,1500);return}n=setTimeout(i,o?9:18)}};return n=setTimeout(i,260),()=>clearTimeout(n)},[e]),n}(V),{text:W,caretVisible:B}=function(e){let[n,t]=(0,a.useState)(""),[r,o]=(0,a.useState)(!0);return(0,a.useEffect)(()=>{let n,r=!1,a=0,i=0,l=(e,t)=>
1{n=setTimeout(()=>{r||e()},t)},s=function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0;if(e>=30){o(!0),l(d,140);return}o(e%2==1),l(()=>s(e+1),230)},d=()=>{let n=e[a];if(n){if(o(!0),i>0){i-=1,t(n.slice(0,i)),l(d,9);return}a=(a+1)%e.length,l(m,2e3)}},m=()=>{let n=e[a];if(n){if(o(!0),i<n.length){i+=1,t(n.slice(0,i)),l(m,18);return}l(()=>s(0),180)}};return l(m,260),()=>{r=!0,clearTimeout(n)}},[e]),{text:n,caretVisible:r}}(Y),D=function(e){var n;let[t,r]=(0,a.useState)(0);return(0,a.useEffect)(()=>{if(!e)return void r(0);let n=q.slice(1).map((e,n)=>setTimeout(()=>r(n+1),e.at));return()=>n.forEach(clearTimeout)},[e]),null!=(n=q[t])?n:q[0]}(v),H=["App / Website"].includes(c),K="Owl AI"===c,G=H&&!1,Q=K?"owl-ai":H?"apps":"nightowls",J=U.indexOf(c),et=s.trim().length>0&&!G;(0,a.useEffect)(()=>{G||l.prefetch(F.Zj[Q])},[Q,G,l]);let ea=(e,n)=>{if(window.matchMedia("(hover: none)").matches)return;let t=k.current;if(!t)return;let r=t.getBoundingClientRect(),a=e.getBoundingClientRect(),o=t.offsetWidth>0?r.width/t.offsetWidth:1,i=window.matchMedia("(max-width: 639px)").matches,l=e.closest(".hero-prompt-controls"),s=z.current,d=!!(null==s?void 0:s.contains(e));if(i&&d){let e=t.offsetWidth,i=en(n,e-24);N({text:n,left:Math.max(12,Math.min(e-i-12,(a.left+a.width/2-r.left)/o-i/2)),top:(a.top-r.top)/o-8,width:i,mobileBottomRowAbove:!1,mobileModeSliderAbove:!0,modeSliderTooltip:!0});return}if(i&&l)return void N({text:n,left:12,top:(l.getBoundingClientRect().top-r.top)/o-10,width:en(n,t.offsetWidth-24),mobileBottomRowAbove:!0,mobileModeSliderAbove:!1,modeSliderTooltip:!1});N({text:n,left:(a.left-r.left)/o,top:(a.bottom-r.top)/o+7,mobileBottomRowAbove:!1,mobileModeSliderAbove:!1,modeSliderTooltip:d})},eo=()=>N(null);(0,a.useEffect)(()=>{if(!j)return;let e=setTimeout(()=>N(null),2500),n=()=>N(null);return document.addEventListener("pointerdown",n),()=>{clearTimeout(e),document.removeEventListener("pointerdown",n)}},[j]);let ei=()=>{P.current.forEach(clearTimeout),P.current=[],S(!1);try{window.localStorage.setItem("nightowlHeroModeSliderInteracted","1")}catch(e){}};(0,a.useEffect)(()=>{let e=!1;try{e="1"===window.localStorage.getItem("nightowlHeroModeSliderInteracted")}catch(n){e=!1}e||S(!0)},[]),(0,a.useEffect)(()=>{if(!L)return;let e=!1,n=()=>{P.current.forEach(clearTimeout),P.current=[]},t=(n,t)=>{let r=setTimeout(()=>{e||t()},n);P.current.push(r)},r=()=>{e||(h("Owl AI"),t(3e3,()=>h("Nightowl")),t(6e3,()=>h("App / Website")),t(9e3,()=>h("Nightowl")),t(12e3,()=>h("Owl AI")),t(22e3,r))};return n(),r(),()=>{e=!0,n()}},[L]);let el=e=>{if(O.current&&null!==E){let e=Math.max(0,Math.min(U.length-1,Math.round(E/100)));h(U[e]),_.current=!0,setTimeout(()=>{_.current=!1},0)}else"number"==typeof e&&h(U[(e=>{let n=z.current;if(!n)return J;let t=n.getBoundingClientRect(),r=Math.max(0,Math.min(t.width-1,e-t.left));return Math.max(0,Math.min(U.length-1,Math.floor(r/t.width*U.length)))})(e)]);C(!1),I(null),M.current=null,O.current=!1},es=v?D.label:G?"COMING SOON":K?W:R;return(0,r.jsxs)("div",{ref:k,className:"hero-fog-protected relative z-30 mx-auto w-[calc(100%-0.25rem)] min-w-0 max-w-[47rem] sm:w-full",children:[(0,r.jsx)("span",{"aria-hidden":!0,className:"pointer-events-none absolute bottom-[-6px] right-[-4px] top-[50%] -z-30 w-[25.3rem] max-w-none rounded-[2rem]",style:{background:"linear-gradient(315deg, color-mix(in oklch, var(--owl-accent-primary) 82%, transparent) 0%, color-mix(in oklch, var(--owl-accent-primary) 34%, transparent) 30%, transparent 58%)",filter:"blur(16px)"}}),(0,r.jsx)("span",{"aria-hidden":!0,className:"pointer-events-none absolute left-[calc(-.25rem-10px)] top-[calc(-.25rem-10px)] -z-30 h-[35rem] w-[20rem] max-w-none rounded-[2rem]",style:{background:"linear-gradient(135deg, rgba(255,255,255,0.36) 0%, rgba(255,255,255,0.16) 16%, transparent 35%)",filter:"blur(20px)"}}),(0,r.jsx)("div",{"aria-hidden":!0,className:"hero-owl-outer-edge-overlay pointer-events-none absolute inset-0 z-[8] rounded-2xl",style:{padding:"1px",background:"linear-gradient(to bottom, rgba(255,255,255,0.095) 0%, rgba(255,255,255,0.070) 2.5%, rgba(255,255,255,0.046) 7%, rgba(255,255,255,0.032) 13%, rgba(255,255,255,0.024) 20%, rgba(255,255,255,0.024) 100%), radial-gradient(circle at 0% 0%, rgba(255,255,255,0.265) 0%, rgba(255,255,255,0.145) 11%, rgba(255,255,255,0.055) 25%, transparent 43%), radial-gradient(circle at 100% 100%, rgba(252,1,153,0.90) 0%, rgba(252,1,153,0.58) 12%, rgba(252,1,153,0.22) 27%, transparent 45%)",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",maskComposite:"exclude",filter:"drop-shadow(0 0 1.5px rgba(255,255,255,0.08))"}}
1),(0,r.jsx)("div",{"aria-hidden":!0,className:"hero-owl-outer-edge-overlay pointer-events-none absolute left-[1.05rem] right-[1.05rem] top-0 z-[8] h-px",style:{background:"linear-gradient(90deg, rgba(255,255,255,0.19) 0%, rgba(255,255,255,0.135) 24%, rgba(255,255,255,0.085) 50%, rgba(255,255,255,0.050) 74%, rgba(255,255,255,0.030) 100%)"}}),(0,r.jsx)("div",{"aria-hidden":!0,className:"hero-owl-outer-edge-overlay pointer-events-none absolute inset-0 z-[9] rounded-2xl",style:{padding:"1.5px",background:"radial-gradient(circle at 0% 0%, rgba(255,255,255,0.255) 0%, rgba(255,255,255,0.145) 8%, rgba(255,255,255,0.052) 15%, transparent 24%)",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",maskComposite:"exclude"}}),(0,r.jsx)("div",{"aria-hidden":!0,className:"hero-owl-outer-edge-overlay pointer-events-none absolute inset-0 z-[9] rounded-2xl",style:{padding:"2px",background:"radial-gradient(circle at 100% 100%, rgba(252,1,153,0.82) 0%, rgba(252,1,153,0.50) 8%, rgba(252,1,153,0.19) 16%, transparent 24%)",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",maskComposite:"exclude"}}),(0,r.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 -z-10 rounded-2xl",style:{background:"linear-gradient(180deg, rgba(3,3,5,0.78) 0%, rgba(3,2,4,0.72) 100%)"}}),(0,r.jsxs)("form",{onSubmit:e=>{if(e.preventDefault(),G||v)return;let n=s.trim();n&&((0,F.rX)({target:Q,prompt:n,...K?{mode:f,...w?{modelKey:w}:{}}:{}}),d(""),ei(),y(!0),l.push(F.Zj[Q]))},className:"relative w-full rounded-2xl pb-1 sm:pb-[clamp(0.25rem,0.8vh,0.75rem)] sm:shadow-[inset_0_0_40px_-26px_rgba(255,255,255,0.2)]",style:{background:"linear-gradient(180deg, rgba(14,7,13,0.91) 0%, rgba(7,5,8,0.89) 62%, rgba(12,5,10,0.90) 100%)",backgroundImage:"radial-gradient(ellipse 84% 54% at 50% 4%, rgba(252,1,153,0.10935) 0%, rgba(252,1,153,0.05184) 34%, rgba(252,1,153,0.02106) 58%, transparent 78%)",WebkitBackdropFilter:"blur(16px) saturate(108%)",backdropFilter:"blur(16px) saturate(108%)",boxShadow:"inset 0 1px 0 rgba(255,255,255,0.085), inset 18px 0 34px -32px rgba(252,1,153,0.10), inset -18px 0 34px -32px rgba(252,1,153,0.08)"},children:[(0,r.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-0 rounded-2xl",style:{background:"radial-gradient(ellipse 72% 42% at 50% 5%, rgba(252,1,153,0.14175) 0%, rgba(252,1,153,0.07938) 27%, rgba(252,1,153,0.0324) 48%, transparent 72%), radial-gradient(ellipse 58% 52% at 50% 38%, rgba(252,1,153,0.05427) 0%, rgba(252,1,153,0.02511) 42%, transparent 72%)"}}),(0,r.jsxs)("div",{className:"px-2 sm:px-3",children:[(0,r.jsxs)("div",{className:"relative z-[1] mb-[clamp(0.78rem,1.45vw,0.92rem)] pt-[clamp(0.58rem,1.18vw,0.84rem)] text-center",children:[(0,r.jsx)("span",{"aria-hidden":!0,className:"pointer-events-none absolute left-1/2 top-[-2.75rem] h-[12rem] w-[96%] -translate-x-1/2 rounded-full blur-[30px]",style:{background:"radial-gradient(ellipse at center, rgba(252,1,153,0.11745) 0%, rgba(252,1,153,0.0729) 28%, rgba(252,1,153,0.03402) 52%, transparent 76%)",WebkitMaskImage:"linear-gradient(to bottom, transparent 0%, transparent 18%, rgba(0,0,0,0.22) 24%, #000 34%, #000 100%)",maskImage:"linear-gradient(to bottom, transparent 0%, transparent 18%, rgba(0,0,0,0.22) 24%, #000 34%, #000 100%)"}}),(0,r.jsx)("span",{"aria-hidden":!0,className:"pointer-events-none absolute left-1/2 top-[2.2rem] h-[13rem] w-[72%] -translate-x-1/2 rounded-full blur-[42px]",style:{background:"radial-gradient(ellipse at center, rgba(252,1,153,0.0729) 0%, rgba(252,1,153,0.03726) 34%, rgba(252,1,153,0.01458) 58%, transparent 78%)"}}),(0,r.jsx)("span",{className:"relative z-10 font-mono text-[clamp(0.66rem,3vw,0.82rem)] font-[500] uppercase tracking-[0.18em] text-[#FC0199] sm:text-[clamp(0.72rem,1.8vw,0.94rem)] sm:tracking-[0.27em] lg:text-[clamp(0.72rem,1.2vw,1rem)]",style:{textShadow:"none",WebkitFontSmoothing:"antialiased",textRendering:"geometricPrecision"},children:"OWL AI"})]}),(0,r.jsxs)("div",{ref:z,className:"relative isolate grid min-h-[3.1rem] grid-cols-3 overflow-hidden rounded-xl border-0 p-1 backdrop-blur-xl [contain:paint]",style:{touchAction:"pan-y",backgroundColor:"rgba(0,0,0,0.75)",border:"none",outline:"none",boxShadow:"none"},onPointerDown:e=>{ei(),C(!0),M.current=e.clientX,O.current=!1,e.currentTarget.setPointerCapture(e.pointerId)},onPointerMove:e=>{A&&null!==M.current&&(!(3>Math.abs(e.clientX-M.current))||O.current)&&(O.current=!0,I((e=>{let n=z.current;if(!n)return 100*J;let t=n.getBoundingClientRect(),r=Math.max(1,t.width-8),a=r/U.length;return Math.max(0,Math.min(r-a,e-t.left-4-a/2))/a*100})(e.clientX)))},onPointerUp:e=>el(e.clientX),onPointerCancel:()=>
1el(),children:[(0,r.jsx)(i.P.span,{"aria-hidden":!0,className:"hero-mode-slider-thumb pointer-events-none absolute bottom-1 top-1 rounded-lg border border-[#FC0199]/28 bg-[linear-gradient(180deg,rgba(252,1,153,0.28),rgba(252,1,153,0.12))] shadow-[inset_0_1px_0_rgba(255,255,255,0.12),0_8px_22px_rgba(0,0,0,0.24),0_0_24px_rgba(252,1,153,0.12)] backdrop-blur-2xl transition-[background,border-color,box-shadow] duration-300",style:{width:"calc((100% - 0.5rem) / 3)",willChange:"left",contain:"paint"},animate:{left:(()=>{let e=null!==E?E:100*J;return"calc(".concat(e/3,"% + ").concat(.25-e/600,"rem)")})()},transition:A?{duration:0}:{duration:.42,ease:[.22,.72,.24,1]}}),U.map(e=>{let n=e===c;return(0,r.jsx)("button",{type:"button",onClick:()=>{_.current||(ei(),h(e))},onMouseEnter:n=>ea(n.currentTarget,"Owl AI"===e?"Private, multi-model chat and creation with OWL AI.":"Nightowl"===e?"Create a persistent Nightowl agent that can remember and work for you.":"Build Apps / Websites : Coming Soon"),onMouseLeave:eo,onFocus:n=>ea(n.currentTarget,"Owl AI"===e?"Private, multi-model chat and creation with OWL AI.":"Nightowl"===e?"Create a persistent Nightowl agent that can remember and work for you.":"Build Apps / Websites : Coming Soon"),onBlur:eo,className:"relative z-10 flex min-w-0 items-center justify-center px-1 py-2 font-heading text-[clamp(0.70rem,3vw,0.86rem)] leading-none tracking-[-0.015em] transition-[color,opacity] duration-200 sm:px-2 sm:text-[clamp(0.82rem,2vw,1rem)] lg:text-[clamp(0.81rem,1.06vw,1.02rem)] ".concat(n?"font-[500] text-white opacity-100":"font-[400] text-owl-neutral-inverse-300 opacity-[0.51] hover:opacity-[0.68]"),children:"Nightowl"===e?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"font-[400] sm:hidden",children:"Hatch"}),(0,r.jsxs)("span",{className:"hidden min-w-0 items-center justify-center gap-1.5 whitespace-nowrap sm:inline-flex",children:[(0,r.jsxs)("span",{className:"font-[400]",children:[(0,r.jsx)("span",{children:"Hatch"})," your"]}),(0,r.jsx)("img",{src:"/nightowl-wordmark.png",alt:"Nightowl",className:"relative h-[0.78em] w-auto max-w-[7.2rem] object-contain"})]})]}):"Owl AI"===e?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"font-[400] sm:hidden",children:"Chat"}),(0,r.jsxs)("span",{className:"hidden min-w-0 items-center justify-center gap-1.5 whitespace-nowrap sm:inline-flex",children:[(0,r.jsxs)("span",{className:"font-[400]",children:[(0,r.jsx)("span",{children:"Chat"})," with"]}),(0,r.jsx)("img",{src:"/owl-wordmark.svg",alt:"Owl AI",className:"relative h-[0.78em] w-auto max-w-[5.6rem] object-contain"})]})]}):(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"font-[400] sm:hidden",children:"Build"}),(0,r.jsxs)("span",{className:"hidden whitespace-nowrap font-[400] sm:inline",children:[(0,r.jsx)("span",{children:"Build"})," App / Website"]})]})},e)})]})]}),(0,r.jsxs)("div",{className:"hero-prompt-inner-shell relative mx-2 mb-2 mt-2 rounded-2xl border border-white/[0.14] bg-black/[0.98] px-2.5 py-[clamp(0.65rem,1.55vh,1.15rem)] shadow-[inset_0_0_60px_rgba(0,0,0,1)] backdrop-blur-md sm:px-4",children:[(0,r.jsxs)("div",{className:"relative",children:[(0,r.jsx)("button",{type:"button",disabled:G,"aria-disabled":G,"aria-label":G?"Voice input unavailable while Build is coming soon":"Dictate with your microphone",onMouseEnter:e=>{G||ea(e.currentTarget,"Dictate your prompt using your microphone.")},onMouseLeave:eo,onFocus:e=>{G||ea(e.currentTarget,"Dictate your prompt using your microphone.")},onBlur:eo,className:"absolute right-3 top-[0.3rem] z-30 flex h-8 w-8 items-center justify-center rounded-lg transition-colors ".concat(G?"cursor-not-allowed text-[#62646b] opacity-55":"text-owl-neutral-inverse-300 hover:text-owl-accent-primary"),children:(0,r.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:1.4,strokeLinecap:"round",strokeLinejoin:"round",className:"h-[1.4rem] w-[1.4rem]","aria-hidden":!0,children:[(0,r.jsx)("rect",{x:"9",y:"2",width:"6",height:"11",rx:"3"}),(0,r.jsx)("path",{d:"M5 10.5v1a7 7 0 0 0 14 0v-1"}),(0,r.jsx)("line",{x1:"12",y1:"18.5",x2:"12",y2:"21.5"}),(0,r.jsx)("line",{x1:"8.5",y1:"21.5",x2:"15.5",y2:"21.5"})]})}),(0,r.jsx)("textarea",{rows:3,disabled:G||v,"aria-disabled":G||v,value:G?"":s,onKeyDown:e=>{if("Enter"===e.key&&!e.shiftKey){var n;e.preventDefault(),!G&&!v&&s.trim()&&(null==(n=e.currentTarget.form)||n.requestSubmit())}},onFocus:()=>{G||p(!0)},onBlur:()=>p(!1),onChange:e=>{G||(e.target.value!==s&&ei(),d(e.target.value))},"aria-label":G?"Build app and website prompt â coming soon":"Describe what you want your Nightowl AI agent to do",className:"relative z-10 min-h-[9rem] w-full resize-none rounded-lg border-0 px-3 py-2 pr-9 font-heading text-[clamp(0.96rem,4.2vw,1.08rem)] leading-relaxed focus:outline-none sm:min-h-[4rem] lg:min-h-[4.55rem] lg:text-[clamp(0.66rem,0.9vw,0.9rem)] ".concat(G?"cursor-not-allowed bg-black/[0.985] text-[#73757d] shadow-[inset_0_2px_4px_rgba(255,255,255,0.025),inset_0_0_60px_rgba(0,0,0,1)]":"bg-black/[0.985] text-owl-neutral-inverse-50 shadow-[inset_0_2px_4px_rgba(255,255,255,0.025),inset_0_0_60px_rgba(0,0,0,1)]")}
1),(G||v||""===s&&!m)&&(0,r.jsxs)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-20 overflow-hidden px-3 py-2 pr-9 font-heading text-[clamp(0.96rem,4.2vw,1.08rem)] leading-relaxed lg:text-[clamp(0.66rem,0.9vw,0.9rem)] ".concat(G?"font-medium tracking-[0.12em] text-[#777982]":v?"text-[#FC0199]":"text-[#92939a]"),children:[es,v&&(0,r.jsx)("span",{className:"mt-3 block h-[3px] w-full max-w-[22rem] overflow-hidden rounded-full bg-white/[0.08]",children:(0,r.jsx)("span",{className:"hero-takeoff-fill block h-full rounded-full",style:{width:"".concat(D.width,"%")}})}),v||G?null:K?(0,r.jsx)("span",{className:"owl-caret-blink ml-[1px] inline-block h-[1em] w-px translate-y-[0.12em] bg-[#96979e] ".concat("")}):(0,r.jsx)("span",{className:"owl-caret-blink ml-[1px] inline-block h-[1em] w-px translate-y-[0.12em] bg-[#96979e]"})]})]}),(0,r.jsxs)("div",{className:"hero-prompt-controls mt-[clamp(0.5rem,1.5vh,0.75rem)] flex flex-wrap items-center gap-[clamp(0.55rem,0.9vw,0.75rem)] sm:flex-nowrap",children:[(0,r.jsxs)("div",{className:"hero-mode-shortcuts inline-flex h-9 shrink-0 items-stretch overflow-hidden rounded-[9px] border border-white/[0.14] bg-white/[0.018]","aria-label":"Nightowl mode shortcuts",children:[(0,r.jsxs)("button",{type:"button","aria-label":"Chat with Owl AI",onMouseEnter:e=>ea(e.currentTarget,"Talk to OWL AI for private, multi-model chat and creation."),onMouseLeave:eo,onFocus:e=>ea(e.currentTarget,"Talk to OWL AI for private, multi-model chat and creation."),onBlur:eo,"aria-pressed":K,onClick:()=>{ei(),h("Owl AI")},onMouseMove:Z,className:"group relative isolate z-0 flex h-full w-9 items-center justify-center overflow-hidden rounded-l-[9px] border-r border-white/[0.10] bg-transparent text-[#a7a9b5] transition-[background-color,color,box-shadow] hover:bg-white/[0.045]",style:{backgroundColor:K?"rgba(252,1,153,0.07)":"transparent",boxShadow:K?"var(--hero-shortcut-selected-shadow-owl)":"none",color:K?"#fff":"#a7a9b5"},children:[(0,r.jsx)($,{size:90}),K&&(0,r.jsx)("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-[1px] z-[20] rounded-l-[7px] border-[1.5px] border-[#FC0199]"}),(0,r.jsx)("img",{src:"/owl-ai-logo.svg",alt:"","aria-hidden":!0,className:"relative z-10 h-[clamp(1.05rem,1.65vw,1.18rem)] w-[clamp(1.05rem,1.65vw,1.18rem)] object-contain transition-opacity duration-200 ".concat(K?"opacity-100":"opacity-50")})]}),(0,r.jsxs)("button",{type:"button","aria-label":"Hatch a Nightowl",onMouseEnter:e=>ea(e.currentTarget,"Switch to Nightowl mode to create a persistent AI agent that can remember and work for you."),onMouseLeave:eo,onFocus:e=>ea(e.currentTarget,"Switch to Nightowl mode to create a persistent AI agent that can remember and work for you."),onBlur:eo,"aria-pressed":"Nightowl"===c,onClick:()=>{ei(),h("Nightowl")},onMouseMove:Z,className:"group relative isolate z-0 flex h-full w-9 items-center justify-center overflow-hidden border-r border-white/[0.10] bg-transparent text-[#a7a9b5] transition-[background-color,color,box-shadow] hover:bg-white/[0.045]",style:{backgroundColor:"Nightowl"===c?"rgba(252,1,153,0.07)":"transparent",boxShadow:"Nightowl"===c?"var(--hero-shortcut-selected-shadow)":"none",color:"Nightowl"===c?"#fff":"#a7a9b5"},children:[(0,r.jsx)($,{size:90}),(0,r.jsx)("img",{src:"/images/white-owl-head-icon.webp",alt:"","aria-hidden":!0,className:"relative z-10 h-[clamp(1.408rem,2.255vw,1.606rem)] w-[clamp(1.408rem,2.255vw,1.606rem)] object-contain transition-[opacity,filter,transform] duration-200 ".concat("Nightowl"===c?"scale-[1.04] opacity-100 brightness-[1.78] contrast-[1.06] drop-shadow-[0_0_3px_rgba(255,255,255,0.95)] drop-shadow-[0_0_6px_rgba(255,255,255,0.48)] drop-shadow-[0_0_8px_rgba(252,1,153,0.18)]":"opacity-100 brightness-[1.38] contrast-[1.06] drop-shadow-[0_0_3px_rgba(255,255,255,0.72)] drop-shadow-[0_0_7px_rgba(252,1,153,0.20)]")})]}),(0,r.jsxs)("button",{type:"button","aria-label":"Build an App or Website",onMouseEnter:e=>ea(e.currentTarget,"Build Apps / Websites : Coming Soon"),onMouseLeave:eo,onFocus:e=>ea(e.currentTarget,"Build Apps / Websites : Coming Soon"),onBlur:eo,"aria-pressed":H,onClick:()=>{ei(),h("App / Website")},onMouseMove:Z,className:"group relative isolate z-0 flex h-full w-9 items-center justify-center overflow-hidden rounded-r-[9px] bg-transparent text-[#a7a9b5] transition-[background-color,color,box-shadow] hover:bg-white/[0.045]",style:{backgroundColor:H?"rgba(252,1,153,0.07)":"transparent",boxShadow:H?"var(--hero-shortcut-selected-shadow)":"none",color:H?"#fff":"#a7a9b5"},children:[(0,r.jsx)($,{size:90}),(0,r.jsxs)("svg",{viewBox:"0 0 24 24","aria-hidden":"true",className:"relative z-10 h-[clamp(1.12rem,1.76vw,1.27rem)] w-[clamp(1.12rem,1.76vw,1.27rem)] fill-none stroke-current transition-opacity duration-200 ".concat(H?"opacity-100":"opacity-68"),strokeWidth:1.6,strokeLinecap:"round",strokeLinejoin:"round",children:[(0,r.jsx)("rect",{x:"5.75",y:"2.25",width:"12.5",height:"19.5",rx:"3.1"}),(0,r.jsx)("rect",{x:"9.25",y:"4.15",width:"5.5",height:"1.9",rx:"0.95",fill:"currentColor",stroke:"none"}),(0,r.jsx)("rect",{x:"8.35",y:"9.05",width:"2.8",height:"2.8",rx:"0.82",fill:"
1currentColor",stroke:"none"}),(0,r.jsx)("rect",{x:"12.85",y:"9.05",width:"2.8",height:"2.8",rx:"0.82",fill:"currentColor",stroke:"none"}),(0,r.jsx)("rect",{x:"8.35",y:"13.55",width:"2.8",height:"2.8",rx:"0.82",fill:"currentColor",stroke:"none"}),(0,r.jsx)("rect",{x:"12.85",y:"13.55",width:"2.8",height:"2.8",rx:"0.82",fill:"currentColor",stroke:"none"})]})]})]}),(0,r.jsx)(i.P.div,{initial:!1,animate:{width:K?"var(--owl-tools-width, 11.375rem)":"0rem",opacity:+!!K,x:K?0:-6},transition:{duration:.28,ease:[.2,.8,.2,1]},"aria-hidden":!K,"data-owl-active":K?"true":"false",style:{pointerEvents:K?"auto":"none",willChange:"width, opacity, transform"},className:"hero-owl-tools flex h-9 shrink-0 items-center overflow-hidden",children:(0,r.jsx)("div",{className:"inline-flex h-9 items-stretch overflow-hidden rounded-[9px] border border-white/[0.14] bg-white/[0.018]","aria-label":"Owl AI creation tools",children:[{key:"Chat",label:"Chat",tooltip:"Chat with the selected model using text and reasoning.",icon:(0,r.jsx)("svg",{viewBox:"0 0 24 24","aria-hidden":"true",children:(0,r.jsx)("path",{d:"M5 5.5h14a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H10l-5 3v-3H5a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2Z"})})},{key:"Image",label:"Image",tooltip:"Create or edit images.",icon:(0,r.jsxs)("svg",{viewBox:"0 0 24 24","aria-hidden":"true",children:[(0,r.jsx)("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),(0,r.jsx)("circle",{cx:"9",cy:"9",r:"1.5"}),(0,r.jsx)("path",{d:"m4.5 18 5.2-5.2 3.2 3.2 2.1-2.1 4.5 4.1"})]})},{key:"Video",label:"Video",tooltip:"Generate video.",icon:(0,r.jsxs)("svg",{viewBox:"0 0 24 24","aria-hidden":"true",className:"scale-110",children:[(0,r.jsx)("circle",{cx:"9",cy:"7",r:"2.6"}),(0,r.jsx)("circle",{cx:"15",cy:"7",r:"2.6"}),(0,r.jsx)("rect",{x:"5",y:"10",width:"12",height:"8.5",rx:"2.2"}),(0,r.jsx)("path",{d:"m17 12.2 4-2v8l-4-2"})]})},{key:"Audio",label:"Audio",tooltip:"Create music, sound, or other audio.",icon:(0,r.jsxs)("svg",{viewBox:"0 0 24 24","aria-hidden":"true",children:[(0,r.jsx)("path",{d:"M9 18V6l9-2v12"}),(0,r.jsx)("circle",{cx:"6.5",cy:"18",r:"2.5"}),(0,r.jsx)("circle",{cx:"15.5",cy:"16",r:"2.5"})]})},{key:"3D",label:"3D rendering",tooltip:"Generate 3D concepts and renderings.",icon:(0,r.jsxs)("svg",{viewBox:"0 0 24 24","aria-hidden":"true",children:[(0,r.jsx)("path",{d:"m12 3 8 4.5v9L12 21l-8-4.5v-9L12 3Z"}),(0,r.jsx)("path",{d:"m4.5 7.8 7.5 4.2 7.5-4.2M12 12v9"})]})}].map((e,n,t)=>{let a=g===e.key;return(0,r.jsxs)("button",{type:"button","aria-label":e.label,"aria-pressed":a,onMouseEnter:n=>ea(n.currentTarget,e.tooltip),onMouseLeave:eo,onFocus:n=>ea(n.currentTarget,e.tooltip),onBlur:eo,onClick:()=>u(e.key),onMouseMove:Z,className:"group relative isolate z-0 flex h-full w-9 items-center justify-center overflow-hidden bg-transparent text-[#a7a9b5] transition-[background-color,color,box-shadow] hover:bg-white/[0.045] ".concat(n<t.length-1?"border-r border-white/[0.10]":""," ").concat(0===n?"rounded-l-[9px]":n===t.length-1?"rounded-r-[9px]":""),style:{backgroundColor:a?"rgba(252,1,153,0.07)":"transparent",color:a?"#fff":"#a7a9b5",boxShadow:a?"var(--hero-shortcut-selected-shadow)":"none"},children:[(0,r.jsx)($,{size:90}),(0,r.jsx)("span",{className:"relative z-10 h-4 w-4 [&>svg]:h-4 [&>svg]:w-4 [&>svg]:fill-none [&>svg]:stroke-current [&>svg]:stroke-[1.7] [&>svg]:[stroke-linecap:round] [&>svg]:[stroke-linejoin:round]",children:e.icon})]},e.key)})})}),(0,r.jsxs)("div",{className:"hero-secondary-controls contents",children:[(0,r.jsx)(er,{catalog:t,modality:f,value:w,onChange:e=>x(n=>({...n,[f]:e})),disabled:!K,disabledReason:"Nightowl"===c?"Model selection available in Owl AI Chat. Hatch action automatically selects the model.":"Model selection not available to start Build app / website mode"}),(0,r.jsxs)("button",{type:"button",disabled:G,"aria-disabled":G,"aria-label":G?"Attach unavailable while Build is coming soon":"Attach file",onMouseEnter:e=>{G||ea(e.currentTarget,"Attach a file or image to give the model additional context.")},onMouseLeave:eo,onFocus:e=>{G||ea(e.currentTarget,"Attach a file or image to give the model additional context.")},onBlur:eo,onMouseMove:G?void 0:Z,className:"hero-attach-control group relative isolate flex h-9 w-9 shrink-0 items-center justify-center overflow-hidden rounded-[9px] border transition-colors ".concat(G?"cursor-not-allowed border-white/[0.07] bg-white/[0.012] text-[#62646b] opacity-55":"border-white/[0.12] bg-white/[0.025] text-[#a7a9b5] hover:bg-white/[0.045] hover:text-owl-neutral-inverse-100"),children:[!G&&(0,r.jsx)($,{size:90}),(0,r.jsx)("svg",{viewBox:"0 0 24 24","aria-hidden":"true",className:"relative z-10 h-4 w-4 fill-none stroke-current stroke-[1.7]",strokeLinecap:"round",strokeLinejoin:"round",children:(0,r.jsx)("path",{d:"M21.4 11.6 12 21a6 6 0 0 1-8.5-8.5l10-10a4 4 0 1 1 5.7 5.7L9.8 17.6a2 2 0 1 1-2.8-2.8l8.7-8.7"})})]}),(0,r.jsxs)("button",{type:"submit",disabled:!et||v,"aria-disabled":!et||v,"aria-busy":v,"aria-label":v?"Sending":void 0,"data-ready":et&&!v?"true":"false",onMouseEnter:e=>{et&&ea(e.currentTarget,K?"Send your prompt to OWL AI.":H?"Start building the app or website described
1in your prompt.":"Hatch a Nightowl from your prompt.")},onMouseLeave:eo,onFocus:e=>{et&&ea(e.currentTarget,K?"Send your prompt to OWL AI.":H?"Start building the app or website described in your prompt.":"Hatch a Nightowl from your prompt.")},onBlur:eo,onMouseMove:et?Z:void 0,className:"hero-prompt-submit group relative isolate ml-auto flex h-9 min-h-9 max-h-9 shrink-0 items-center justify-center overflow-hidden whitespace-nowrap rounded-[9px] border px-[clamp(0.7rem,3vw,1.125rem)] font-mono font-normal text-[clamp(0.66rem,3vw,0.82rem)] uppercase sm:text-[clamp(0.72rem,1.8vw,0.94rem)] tracking-[0.16em] transition-[border-color,background-color,color,opacity] duration-200 lg:text-[clamp(0.72rem,1.2vw,1rem)] ".concat(G?"cursor-not-allowed border-white/[0.10] bg-black text-[#777982] opacity-75":v?"cursor-wait border-owl-accent-primary bg-[#B01470] text-white":et?"cursor-pointer border-owl-accent-primary bg-[#B01470] text-white":"cursor-not-allowed border-transparent bg-[#B01470] text-white"),children:[et&&!v&&(0,r.jsx)($,{size:110}),(0,r.jsxs)("span",{className:"relative z-10 pl-[0.12em]",children:[(0,r.jsx)("span",{className:v?"invisible":void 0,children:K?"CHAT":H?"BUILD":"HATCH"}),v&&(0,r.jsx)("span",{"aria-hidden":!0,className:"absolute inset-0 flex items-center justify-center",children:(0,r.jsx)("span",{className:"hero-takeoff-arrow inline-block text-[1.15em] leading-none",children:"â"})})]})]})]})]})]})]}),j&&(0,r.jsx)("div",{role:"tooltip",className:"hero-other-tooltip-glass hero-prompt-control-tooltip pointer-events-none absolute z-[10001] inline-block whitespace-normal break-words [text-wrap:balance] rounded-xl border border-white/[0.10] px-3 py-2 text-left font-body text-[0.72rem] leading-relaxed text-owl-neutral-inverse-300 shadow-[0_10px_28px_rgba(0,0,0,0.46)] ".concat(j.mobileBottomRowAbove?"hero-prompt-control-tooltip-mobile-above":j.mobileModeSliderAbove?"hero-prompt-control-tooltip-mobile-slider":""),style:{left:j.left,top:j.top,width:null!=(n=j.width)?n:"max-content",backgroundColor:"rgba(255,255,255,0.03)"},children:j.modeSliderTooltip?(0,r.jsx)("span",{className:"hero-mode-tooltip-copy block whitespace-nowrap",children:j.text}):(0,r.jsx)(ee,{text:j.text})})]})}},85486:(e,n,t)=>{"use strict";t.d(n,{default:()=>p});var r=t(95155),a=t(12115),o=t(11138);function i(){return(0,r.jsx)("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"w-5 h-5 overflow-hidden",children:(0,r.jsx)("path",{d:"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.748l7.73-8.835L1.254 2.25H8.08l4.264 5.634 5.9-5.634Zm-1.161 17.52h1.833L7.084 4.126H5.117L17.083 19.77Z",fill:"rgba(255,255,255,0.55)",className:"transition-[fill] duration-[0.25s]"})})}function l(){return(0,r.jsx)("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"w-5 h-5 overflow-hidden",children:(0,r.jsx)("path",{d:"M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286ZM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065Zm1.782 13.019H3.555V9h3.564v11.452ZM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003Z",fill:"rgba(255,255,255,0.55)",className:"transition-[fill] duration-[0.25s]"})})}var s=t(67514),d=t(75866);let m=[{label:"Parliament",href:"#security",sheenColor:"#39FF14",textClass:"text-owl-neutral-inverse-300 transition-[color,text-shadow] duration-300 hover:text-[#39FF14] hover:[text-shadow:0_0_4px_#39FF14,0_0_12px_#39FF14]"},{label:"Platform",href:"#platform",sheenColor:"#FC0199"},{label:"Mission",href:"#mission",sheenColor:"#FC0199"},{label:"Token",href:"#token",sheenColor:"#47FFFF",textClass:"text-owl-neutral-inverse-300 transition-[color,text-shadow] duration-300 hover:text-[#47FFFF] hover:[text-shadow:0_0_4px_#47FFFF,0_0_12px_#47FFFF]"},{label:"Identity",href:"#identity",sheenColor:"#FFFF33",textClass:"text-owl-neutral-inverse-300 transition-[color,text-shadow] duration-300 hover:text-[#FFFF33] hover:[text-shadow:0_0_4px_#FFFF33,0_0_12px_#FFFF33]"}];function p(){let[e,n]=(0,a.useState)([]),[t,p]=(0,a.useState)(!1),c=(0,d.useAuthStore)(e=>e.isAuthenticated),[h,g]=(0,a.useState)(!1);(0,a.useEffect)(()=>g(!0),[]);let u=h&&c;return(0,a.useEffect)(()=>{let e=e=>{"Escape"===e.key&&p(!1)},n=()=>{window.innerWidth>=768&&p(!1)};return window.addEventListener("keydown",e),window.addEventListener("resize",n),(
1)=>{window.removeEventListener("keydown",e),window.removeEventListener("resize",n)}},[]),(0,a.useEffect)(()=>{let e=!1,t=0,r=[],a=e=>new Promise(n=>{let t=setTimeout(n,e);r.push(t)}),o=(e,a)=>{let o=t++;n(n=>[...n,{id:o,index:e,direction:a}]);let i=setTimeout(()=>{n(e=>e.filter(e=>e.id!==o))},3500);r.push(i)};return async function(){for(;!e;){for(let n=0;n<m.length;n++)if(o(n,"ltr"),await a(n===m.length-1?5500:800),e)return;for(let n=m.length-1;n>=0;n--)if(o(n,"rtl"),await a(0===n?5500:800),e)return}}(),()=>{e=!0,r.forEach(clearTimeout)}},[]),(0,r.jsxs)("header",{className:"fixed inset-x-0 top-0 z-[1000] border-b border-white/10",children:[(0,r.jsx)("div",{"aria-hidden":!0,className:"absolute inset-0 -z-10 bg-black/50 backdrop-blur-xl"}),(0,r.jsxs)("div",{className:"navbar-shell relative mx-auto flex h-16 w-full max-w-[1600px] items-center justify-between px-4 sm:px-6 lg:px-8",children:[(0,r.jsx)("a",{href:"/","aria-label":"Nightowl AI",className:"navbar-logo relative z-20 flex shrink-0 items-center",children:(0,r.jsx)(o.A,{className:"h-5 w-auto overflow-visible [--owl-accent-primary:#FC0199]"})}),(0,r.jsxs)("span",{"aria-label":"OWL balance",className:"navbar-mobile-owl-balance relative z-20 ml-auto mr-3 flex shrink-0 items-center justify-end gap-1.5 font-mono text-[0.66rem] uppercase tracking-[0.08em] text-[#47FFFF] [text-shadow:0_0_4px_#47FFFF80,0_0_10px_#47FFFF40] sm:hidden",children:[(0,r.jsx)("span",{className:"whitespace-nowrap",children:"$OWL:"}),(0,r.jsxs)("svg",{viewBox:"0 0 20 11",className:"h-[0.90rem] w-[1.68rem] shrink-0 [filter:drop-shadow(0_0_3px_#47FFFF)]","aria-hidden":!0,children:[(0,r.jsx)("rect",{x:"0.6",y:"1.1",width:"16.4",height:"8.8",rx:"1.8",fill:"none",stroke:"#47FFFF",strokeWidth:"1"}),(0,r.jsx)("rect",{x:"18",y:"3.4",width:"1.8",height:"4.2",rx:"0.7",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"2.2",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"5.7",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"9.2",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"12.7",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"})]})]}),(0,r.jsxs)("nav",{className:"navbar-center absolute left-1/2 top-1/2 z-10 hidden min-w-0 -translate-x-1/2 -translate-y-1/2 items-center justify-center gap-1 lg:flex xl:gap-1.5",children:[(0,r.jsx)("div",{className:"relative flex min-w-0 items-center gap-1 rounded-xl xl:gap-1.5",children:m.map((n,t)=>{var a,o,i;let l=e.find(e=>e.index===t);return(0,r.jsx)(s.GlassLink,{href:n.href,surface:!0,sheenSize:56,sheenColor:n.sheenColor,idleSweepActive:!!l,idleSweepDirection:null!=(a=null==l?void 0:l.direction)?a:"ltr",idleSweepToken:null!=(o=null==l?void 0:l.id)?o:0,className:"navbar-primary-link relative z-10 whitespace-nowrap rounded-lg px-2.5 py-2 font-mono text-[0.70rem] uppercase tracking-[0.12em] xl:px-4 xl:text-[0.78rem] xl:tracking-[0.16em] ".concat(null!=(i=n.textClass)?i:"text-owl-neutral-inverse-300 hover:text-owl-neutral-inverse-50"),children:(0,r.jsx)("span",{className:"navbar-label-content",children:n.label})},n.label)})}),(0,r.jsxs)("span",{"aria-label":"OWL balance",className:"navbar-owl-balance relative z-10 ml-1 flex shrink-0 items-center gap-1.5 px-2 py-2 font-mono text-[0.78rem] uppercase tracking-[0.12em] text-[#47FFFF] [text-shadow:0_0_4px_#47FFFF80,0_0_10px_#47FFFF40] xl:px-3 xl:text-[0.85rem] xl:tracking-[0.16em]",children:[(0,r.jsx)("span",{children:"$OWL:"}),(0,r.jsxs)("svg",{viewBox:"0 0 20 11",className:"h-3 w-[1.4rem] shrink-0 [filter:drop-shadow(0_0_3px_#47FFFF)]","aria-hidden":!0,children:[(0,r.jsx)("rect",{x:"0.6",y:"1.1",width:"16.4",height:"8.8",rx:"1.8",fill:"none",stroke:"#47FFFF",strokeWidth:"1"}),(0,r.jsx)("rect",{x:"18",y:"3.4",width:"1.8",height:"4.2",rx:"0.7",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"2.2",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"5.7",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"9.2",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"12.7",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"})]})]})]}
1),(0,r.jsxs)("nav",{className:"navbar-tablet-center",children:[m.map((n,t)=>{var a,o,i;let l=e.find(e=>e.index===t);return(0,r.jsx)(s.GlassLink,{href:n.href,surface:!0,sheenSize:48,sheenColor:n.sheenColor,idleSweepActive:!!l,idleSweepDirection:null!=(a=null==l?void 0:l.direction)?a:"ltr",idleSweepToken:null!=(o=null==l?void 0:l.id)?o:0,className:"navbar-tablet-primary-link ".concat(null!=(i=n.textClass)?i:"text-owl-neutral-inverse-300 hover:text-owl-neutral-inverse-50"),children:(0,r.jsx)("span",{children:n.label})},"tablet-".concat(n.label))}),(0,r.jsxs)("span",{"aria-label":"OWL balance",className:"navbar-tablet-owl-balance",children:[(0,r.jsx)("span",{children:"$OWL:"}),(0,r.jsxs)("svg",{viewBox:"0 0 20 11","aria-hidden":!0,children:[(0,r.jsx)("rect",{x:"0.6",y:"1.1",width:"16.4",height:"8.8",rx:"1.8",fill:"none",stroke:"#47FFFF",strokeWidth:"1"}),(0,r.jsx)("rect",{x:"18",y:"3.4",width:"1.8",height:"4.2",rx:"0.7",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"2.2",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"5.7",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"9.2",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"}),(0,r.jsx)("rect",{x:"12.7",y:"2.8",width:"2.9",height:"5.4",rx:"0.5",fill:"#47FFFF"})]})]})]}),(0,r.jsxs)("div",{className:"navbar-actions relative z-20 flex shrink-0 items-center gap-3 sm:gap-4",children:[(0,r.jsxs)("div",{className:"navbar-socials hidden items-center gap-1.5 xl:flex",children:[(0,r.jsx)(s.GlassLink,{href:"https://x.com/nightowlai_",target:"_blank",rel:"noopener noreferrer","aria-label":"Nightowl AI on X",surface:!0,sheenSize:42,className:"h-9 w-9 rounded-lg text-owl-neutral-inverse-400 hover:text-owl-neutral-inverse-50",children:(0,r.jsx)(i,{})}),(0,r.jsx)(s.GlassLink,{href:"https://www.linkedin.com/company/nightowlai/",target:"_blank",rel:"noopener noreferrer","aria-label":"Nightowl AI on LinkedIn",surface:!0,sheenSize:42,className:"h-9 w-9 rounded-lg text-owl-neutral-inverse-400 hover:text-owl-neutral-inverse-50",children:(0,r.jsx)(l,{})})]}),(0,r.jsx)(s.GlassLink,{href:u?"/nightowls":"/auth",surface:!0,sheenSize:56,className:"navbar-login whitespace-nowrap rounded-lg border [border-color:color-mix(in_srgb,var(--owl-accent-primary)_80%,transparent)] px-2.5 py-1.5 font-mono text-[0.6rem] font-normal uppercase tracking-[0.08em] text-white transition-[border-color] duration-200 hover:[border-color:var(--owl-accent-primary)] md:px-4 md:py-2 md:text-[0.78rem] md:tracking-[0.16em]",children:(0,r.jsx)("span",{className:"navbar-label-content",children:u?"THE NEST":(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"md:hidden",children:"Login"}),(0,r.jsx)("span",{className:"hidden md:inline",children:"Login / Sign up"})]})})}),(0,r.jsx)("button",{type:"button",onClick:()=>p(e=>!e),"aria-label":t?"Close menu":"Open menu","aria-expanded":t,className:"md:hidden flex h-9 w-9 items-center justify-center rounded-lg border border-white/10 text-owl-neutral-inverse-300 transition-colors hover:text-owl-neutral-inverse-50",children:t?(0,r.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round","aria-hidden":!0,children:(0,r.jsx)("path",{d:"M6 6l12 12M18 6L6 18"})}):(0,r.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round","aria-hidden":!0,children:(0,r.jsx)("path",{d:"M3 6h18M3 12h18M3 18h18"})})})]})]}),t&&(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("div",{className:"md:hidden fixed inset-x-0 bottom-0 top-16 z-[998] bg-black/40",onClick:()=>p(!1),"aria-hidden":!0}),(0,r.jsx)("div",{className:"md:hidden absolute inset-x-0 top-16 z-[999] border-b border-white/10 bg-black/90 backdrop-blur-xl",children:(0,r.jsxs)("nav",{className:"mx-auto flex max-w-[1600px] flex-col gap-1 px-4 py-4 sm:px-6",children:[m.map(e=>{var n;return(0,r.jsx)("a",{href:e.href,onClick:()=>p(!1),className:"rounded-lg px-4 py-3 font-mono text-[0.82rem] uppercase tracking-[0.16em] ".concat(null!=(n=e.textClass)?n:"text-owl-neutral-inverse-300 hover:text-owl-neutral-inverse-50"),children:e.label},e.label)}),(0,r.jsxs)("div",{className:"mt-2 flex items-center justify-end gap-3 border-t border-white/10 px-4 pt-4",children:[(0,r.jsx)("a",{href:"https://x.com/nightowlai_",target:"_blank",rel:"noopener noreferrer","aria-label":"Nightowl AI on X",className:"flex h-9 w-9 items-center justify-center rounded-lg border border-white/10 text-owl-neutral-inverse-400 hover:text-owl-neutral-inverse-50",children:(0,r.jsx)(i,{})}),(0,r.jsx)("a",{href:"https://www.linkedin.com/company/nightowlai/",target:"_blank",rel:"noopener noreferrer","aria-label":"Nightowl AI on LinkedIn",className:"flex h-9 w-9 items-center justify-center rounded-lg border border-white/10 text-owl-neutral-inverse-400 hover:text-owl-neutral-inverse-50",children:(0,r.jsx)(l,{})})]})]})})]}),(0,r.jsx)("style",{children:'\n /*\n * SITE SCALE\n * ----------\n * The 1920â2299px desktop band is intentionally the 125% look.\n * Smaller desktop resolutions step down proportionally; larger ones step up\n * modestly. Mobile/tablet remain at 100% so their existing responsive layouts\n * are not artificially enlarged.\n *\n * CSS zoom is used rather than transform: scale() because zoom participates\n * in layout/reflow instead of merely painting a larger copy on top.\n *\n * SCOPING IS LOAD-BEARING: .landing-root wraps only the landing page\n * (app/landing/page.tsx). A bare body selector here would zoom the\n * entire application.\n */\n .landing-root {\n zoom: 1;\n }\n\n @media (min-width: 1280px) {\n .landing-root { zoom: 1.05; }\n }\n\n @media (min-width: 1450px) {\n .landing-root { zoom: 1.10; }\n }\n\n @media (min-width: 1600px) {\n .landing-root { zoom: 1.15; }\n }\n\n @media (min-width: 1760px) {\n .landing-root { zoom: 1.20; }\n }\n\n @media (min-width: 1920px) {\n .landing-root { zoom: 1.25; }\n }\n\n @media (min-width: 2300px) {\n .landing-root { zoom: 1.30; }\n }\n\n @media (min-width: 2800px) {\n .landing-root { zoom: 1.35; }\n }\n\n /*\n * NAVBAR RESPONSIVE SCALE\n * -----------------------\n * Keep every interactive navbar control visible on de
1sktop-like widths:\n * Parliament / Platform / Mission / Token / Identity, $OWL, X, LinkedIn,\n * and Login / Sign Up.\n *\n * Instead of deleting controls at smaller resolutions, shrink their\n * footprint. The status dot remains decorative and may stay hidden.\n */\n\n /*\n * TABLET NAVBAR â ONE AUTHORITATIVE LAYOUT\n * ----------------------------------------\n * At 768â1023px, use a real 3-column grid:\n * logo | center nav + $OWL | actions.\n * This removes all absolute positioning and guarantees the center controls\n * can never paint over the Nightowl logo.\n */\n @media (min-width: 768px) and (max-width: 1023px) {\n /*\n * TABLET: hard 3-zone layout\n * --------------------------\n * [ NIGHTOWL AI ] [ Parliament ... $OWL ] [ X in Login ]\n *\n * Nothing in the middle is absolute. Nothing is page-centered.\n * The middle group gets ONLY the real space between the logo and actions.\n */\n .navbar-shell {\n display: grid !important;\n grid-template-columns: max-content minmax(0, 1fr) max-content !important;\n grid-template-areas: "logo center actions" !important;\n align-items: center !important;\n width: 100% !important;\n max-width: none !important;\n height: 3.5rem !important;\n column-gap: 0.55rem !important;\n padding-left: 0.55rem !important;\n padding-right: 0.55rem !important;\n }\n\n .navbar-logo {\n grid-area: logo !important;\n position: static !important;\n z-index: 30 !important;\n display: flex !important;\n min-width: 0 !important;\n width: max-content !important;\n justify-self: start !important;\n align-self: center !important;\n }\n\n .navbar-logo svg {\n display: block !important;\n height: 1.08rem !important;\n width: auto !important;\n max-width: 9.45rem !important;\n overflow: visible !important;\n }\n\n .navbar-center {\n grid-area: center !important;\n position: static !important;\n inset: auto !important;\n left: auto !important;\n right: auto !important;\n top: auto !important;\n transform: none !important;\n z-index: 20 !important;\n\n display: flex !important;\n min-width: 0 !important;\n width: 100% !important;\n max-width: 100% !important;\n align-items: center !important;\n justify-content: flex-start !important;\n justify-self: stretch !important;\n gap: 0.18rem !important;\n overflow: hidden !important;\n }\n\n .navbar-center > div {\n display: flex !important;\n min-width: 0 !important;\n flex: 0 1 auto !important;\n align-items: center !important;\n justify-content: flex-start !important;\n gap: 0.14rem !important;\n overflow: hidden !important;\n }\n\n .navbar-primary-link {\n flex: 0 1 auto !important;\n min-width: 0 !important;\n height: 1.46rem !important;\n padding: 0 0.32rem !important;\n border-radius: 0.38rem !important;\n font-size: 0.50rem !important;\n line-height: 1 !important;\n letter-spacing: 0.045em !important;\n }\n\n .navbar-primary-link .navbar-label-content {\n display: block !important;\n overflow: hidden !important;\n white-space: nowrap !important;\n }\n\n .navbar-owl-balance {\n flex: 0 0 auto !important;\n margin: 0 0 0 0.08rem !important;\n padding: 0 !important;\n gap: 0.22rem !important;\n font-size: 0.52rem !important;\n line-height: 1 !important;\n letter-spacing: 0.045em !important;\n white-space: nowrap !important;\n }\n\n .navbar-owl-balance svg {\n width: 1.24rem !important;\n height: 0.70rem !important;\n }\n\n .navbar-actions {\n grid-area: actions !important;\n position: static !important;\n z-index: 30 !important;\n display: flex !important;\n min-width: max-content !important;\n width: max-content !important;\n align-items: center !important;\n justify-self: end !important;\n gap: 0.20rem !important;\n }\n\n .navbar-socials {\n display: flex !important;\n gap: 0.15rem !important;\n }\n\n .navbar-socials > a {\n width: 1.42rem !important;\n height: 1.42rem !important;\n border-radius: 0.38rem !important;\n }\n\n .navbar-socials svg {\n width: 0.68rem !important;\n height: 0.68rem !important;\n }\n\n .navbar-login {\n height: 1.46rem !important;\n padding: 0 0.48rem !important;\n border-radius: 0.42rem !important;\n font-size: 0.50rem !important;\n line-height: 1 !important;\n letter-spacing: 0.065em !important;\n }\n\n .navbar-status-dot,\n .navbar-mobile-owl-balance {\n display: none !important;\n }\n }\n\n /* 1024â1199px */\n @media (min-width: 1024px) and (max-width: 1199px) {\n .navbar-center {\n transform: translate(-50%, -50%) !important;\n }\n\n .navbar-socials {\n display: flex !important;\n gap: 0.28rem !important;\n }\n\n .navbar-socials > a {\n width: 1.7rem !important;\n height: 1.7rem !important;\n }\n\n .navbar-primary-link {\n height: 1.7rem !important;\n padding-left: 0.48rem !important;\n padding-right: 0.48rem !important;\n font-size: 0.56rem !important;\n letter-spacing: 0.08em !important;\n }\n\n .navbar-owl-balance {\n margin-left: 0.12rem !important;\n gap: 0.24rem !important;\n padding-left: 0.22rem !important;\n padding-right: 0.22rem !important;\n font-size: 0.62rem !important;\n line-height: 1 !important;\n letter-spacing: 0.08em !important;\n }\n\n .navbar-owl-balance svg {\n width: 1.38rem !important;\n height: 0.78rem !important;\n }\n\n .navbar-login {\n height: 1.7rem !important;\n padding-left: 0.7rem !important;\n padding-right: 0.7rem !important;\n font-size: 0.60rem !important;\n letter-spacing: 0.10em !important;\n }\n\n .navbar-status-dot {\n display: none !important;\n }\n }\n\n /* 1200â1439px */\n @media (min-width: 1200px) and (max-width: 1439px) {\n .navbar-socials {\n display: flex !important;\n gap: 0.32rem !important;\n }\n\n .navbar-socials > a {\n width: 1.85rem !important;\n height: 1.85rem !important;\n }\n\n .navbar-primary-link {\n padding-left: 0.55rem !important;\n padding-right: 0.55rem !important;\n font-size: 0.64rem !important;\n letter-spacing: 0.10em !important;\n }\n\n .navbar-owl-balance {\n padding-left: 0.45rem !important;\n padding-right: 0.45rem !important;\n font-size: 0.68rem !important;\n letter-spacing: 0.10em !important;\n }\n\n .navbar-status-dot {\n display: none !important;\n }\n }\n\n /* 1440â1999px */\n @media (min-width: 1440px) and (max-width: 1999px) {\n .navbar-socials {\n display: flex !important;\n gap: 0.375rem !important;\n }\n\n .navbar-socials > a {\n width: 2rem !important;\n height: 2rem !important;\n }\n\n .navbar-primary-link {\n padding-left: 0.625rem !important;\n padding-right: 0.625rem !important;\n font-size: 0.70rem !important;\n letter-spacing: 0.12em !important;\n }\n\n .navbar-owl-balance {\n padding-left: 0.5rem !important;\n padding-right: 0.5rem !important;\n font-size: 0.78rem !important;\n letter-spacing: 0.12em !important;\n }\n\n .navbar-status-dot {\n display: none !important;\n }\n }
1\n\n /*\n * TABLET TEXT OPTICAL CENTER\n * --------------------------\n * The anchor boxes are mathematically centered already, but IBM Plex Mono\'s\n * uppercase glyph metrics sit about a rendered pixel high inside the line box.\n * Nudge only the visible text down slightly; do not move the glass, icons,\n * border, or hover/sheen layers.\n */\n @media (min-width: 768px) and (max-width: 1199px) {\n .navbar-primary-link .navbar-label-content,\n .navbar-login .navbar-label-content {\n position: relative;\n top: 0.75px;\n display: inline-block;\n }\n }\n\n /*\n * TABLET BUTTON OPTICAL SIZE\n * --------------------------\n * The previous pass was still too short because it was chasing the SVG\n * box instead of the visible NIGHTOWL AI wordmark. Use the existing\n * compact social-button heights as the visual target, then enlarge the\n * nav type enough that the buttons no longer read undersized.\n */\n @media (min-width: 768px) and (max-width: 899px) {\n .navbar-primary-link,\n .navbar-socials > a,\n .navbar-login {\n box-sizing: border-box !important;\n height: 1.45rem !important;\n min-height: 1.45rem !important;\n max-height: 1.45rem !important;\n border-radius: 0.38rem !important;\n }\n\n .navbar-socials > a {\n width: 1.45rem !important;\n }\n\n .navbar-primary-link {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n font-size: 0.68rem !important;\n letter-spacing: 0.045em !important;\n line-height: 1 !important;\n }\n\n .navbar-login {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n font-size: 0.66rem !important;\n line-height: 1 !important;\n }\n }\n\n @media (min-width: 900px) and (max-width: 1023px) {\n .navbar-primary-link,\n .navbar-socials > a,\n .navbar-login {\n box-sizing: border-box !important;\n height: 1.55rem !important;\n min-height: 1.55rem !important;\n max-height: 1.55rem !important;\n border-radius: 0.40rem !important;\n }\n\n .navbar-socials > a {\n width: 1.55rem !important;\n }\n\n .navbar-primary-link {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n font-size: 0.72rem !important;\n letter-spacing: 0.050em !important;\n line-height: 1 !important;\n }\n\n .navbar-login {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n font-size: 0.70rem !important;\n line-height: 1 !important;\n }\n }\n\n @media (min-width: 1024px) and (max-width: 1199px) {\n .navbar-primary-link,\n .navbar-socials > a,\n .navbar-login {\n box-sizing: border-box !important;\n height: 1.70rem !important;\n min-height: 1.70rem !important;\n max-height: 1.70rem !important;\n border-radius: 0.44rem !important;\n }\n\n .navbar-socials > a {\n width: 1.70rem !important;\n }\n\n .navbar-primary-link {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n font-size: 0.76rem !important;\n letter-spacing: 0.055em !important;\n line-height: 1 !important;\n }\n\n .navbar-login {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n font-size: 0.74rem !important;\n line-height: 1 !important;\n }\n }\n\n /* 2000px+: original full-size composition is untouched. */\n\n /*\n * FINAL TABLET NAVBAR AUTHORITY â 640px through 1023px\n * ----------------------------------------------------\n * This block is intentionally LAST so no legacy tablet rule can override it.\n *\n * Root causes from the 764px screenshot:\n * 1) the previous structural fix began at 768px, but 764px is already being\n * used as a tablet viewport in Ploy;\n * 2) old 768â899 "optical size" rules appeared later in the stylesheet and\n * re-enlarged the nav after the structural fix.\n *\n * One grid now owns tablet layout:\n * [ NIGHTOWL AI ] [ PARLIAMENT ... $OWL ] [ X | in | LOGIN / SIGN UP ]\n */\n @media (min-width: 640px) and (max-width: 1023px) {\n .navbar-shell {\n display: grid !important;\n grid-template-columns: max-content minmax(0, 1fr) max-content !important;\n grid-template-areas: "logo center actions" !important;\n align-items: center !important;\n width: 100% !important;\n max-width: none !important;\n height: 3.5rem !important;\n min-height: 3.5rem !important;\n padding: 0 0.45rem !important;\n column-gap: 0.48rem !important;\n }\n\n .navbar-logo {\n grid-area: logo !important;\n position: static !important;\n inset: auto !important;\n transform: none !important;\n display: flex !important;\n width: max-content !important;\n min-width: 0 !important;\n justify-self: start !important;\n align-self: center !important;\n z-index: 40 !important;\n }\n\n .navbar-logo svg {\n display: block !important;\n width: auto !important;\n height: 1.05rem !important;\n max-width: 8.85rem !important;\n overflow: visible !important;\n }\n\n .navbar-center {\n grid-area: center !important;\n position: static !important;\n inset: auto !important;\n left: auto !important;\n right: auto !important;\n top: auto !important;\n transform: none !important;\n display: flex !important;\n width: 100% !important;\n min-width: 0 !important;\n max-width: 100% !important;\n align-items: center !important;\n justify-content: flex-start !important;\n justify-self: stretch !important;\n gap: 0.12rem !important;\n overflow: hidden !important;\n z-index: 30 !important;\n }\n\n .navbar-center > div {\n display: flex !important;\n min-width: 0 !important;\n max-width: 100% !important;\n flex: 0 1 auto !important;\n align-items: center !important;\n justify-content: flex-start !important;\n gap: 0.10rem !important;\n overflow: hidden !important;\n }\n\n .navbar-primary-link {\n box-sizing: border-box !important;\n flex: 0 1 auto !important;\n min-width: 0 !important;\n height: 1.42rem !important;\n min-height: 1.42rem !important;\n max-height: 1.42rem !important;\n padding: 0 0.29rem !important;\n border-radius: 0.36rem !important;\n font-size: 0.50rem !important;\n line-height: 1 !important;\n letter-spacing: 0.035em !important;\n }\n\n .navbar-primary-link .navbar-label-content {\n position: static !important;\n top: auto !important;\n display: block !important;\n overflow: hidden !important;\n text-overflow: clip !important;\n white-space: nowrap !important;\n }\n\n .navbar-owl-balance {\n box-sizing: border-box !important;\n display: flex !important;\n flex: 0 0 auto !important;\n align-items: center !important;\n height: 1.42rem !important;\n margin: 0 0 0 0.08rem !important;\n padding: 0 0.10rem !important;\n gap: 0.18rem !important;\n font-size: 0.50rem !important;\n line-height: 1 !important;\n letter-spacing: 0.035em !important;\n white-space: nowrap !important;\n }\n\n .navbar-owl-balance svg {\n width: 1.20rem !important;\n height: 0.68rem !important;\n }\n\n .navbar-actions {\n grid-area: actions !important;\n position: static !important;\n inset: auto !important;\n transform: none !important;\n display: flex !important;\n width: max-content !important;\n min-width: max-content !important;\n align-items: center !important;\n justify-self: end !important;\n gap: 0.16rem !important;\n z-index: 40 !important;\n }\n\n .navbar-socials {\n display: flex !important;\n gap: 0.13rem !important;\n }\n\n .navbar-socials > a {\n box-sizing: border-box !important;\n width: 1.42rem !important;\n min-width: 1.42rem !important;\n height: 1.42rem !important;\n min-height: 1.42rem !important;\n max-height: 1.42rem !important;\n padding: 0 !important;\n border-radius: 0.36rem !important;\n }\n\n .navbar-socials svg {\n width: 0.68rem !important;\n height: 0.68rem !important;\n }\n\n .navbar-login {\n box-sizing: border-box !important;\n height: 1.42rem !important;\n min-height: 1.42rem !important;\n max-height: 1.42rem !important;\n padding: 0 0.46rem !important;\n border-radius: 0.39rem !important;\n font-size: 0.50rem !important;\n line-height: 1 !important;\n letter-spacing: 0.055em !important;\n white-space: nowrap !important;\n }\n\n .navbar-login .navbar-label-content {\n position: static !important;\n top: auto !important;\n }\n\n /* At tablet widths the balance belongs in the center navigation only. */\n .navbar-mobile-owl-balance,\n .navbar-status-dot {\n display: none !important;\n }\n }\n\n /* Give the middle zone a tiny bit more breathing room above 800px. */\n @media (min-width: 800px) and (max-width: 1023px) {\n .navbar-shell {\n padding-left: 0.60rem !important;\n padding-right: 0.60rem !important;\n column-gap: 0.60rem !important;\n }\n\n .navbar-primary-link {\n padding-left: 0.34rem !important;\n padding-right: 0.34rem !important;\n font-size: 0.52rem !important;\n }\n\n .navbar-owl-balance {\n font-size: 0.52rem !important;\n }\n\n .navbar-logo svg {\n max-width: 9.10rem !important;\n }\n }\n\n /*\n * TABLET CENTER NAV â ISOLATED FROM LEGACY NAVBAR CSS\n * ---------------------------------------------------\n * The screenshot showed only Parliament->$OWL broken. Do not reuse the\n * desktop .navbar-center on tablets at all. This dedicated element is\n * anchored between the real logo and right actions and cannot overlap them.\n */\n .navbar-tablet-ce
1nter {\n display: none;\n }\n\n @media (min-width: 640px) and (max-width: 1023px) {\n .navbar-center {\n display: none !important;\n }\n\n .navbar-tablet-center {\n position: absolute !important;\n left: 10.1rem !important;\n right: 10.3rem !important;\n top: 50% !important;\n z-index: 35 !important;\n display: flex !important;\n transform: translateY(-50%) !important;\n align-items: center !important;\n justify-content: center !important;\n gap: 0.11rem !important;\n min-width: 0 !important;\n overflow: visible !important;\n white-space: nowrap !important;\n }\n\n .navbar-tablet-primary-link {\n box-sizing: border-box !important;\n flex: 0 0 auto !important;\n height: 1.42rem !important;\n padding: 0 0.28rem !important;\n border-radius: 0.36rem !important;\n font-family: "IBM Plex Mono", monospace !important;\n font-size: 0.46rem !important;\n line-height: 1 !important;\n letter-spacing: 0.025em !important;\n text-transform: uppercase !important;\n white-space: nowrap !important;\n }\n\n .navbar-tablet-owl-balance {\n display: inline-flex !important;\n flex: 0 0 auto !important;\n height: 1.42rem !important;\n align-items: center !important;\n gap: 0.17rem !important;\n padding: 0 0.08rem !important;\n font-family: "IBM Plex Mono", monospace !important;\n font-size: 0.48rem !important;\n line-height: 1 !important;\n letter-spacing: 0.025em !important;\n color: #47FFFF !important;\n text-shadow: 0 0 4px #47FFFF80, 0 0 10px #47FFFF40 !important;\n white-space: nowrap !important;\n }\n\n .navbar-tablet-owl-balance svg {\n width: 1.18rem !important;\n height: 0.66rem !important;\n flex: none !important;\n filter: drop-shadow(0 0 3px #47FFFF) !important;\n }\n }\n\n @media (min-width: 760px) and (max-width: 1023px) {\n .navbar-tablet-center {\n left: 10.4rem !important;\n right: 10.6rem !important;\n gap: 0.13rem !important;\n }\n\n .navbar-tablet-primary-link {\n padding-left: 0.31rem !important;\n padding-right: 0.31rem !important;\n font-size: 0.49rem !important;\n }\n\n .navbar-tablet-owl-balance {\n font-size: 0.50rem !important;\n }\n }\n\n\n /*\n * TABLET NAV POLISH\n * -----------------\n * The structural layout is now correct. These are only alignment/type\n * refinements for the isolated tablet nav:\n * - logo left edge aligns with OWL AI prompt left edge;\n * - $OWL gets breathing room from Identity;\n * - $OWL type matches Login exactly;\n * - normal character spacing restores legibility.\n */\n @media (min-width: 640px) and (max-width: 1023px) {\n .navbar-logo {\n margin-left: 1.15rem !important;\n }\n\n .navbar-tablet-primary-link {\n letter-spacing: normal !important;\n }\n\n .navbar-tablet-owl-balance {\n margin-left: 0.28rem !important;\n padding-left: 0 !important;\n padding-right: 0 !important;\n font-size: 0.50rem !important;\n letter-spacing: normal !important;\n gap: 0.20rem !important;\n }\n\n .navbar-login {\n font-size: 0.50rem !important;\n letter-spacing: normal !important;\n }\n\n .navbar-login .navbar-label-content {\n letter-spacing: normal !important;\n }\n }\n\n @media (min-width: 760px) and (max-width: 1023px) {\n .navbar-tablet-primary-link {\n font-size: 0.49rem !important;\n letter-spacing: normal !important;\n }\n\n .navbar-tablet-owl-balance {\n font-size: 0.50rem !important;\n letter-spacing: normal !important;\n }\n }\n\n\n /*\n * TABLET CENTER NAV â WIDER + MORE LEGIBLE TYPE\n * ---------------------------------------------\n * There is visible unused room between the logo and the right controls.\n * Use more of it, then restore modest mono tracking so the labels do not\n * look compressed.\n */\n @media (min-width: 640px) and (max-width: 1023px) {\n .navbar-tablet-ce
1nter {\n left: 9.45rem !important;\n right: 9.55rem !important;\n gap: 0.16rem !important;\n }\n\n .navbar-tablet-primary-link {\n padding-left: 0.36rem !important;\n padding-right: 0.36rem !important;\n letter-spacing: 0.055em !important;\n }\n\n .navbar-tablet-owl-balance {\n margin-left: 0.34rem !important;\n font-size: 0.50rem !important;\n letter-spacing: 0.055em !important;\n gap: 0.22rem !important;\n }\n\n .navbar-login,\n .navbar-login .navbar-label-content {\n letter-spacing: 0.055em !important;\n }\n }\n\n @media (min-width: 760px) and (max-width: 1023px) {\n .navbar-tablet-center {\n left: 9.70rem !important;\n right: 9.85rem !important;\n gap: 0.18rem !important;\n }\n\n .navbar-tablet-primary-link {\n padding-left: 0.39rem !important;\n padding-right: 0.39rem !important;\n letter-spacing: 0.060em !important;\n }\n\n .navbar-tablet-owl-balance {\n margin-left: 0.38rem !important;\n letter-spacing: 0.060em !important;\n }\n\n .navbar-login,\n .navbar-login .navbar-label-content {\n letter-spacing: 0.060em !important;\n }\n }\n\n\n /*\n * TABLET RIGHT-EDGE ALIGNMENT\n * ---------------------------\n * Match the right edge of X / LinkedIn / Login to the right edge of the\n * OWL AI prompt box. The Hero prompt sits 1.5rem in from the viewport on\n * tablet (sm:px-6), so shift the action cluster inward to that same line.\n *\n * Move the isolated middle nav\'s right boundary left by the same amount so\n * the two groups keep their existing breathing room.\n */\n @media (min-width: 640px) and (max-width: 759px) {\n .navbar-actions {\n margin-right: 1.05rem !important;\n }\n\n .navbar-tablet-center {\n right: 10.60rem !important;\n }\n }\n\n @media (min-width: 760px) and (max-width: 1023px) {\n .navbar-actions {\n margin-right: 0.90rem !important;\n }\n\n .navbar-tablet-center {\n right: 10.75rem !important;\n }\n }\n\n '})]})}},99420:(e,n,t)=>{"use strict";t.d(n,{default:()=>l});var r=t(95155),a=t(39867),o=t(39167),i=t(34922);function l(){let e=(0,i.F)({auto:!1});return(0,r.jsxs)(r.Fragment,{children:[e.canPrompt&&(0,r.jsxs)("button",{type:"button",onClick:e.openManually,className:"fixed bottom-4 left-1/2 z-[650] flex -translate-x-1/2 items-center gap-2 rounded-full px-4 py-2 text-[0.8125rem] font-semibold text-white",style:{fontFamily:"var(--font-ui)",backgroundColor:"rgba(18, 18, 24, 0.94)",border:"1px solid rgba(255, 255, 255, 0.18)",backdropFilter:"blur(24px) saturate(160%)",WebkitBackdropFilter:"blur(24px) saturate(160%)",boxShadow:"inset 0 1px 0 rgba(255,255,255,0.14), 0 8px 24px rgba(0,0,0,0.5)",marginBottom:"env(safe-area-inset-bottom, 0px)"},children:[(0,r.jsx)(a.default,{size:14,style:{color:"#39FF14"}}),"Install app"]}),(0,r.jsx)(o.A,{open:e.open,platform:e.platform,browser:e.browser,browserIcon:e.browserIcon,shareAtTop:e.shareAtTop,canInstallNatively:e.canInstallNatively,onInstall:e.install,onClose:e.close,onNever:e.never})]})}}},e=>{e.O(0,[58780,20709,73426,75866,84861,46600,28441,61653,77358],()=>e(e.s=9358)),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.