/* landing-pilot SPEC 2: Stylesheet der Seite /uae/. Werte stammen aus der
   Owner-abgenommenen Referenz docs/mockups/landing-pilot-uae.html. */
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/archivo-latin-wght-normal.woff2) format('woff2')}
@font-face{font-family:'Spline Sans Mono';font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/spline-sans-mono-latin-wght-normal.woff2) format('woff2')}

:root{
  --bg:#06080A;--card:#10151B;--band-a:#0A0D11;--band-b:#080B0E;--foot:#05070A;
  --t1:#ECEEF2;--t2:#B4BCC6;--t3:#A2AAB5;--t4:#828B97;
  --g-fill:#00843D;--g-acc:#00A34B;--g-num:#36B45F;
  --l06:rgba(255,255,255,.06);--l07:rgba(255,255,255,.07);--l09:rgba(255,255,255,.09);--l10:rgba(255,255,255,.1);--l12:rgba(255,255,255,.12);
  --wrap:1240px;--gutter:clamp(16px,4vw,40px);--sec:64px;
  --mono:'Spline Sans Mono',ui-monospace,monospace;
}

body{margin:0;background:var(--bg)}
.page{background:var(--bg);color:var(--t1);font-family:'Archivo',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--t1)}a:hover{color:#FFFFFF}
:focus-visible{outline:2px solid var(--g-acc);outline-offset:2px}

/* Eyebrow mit Parallelogramm */
.k{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500;color:var(--t3)}
.k::before{content:'';width:17px;height:10px;flex-shrink:0;background:var(--g-fill);clip-path:polygon(24% 0,100% 0,76% 100%,0 100%)}
.acc{color:var(--g-acc)}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t4)}
.mono.acc-c{color:var(--g-acc)}

/* Hero */
.hero{position:relative;overflow:hidden;background:radial-gradient(55% 65% at 74% 82%,rgba(0,132,61,.50) 0%,rgba(11,58,36,.28) 38%,rgba(6,8,10,0) 72%),linear-gradient(180deg,#06080A 0%,#08100C 100%)}
.hdr{position:relative;z-index:2;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);min-height:76px;display:flex;align-items:center;gap:36px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.logo{color:var(--t1);flex:none}
.brand-t{font-size:15px;font-weight:800;letter-spacing:-.01em;color:var(--t1)}
.brand-t span{color:var(--t4);font-weight:500}
.nav{margin-left:auto;display:flex;gap:30px;font-size:14px}
.nav a{color:var(--t3);text-decoration:none}
.hero-in{position:relative;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(500px,100%),1fr));align-items:center;gap:24px}
.hero-copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:26px;padding:var(--sec) 0}
.h1{margin:0;font-size:clamp(60px,8vw,124px);line-height:.9;font-weight:800;letter-spacing:-.045em}
.lead{margin:0;max-width:30em;font-size:19px;line-height:1.55;color:var(--t2)}
.lead.w32{max-width:32em}
.hero-note{margin:0;max-width:32em;padding-left:16px;border-left:2px solid var(--g-fill);font-size:16px;line-height:1.55;color:var(--t3)}
.hero-note b{color:var(--t1);font-weight:700}

/* Abschnitte */
.sec{padding:var(--sec) var(--gutter)}
.sec-in{max-width:var(--wrap);margin:0 auto;display:flex;flex-direction:column;gap:48px}
.sec-in.g72{gap:72px}
.stack18{display:flex;flex-direction:column;gap:18px}
.w760{max-width:760px}
.pull{margin-bottom:-24px}
.h2{margin:0;font-size:clamp(40px,4.4vw,64px);line-height:.98;font-weight:800;letter-spacing:-.04em}
.sub{margin:0;font-size:19px;line-height:1.55;color:var(--t3)}

/* Preise, Karten */
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:16px;align-items:stretch}
.card{display:flex;flex-direction:column;gap:28px;padding:32px;border-radius:2px;border:1px solid var(--l09);background:var(--card)}
.card.g20{gap:20px}
.card.hl{position:relative;border:2px solid var(--g-fill);background:linear-gradient(180deg,rgba(0,132,61,.14) 0%,rgba(0,132,61,.02) 60%),#121A17;box-shadow:0 24px 60px -24px rgba(0,163,75,.55)}
.card-h{display:flex;flex-direction:column;gap:8px}
.card-t{font-size:32px;line-height:1;font-weight:800;letter-spacing:-.03em}
.card-s{font-size:15px;color:var(--t3)}
.hl .card-s{color:#C3D4CA}
.badge{position:absolute;top:-13px;left:30px;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:2px;background:var(--g-fill);color:#FFFFFF;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.rows{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;border-top:1px solid var(--l09)}
.row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--l07)}
.row-n{display:flex;flex-direction:column}
.row-n b{font-size:16px;font-weight:700}
.row-n span{font-size:13px;color:var(--t4)}
.row-p{font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.row-p.dim{color:var(--t3)}
.row-inc{font-size:16px;font-weight:700;color:var(--t3)}
.hl .rows{border-top-color:var(--l12)}
.hl .row{border-bottom-color:rgba(255,255,255,.08)}
.hl .row-n span{color:#8FA79A}
.hl .row-inc{color:#C3D4CA}
.rows .row:last-child{border-bottom:0}
.notes{display:flex;flex-wrap:wrap;gap:8px 32px;font-size:14px;color:var(--t4)}

/* So funktioniert es */
.band{background:linear-gradient(180deg,var(--band-a) 0%,var(--band-b) 100%);border-top:1px solid var(--l06);border-bottom:1px solid var(--l06)}
.how-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(480px,100%),1fr));gap:24px 80px;align-items:end}
.steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:12px}
.step{display:flex;flex-direction:column;gap:12px;padding:24px 20px 28px;border-radius:2px;border-top:2px solid rgba(255,255,255,.16);background:rgba(255,255,255,.025)}
.step-n{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--t4)}
.step b{font-size:18px;line-height:1.2;font-weight:700;letter-spacing:-.01em}
.step-d{font-size:14px;line-height:1.5;color:var(--t3)}
.step-hl{border-top-color:var(--g-acc);background:linear-gradient(180deg,rgba(0,132,61,.22) 0%,rgba(0,132,61,.08) 100%);box-shadow:inset 0 0 0 1px rgba(0,163,75,.28)}
.step-hl .step-n{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--g-num)}
.step-hl b{font-weight:800;color:#FFFFFF}
.step-hl .step-d{color:#C3D4CA}
.tag{padding:2px 7px;border-radius:2px;border:1px solid rgba(54,180,95,.4);font-size:9.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}

/* Virtual Employees */
.member{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(480px,100%),1fr));gap:clamp(32px,5vw,80px);align-items:center}
.portrait{position:relative;width:100%;max-width:440px;height:480px;overflow:hidden;border-radius:2px;border:1px solid rgba(255,255,255,.08);background:radial-gradient(70% 60% at 50% 32%,rgba(0,132,61,.38) 0%,rgba(0,132,61,0) 70%),linear-gradient(180deg,#0D1612 0%,#07090C 100%)}
.portrait.start{justify-self:start}
.portrait.end{justify-self:end}
.portrait img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:94%;width:auto;max-width:none}
.fade{position:absolute;inset:auto 0 0 0;height:30%;background:linear-gradient(to top,rgba(7,9,12,.9),transparent)}
.status{position:absolute;left:20px;top:20px;display:inline-flex;align-items:center;gap:7px;padding:4px 10px;border-radius:2px;border:1px solid rgba(54,180,95,.3);background:rgba(6,8,10,.55);font-size:12px;font-weight:600;color:var(--g-num)}
.dot{width:6px;height:6px;border-radius:999px;background:var(--g-num)}
.copy{display:flex;flex-direction:column;gap:22px}
.role{font-size:12px}
.name{margin:0;font-size:clamp(64px,6.6vw,96px);line-height:.88;font-weight:800;letter-spacing:-.05em}
.feat{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));column-gap:32px;border-top:1px solid var(--l10)}
.feat li{display:flex;flex-direction:column;gap:4px;padding:16px 0;border-bottom:1px solid var(--l07)}
.feat b{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700}
.feat li span{padding-left:26px;font-size:14px;line-height:1.5;color:var(--t3)}
.tick{color:var(--g-acc)}
.works{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:var(--t4)}
.chip{padding:4px 10px;border-radius:2px;border:1px solid var(--l12);color:#C9CFD6;font-weight:600}
.checks{margin:0;padding:22px 0 0;list-style:none;display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--l10);font-size:17px;font-weight:600}
.checks li{display:flex;align-items:center;gap:12px}

/* Pilot */
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(480px,100%),1fr));gap:16px;align-items:stretch}
.dl{margin:0;display:flex;flex-direction:column;border-top:1px solid var(--l09)}
.dl>div{display:grid;grid-template-columns:minmax(110px,34%) 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--l07)}
.dl>div:last-child{border-bottom:0}
.dl dt{font-size:14px;color:var(--t4)}
.dl dd{margin:0;font-size:16px;font-weight:700}
.olist{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;border-top:1px solid var(--l09)}
.olist>li{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:18px 0;border-bottom:1px solid var(--l07)}
.olist>li:last-child{border-bottom:0}
.num{font-family:var(--mono);font-size:22px;font-weight:600;line-height:1.1;color:var(--g-num)}
.olist-t{display:flex;flex-direction:column;gap:4px}
.olist-t b{font-size:16px;font-weight:700}
.olist-t span{font-size:14px;line-height:1.5;color:var(--t3)}

/* Proof */
.case{background:radial-gradient(80% 90% at 100% 0%,rgba(0,132,61,.16) 0%,rgba(0,132,61,0) 60%),var(--card)}
.case-h{display:flex;flex-direction:column;gap:10px}
.case-t{margin:0;font-size:30px;line-height:1.05;font-weight:800;letter-spacing:-.03em}
.case-m{font-size:14px;color:var(--t4)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:24px;border-top:1px solid var(--l09)}
.stat{display:flex;flex-direction:column;gap:6px}
.stat-n{font-size:clamp(30px,3vw,42px);line-height:1;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.stat-n.up{color:var(--g-num)}
.stat-l{font-size:14px;color:var(--t3)}
.case p{margin:0;font-size:16px;line-height:1.55;color:var(--t2)}

/* FAQ */
.faq{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:48px 80px;align-items:start}
.faq-list{display:flex;flex-direction:column;border-top:1px solid var(--l10)}
details{border-bottom:1px solid var(--l10)}
summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;font-size:20px;line-height:1.3;font-weight:700;letter-spacing:-.01em;list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
details p{margin:0;padding:0 44px 24px 0;font-size:16px;line-height:1.6;color:var(--t3)}
.faq-i{flex:none;color:var(--g-acc);transition:transform .2s ease}
details[open] .faq-i{transform:rotate(45deg)}

/* Footer */
footer{border-top:1px solid rgba(255,255,255,.08);background:var(--foot);padding:var(--sec) var(--gutter) 40px}
footer a{color:var(--t3);text-decoration:none}footer a:hover{color:var(--t1)}
.foot-in{max-width:var(--wrap);margin:0 auto;display:flex;flex-direction:column;gap:48px}
.foot-top{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:32px}
.foot-brand{display:flex;flex-direction:column;gap:14px}
.foot-brand a{display:flex;align-items:center;gap:11px}
.foot-tag{font-size:15px;color:var(--t4)}
footer nav{display:flex;flex-wrap:wrap;gap:12px 28px;font-size:14px}
.foot-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px;padding-top:24px;border-top:1px solid var(--l06);font-size:13px;line-height:1.6;color:var(--t4)}

/* 404 */
.nf{max-width:var(--wrap);margin:0 auto;padding:var(--sec) var(--gutter);display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.nf p{margin:0}

@media (max-width:900px){.nav{display:none}}
@media (prefers-reduced-motion:reduce){.faq-i{transition:none}}
