/* ── TOKENS ─────────────────────────────────── */
:root {
    --bg:        #010101;
    --bg-panel:  #0D0D0D;
    --bg-up:     #141414;
    --primary:   #FF9F1C;
    --pdim:      rgba(255,159,28,.11);
    --pglow:     rgba(255,159,28,.38);
    --tx:        #EFEFEF;
    --tx-sub:    #8A8A8A;
    --tx-muted:  #4A4A4A;
    --border:    rgba(255,255,255,.06);
    --border-hi: rgba(255,255,255,.12);
    --r:         14px;
    --r-lg:      20px;
}

/* ── RESET ───────────────────────────────────── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font-family:'Inter',sans-serif;line-height:1.65;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif;line-height:1.08;letter-spacing:-.025em}
a{text-decoration:none;color:inherit;transition:color .2s}
ul{list-style:none}
img{max-width:100%;display:block}

/* ── BACKGROUNDS ─────────────────────────────── */
.grid-bg{position:fixed;inset:0;z-index:-2;pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
                     linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
    background-size:60px 60px;
    mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 20%,transparent 100%);
    -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 20%,transparent 100%)}

.amb{position:fixed;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:-1}
.amb-1{width:1000px;height:450px;top:-80px;left:50%;transform:translateX(-50%);
    background:radial-gradient(ellipse,rgba(255,159,28,.065) 0%,transparent 70%);
    animation:drift1 16s ease-in-out infinite alternate}
.amb-2{width:560px;height:560px;bottom:20%;right:-180px;
    background:radial-gradient(ellipse,rgba(255,159,28,.035) 0%,transparent 70%);
    animation:drift2 22s ease-in-out infinite alternate-reverse}
@keyframes drift1{0%{transform:translateX(-50%) translateY(0)}100%{transform:translateX(-50%) translateY(28px) scale(1.1)}}
@keyframes drift2{0%{transform:scale(1)}100%{transform:scale(1.18) translateY(-24px)}}

.beam{position:fixed;z-index:-1;pointer-events:none;opacity:0}
.beam.h{height:1px;width:400px;background:linear-gradient(90deg,transparent,rgba(255,159,28,.45),transparent);animation:bh 5s linear forwards}
.beam.v{width:1px;height:400px;background:linear-gradient(180deg,transparent,rgba(255,159,28,.45),transparent);animation:bv 5s linear forwards}
@keyframes bh{0%{left:-400px;opacity:0}15%{opacity:.7}85%{opacity:.7}100%{left:100%;opacity:0}}
@keyframes bv{0%{top:-400px;opacity:0}15%{opacity:.7}85%{opacity:.7}100%{top:100%;opacity:0}}

/* ── LAYOUT ──────────────────────────────────── */
.container{max-width:1160px;margin:0 auto;padding:0 28px}
.section{padding:100px 0;position:relative}
.divider{height:1px;background:linear-gradient(to right,transparent,rgba(255,255,255,.1),transparent)}
.section-label{display:inline-flex;align-items:center;gap:8px;color:var(--primary);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:2.2px;margin-bottom:14px}
.section-label::before{content:'';display:block;width:16px;height:1px;background:var(--primary)}
.section-head{text-align:center;margin-bottom:56px}
.section-head h2{font-size:clamp(2rem,4vw,2.75rem);margin-bottom:14px}
.section-head p{color:var(--tx-sub);max-width:520px;margin:0 auto;font-size:1rem}

/* ── REVEAL ──────────────────────────────────── */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1)}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}.reveal.d3{transition-delay:.3s}
.reveal.on{opacity:1;transform:translateY(0)}

/* ── NAV ─────────────────────────────────────── */
nav{position:fixed;top:0;left:0;width:100%;z-index:200;padding:18px 0;
    background:transparent;border-bottom:1px solid transparent;
    transition:background .35s,backdrop-filter .35s,border-color .35s}
nav.scrolled{background:rgba(1,1,1,.88);backdrop-filter:blur(24px);border-bottom-color:var(--border)}
.nav-inner{display:flex;justify-content:space-between;align-items:center}
.logo{font-family:'Space Grotesk',sans-serif;font-size:1.3rem;font-weight:700;letter-spacing:-1px}
.logo em{color:var(--primary);font-style:normal}
.nav-links{display:flex;align-items:center;gap:32px}
.nav-link{color:var(--tx-sub);font-size:.875rem;font-weight:500;position:relative;transition:color .2s}
.nav-link:hover{color:var(--tx)}
.nav-link::after{content:'';position:absolute;width:0;height:1px;bottom:-4px;left:0;background:var(--primary);transition:width .25s}
.nav-link:hover::after{width:100%}
.nav-cta{background:var(--primary);color:#000;padding:10px 22px;border-radius:8px;font-weight:700;font-size:.84rem;transition:transform .2s,box-shadow .2s;box-shadow:0 0 0 0 var(--pglow)}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 4px 22px var(--pglow)}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.hamburger span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:.3s}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
.mob-menu{display:none;position:fixed;inset:0;top:58px;background:rgba(1,1,1,.97);z-index:190;flex-direction:column;align-items:center;justify-content:center;gap:34px}
.mob-menu.open{display:flex}
.mob-menu .nav-link{font-size:1.35rem;color:var(--tx)}

.scroll-progress{position:fixed;top:0;left:0;width:0;height:3px;z-index:260;background:linear-gradient(90deg,var(--primary),#63B3ED);box-shadow:0 0 18px rgba(99,179,237,.35),0 0 18px rgba(255,159,28,.25);transform-origin:left center}

/* ── BUTTONS ─────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 28px;border-radius:10px;font-weight:600;font-size:.95rem;cursor:pointer;position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s;border:none;font-family:inherit;white-space:nowrap}
.btn-primary{background:var(--primary);color:#000;box-shadow:0 2px 24px rgba(255,159,28,.18)}
.btn-primary::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transform:skewX(-20deg);transition:.55s}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(255,159,28,.5)}
.btn-primary:hover::before{left:100%}
.btn-blue{background:rgba(99,179,237,.14);color:#d8ecff;border:1px solid rgba(99,179,237,.34);box-shadow:0 2px 24px rgba(99,179,237,.14)}
.btn-blue::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),transparent);transform:skewX(-20deg);transition:.55s}
.btn-blue:hover{transform:translateY(-2px);border-color:rgba(99,179,237,.52);box-shadow:0 10px 34px rgba(99,179,237,.26);background:rgba(99,179,237,.2)}
.btn-blue:hover::before{left:100%}
.btn-outline{background:transparent;color:var(--tx);border:1px solid var(--border-hi)}
.btn-outline:hover{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.22);transform:translateY(-1px)}
.btn-lg{padding:17px 38px;font-size:1.05rem;border-radius:12px}
.btn-full{width:100%;justify-content:center}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;color:var(--tx-sub);font-size:.95rem;font-weight:600;cursor:pointer;border:none;background:none;font-family:inherit;transition:color .2s,gap .2s;padding:0}
.btn-ghost:hover{color:var(--tx);gap:12px}
.btn-ghost svg{transition:transform .2s}
.btn-ghost:hover svg{transform:translateX(3px)}

/* ── HERO (SPLIT LAYOUT) ─────────────────────── */
#hero{min-height:100vh;display:flex;align-items:center;padding:120px 0 80px;position:relative}
.hero-split{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center;width:100%}
.hero-text{display:flex;flex-direction:column;align-items:flex-start}

.hero-eyebrow{display:inline-flex;align-items:center;gap:9px;background:var(--pdim);border:1px solid rgba(255,159,28,.18);color:var(--primary);padding:7px 16px;border-radius:50px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:1.8px;margin-bottom:32px;animation:popIn .8s cubic-bezier(.16,1,.3,1) backwards}
.eyebrow-dot{width:6px;height:6px;background:var(--primary);border-radius:50%;animation:pulsedot 2.2s ease-in-out infinite}
@keyframes pulsedot{0%,100%{box-shadow:0 0 0 0 rgba(255,159,28,.5)}50%{box-shadow:0 0 0 5px rgba(255,159,28,0)}}

.hero-title{font-size:clamp(2.8rem,5.5vw,4.8rem);color:var(--tx);margin-bottom:24px;animation:slideUp 1s cubic-bezier(.16,1,.3,1) .15s backwards}
.hero-title .accent{background:linear-gradient(130deg,var(--primary) 0%,#FFD580 50%,var(--primary) 100%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:gradshift 7s linear infinite}
@keyframes gradshift{0%{background-position:0% center}100%{background-position:200% center}}

.hero-sub{font-size:1.1rem;color:var(--tx-sub);max-width:500px;line-height:1.74;margin-bottom:40px;animation:slideUp 1s cubic-bezier(.16,1,.3,1) .3s backwards}

.hero-cta-row{display:flex;align-items:center;gap:28px;flex-wrap:wrap;animation:slideUp 1s cubic-bezier(.16,1,.3,1) .45s backwards}

.hero-proof{display:flex;align-items:center;gap:12px;margin-top:32px;animation:slideUp 1s cubic-bezier(.16,1,.3,1) .6s backwards}
.proof-avatars{display:flex}
.proof-avatars .av{width:32px;height:32px;border-radius:50%;border:2px solid var(--bg);overflow:hidden;margin-left:-8px;background:#2a2a2a}
.proof-avatars .av:first-child{margin-left:0}
.proof-avatars .av img{width:100%;height:100%;object-fit:cover}
.proof-text{font-size:.82rem;color:var(--tx-sub);line-height:1.4}
.proof-text strong{color:var(--tx);font-weight:600}

/* ── HERO VISUAL ─────────────────────────────── */
.hero-visual{position:relative;animation:slideUp 1s cubic-bezier(.16,1,.3,1) .25s backwards}
.hero-browser{
    border-radius:var(--r-lg);overflow:hidden;
    border:1px solid rgba(255,255,255,.1);
    box-shadow:0 40px 100px rgba(0,0,0,.7),0 0 60px rgba(255,159,28,.06);
    transform:perspective(1400px) rotateY(-8deg) rotateX(3deg);
    transition:transform .6s cubic-bezier(.16,1,.3,1);
}
.hero-visual:hover .hero-browser{transform:perspective(1400px) rotateY(-4deg) rotateX(1deg)}
.hb-bar{display:flex;align-items:center;gap:7px;padding:11px 16px;background:#1a1a1a;border-bottom:1px solid rgba(255,255,255,.07)}
.hb-dots{display:flex;gap:5px}
.hb-dots s{display:block;width:10px;height:10px;border-radius:50%;text-decoration:none}
.hb-dots s:nth-child(1){background:#ff5f57}
.hb-dots s:nth-child(2){background:#febc2e}
.hb-dots s:nth-child(3){background:#28c840}
.hb-addr{flex:1;background:#111;border-radius:6px;padding:5px 12px;font-size:.7rem;color:#555;text-align:center;margin:0 10px;font-family:'Inter',monospace}

/* fake website content inside browser */
.hb-content{background:#090909;overflow:hidden}
.fw-nav{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.06);background:#0c0c0c}
.fw-logo{width:80px;height:8px;background:var(--primary);border-radius:4px;opacity:.9}
.fw-nav-items{display:flex;gap:14px}
.fw-nav-items span{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.12)}
.fw-nav-items span:nth-child(1){width:44px}
.fw-nav-items span:nth-child(2){width:52px}
.fw-nav-items span:nth-child(3){width:40px}
.fw-nav-btn{width:64px;height:22px;background:var(--primary);border-radius:5px;opacity:.85}

.fw-hero-area{padding:36px 20px;background:linear-gradient(160deg,#0e0a03 0%,#080808 100%);position:relative;overflow:hidden}
.fw-hero-area::before{content:'';position:absolute;top:-40px;left:50%;transform:translateX(-50%);width:300px;height:160px;background:radial-gradient(ellipse,rgba(255,159,28,.08),transparent 70%);pointer-events:none}
.fw-h-line{height:14px;border-radius:7px;background:rgba(255,255,255,.85);margin-bottom:10px}
.fw-h-line.sm{height:10px;background:rgba(255,255,255,.55);width:75%}
.fw-h-line.xs{height:8px;background:rgba(255,255,255,.25);width:55%;margin-top:4px}
.fw-h-btn{display:inline-block;margin-top:20px;width:110px;height:30px;background:var(--primary);border-radius:7px}

.fw-cards-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px 20px 20px;background:#090909}
.fw-card-item{background:#141414;border-radius:8px;overflow:hidden;border:1px solid rgba(255,255,255,.06)}
.fw-card-thumb{height:52px}
.fw-card-thumb:nth-child(1){background:linear-gradient(135deg,#1a0e00,#2a1a08)}
.fw-card-body{padding:8px}
.fw-card-title{height:7px;border-radius:3px;background:rgba(255,255,255,.5);margin-bottom:5px}
.fw-card-sub{height:5px;border-radius:3px;background:rgba(255,255,255,.18);width:70%}
.fw-card-price{margin-top:7px;height:18px;width:50px;border-radius:4px;background:rgba(255,159,28,.25)}

/* floating badges on hero */
.hf{position:absolute;border-radius:10px;font-size:.78rem;font-weight:700;display:flex;align-items:center;gap:7px;padding:8px 14px;backdrop-filter:blur(12px)}
.hf-live{top:-18px;right:24px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.25);color:#22c55e}
.hf-live .dot{width:7px;height:7px;background:#22c55e;border-radius:50%;animation:pulsedot 2s ease-in-out infinite}
.hf-kassel{bottom:24px;left:-28px;background:rgba(12,12,12,.9);border:1px solid var(--border-hi);color:var(--tx-sub)}
.hf-kassel svg{color:var(--primary)}

/* ── STATS BAR ───────────────────────────────── */
.stats-bar{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:rgba(10,10,10,.9);backdrop-filter:blur(16px);padding:0;position:relative;z-index:10}
.stats-inner{display:flex}
.stat-block{flex:1;padding:32px 24px;text-align:center;position:relative}
.stat-block+.stat-block{border-left:1px solid var(--border)}
.stat-block::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:40%;height:2px;background:linear-gradient(to right,transparent,var(--primary),transparent);opacity:0;transition:opacity .3s}
.stat-block:hover::before{opacity:1}
.stat-big{display:block;font-family:'Space Grotesk',sans-serif;font-size:2.6rem;font-weight:700;color:#fff;line-height:1;margin-bottom:6px}
.stat-big .sa{color:var(--primary)}
.stat-cap{font-size:.72rem;text-transform:uppercase;letter-spacing:1px;color:var(--tx-muted)}

/* ── CARDS ───────────────────────────────────── */
.card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--r-lg);padding:34px;position:relative;overflow:hidden;transition:border-color .3s,transform .3s,box-shadow .3s;--mx:0px;--my:0px}
.card::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(500px circle at var(--mx) var(--my),rgba(255,255,255,.035),transparent 40%);opacity:0;transition:opacity .4s}
.card:hover::after{opacity:1}
.card:hover{border-color:var(--border-hi);transform:translateY(-4px);box-shadow:0 18px 56px rgba(0,0,0,.45)}
.card-icon{width:46px;height:46px;border-radius:12px;background:var(--pdim);border:1px solid rgba(255,159,28,.18);display:flex;align-items:center;justify-content:center;color:var(--primary);margin-bottom:18px;transition:.3s}
.card:hover .card-icon{background:var(--primary);color:#000;border-color:var(--primary);box-shadow:0 0 16px var(--pglow)}
.card h3{font-size:1.1rem;margin-bottom:9px}
.card p{color:var(--tx-sub);font-size:.9rem;line-height:1.62}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}

/* ── THREE PATHS ─────────────────────────────── */
#wege{padding:100px 0}
.paths-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}

.path-card{border-radius:24px;padding:38px 32px;display:flex;flex-direction:column;gap:20px;position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s,border-color .35s;min-height:100%;--mx:50%;--my:0%}
.path-card > *{position:relative;z-index:1}
.path-card::after{content:'';position:absolute;inset:0;background:radial-gradient(440px circle at var(--mx) var(--my),rgba(255,255,255,.08),transparent 42%);opacity:0;transition:opacity .35s;pointer-events:none}
.path-card:hover{transform:translateY(-7px)}
.path-card:hover::after{opacity:1}

/* Festpreis – amber */
.path-a{background:linear-gradient(150deg,#130d02,#0D0D0D);border:1px solid rgba(255,159,28,.35);box-shadow:0 0 50px rgba(255,159,28,.06),inset 0 0 60px rgba(255,159,28,.025)}
.path-a:hover{box-shadow:0 28px 80px rgba(0,0,0,.5),0 0 50px rgba(255,159,28,.13)}
.path-a::before{content:'';position:absolute;top:-70px;right:-70px;width:220px;height:220px;background:radial-gradient(circle,rgba(255,159,28,.1),transparent 70%);pointer-events:none}

/* Monatlich – teal/blue tint */
.path-b{background:linear-gradient(150deg,#080c12,#0D0D0D);border:1px solid rgba(99,179,237,.25);box-shadow:0 0 50px rgba(99,179,237,.04)}
.path-b:hover{box-shadow:0 28px 80px rgba(0,0,0,.5);border-color:rgba(99,179,237,.4)}
.path-b::before{content:'';position:absolute;top:-70px;right:-70px;width:220px;height:220px;background:radial-gradient(circle,rgba(99,179,237,.07),transparent 70%);pointer-events:none}

/* Persönlich – neutral */
.path-c{background:linear-gradient(150deg,#0c0c0e,#0D0D0D);border:1px solid rgba(255,255,255,.09)}
.path-c:hover{border-color:rgba(255,255,255,.18);box-shadow:0 28px 80px rgba(0,0,0,.5)}

.path-tag{display:inline-flex;align-items:center;gap:6px;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;padding:5px 12px;border-radius:50px;width:fit-content}
.tag-a{background:rgba(255,159,28,.1);color:var(--primary);border:1px solid rgba(255,159,28,.22)}
.tag-b{background:rgba(99,179,237,.08);color:#63B3ED;border:1px solid rgba(99,179,237,.2)}
.tag-c{background:rgba(255,255,255,.05);color:var(--tx-sub);border:1px solid rgba(255,255,255,.1)}

.path-icon{width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center}
.icon-a{background:rgba(255,159,28,.1);color:var(--primary)}
.icon-b{background:rgba(99,179,237,.1);color:#63B3ED}
.icon-c{background:rgba(255,255,255,.06);color:var(--tx-sub)}

.path-title{font-size:1.55rem;margin-bottom:6px}
.path-desc{color:var(--tx-sub);font-size:.9rem;line-height:1.65}
.path-feats{display:flex;flex-direction:column;gap:9px}
.path-feat{display:flex;align-items:center;gap:9px;font-size:.875rem;color:var(--tx-sub)}
.path-feat svg{flex-shrink:0}
.feat-a svg{color:var(--primary)}
.feat-b svg{color:#63B3ED}
.feat-c svg{color:#666}

.path-price{margin-top:auto;padding-top:22px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:14px}
.price-display{font-family:'Space Grotesk',sans-serif;font-size:2.1rem;font-weight:700;color:#fff;line-height:1;margin-bottom:4px}
.price-display .cur{font-size:1.1rem;vertical-align:super;margin-right:2px}
.price-display .per{font-size:.82rem;font-weight:400;color:var(--tx-muted);margin-left:3px;font-family:'Inter',sans-serif}
.price-from{font-size:.76rem;color:var(--tx-muted);margin-bottom:16px}
.price-none{font-size:.9rem;color:var(--tx-muted);margin-bottom:16px;padding:14px 0 0}

.section-panel{position:relative;padding:24px;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.07);box-shadow:0 28px 80px rgba(0,0,0,.22)}
.section-panel::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(700px circle at top center,rgba(255,159,28,.08),transparent 45%)}
.section-panel > *{position:relative;z-index:1}

.pricing-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0 0 26px}
.pricing-flow-card{position:relative;overflow:hidden;padding:18px 18px 16px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.015));border:1px solid var(--border);border-radius:18px;transition:transform .3s,border-color .3s,box-shadow .3s}
.pricing-flow-card::before{content:'';position:absolute;inset:0;background:radial-gradient(280px circle at top right,rgba(255,159,28,.1),transparent 48%);opacity:.9;pointer-events:none}
.pricing-flow-card:hover{transform:translateY(-4px);border-color:rgba(255,159,28,.18);box-shadow:0 18px 40px rgba(0,0,0,.25)}
.pricing-flow-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;position:relative;z-index:1}
.pricing-flow-nr{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--pdim);border:1px solid rgba(255,159,28,.22);font-family:'Space Grotesk',sans-serif;font-weight:700;color:var(--primary);font-size:.82rem}
.pricing-flow-icon{color:var(--primary);opacity:.95}
.pricing-flow-card h3{position:relative;z-index:1;font-size:1rem;margin-bottom:6px}
.pricing-flow-card p{position:relative;z-index:1;color:var(--tx-sub);font-size:.84rem;line-height:1.58}

.trust-proof-line.soft{color:#b0b0b0}
.trust-result-chip .result-pill{backdrop-filter:blur(12px)}

/* ── BUILDER TEASER ──────────────────────────── */
#builder{padding:100px 0}
.builder-split{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:center}

.bsteps{display:flex;flex-direction:column;gap:0;margin-top:32px;position:relative}
.bsteps::before{content:'';position:absolute;left:17px;top:0;width:2px;height:100%;background:linear-gradient(to bottom,var(--primary),rgba(255,159,28,.1));opacity:.25}
.bstep{display:flex;gap:18px;padding:0 0 28px;position:relative}
.bstep:last-child{padding-bottom:0}
.bstep-n{width:36px;height:36px;border-radius:50%;flex-shrink:0;background:var(--pdim);border:1px solid rgba(255,159,28,.28);color:var(--primary);font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:.8rem;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.bstep h4{font-size:.97rem;margin-bottom:4px;color:var(--tx)}
.bstep p{color:var(--tx-sub);font-size:.86rem;line-height:1.55}

/* static browser mockup for builder teaser */
.builder-screen{border-radius:var(--r-lg);overflow:hidden;border:1px solid rgba(255,255,255,.1);background:#0d0d0d;box-shadow:0 40px 100px rgba(0,0,0,.6),0 0 50px rgba(255,159,28,.05)}
.bs-bar{display:flex;align-items:center;gap:7px;padding:11px 16px;background:#1a1a1a;border-bottom:1px solid rgba(255,255,255,.07)}
.bs-dots{display:flex;gap:5px}
.bs-dots s{display:block;width:9px;height:9px;border-radius:50%;text-decoration:none}
.bs-dots s:nth-child(1){background:#ff5f57}
.bs-dots s:nth-child(2){background:#febc2e}
.bs-dots s:nth-child(3){background:#28c840}
.bs-url{flex:1;background:#111;border-radius:5px;padding:4px 12px;font-size:.68rem;color:#555;text-align:center;margin:0 10px;font-family:monospace}

.bs-topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:#0f0f0f;border-bottom:1px solid rgba(255,255,255,.05)}
.bs-tab{display:flex;gap:8px}
.bs-tab-item{padding:5px 14px;border-radius:6px;font-size:.7rem;font-family:'Space Grotesk',sans-serif;font-weight:600;cursor:pointer}
.bs-tab-item.act{background:var(--pdim);color:var(--primary);border:1px solid rgba(255,159,28,.2)}
.bs-tab-item:not(.act){background:rgba(255,255,255,.04);color:#555;border:1px solid rgba(255,255,255,.06)}
.bs-progress{display:flex;align-items:center;gap:6px}
.bs-prog-dot{width:7px;height:7px;border-radius:50%}
.bs-prog-dot.done{background:var(--primary)}
.bs-prog-dot:not(.done){background:#333}
.bs-prog-line{width:20px;height:1px;background:#333}

.bs-canvas{padding:20px;display:grid;grid-template-columns:1.2fr 1fr;gap:16px;background:#0d0d0d}
.bs-preview{border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.bs-prev-nav{height:34px;background:#141414;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;padding:0 14px;gap:8px}
.bs-prev-logo{width:50px;height:7px;background:var(--primary);border-radius:3px;opacity:.8}
.bs-prev-hero{padding:24px 18px;background:linear-gradient(135deg,#0e0a02,#080808)}
.bs-ph-h{height:11px;border-radius:5px;background:rgba(255,255,255,.8);margin-bottom:7px}
.bs-ph-sub{height:8px;border-radius:4px;background:rgba(255,255,255,.3);width:70%;margin-bottom:14px}
.bs-ph-btn{width:80px;height:22px;background:var(--primary);border-radius:6px;opacity:.85}
.bs-prev-cards{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;background:#0d0d0d}
.bs-mini-card{background:#141414;border-radius:6px;overflow:hidden;border:1px solid rgba(255,255,255,.05)}
.bs-mini-img{height:34px;background:linear-gradient(135deg,#1a0e00,#1a1200)}
.bs-mini-body{padding:6px}
.bs-mini-t{height:5px;border-radius:3px;background:rgba(255,255,255,.45);margin-bottom:4px}
.bs-mini-s{height:4px;border-radius:3px;background:rgba(255,255,255,.15);width:65%}

.bs-panel{display:flex;flex-direction:column;gap:10px}
.bs-panel-block{background:#111;border-radius:9px;border:1px solid rgba(255,255,255,.07);padding:12px}
.bs-panel-label{font-size:.62rem;text-transform:uppercase;letter-spacing:1px;color:#555;margin-bottom:8px;font-weight:700}
.bs-color-row{display:flex;gap:6px}
.bs-color{width:22px;height:22px;border-radius:6px;cursor:pointer}
.bs-color.sel{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--primary)}
.bs-field{width:100%;background:#0a0a0a;border:1px solid rgba(255,255,255,.1);border-radius:7px;padding:7px 10px;font-size:.75rem;color:#888;font-family:inherit;margin-top:4px}
.bs-status{display:flex;align-items:center;justify-content:space-between;background:#111;border-radius:9px;border:1px solid rgba(34,197,94,.15);padding:12px}
.bs-status-txt{font-size:.75rem;color:#22c55e;font-weight:600;display:flex;align-items:center;gap:6px}
.bs-status-dot{width:6px;height:6px;background:#22c55e;border-radius:50%;animation:pulsedot 2s ease-in-out infinite}
.bs-status-time{font-size:.7rem;color:#555}

/* ── TRUST ───────────────────────────────────── */
.trust-stage{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;margin-bottom:18px}
.trust-hero{position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(255,159,28,.09),rgba(255,255,255,.02) 35%,rgba(255,255,255,.01) 100%);border:1px solid rgba(255,159,28,.18);border-radius:26px;padding:34px;box-shadow:0 30px 90px rgba(0,0,0,.35)}
.trust-hero::before{content:'';position:absolute;inset:auto auto -90px -40px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,159,28,.16),transparent 70%);pointer-events:none}
.trust-hero::after{content:'';position:absolute;top:-120px;right:-120px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.08),transparent 68%);pointer-events:none}
.trust-hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:28px;position:relative;z-index:1}
.trust-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(255,159,28,.1);border:1px solid rgba(255,159,28,.22);color:var(--primary);font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.trust-proof-stack{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.trust-proof-line{display:inline-flex;align-items:center;gap:10px;color:var(--tx-sub);font-size:.82rem}
.trust-proof-line strong{color:var(--tx)}
.trust-proof-line .dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.45);animation:pulsedot 2.1s ease-in-out infinite}
.trust-quote{position:relative;z-index:1;font-family:'Space Grotesk',sans-serif;font-size:clamp(1.55rem,3vw,2.35rem);line-height:1.16;max-width:680px;margin-bottom:26px}
.trust-quote-mark{display:block;color:rgba(255,159,28,.45);font-size:3.5rem;line-height:.8;margin-bottom:10px}
.trust-quote-sub{position:relative;z-index:1;color:var(--tx-sub);font-size:1rem;line-height:1.75;max-width:630px;margin-bottom:26px}
.trust-proof-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:30px}
.trust-proof-card{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(10px)}
.trust-proof-card strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:1rem;color:#fff;margin-bottom:4px}
.trust-proof-card span{display:block;color:var(--tx-sub);font-size:.8rem;line-height:1.5}
.trust-hero-footer{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.tauthor-featured{display:flex;align-items:center;gap:14px}
.tavatar-featured{width:58px;height:58px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,159,28,.3);background:#222;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.tavatar-featured img{width:100%;height:100%;object-fit:cover}
.tname-lg{font-weight:700;font-size:1rem}
.trole-lg{color:var(--tx-sub);font-size:.84rem}
.trust-result-chip{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.result-pill{display:inline-flex;align-items:center;gap:9px;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:var(--tx-sub);font-size:.82rem}
.result-pill strong{color:#fff;font-family:'Space Grotesk',sans-serif;font-size:1rem}
.trust-side{display:grid;grid-template-columns:1fr;gap:18px}
.trust-metric{position:relative;overflow:hidden;background:linear-gradient(180deg,#101010,#0a0a0a);border:1px solid var(--border);border-radius:22px;padding:24px;min-height:146px;transition:transform .35s,border-color .35s,box-shadow .35s}
.trust-metric::before{content:'';position:absolute;inset:0;background:radial-gradient(350px circle at top right,rgba(255,159,28,.11),transparent 45%);opacity:.9;pointer-events:none}
.trust-metric:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.14);box-shadow:0 18px 50px rgba(0,0,0,.35)}
.metric-label{position:relative;z-index:1;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--tx-muted);margin-bottom:18px;font-weight:700}
.metric-value{position:relative;z-index:1;font-family:'Space Grotesk',sans-serif;font-size:2.35rem;line-height:1;color:#fff;margin-bottom:10px}
.metric-value span{color:var(--primary)}
.metric-copy{position:relative;z-index:1;color:var(--tx-sub);font-size:.88rem;line-height:1.6;max-width:250px}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px}
.tcard{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.01));border:1px solid var(--border);border-radius:22px;padding:28px;transition:border-color .35s,transform .35s,box-shadow .35s,background .35s}
.tcard::before{content:'';position:absolute;inset:0;background:radial-gradient(380px circle at var(--mx,75%) var(--my,0%),rgba(255,159,28,.11),transparent 42%);opacity:0;transition:opacity .35s;pointer-events:none}
.tcard:hover::before,.tcard.is-active::before{opacity:1}
.tcard:hover,.tcard.is-active{border-color:rgba(255,159,28,.2);transform:translateY(-6px);box-shadow:0 20px 60px rgba(0,0,0,.34);background:linear-gradient(180deg,rgba(255,159,28,.055),rgba(255,255,255,.015))}
.tcard-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.tcard-tag{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-sub)}
.tcard-tag svg{color:var(--primary)}
.stars{display:flex;gap:3px;color:var(--primary)}
.tcard-text{color:#d6d6d6;font-size:.95rem;line-height:1.78;margin-bottom:22px}
.tauthor{display:flex;align-items:center;gap:12px}
.tavatar{width:44px;height:44px;border-radius:50%;overflow:hidden;background:#222;border:2px solid rgba(255,255,255,.08);flex-shrink:0}
.tavatar img{width:100%;height:100%;object-fit:cover}
.tname{font-weight:600;font-size:.92rem}
.trole{color:var(--tx-muted);font-size:.78rem;line-height:1.45}
.guarantee-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gitem{display:flex;align-items:flex-start;gap:14px;padding:22px;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01));border:1px solid var(--border);border-radius:18px;transition:transform .3s,border-color .3s,box-shadow .3s}
.gitem:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.12);box-shadow:0 16px 40px rgba(0,0,0,.24)}
.gitem-icon{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:rgba(255,159,28,.09);border:1px solid rgba(255,159,28,.18);color:var(--primary);flex-shrink:0}
.gitem h4{font-size:.95rem;margin-bottom:5px}
.gitem p{color:var(--tx-sub);font-size:.84rem;line-height:1.6}



/* ── REVIEWS ONLY ───────────────────────────── */
.reviews-strip-section{
    padding:76px 0;
    overflow:hidden;
}
.reviews-stage{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:0;
}
.reviews-marquee{
    position:relative;
    overflow:hidden;
    border-radius:24px;
}
.reviews-marquee::before,
.reviews-marquee::after{
    content:'';
    position:absolute;
    top:0;
    bottom:0;
    width:90px;
    z-index:3;
    pointer-events:none;
}
.reviews-marquee::before{
    left:0;
    background:linear-gradient(90deg,var(--bg) 0%,rgba(1,1,1,0) 100%);
}
.reviews-marquee::after{
    right:0;
    background:linear-gradient(270deg,var(--bg) 0%,rgba(1,1,1,0) 100%);
}
.reviews-track{
    display:flex;
    align-items:stretch;
    gap:14px;
    width:max-content;
    will-change:transform;
}
.track-left{animation:reviewsLeft 54s linear infinite}
.track-right{animation:reviewsRight 60s linear infinite}
.reviews-marquee:hover .reviews-track{animation-play-state:paused}
.review-tile{
    position:relative;
    flex:0 0 320px;
    min-height:178px;
    padding:20px 20px 18px;
    border-radius:20px;
    overflow:hidden;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.07);
    box-shadow:0 12px 30px rgba(0,0,0,.16);
    transition:transform .25s,border-color .25s,background .25s;
}
.review-tile::before{
    content:'';
    position:absolute;
    inset:0;
    pointer-events:none;
    background:radial-gradient(300px circle at top right,rgba(255,159,28,.08),transparent 44%);
    opacity:.8;
}
.review-tile::after{
    display:none;
}
.review-tile:hover{
    transform:translateY(-3px);
    border-color:rgba(255,255,255,.12);
    background:rgba(255,255,255,.035);
}
.review-stars{
    position:relative;
    z-index:1;
    display:flex;
    gap:3px;
    color:var(--primary);
    margin-bottom:14px;
}
.review-stars::after{
    display:none;
}
.review-stars i{
    filter:none;
}
.review-copy{
    position:relative;
    z-index:1;
    font-family:'Inter',sans-serif;
    font-size:.95rem;
    line-height:1.68;
    letter-spacing:0;
    color:#ededed;
    margin-bottom:18px;
}
.review-meta{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    gap:9px;
    margin-top:auto;
    color:#9b9b9b;
    font-size:.76rem;
    font-weight:600;
    letter-spacing:.02em;
    text-transform:none;
}
.review-dot{
    width:4px;
    height:4px;
    border-radius:50%;
    background:rgba(255,159,28,.72);
    flex-shrink:0;
}
@keyframes reviewsLeft{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 7px))}}
@keyframes reviewsRight{from{transform:translateX(calc(-50% - 7px))}to{transform:translateX(0)}}

/* ── CONSULTATION ────────────────────────────── */
#beratung{padding:100px 0}
.consult-wrap{display:grid;grid-template-columns:1fr 1.12fr;gap:76px;align-items:start}
.consult-info h2{font-size:clamp(1.9rem,3.5vw,2.6rem);margin-bottom:16px}
.consult-info p{color:var(--tx-sub);font-size:1rem;line-height:1.72;margin-bottom:24px}
.consult-feats{display:flex;flex-direction:column;gap:12px}
.cfeat{display:flex;align-items:center;gap:10px;color:var(--tx-sub);font-size:.9rem}
.cfeat svg{color:var(--primary);flex-shrink:0}
.jason-row{display:flex;align-items:center;gap:14px;margin-top:28px;padding:16px;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--r)}
.jason-av{width:44px;height:44px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,159,28,.3);flex-shrink:0}
.jason-av img{width:100%;height:100%;object-fit:cover}

.ccard{background:var(--bg-panel);border:1px solid var(--border-hi);border-radius:var(--r-lg);padding:36px}
.ccard h3{font-size:1.35rem;margin-bottom:6px}
.ccard .csub{color:var(--tx-muted);font-size:.86rem;margin-bottom:24px}
.fgroup{margin-bottom:13px}
.fgroup label{display:block;font-size:.71rem;color:var(--tx-muted);font-weight:700;text-transform:uppercase;letter-spacing:.9px;margin-bottom:6px}
.fgroup input,.fgroup select,.fgroup textarea{width:100%;background:var(--bg-up);border:1px solid var(--border-hi);border-radius:9px;padding:11px 15px;color:var(--tx);font-family:inherit;font-size:.92rem;outline:none;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.fgroup input:focus,.fgroup select:focus,.fgroup textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,159,28,.09)}
.fgroup textarea{resize:vertical;min-height:86px}
.fgroup select option{background:#111;color:#fff}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.fhint{font-size:.76rem;color:var(--tx-muted);margin-top:13px;text-align:center}
.fhint a{color:var(--primary)}

/* ── FOOTER ──────────────────────────────────── */
footer{border-top:1px solid var(--border);padding:60px 0 26px;background:#000;margin-top:80px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:42px}
.footer-about p{color:var(--tx-muted);font-size:.86rem;margin-top:14px;max-width:270px;line-height:1.7}
.footer-loc{display:inline-flex;align-items:center;gap:7px;margin-top:16px;background:rgba(255,255,255,.03);border:1px solid var(--border);padding:7px 12px;border-radius:7px;font-size:.76rem;color:#666}
.footer-loc svg{color:var(--primary)}
.fcol h4{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:1.3px;color:#fff;margin-bottom:16px}
.flinks{display:flex;flex-direction:column;gap:9px}
.flinks a{color:var(--tx-muted);font-size:.86rem;transition:color .2s,padding-left .2s}
.flinks a:hover{color:var(--primary);padding-left:4px}
.fsocial{display:flex;gap:10px;margin-top:18px}
.fsocial a{width:33px;height:33px;border-radius:7px;background:rgba(255,255,255,.04);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--tx-muted);transition:.2s}
.fsocial a:hover{background:var(--pdim);color:var(--primary)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.05);padding-top:20px;display:flex;justify-content:space-between;align-items:center;color:#3a3a3a;font-size:.76rem}
.footer-bottom a{color:#484848;transition:color .2s}.footer-bottom a:hover{color:#777}

/* ── COOKIE ──────────────────────────────────── */
#cookie-banner{position:fixed;bottom:22px;left:22px;max-width:400px;z-index:9999;background:var(--bg-up);border:1px solid var(--border-hi);padding:20px;border-radius:var(--r);box-shadow:0 24px 60px rgba(0,0,0,.6);transform:translateY(16px);opacity:0;transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .5s;pointer-events:none}
#cookie-banner.show{transform:translateY(0);opacity:1;pointer-events:all}
.ck-title{font-weight:600;margin-bottom:7px;display:flex;align-items:center;gap:8px;font-size:.9rem}
.ck-title svg{color:var(--primary)}
.ck-text{font-size:.8rem;color:var(--tx-muted);line-height:1.6;margin-bottom:16px}
.ck-btns{display:flex;gap:9px}

/* ── ANIMATIONS ──────────────────────────────── */
@keyframes popIn{from{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}
@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}


/* ── HERO REVAMP V11 ───────────────────────── */
#hero{
    padding:148px 0 112px;
    min-height:100vh;
}
#hero::before{
    background:
        radial-gradient(circle at 76% 26%, rgba(99,179,237,.12), transparent 24%),
        radial-gradient(circle at 24% 10%, rgba(255,159,28,.14), transparent 26%),
        linear-gradient(180deg, rgba(255,255,255,.015), transparent 55%);
}
#hero::after{
    inset:auto 4% 4% auto;
    width:420px;
    height:420px;
    background:radial-gradient(circle, rgba(255,255,255,.055), transparent 65%);
    filter:blur(24px);
}
.hero-split{
    grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
    gap:72px;
}
.hero-text{
    max-width:620px;
}
.hero-pretitle-rail{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:0 0 18px;
    animation:slideUp 1s cubic-bezier(.16,1,.3,1) .08s backwards;
}
.hero-pretitle-rail span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.08);
    color:#d7d7d7;
    font-size:.77rem;
    font-weight:600;
    letter-spacing:.02em;
    box-shadow:0 10px 28px rgba(0,0,0,.14);
}
.hero-pretitle-rail span::before{
    content:'';
    width:6px;
    height:6px;
    border-radius:50%;
    background:linear-gradient(180deg, var(--primary), #63B3ED);
    box-shadow:0 0 0 4px rgba(255,159,28,.08);
}
.hero-title{
    font-size:clamp(3.35rem,6.2vw,5.6rem);
    line-height:.95;
    letter-spacing:-.055em;
    margin-bottom:22px;
}
.hero-sub{
    max-width:580px;
    font-size:1.08rem;
    color:#b3b3b3;
    line-height:1.82;
    margin-bottom:28px;
}
.hero-cta-row{
    gap:14px;
    margin-bottom:24px;
}
.hero-trust-pills{
    gap:10px;
    margin-bottom:26px;
}
.hero-trust-pill{
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.07);
    box-shadow:0 14px 34px rgba(0,0,0,.16);
}
.hero-scroll-invite{
    display:flex;
    align-items:center;
    gap:14px;
    width:fit-content;
    padding:14px 16px;
    border-radius:22px;
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 18px 46px rgba(0,0,0,.18);
    animation:slideUp 1s cubic-bezier(.16,1,.3,1) .72s backwards;
}
.hero-scroll-copy{
    display:flex;
    flex-direction:column;
    gap:4px;
}
.hero-scroll-copy strong{
    font-size:.9rem;
    letter-spacing:-.02em;
}
.hero-scroll-copy span{
    display:block;
    max-width:320px;
    color:var(--tx-sub);
    font-size:.8rem;
    line-height:1.55;
}
.hero-scroll-mouse{
    width:34px;
    height:52px;
    flex-shrink:0;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.12);
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
    position:relative;
    overflow:hidden;
}
.hero-scroll-mouse::before{
    content:'';
    position:absolute;
    top:10px;
    left:50%;
    width:4px;
    height:10px;
    margin-left:-2px;
    border-radius:999px;
    background:var(--primary);
    animation:scrollNudge 1.8s ease-in-out infinite;
}
.hero-scroll-mouse::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, transparent, rgba(255,255,255,.05), transparent);
    animation:scrollGlow 2.2s ease-in-out infinite;
}
@keyframes scrollNudge{
    0%{transform:translateY(0);opacity:0}
    20%{opacity:1}
    70%{transform:translateY(16px);opacity:1}
    100%{transform:translateY(20px);opacity:0}
}
@keyframes scrollGlow{
    0%,100%{transform:translateY(-100%)}
    50%{transform:translateY(100%)}
}
.hero-visual{
    perspective:1800px;
}
.hero-stage{
    --hero-rx:0deg;
    --hero-ry:0deg;
    --spot-x:78%;
    --spot-y:14%;
    position:relative;
    isolation:isolate;
    padding:20px;
    border-radius:34px;
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 42px 120px rgba(0,0,0,.42);
    overflow:visible;
}
.hero-stage::before{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    background:
        radial-gradient(760px circle at var(--spot-x) var(--spot-y), rgba(255,159,28,.14), transparent 34%),
        radial-gradient(520px circle at 14% 100%, rgba(99,179,237,.11), transparent 30%);
}
.hero-stage::after{
    content:'';
    position:absolute;
    inset:14px;
    border-radius:26px;
    border:1px solid rgba(255,255,255,.045);
    pointer-events:none;
}
.hero-stage-head{
    margin-bottom:18px;
    padding:2px 4px 0;
}
.hero-stage-title{
    font-size:1.24rem;
    max-width:330px;
}
.hero-browser{
    transform:perspective(1800px) rotateX(var(--hero-rx)) rotateY(var(--hero-ry));
    transform-style:preserve-3d;
    transition:transform .28s ease, box-shadow .35s ease;
    border-radius:28px;
    overflow:hidden;
}
.hb-content{
    position:relative;
}
.hb-content::after{
    content:'';
    position:absolute;
    left:0;
    right:0;
    top:-48%;
    height:44%;
    background:linear-gradient(180deg, transparent, rgba(255,255,255,.05), transparent);
    opacity:.75;
    pointer-events:none;
    animation:heroScan 6.5s ease-in-out infinite;
}
@keyframes heroScan{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(225%)}
}
.fw-hero-area{
    padding:44px 24px 40px;
    position:relative;
}
.fw-hero-chip{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 11px;
    border-radius:999px;
    background:rgba(255,159,28,.12);
    border:1px solid rgba(255,159,28,.22);
    color:var(--primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.03em;
    margin-bottom:16px;
    box-shadow:0 12px 26px rgba(0,0,0,.15);
    animation:heroChipPulse 3.8s ease-in-out infinite;
}
@keyframes heroChipPulse{
    0%,100%{transform:translateY(0);box-shadow:0 12px 26px rgba(0,0,0,.15)}
    50%{transform:translateY(-2px);box-shadow:0 18px 32px rgba(255,159,28,.18)}
}
.fw-h-line{
    position:relative;
    overflow:hidden;
}
.fw-h-line::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.26), transparent);
    transform:translateX(-120%);
    animation:lineSweep 4.8s ease-in-out infinite;
}
@keyframes lineSweep{
    0%,100%{transform:translateX(-120%)}
    55%{transform:translateX(140%)}
}
.fw-cards-row{
    padding:18px 22px 22px;
    gap:12px;
}
.fw-card-item{
    transform:translateY(0);
    animation:cardBob 6s ease-in-out infinite;
}
.fw-card-item:nth-child(2){animation-delay:.35s}
.fw-card-item:nth-child(3){animation-delay:.7s}
@keyframes cardBob{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-5px)}
}
.hero-floating{
    position:absolute;
    z-index:3;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    border-radius:16px;
    background:rgba(8,8,8,.78);
    border:1px solid rgba(255,255,255,.11);
    box-shadow:0 20px 46px rgba(0,0,0,.28);
    backdrop-filter:blur(16px);
    color:#ececec;
    font-size:.8rem;
    font-weight:600;
    white-space:nowrap;
}
.hero-floating i{color:var(--primary)}
.hero-floating-a{
    top:106px;
    right:-20px;
    animation:heroFloatA 5.4s ease-in-out infinite;
}
.hero-floating-b{
    left:-28px;
    bottom:164px;
    animation:heroFloatB 6.2s ease-in-out infinite;
}
.hero-floating-c{
    right:18px;
    bottom:-16px;
    animation:heroFloatC 5.8s ease-in-out infinite;
}
@keyframes heroFloatA{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-10px)}
}
@keyframes heroFloatB{
    0%,100%{transform:translateY(0) rotate(-2deg)}
    50%{transform:translateY(-12px) rotate(1deg)}
}
@keyframes heroFloatC{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-8px)}
}
.hero-signal-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:16px;
}
.hero-signal-card{
    padding:15px 15px 14px;
    border-radius:18px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.07);
    box-shadow:0 16px 38px rgba(0,0,0,.18);
}
.hero-signal-label{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-bottom:10px;
    color:var(--tx-muted);
    font-size:.66rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.hero-signal-label::before{
    content:'';
    width:14px;
    height:1px;
    background:var(--primary);
}
.hero-signal-card strong{
    display:block;
    font-family:'Space Grotesk',sans-serif;
    font-size:1rem;
    line-height:1.1;
    margin-bottom:7px;
}
.hero-signal-card p{
    color:var(--tx-sub);
    font-size:.78rem;
    line-height:1.58;
}
.hero-stage-bar{
    margin-top:14px;
}
.hero-metric{
    border-radius:18px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.07);
    box-shadow:0 16px 38px rgba(0,0,0,.16);
}
@media(max-width:1100px){
    #hero{padding:132px 0 90px}
    .hero-split{grid-template-columns:1fr;gap:42px}
    .hero-text{max-width:none;text-align:center;align-items:center}
    .hero-pretitle-rail,.hero-trust-pills{justify-content:center}
    .hero-sub{max-width:650px}
    .hero-scroll-invite{margin:0 auto}
    .hero-scroll-copy span{max-width:420px}
    .hero-floating-a{right:18px;top:108px}
    .hero-floating-b{left:18px;bottom:156px}
}
@media(max-width:768px){
    #hero{padding:118px 0 74px}
    .hero-pretitle-rail{justify-content:center}
    .hero-title{font-size:clamp(2.7rem,11vw,4.05rem)}
    .hero-scroll-invite{width:100%;justify-content:flex-start}
    .hero-signal-grid,.hero-stage-bar{grid-template-columns:1fr}
    .hero-floating{display:none}
    .hero-stage{padding:14px;border-radius:26px}
    .hero-browser{border-radius:22px;transform:none!important}
    .hero-stage::after{inset:10px;border-radius:18px}
}

/* ── RESPONSIVE ──────────────────────────────── */
@media(max-width:1100px){
    .hero-split{grid-template-columns:1fr;gap:44px}
    .hero-text{align-items:center;text-align:center}
    .hero-sub{max-width:100%}
    .hero-cta-row{justify-content:center}
    .hero-proof{justify-content:center}
    .hero-visual{max-width:600px;margin:0 auto}
    .builder-split{grid-template-columns:1fr;gap:44px}
    .consult-wrap{grid-template-columns:1fr;gap:44px}
    .trust-stage{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
    .paths-3{grid-template-columns:1fr}
    .section-panel{padding:18px}
    .pricing-flow{grid-template-columns:1fr 1fr}
    .features-grid,.trust-grid,.guarantee-strip{grid-template-columns:1fr}
    .trust-hero-top,.trust-hero-footer{flex-direction:column;align-items:flex-start}
    .trust-result-chip{justify-content:flex-start}
    .stats-inner{flex-wrap:wrap}
    .stat-block{flex:1 1 50%}
    .stat-block+.stat-block{border-left:none;border-top:1px solid var(--border)}
}
@media(max-width:768px){
    .nav-links{display:none}
    .review-tile{flex-basis:300px;min-height:205px;padding:22px}
    .reviews-marquee::before,.reviews-marquee::after{width:52px}
    .hamburger{display:flex}
    .section{padding:68px 0}
    .paths-3{grid-template-columns:1fr}
    .pricing-flow{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr}
    .footer-bottom{flex-direction:column;gap:10px;text-align:center}
    #cookie-banner{left:12px;right:12px;max-width:none}
    .frow{grid-template-columns:1fr}
    .hero-browser{transform:none!important}
    .hf{display:none}
    .reveal{opacity:1;transform:none;transition:none}
    .bs-canvas{grid-template-columns:1fr}
    .bs-panel{display:none}
}
    
/* ── DESIGN POLISH V9 ────────────────────────── */
body{
    background:
        radial-gradient(circle at 12% 14%, rgba(99,179,237,.08), transparent 26%),
        radial-gradient(circle at 82% 9%, rgba(255,159,28,.10), transparent 30%),
        radial-gradient(circle at 50% 120%, rgba(255,255,255,.03), transparent 42%),
        #010101;
}
.section{padding:112px 0}
.section-label{
    padding:8px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    letter-spacing:1.5px;
}
.section-label::before{display:none}
.section-head{margin-bottom:64px}
.section-head h2{font-size:clamp(2.25rem,4vw,3.1rem)}
.section-head p{max-width:650px;line-height:1.78}

#hero{
    padding:138px 0 92px;
}
#hero::before{
    content:'';
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 70% 34%, rgba(99,179,237,.08), transparent 26%),
        radial-gradient(circle at 28% 12%, rgba(255,159,28,.12), transparent 24%);
    pointer-events:none;
}
#hero::after{
    content:'';
    position:absolute;
    inset:auto 8% 6% auto;
    width:380px;
    height:380px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,.04), transparent 64%);
    filter:blur(18px);
    pointer-events:none;
}
.hero-split{
    gap:64px;
    align-items:center;
}
.hero-text{
    position:relative;
    z-index:1;
    max-width:620px;
}
.hero-title{
    font-size:clamp(3.2rem,6vw,5.15rem);
    max-width:760px;
    margin-bottom:20px;
}
.hero-sub{
    max-width:590px;
    font-size:1.08rem;
    color:#ababab;
    margin-bottom:30px;
}
.hero-cta-row{
    gap:14px;
    margin-bottom:28px;
}
.hero-trust-pills{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    animation:slideUp 1s cubic-bezier(.16,1,.3,1) .6s backwards;
}
.hero-trust-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    color:#d7d7d7;
    font-size:.82rem;
    line-height:1;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.hero-trust-pill i{
    color:var(--primary);
}
.hero-visual{
    position:relative;
    z-index:1;
}
.hero-stage{
    position:relative;
    padding:18px;
    border-radius:32px;
    background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 40px 110px rgba(0,0,0,.4);
}
.hero-stage::before{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    background:radial-gradient(560px circle at top right, rgba(255,159,28,.09), transparent 42%);
}
.hero-stage-head{
    position:relative;
    z-index:1;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
    margin-bottom:16px;
    padding:2px 4px 0;
}
.hero-stage-copy{
    display:flex;
    flex-direction:column;
    gap:6px;
}
.hero-stage-label{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.hero-stage-label::before{
    content:'';
    width:18px;
    height:1px;
    background:var(--primary);
    opacity:.8;
}
.hero-stage-title{
    font-family:'Space Grotesk',sans-serif;
    font-size:1.2rem;
    line-height:1.15;
}
.hero-stage-note{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 12px;
    border-radius:999px;
    background:rgba(99,179,237,.10);
    border:1px solid rgba(99,179,237,.24);
    color:#cfe8ff;
    font-size:.78rem;
    white-space:nowrap;
}
.hero-stage-note i{
    color:#63B3ED;
}
.hero-browser{
    position:relative;
    z-index:1;
    border-radius:26px;
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 36px 90px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.03) inset, 0 0 56px rgba(255,159,28,.06);
}
.hero-browser::before{
    content:'';
    position:absolute;
    inset:-1px;
    border-radius:inherit;
    padding:1px;
    background:linear-gradient(135deg, rgba(255,159,28,.18), rgba(255,255,255,.02), rgba(99,179,237,.16));
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
            mask-composite:exclude;
    pointer-events:none;
}
.hb-content{
    position:relative;
    background:
        radial-gradient(circle at 50% 0%, rgba(255,159,28,.05), transparent 28%),
        #090909;
}
.fw-hero-area{
    padding:42px 24px 40px;
}
.fw-cards-row{
    gap:12px;
    padding:18px 22px 22px;
}
.hero-stage-bar{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:16px;
}
.hero-metric{
    padding:16px 16px 14px;
    border-radius:18px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.07);
}
.hero-metric strong{
    display:block;
    font-family:'Space Grotesk',sans-serif;
    font-size:1rem;
    line-height:1;
    margin-bottom:6px;
    text-transform:uppercase;
    color:#fff;
}
.hero-metric span{
    display:block;
    color:var(--tx-sub);
    font-size:.78rem;
    line-height:1.5;
}

.stats-bar{
    background:transparent;
    border:none;
    padding:12px 0 12px;
}
.stats-inner{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}
.stat-block{
    padding:28px 24px;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 26px 60px rgba(0,0,0,.22);
}
.stat-block+.stat-block{border-left:none}
.stat-big{font-size:2.8rem}
.stat-cap{font-size:.76rem;color:#7f7f7f}

#services{
    position:relative;
}
#services .section-head{
    max-width:780px;
    margin-left:auto;
    margin-right:auto;
}
.features-grid{
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:18px;
}
.features-grid .card{
    grid-column:span 4;
    padding:30px;
    border-radius:24px;
    border:1px solid rgba(255,255,255,.08);
    background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.012));
    box-shadow:0 24px 60px rgba(0,0,0,.22);
}
.features-grid .card:first-child{
    grid-column:span 6;
    padding:40px;
    background:linear-gradient(145deg, rgba(255,159,28,.12), rgba(255,255,255,.025) 42%, rgba(255,255,255,.012) 100%);
    border-color:rgba(255,159,28,.16);
}
.features-grid .card:nth-child(2),
.features-grid .card:nth-child(3){
    grid-column:span 3;
}
.features-grid .card-icon{
    width:52px;
    height:52px;
    border-radius:16px;
}
.features-grid .card h3{
    font-size:1.12rem;
    margin-bottom:10px;
}
.features-grid .card p{
    font-size:.92rem;
    line-height:1.68;
}

#builder{
    position:relative;
    overflow:hidden;
}
#builder .builder-split > .reveal:first-child{
    position:relative;
    padding:42px;
    border-radius:30px;
    background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.012));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 28px 90px rgba(0,0,0,.24);
}
#builder .builder-split > .reveal:first-child::before{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:radial-gradient(560px circle at top left, rgba(255,159,28,.11), transparent 42%);
    pointer-events:none;
}
.bsteps{margin-top:34px}
.bstep{
    padding-bottom:22px;
}
.bstep h4{
    font-size:1rem;
    margin-bottom:6px;
}
.builder-screen{
    position:relative;
    border-radius:30px;
    border:1px solid rgba(255,255,255,.1);
    box-shadow:0 50px 120px rgba(0,0,0,.56), 0 0 0 1px rgba(255,255,255,.02) inset;
    transform:perspective(1400px) rotateY(-6deg) rotateX(3deg);
}
.builder-screen::before{
    content:'';
    position:absolute;
    inset:-1px;
    border-radius:inherit;
    padding:1px;
    background:linear-gradient(145deg, rgba(255,159,28,.24), rgba(255,255,255,.04), rgba(99,179,237,.18));
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
            mask-composite:exclude;
    pointer-events:none;
}
.bs-canvas{padding:22px;gap:18px}
.bs-preview,
.bs-panel-block,
.bs-status{border-radius:16px}
.bs-panel-block{
    background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}
.bs-status{
    background:linear-gradient(180deg, rgba(34,197,94,.12), rgba(17,17,17,.5));
}
.review-tile{
    border-radius:22px;
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 18px 44px rgba(0,0,0,.2);
}

#beratung{
    position:relative;
}
.consult-info{
    position:relative;
    padding:40px;
    border-radius:30px;
    background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.012));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 26px 70px rgba(0,0,0,.2);
}
.consult-info::before{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:radial-gradient(520px circle at top left, rgba(255,159,28,.1), transparent 42%);
    pointer-events:none;
}
.consult-info > *{position:relative;z-index:1}
.ccard{
    border-radius:30px;
    padding:38px;
    background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
    box-shadow:0 32px 90px rgba(0,0,0,.26);
}
.fgroup input,.fgroup select,.fgroup textarea{
    background:rgba(255,255,255,.03);
}
.jason-row{
    border-radius:20px;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.08);
}

.prefooter-cta{
    padding:26px 0 20px;
}
.prefooter-panel{
    display:grid;
    grid-template-columns:1.2fr auto;
    gap:26px;
    align-items:center;
    padding:34px 36px;
    border-radius:30px;
    background:linear-gradient(135deg, rgba(255,159,28,.12), rgba(255,255,255,.03) 38%, rgba(99,179,237,.08) 100%);
    border:1px solid rgba(255,255,255,.09);
    box-shadow:0 30px 90px rgba(0,0,0,.25);
}
.prefooter-panel h2{
    font-size:clamp(2rem,3.5vw,2.9rem);
    margin:8px 0 12px;
    line-height:1.1;
}
.prefooter-panel p{
    max-width:640px;
    color:#adadad;
    line-height:1.72;
}
.prefooter-actions{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

footer{
    margin-top:32px;
    background:
        radial-gradient(circle at top left, rgba(255,159,28,.08), transparent 24%),
        #000;
    border-top:1px solid rgba(255,255,255,.08);
}
.footer-grid{
    gap:54px;
}
.footer-about p{
    font-size:.9rem;
    color:#999;
}
.fcol h4{
    color:#d8d8d8;
}
.flinks a{
    color:#8b8b8b;
}
.footer-bottom{
    color:#555;
}

@media(max-width:1100px){
    .hero-stage-bar{grid-template-columns:1fr}
    .hero-stage-head{align-items:flex-start;flex-direction:column}
    #builder .builder-split > .reveal:first-child{padding:34px}
    .prefooter-panel{grid-template-columns:1fr}
    .prefooter-actions{justify-content:flex-start}
}
@media(max-width:900px){
    .stats-inner{grid-template-columns:1fr}
    .features-grid{
        grid-template-columns:1fr 1fr;
    }
    .features-grid .card,
    .features-grid .card:first-child,
    .features-grid .card:nth-child(2),
    .features-grid .card:nth-child(3){
        grid-column:auto;
    }
    .hero-trust-pills{
        max-width:420px;
    }
    .builder-screen{
        transform:none;
    }
    .hero-stage{
        padding:16px;
    }
}
@media(max-width:768px){
    .section{padding:78px 0}
    .hero-title{font-size:clamp(2.65rem,11vw,4rem)}
    .hero-cta-row{justify-content:center}
    .hero-trust-pills{max-width:100%;justify-content:center}
    .hero-stage-bar{grid-template-columns:1fr}
    .features-grid{grid-template-columns:1fr}
    #builder .builder-split > .reveal:first-child,
    .consult-info,
    .ccard,
    .prefooter-panel{
        padding:26px;
        border-radius:24px;
    }
    .hero-browser{border-radius:24px}
    .stat-block{padding:24px 20px}
    .prefooter-actions .btn{width:100%;justify-content:center}
}
@media(max-width:560px){
    .hero-stage-note{
        white-space:normal;
    }
    .review-tile{
        flex-basis:280px;
    }
}


/* ── HERO V12 REBUILD ───────────────────────── */
.hero-v12{
    min-height:100vh;
    display:flex;
    align-items:center;
    padding:138px 0 88px;
    position:relative;
    overflow:hidden;
}
.hero-v12::before{
    content:'';
    position:absolute;
    left:-140px;
    top:120px;
    width:420px;
    height:420px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,159,28,.11), transparent 70%);
    filter:blur(10px);
    pointer-events:none;
}
.hero-v12::after{
    content:'';
    position:absolute;
    right:-120px;
    bottom:40px;
    width:360px;
    height:360px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(99,179,237,.10), transparent 72%);
    filter:blur(14px);
    pointer-events:none;
}
.hero-shell{
    display:grid;
    grid-template-columns:minmax(0, 1.02fr) minmax(0, .98fr);
    gap:72px;
    align-items:center;
}
.hero-copy{
    position:relative;
    z-index:2;
}
.hero-kicker{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:8px 16px;
    border-radius:999px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    color:#d5d5d5;
    font-size:.78rem;
    font-weight:600;
    letter-spacing:.02em;
    margin-bottom:28px;
    animation:heroFadeUp .9s cubic-bezier(.16,1,.3,1) backwards;
}
.hero-kicker-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--primary);
    box-shadow:0 0 0 0 rgba(255,159,28,.5);
    animation:pulsedot 2.2s ease-in-out infinite;
}
.hero-heading{
    font-size:clamp(3rem, 5.7vw, 5.35rem);
    line-height:.98;
    letter-spacing:-.05em;
    margin-bottom:22px;
    animation:heroFadeUp 1s cubic-bezier(.16,1,.3,1) .08s backwards;
}
.hero-heading span{
    color:var(--primary);
    text-shadow:0 0 32px rgba(255,159,28,.12);
}
.hero-lead{
    max-width:590px;
    color:#b7b7b7;
    font-size:1.05rem;
    line-height:1.78;
    margin-bottom:34px;
    animation:heroFadeUp 1s cubic-bezier(.16,1,.3,1) .16s backwards;
}
.hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-bottom:28px;
    animation:heroFadeUp 1s cubic-bezier(.16,1,.3,1) .24s backwards;
}
.hero-meta-line{
    display:flex;
    flex-wrap:wrap;
    gap:10px 14px;
    color:#8f8f8f;
    font-size:.84rem;
    margin-bottom:28px;
    animation:heroFadeUp 1s cubic-bezier(.16,1,.3,1) .32s backwards;
}
.hero-meta-line span{
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.hero-meta-line span::before{
    content:'';
    width:5px;
    height:5px;
    border-radius:50%;
    background:rgba(255,159,28,.8);
    flex-shrink:0;
}
.hero-scroll-link{
    display:inline-flex;
    align-items:center;
    gap:14px;
    padding:14px 18px;
    border-radius:18px;
    background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
    border:1px solid rgba(255,255,255,.08);
    transition:transform .3s, border-color .3s, background .3s, box-shadow .3s;
    animation:heroFadeUp 1s cubic-bezier(.16,1,.3,1) .4s backwards;
}
.hero-scroll-link:hover{
    transform:translateY(-3px);
    border-color:rgba(255,159,28,.22);
    box-shadow:0 18px 42px rgba(0,0,0,.28);
}
.hero-scroll-icon{
    width:42px;
    height:42px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,159,28,.10);
    border:1px solid rgba(255,159,28,.18);
    color:var(--primary);
    animation:heroScrollPulse 2.8s ease-in-out infinite;
}
.hero-scroll-link strong{
    display:block;
    font-size:.93rem;
    color:#fff;
    margin-bottom:2px;
}
.hero-scroll-link em{
    display:block;
    font-style:normal;
    color:#8d8d8d;
    font-size:.8rem;
}
.hero-scene-wrap{
    position:relative;
    min-width:0;
    animation:heroFadeUp 1.05s cubic-bezier(.16,1,.3,1) .12s backwards;
}
.hero-scene{
    --hero-rx:0deg;
    --hero-ry:0deg;
    --spot-x:72%;
    --spot-y:18%;
    position:relative;
    min-height:640px;
    padding:34px 28px 98px;
    border-radius:34px;
    background:
        radial-gradient(420px circle at var(--spot-x) var(--spot-y), rgba(255,159,28,.18), transparent 42%),
        linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.015) 48%, rgba(255,255,255,.01) 100%);
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 34px 100px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.04);
    transform:perspective(1600px) rotateX(var(--hero-rx)) rotateY(var(--hero-ry));
    transition:transform .24s ease-out, box-shadow .35s ease-out, border-color .35s ease-out;
    overflow:hidden;
    isolation:isolate;
}
.hero-scene:hover{
    border-color:rgba(255,159,28,.16);
    box-shadow:0 42px 120px rgba(0,0,0,.56), 0 0 60px rgba(255,159,28,.08);
}
.hero-scene::before{
    content:'';
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg, rgba(255,255,255,.05), transparent 22%),
        repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, transparent 1px 82px),
        repeating-linear-gradient(180deg, rgba(255,255,255,.02) 0 1px, transparent 1px 82px);
    mask-image:linear-gradient(180deg, rgba(0,0,0,.95), rgba(0,0,0,.3));
    -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.95), rgba(0,0,0,.3));
    opacity:.7;
    pointer-events:none;
}
.hero-scene-layer{
    position:absolute;
    border-radius:28px;
    pointer-events:none;
}
.hero-scene-layer-back{
    inset:78px 38px 130px 88px;
    background:linear-gradient(160deg, rgba(99,179,237,.10), rgba(255,255,255,.01));
    border:1px solid rgba(99,179,237,.14);
    transform:translate3d(0,0,0) rotate(-7deg);
    animation:heroFloatWide 8s ease-in-out infinite;
    opacity:.82;
}
.hero-scene-layer-mid{
    inset:48px 92px 208px 18px;
    background:linear-gradient(160deg, rgba(255,159,28,.10), rgba(255,255,255,.015));
    border:1px solid rgba(255,159,28,.16);
    transform:translate3d(0,0,0) rotate(6deg);
    animation:heroFloatWide 10s ease-in-out infinite reverse;
    opacity:.9;
}
.hero-floating-note{
    position:absolute;
    z-index:3;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    border-radius:999px;
    background:rgba(10,10,10,.78);
    border:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(16px);
    color:#d7d7d7;
    font-size:.78rem;
    box-shadow:0 14px 36px rgba(0,0,0,.26);
}
.hero-floating-note i{color:var(--primary)}
.hero-floating-note-a{
    top:34px;
    right:34px;
    animation:heroFloatTag 5.8s ease-in-out infinite;
}
.hero-floating-note-b{
    left:0;
    bottom:152px;
    animation:heroFloatTag 6.8s ease-in-out infinite reverse;
}
.hero-scene-main{
    position:relative;
    z-index:2;
    margin-top:84px;
    margin-left:52px;
    border-radius:30px;
    overflow:hidden;
    background:linear-gradient(180deg, #0f0f10, #090909);
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 28px 80px rgba(0,0,0,.45);
}
.hero-scene-topbar{
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 18px;
    background:rgba(255,255,255,.03);
    border-bottom:1px solid rgba(255,255,255,.06);
}
.hero-scene-dots{
    display:flex;
    gap:6px;
}
.hero-scene-dots span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:rgba(255,255,255,.18);
}
.hero-scene-dots span:first-child{background:#ff5f57}
.hero-scene-dots span:nth-child(2){background:#febc2e}
.hero-scene-dots span:nth-child(3){background:#28c840}
.hero-scene-url{
    margin-left:auto;
    padding:6px 12px;
    border-radius:999px;
    background:#121212;
    color:#5d5d5d;
    font-size:.72rem;
    border:1px solid rgba(255,255,255,.05);
}
.hero-scene-canvas{
    position:relative;
    padding:38px 34px 30px;
    background:
        radial-gradient(520px circle at 80% 0%, rgba(255,159,28,.14), transparent 36%),
        linear-gradient(160deg, #0c0c0d 0%, #0a0a0a 60%, #090909 100%);
}
.hero-scene-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 12px;
    border-radius:999px;
    background:rgba(255,159,28,.10);
    border:1px solid rgba(255,159,28,.18);
    color:var(--primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.04em;
    margin-bottom:22px;
}
.hero-scene-copy{
    max-width:520px;
    margin-bottom:24px;
}
.hero-scene-overline{
    font-size:.76rem;
    text-transform:uppercase;
    letter-spacing:.18em;
    color:#767676;
    margin-bottom:12px;
    font-weight:700;
}
.hero-scene-copy h2{
    font-size:clamp(1.9rem, 3vw, 2.75rem);
    line-height:1.03;
    margin-bottom:14px;
}
.hero-scene-copy p{
    color:#a7a7a7;
    font-size:.95rem;
    line-height:1.72;
}
.hero-scene-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:26px;
}
.hero-scene-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:11px 16px;
    border-radius:12px;
    font-size:.83rem;
    font-weight:700;
    letter-spacing:.01em;
    border:1px solid transparent;
}
.hero-scene-btn-primary{
    background:var(--primary);
    color:#000;
    box-shadow:0 10px 30px rgba(255,159,28,.18);
}
.hero-scene-btn-secondary{
    background:rgba(255,255,255,.04);
    color:#e8e8e8;
    border-color:rgba(255,255,255,.08);
}
.hero-scene-cards{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
}
.hero-scene-card{
    padding:16px;
    border-radius:18px;
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018));
    border:1px solid rgba(255,255,255,.06);
    transition:transform .3s, border-color .3s, background .3s;
    animation:heroCardBob 8s ease-in-out infinite;
}
.hero-scene-card:nth-child(2){animation-delay:-2.2s}
.hero-scene-card:nth-child(3){animation-delay:-4.4s}
.hero-scene-card:hover{
    transform:translateY(-4px);
    border-color:rgba(255,159,28,.18);
    background:linear-gradient(180deg, rgba(255,159,28,.07), rgba(255,255,255,.02));
}
.hero-scene-card strong{
    display:block;
    font-size:.9rem;
    margin-bottom:4px;
}
.hero-scene-card span{
    display:block;
    color:#868686;
    font-size:.78rem;
    line-height:1.55;
}
.hero-scene-scrollcard{
    position:absolute;
    right:28px;
    bottom:26px;
    z-index:3;
    max-width:240px;
    padding:14px 16px;
    border-radius:18px;
    background:rgba(10,10,10,.8);
    border:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(14px);
    box-shadow:0 18px 40px rgba(0,0,0,.32);
    transition:transform .3s, border-color .3s;
}
.hero-scene-scrollcard:hover{
    transform:translateY(-4px);
    border-color:rgba(255,159,28,.2);
}
.hero-scene-scrollcard span{
    display:block;
    color:var(--primary);
    font-size:.72rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.12em;
    margin-bottom:6px;
}
.hero-scene-scrollcard strong{
    display:block;
    color:#f2f2f2;
    font-size:.88rem;
    line-height:1.5;
}
@keyframes heroFadeUp{
    from{opacity:0;transform:translateY(22px)}
    to{opacity:1;transform:translateY(0)}
}
@keyframes heroFloatWide{
    0%,100%{transform:translate3d(0,0,0) rotate(-7deg)}
    50%{transform:translate3d(0,-16px,0) rotate(-5deg)}
}
@keyframes heroFloatTag{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-10px)}
}
@keyframes heroCardBob{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-6px)}
}
@keyframes heroScrollPulse{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(4px)}
}
@media(max-width:1100px){
    .hero-shell{
        grid-template-columns:1fr;
        gap:42px;
    }
    .hero-copy{
        text-align:center;
        display:flex;
        flex-direction:column;
        align-items:center;
    }
    .hero-lead{max-width:720px}
    .hero-meta-line{justify-content:center}
    .hero-scene{
        min-height:unset;
        max-width:760px;
        margin:0 auto;
    }
}
@media(max-width:768px){
    .hero-v12{
        padding:118px 0 64px;
    }
    .hero-heading{
        font-size:clamp(2.5rem, 11vw, 4rem);
    }
    .hero-actions{
        width:100%;
        justify-content:center;
    }
    .hero-actions .btn{
        width:100%;
        justify-content:center;
    }
    .hero-scroll-link{
        width:100%;
        justify-content:flex-start;
        text-align:left;
    }
    .hero-scene{
        padding:18px 16px 86px;
        border-radius:26px;
    }
    .hero-scene-layer-back,
    .hero-scene-layer-mid,
    .hero-floating-note{
        display:none;
    }
    .hero-scene-main{
        margin:44px 0 0;
        border-radius:22px;
    }
    .hero-scene-canvas{
        padding:24px 18px 18px;
    }
    .hero-scene-copy h2{
        font-size:1.85rem;
    }
    .hero-scene-cards{
        grid-template-columns:1fr;
    }
    .hero-scene-scrollcard{
        position:static;
        max-width:none;
        margin-top:14px;
    }
}



/* ── HERO V14 ────────────────────────────────── */
.hero-v14{
    position:relative;
    min-height:100svh;
    padding:138px 0 96px;
    display:flex;
    align-items:center;
    overflow:hidden;
}
.hero-v14::before{
    content:'';
    position:absolute;
    top:-80px;
    left:50%;
    transform:translateX(-50%);
    width:min(1100px,92vw);
    height:460px;
    background:radial-gradient(ellipse at center, rgba(255,159,28,.14) 0%, rgba(255,159,28,.05) 38%, transparent 74%);
    filter:blur(16px);
    pointer-events:none;
}
.hero-v14::after{
    content:'';
    position:absolute;
    inset:auto 0 0;
    height:240px;
    background:linear-gradient(180deg, rgba(1,1,1,0) 0%, rgba(1,1,1,.82) 100%);
    pointer-events:none;
}
.hero-v14 .container{position:relative;z-index:2}
.hero-v14-copy{
    max-width:820px;
    margin:0 auto;
    text-align:center;
}
.hero-v14-kicker{
    display:inline-flex;
    align-items:center;
    gap:12px;
    color:#c9c9c9;
    font-size:.78rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    margin-bottom:28px;
}
.hero-v14-kicker-line{
    width:40px;
    height:1px;
    background:linear-gradient(90deg, rgba(255,159,28,.08), rgba(255,159,28,.95), rgba(255,159,28,.08));
}
.hero-v14-title{
    font-size:clamp(3.15rem, 7.2vw, 6.4rem);
    line-height:.93;
    letter-spacing:-.055em;
    margin-bottom:18px;
}
.hero-v14-title span{
    color:var(--primary);
    text-shadow:0 0 28px rgba(255,159,28,.12);
}
.hero-v14-sub{
    max-width:700px;
    margin:0 auto 30px;
    color:#b7b7b7;
    font-size:1.08rem;
    line-height:1.78;
}
.hero-v14-actions{
    display:flex;
    justify-content:center;
    gap:14px;
    flex-wrap:wrap;
}
.hero-v14-trust{
    margin-top:24px;
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
}
.hero-v14-trust span{
    padding:9px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    color:#9f9f9f;
    font-size:.82rem;
}
.hero-v14-scene-wrap{
    max-width:1120px;
    margin:58px auto 0;
}
.hero-v14-scene{
    --hero-rx:0deg;
    --hero-ry:0deg;
    --spot-x:50%;
    --spot-y:18%;
    position:relative;
    min-height:500px;
    padding:38px;
    border-radius:38px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.08);
    background:
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
        radial-gradient(circle at 50% 15%, rgba(255,159,28,.06), transparent 28%),
        linear-gradient(140deg, #0f0c09 0%, #0b0c0f 48%, #09090b 100%);
    box-shadow:0 42px 140px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.04);
    transform:perspective(1600px) rotateX(var(--hero-rx)) rotateY(var(--hero-ry));
    transition:transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.hero-v14-scene:hover{
    border-color:rgba(255,255,255,.14);
    box-shadow:0 48px 150px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.05);
}
.hero-v14-scene::before{
    content:'';
    position:absolute;
    inset:0;
    background:radial-gradient(560px circle at var(--spot-x) var(--spot-y), rgba(255,255,255,.085), transparent 44%);
    pointer-events:none;
}
.hero-v14-scene::after{
    content:'';
    position:absolute;
    left:50%;
    bottom:-120px;
    width:72%;
    height:240px;
    transform:translateX(-50%);
    background:radial-gradient(ellipse at center, rgba(255,159,28,.11), transparent 72%);
    filter:blur(26px);
    pointer-events:none;
}
.hero-v14-grid{
    position:relative;
    min-height:424px;
    display:grid;
    place-items:center;
}
.hero-v14-orbit{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border-radius:999px;
    border:1px solid rgba(255,255,255,.08);
    pointer-events:none;
}
.hero-v14-orbit-a{
    width:min(760px,84%);
    height:320px;
    animation:heroOrbitA 20s linear infinite;
}
.hero-v14-orbit-b{
    width:min(620px,70%);
    height:220px;
    border-color:rgba(255,159,28,.14);
    animation:heroOrbitB 14s linear infinite reverse;
}
.hero-v14-beam{
    position:absolute;
    top:-18%;
    left:18%;
    width:160px;
    height:150%;
    transform:rotate(24deg);
    background:linear-gradient(180deg, transparent 0%, rgba(255,255,255,.055) 22%, rgba(255,255,255,.11) 50%, rgba(255,255,255,.055) 78%, transparent 100%);
    filter:blur(4px);
    opacity:.5;
    animation:heroBeamMove 8.5s ease-in-out infinite;
    pointer-events:none;
}
.hero-v14-core{
    position:relative;
    z-index:2;
    width:min(560px,100%);
    padding:38px 34px 34px;
    border-radius:30px;
    text-align:center;
    background:linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
    border:1px solid rgba(255,255,255,.1);
    box-shadow:0 26px 70px rgba(0,0,0,.34);
    backdrop-filter:blur(16px);
}
.hero-v14-core-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 13px;
    border-radius:999px;
    margin-bottom:18px;
    background:rgba(255,159,28,.1);
    border:1px solid rgba(255,159,28,.18);
    color:var(--primary);
    font-size:.74rem;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.hero-v14-core strong{
    display:block;
    font-family:'Space Grotesk',sans-serif;
    font-size:clamp(2rem,4vw,3.55rem);
    line-height:.96;
    letter-spacing:-.05em;
    margin-bottom:14px;
}
.hero-v14-core p{
    color:#b2b2b2;
    font-size:1rem;
    line-height:1.74;
    max-width:460px;
    margin:0 auto;
}
.hero-v14-word{
    position:absolute;
    z-index:2;
    padding:12px 16px;
    border-radius:16px;
    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.08);
    color:#d8d8d8;
    font-size:.84rem;
    backdrop-filter:blur(14px);
    box-shadow:0 20px 44px rgba(0,0,0,.24);
    animation:heroWordFloat 7s ease-in-out infinite;
}
.hero-v14-word strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:1rem;color:#fff;line-height:1.05;margin-bottom:5px}
.hero-v14-word span{display:block;color:#999;font-size:.75rem;line-height:1.45}
.hero-v14-word-a{top:42px;left:48px;animation-delay:-1.4s}
.hero-v14-word-b{top:72px;right:56px;animation-delay:-3.2s}
.hero-v14-word-c{bottom:70px;left:72px;animation-delay:-5.1s}
.hero-v14-word-d{bottom:48px;right:76px;animation-delay:-2.2s}
.hero-v14-word-accent{
    background:linear-gradient(180deg, rgba(255,159,28,.13), rgba(255,159,28,.05));
    border-color:rgba(255,159,28,.22);
}
.hero-v14-line{
    position:absolute;
    left:50%;
    bottom:28px;
    transform:translateX(-50%);
    width:1px;
    height:88px;
    background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.16), transparent);
    overflow:visible;
}
.hero-v14-line::after{
    content:'';
    position:absolute;
    left:50%;
    top:0;
    width:10px;
    height:10px;
    border-radius:50%;
    transform:translate(-50%,0);
    background:var(--primary);
    box-shadow:0 0 0 0 rgba(255,159,28,.55);
    animation:heroLineDrop 2.8s ease-in-out infinite;
}
.hero-v14-foot{
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    color:#bcbcbc;
    font-size:.9rem;
}
.hero-v14-foot span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:12px 16px;
    border-radius:999px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
}
.hero-v14-foot i{color:var(--primary)}
.hero-v14-down{
    width:fit-content;
    display:inline-flex;
    align-items:center;
    gap:12px;
    margin:24px auto 0;
    padding:12px 18px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
    color:#bcbcbc;
    font-size:.9rem;
}
.hero-v14-down:hover{color:#fff;border-color:rgba(255,255,255,.16)}
.hero-v14-down-icon{
    width:32px;
    height:32px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,159,28,.1);
    color:var(--primary);
    animation:heroArrowBob 2.4s ease-in-out infinite;
}
@keyframes heroOrbitA{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes heroOrbitB{from{transform:translate(-50%,-50%) rotate(0deg) scale(1.02)}50%{transform:translate(-50%,-50%) rotate(180deg) scale(.98)}to{transform:translate(-50%,-50%) rotate(360deg) scale(1.02)}}
@keyframes heroBeamMove{0%,100%{transform:translateX(0) rotate(24deg);opacity:.38}50%{transform:translateX(180px) rotate(24deg);opacity:.75}}
@keyframes heroWordFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes heroLineDrop{0%{top:0;opacity:0}18%{opacity:1}82%{opacity:1}100%{top:74px;opacity:0}}
@keyframes heroArrowBob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@media(max-width:1080px){
    .hero-v14-word{font-size:.8rem;padding:11px 14px}
    .hero-v14-word-a{left:24px}
    .hero-v14-word-b{right:24px}
    .hero-v14-word-c{left:34px}
    .hero-v14-word-d{right:34px}
}
@media(max-width:768px){
    .hero-v14{padding:122px 0 72px}
    .hero-v14-title{font-size:clamp(2.6rem, 13vw, 4.2rem)}
    .hero-v14-sub{font-size:.98rem}
    .hero-v14-actions{gap:10px}
    .hero-v14-actions .btn{width:100%;justify-content:center}
    .hero-v14-scene-wrap{margin-top:42px}
    .hero-v14-scene{padding:18px 18px 24px;min-height:auto;border-radius:28px}
    .hero-v14-grid{min-height:420px}
    .hero-v14-core{padding:28px 22px 26px;border-radius:24px}
    .hero-v14-word{position:relative;top:auto;left:auto;right:auto;bottom:auto;animation:none;width:100%}
    .hero-v14-word-a,.hero-v14-word-b,.hero-v14-word-c,.hero-v14-word-d{transform:none}
    .hero-v14-grid{display:flex;flex-direction:column;gap:12px}
    .hero-v14-orbit,.hero-v14-beam{display:none}
    .hero-v14-line{position:relative;left:auto;bottom:auto;transform:none;margin:6px auto 0;height:64px}
    .hero-v14-foot{flex-direction:column;gap:10px}
    .hero-v14-foot span{width:100%;justify-content:center}
    .hero-v14-down{font-size:.82rem;padding:10px 14px}
}




/* ── HERO V16 REBUILD ───────────────────────── */
#hero.hero-v16{
    position:relative;
    min-height:100svh;
    display:flex;
    align-items:center;
    padding:144px 0 96px;
    overflow:hidden;
}
#hero.hero-v16::before{
    content:'';
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 20% 16%, rgba(255,159,28,.14), transparent 24%),
        radial-gradient(circle at 82% 18%, rgba(99,179,237,.10), transparent 22%),
        linear-gradient(180deg, rgba(255,255,255,.02), transparent 38%);
    pointer-events:none;
}
#hero.hero-v16::after{
    content:'';
    position:absolute;
    inset:auto 0 0;
    height:180px;
    background:linear-gradient(180deg, rgba(1,1,1,0), rgba(1,1,1,.7));
    pointer-events:none;
}
.hero-v16 .container{position:relative;z-index:2}
.hero-v16-shell{
    display:grid;
    grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);
    gap:56px;
    align-items:center;
}
.hero-v16-copy{
    max-width:640px;
}
.hero-v16-kicker{
    display:inline-flex;
    align-items:center;
    gap:12px;
    margin-bottom:26px;
    padding:10px 16px;
    border-radius:999px;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.08);
    color:#d7d7d7;
    font-size:.76rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.hero-v16-kicker::before{
    content:'';
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--primary);
    box-shadow:0 0 0 5px rgba(255,159,28,.08);
}
.hero-v16-title{
    font-size:clamp(3rem, 6.2vw, 5.55rem);
    line-height:.94;
    letter-spacing:-.055em;
    margin-bottom:20px;
    max-width:760px;
}
.hero-v16-title span{
    display:block;
    color:var(--primary);
    text-shadow:0 0 26px rgba(255,159,28,.12);
}
.hero-v16-sub{
    max-width:610px;
    color:#b6b6b6;
    font-size:1.05rem;
    line-height:1.82;
    margin-bottom:30px;
}
.hero-v16-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-bottom:24px;
}
.hero-v16-points{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:28px;
}
.hero-v16-points span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:11px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.08);
    color:#d9d9d9;
    font-size:.84rem;
}
.hero-v16-points span::before{
    content:'';
    width:6px;
    height:6px;
    border-radius:50%;
    background:linear-gradient(180deg, var(--primary), #63B3ED);
}
.hero-v16-scroll{
    display:inline-flex;
    align-items:center;
    gap:12px;
    padding:12px 16px;
    border-radius:18px;
    background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.08);
    color:#d7d7d7;
    font-size:.88rem;
    transition:transform .25s,border-color .25s,color .25s;
}
.hero-v16-scroll:hover{
    transform:translateY(-2px);
    border-color:rgba(255,255,255,.14);
    color:#fff;
}
.hero-v16-scroll-icon{
    width:32px;
    height:32px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,159,28,.11);
    border:1px solid rgba(255,159,28,.18);
    color:var(--primary);
}
.hero-v16-side{
    position:relative;
}
.hero-v16-panel{
    position:relative;
    padding:22px;
    border-radius:30px;
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 30px 90px rgba(0,0,0,.38);
    overflow:hidden;
}
.hero-v16-panel::before{
    content:'';
    position:absolute;
    top:-80px;
    right:-80px;
    width:260px;
    height:260px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,159,28,.12), transparent 70%);
    pointer-events:none;
}
.hero-v16-panel::after{
    content:'';
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(135deg, rgba(255,255,255,.045), transparent 36%, transparent 64%, rgba(255,255,255,.02));
}
.hero-v16-panel-head,
.hero-v16-panel-foot{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.hero-v16-panel-head{margin-bottom:18px}
.hero-v16-panel-head span,
.hero-v16-panel-foot span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.08);
    color:#cfcfcf;
    font-size:.77rem;
    font-weight:600;
}
.hero-v16-window{
    position:relative;
    z-index:1;
    border-radius:24px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.09);
    background:#0c0c0c;
    box-shadow:0 18px 46px rgba(0,0,0,.32);
    margin-bottom:18px;
}
.hero-v16-window-bar{
    display:flex;
    align-items:center;
    gap:7px;
    padding:12px 16px;
    background:#151515;
    border-bottom:1px solid rgba(255,255,255,.06);
}
.hero-v16-window-dot{width:10px;height:10px;border-radius:50%}
.hero-v16-window-dot:nth-child(1){background:#ff5f57}
.hero-v16-window-dot:nth-child(2){background:#febc2e}
.hero-v16-window-dot:nth-child(3){background:#28c840}
.hero-v16-window-url{
    margin-left:auto;
    padding:5px 12px;
    border-radius:999px;
    background:#101010;
    color:#5d5d5d;
    font-size:.68rem;
    border:1px solid rgba(255,255,255,.04);
}
.hero-v16-showcase{
    padding:26px;
    background:linear-gradient(145deg, #100c06 0%, #0d0d0d 50%, #0b1016 100%);
}
.hero-v16-showcase-grid{
    display:grid;
    grid-template-columns:1.06fr .94fr;
    gap:16px;
    align-items:stretch;
}
.hero-v16-maincard,
.hero-v16-stackcard{
    border-radius:20px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.035);
    backdrop-filter:blur(12px);
}
.hero-v16-maincard{
    padding:24px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:280px;
}
.hero-v16-maincard-top span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:14px;
    padding:7px 12px;
    border-radius:999px;
    background:rgba(255,159,28,.1);
    border:1px solid rgba(255,159,28,.18);
    color:var(--primary);
    font-size:.73rem;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.hero-v16-maincard h3{
    font-size:1.65rem;
    line-height:1.08;
    margin-bottom:12px;
}
.hero-v16-maincard p{
    color:#b8b8b8;
    font-size:.9rem;
    line-height:1.72;
    max-width:420px;
}
.hero-v16-minirow{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:18px;
}
.hero-v16-minirow div{
    padding:12px 14px;
    border-radius:16px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
}
.hero-v16-minirow strong{
    display:block;
    font-size:.95rem;
    margin-bottom:4px;
}
.hero-v16-minirow span{
    display:block;
    color:#9d9d9d;
    font-size:.78rem;
    line-height:1.5;
}
.hero-v16-stack{
    display:grid;
    gap:12px;
}
.hero-v16-stackcard{
    padding:18px 18px 16px;
}
.hero-v16-stackcard-label{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-bottom:10px;
    color:#9f9f9f;
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.09em;
}
.hero-v16-stackcard strong{
    display:block;
    font-size:1.08rem;
    line-height:1.18;
    margin-bottom:6px;
}
.hero-v16-stackcard p{
    color:#a8a8a8;
    font-size:.82rem;
    line-height:1.6;
}
.hero-v16-offers{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:16px;
}
.hero-v16-offer{
    padding:16px;
    border-radius:18px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    transition:transform .25s,border-color .25s,background .25s;
}
.hero-v16-offer:hover{
    transform:translateY(-3px);
    border-color:rgba(255,255,255,.15);
    background:rgba(255,255,255,.045);
}
.hero-v16-offer-label{
    display:block;
    color:#8f8f8f;
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:8px;
}
.hero-v16-offer strong{
    display:block;
    font-size:1rem;
    margin-bottom:5px;
}
.hero-v16-offer span{
    display:block;
    color:#acacac;
    font-size:.79rem;
    line-height:1.55;
}
.hero-v16-offer.is-accent{
    border-color:rgba(255,159,28,.22);
    background:linear-gradient(180deg, rgba(255,159,28,.09), rgba(255,255,255,.035));
}
.hero-v16-panel-foot{margin-top:0}
.hero-v16-panel-foot span i{color:var(--primary)}

@media (max-width: 1080px){
    .hero-v16-shell{grid-template-columns:1fr;gap:34px}
    .hero-v16-copy{max-width:none;text-align:center}
    .hero-v16-sub{margin-left:auto;margin-right:auto}
    .hero-v16-actions,.hero-v16-points{justify-content:center}
    .hero-v16-scroll{margin:0 auto}
}
@media (max-width: 860px){
    #hero.hero-v16{padding:124px 0 76px}
    .hero-v16-showcase-grid{grid-template-columns:1fr}
    .hero-v16-offers{grid-template-columns:1fr}
}
@media (max-width: 640px){
    .hero-v16-title{font-size:clamp(2.5rem, 13vw, 3.8rem)}
    .hero-v16-actions{flex-direction:column}
    .hero-v16-actions .btn{width:100%;justify-content:center}
    .hero-v16-points span{width:100%;justify-content:center}
    .hero-v16-window{border-radius:20px}
    .hero-v16-showcase{padding:18px}
    .hero-v16-maincard{padding:20px;min-height:auto}
    .hero-v16-minirow{grid-template-columns:1fr}
    .hero-v16-panel-head,
    .hero-v16-panel-foot{flex-direction:column;align-items:stretch}
    .hero-v16-panel-head span,
    .hero-v16-panel-foot span{justify-content:center}
    .hero-v16-scroll{width:100%;justify-content:flex-start}
}


/* ════════════════════════════════════════════════════════
   HERO — FINAL REBUILD
   Alle alten hero-vXX-Klassen bleiben als totes CSS;
   dieser Block überschreibt via #hero und .hi-* alles.
════════════════════════════════════════════════════════ */

#hero {
    position: relative;
    min-height: 100svh;
    display: flex;
    align-items: center;
    padding: 152px 0 108px;
    overflow: hidden;
    isolation: isolate;
}

/* Warmer Top-Glow + seitliche Akzente */
#hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 88% 52% at 50% -6%,  rgba(255,159,28,.18)  0%, transparent 56%),
        radial-gradient(circle   at  9% 78%,          rgba(99,179,237,.08),  transparent 30%),
        radial-gradient(circle   at 91% 68%,          rgba(255,159,28,.06),  transparent 26%);
    pointer-events: none;
    z-index: 0;
}

/* Subtiles Grid */
#hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);
    background-size: 68px 68px;
    mask-image: radial-gradient(ellipse 100% 75% at 50% 0%, #000 0%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 100% 75% at 50% 0%, #000 0%, transparent 100%);
    pointer-events: none;
    z-index: 0;
}

/* ── LAYOUT ─────────────────────────────────────── */

.hi-shell {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
    gap: 72px;
    align-items: center;
}

/* ── COPY ───────────────────────────────────────── */

.hi-copy {
    max-width: 640px;
}

.hi-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 9px 18px;
    border-radius: 999px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.09);
    color: #c8c8c8;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 34px;
    animation: lpFadeUp .85s cubic-bezier(.16,1,.3,1) backwards;
}

.hi-kicker-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--primary);
    flex-shrink: 0;
    animation: pulsedot 2.2s ease-in-out infinite;
}

.hi-h1 {
    font-size: clamp(3.5rem, 6.6vw, 5.8rem);
    line-height: .93;
    letter-spacing: -.058em;
    margin-bottom: 28px;
    animation: lpFadeUp 1s cubic-bezier(.16,1,.3,1) .1s backwards;
}

.hi-h1-accent {
    display: block;
    background: linear-gradient(128deg,
        var(--primary) 0%,
        #FFD580        42%,
        var(--primary) 100%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: lpGradMove 5s linear infinite;
}

.hi-sub {
    font-size: 1.08rem;
    color: #a5a5a5;
    line-height: 1.84;
    max-width: 510px;
    margin-bottom: 40px;
    animation: lpFadeUp 1s cubic-bezier(.16,1,.3,1) .2s backwards;
}

.hi-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 36px;
    animation: lpFadeUp 1s cubic-bezier(.16,1,.3,1) .3s backwards;
}

.hi-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 24px;
    color: #5e5e5e;
    font-size: .83rem;
    animation: lpFadeUp 1s cubic-bezier(.16,1,.3,1) .42s backwards;
}

.hi-trust-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.hi-trust-item::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(255,159,28,.75);
    flex-shrink: 0;
}

/* ── VISUAL ─────────────────────────────────────── */

.hi-visual {
    position: relative;
    animation: lpFadeUp 1.1s cubic-bezier(.16,1,.3,1) .14s backwards;
}

/* Browser-Karte */
.hi-browser {
    position: relative;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.1);
    background: #0a0a0a;
    box-shadow:
        0 52px 140px rgba(0,0,0,.62),
        0 0 0 1px rgba(255,255,255,.03) inset,
        0 0 80px rgba(255,159,28,.07);
    transform: perspective(1600px) rotateY(-9deg) rotateX(3.5deg);
    transition: transform .52s cubic-bezier(.16,1,.3,1), box-shadow .52s;
    will-change: transform;
}

.hi-browser:hover {
    transform: perspective(1600px) rotateY(-3deg) rotateX(1deg);
    box-shadow:
        0 68px 170px rgba(0,0,0,.66),
        0 0 0 1px rgba(255,255,255,.05) inset,
        0 0 100px rgba(255,159,28,.1);
}

/* Gradient-Rand-Shimmer */
.hi-browser::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(
        138deg,
        rgba(255,159,28,.28) 0%,
        rgba(255,255,255,.04) 42%,
        rgba(99,179,237,.2) 100%
    );
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

/* Browser-Topbar */
.hi-bar {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 11px 16px;
    background: #111;
    border-bottom: 1px solid rgba(255,255,255,.06);
    border-radius: 22px 22px 0 0;
}

.hi-dots { display: flex; gap: 5px; }

.hi-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.hi-dot:nth-child(1) { background: #ff5f57; }
.hi-dot:nth-child(2) { background: #febc2e; }
.hi-dot:nth-child(3) { background: #28c840; }

.hi-url {
    flex: 1;
    background: #0d0d0d;
    border-radius: 999px;
    padding: 5px 14px;
    font-size: .67rem;
    color: #484848;
    text-align: center;
    margin: 0 12px;
    border: 1px solid rgba(255,255,255,.04);
    letter-spacing: .03em;
    font-family: 'Inter', monospace;
}

/* Browser-Body */
.hi-body {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 0%, rgba(255,159,28,.08), transparent 32%),
        #090909;
}

/* Scan-Line */
.hi-body::after {
    content: '';
    position: absolute;
    left: 0; right: 0;
    height: 56%;
    top: -56%;
    background: linear-gradient(180deg,
        transparent 0%,
        rgba(255,255,255,.046) 50%,
        transparent 100%
    );
    pointer-events: none;
    animation: lpScan 5.8s ease-in-out infinite;
}

/* ── Mini-Website im Browser ──── */

.mw-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 18px;
    border-bottom: 1px solid rgba(255,255,255,.05);
    background: rgba(255,255,255,.02);
}

.mw-logo  { width: 66px; height: 7px; background: var(--primary); border-radius: 4px; opacity: .82; }
.mw-links { display: flex; gap: 10px; }
.mw-links span { display: block; height: 5px; border-radius: 3px; background: rgba(255,255,255,.1); }
.mw-links span:nth-child(1) { width: 34px; }
.mw-links span:nth-child(2) { width: 42px; }
.mw-links span:nth-child(3) { width: 30px; }
.mw-cta   { width: 50px; height: 18px; background: var(--primary); border-radius: 5px; opacity: .78; }

.mw-hero-area {
    padding: 30px 20px 26px;
    background: linear-gradient(158deg, #0f0900 0%, #090909 100%);
    position: relative;
    overflow: hidden;
}

.mw-hero-area::before {
    content: '';
    position: absolute;
    top: -36px; left: 50%;
    transform: translateX(-50%);
    width: 230px; height: 110px;
    background: radial-gradient(ellipse, rgba(255,159,28,.12), transparent 70%);
    pointer-events: none;
}

.mw-h-a { height: 13px; border-radius: 6px; background: rgba(255,255,255,.86); margin-bottom: 7px; }
.mw-h-b { height: 13px; border-radius: 6px; background: rgba(255,255,255,.86); width: 66%; margin-bottom: 9px; }
.mw-p-a { height: 6px; border-radius: 3px; background: rgba(255,255,255,.25); width: 80%; margin-bottom: 4px; }
.mw-p-b { height: 6px; border-radius: 3px; background: rgba(255,255,255,.17); width: 58%; margin-bottom: 19px; }

.mw-btns        { display: flex; gap: 8px; }
.mw-btn-p       { width: 82px; height: 25px; background: var(--primary); border-radius: 7px; }
.mw-btn-o       { width: 70px; height: 25px; border: 1px solid rgba(255,255,255,.14); border-radius: 7px; }

.mw-cards {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 9px;
    padding: 14px 16px 18px;
    background: #090909;
}

.mw-card {
    background: #111;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.05);
    animation: lpCardBob 7s ease-in-out infinite;
}

.mw-card:nth-child(2) { animation-delay: -2.1s; }
.mw-card:nth-child(3) { animation-delay: -4.2s; }

.mw-card-img  { height: 46px; }
.mw-card:nth-child(1) .mw-card-img { background: linear-gradient(135deg, #1a0d00, #200e00); }
.mw-card:nth-child(2) .mw-card-img { background: linear-gradient(135deg, #080d1a, #0c111f); }
.mw-card:nth-child(3) .mw-card-img { background: linear-gradient(135deg, #091209, #0b1509); }

.mw-card-body { padding: 8px; }
.mw-card-t    { height: 6px; border-radius: 3px; background: rgba(255,255,255,.4); margin-bottom: 4px; }
.mw-card-s    { height: 5px; border-radius: 3px; background: rgba(255,255,255,.14); width: 65%; }

/* ── Floating Badges ─────────────────────────────── */

.hi-badge {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 15px;
    border-radius: 14px;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    font-size: .78rem;
    font-weight: 600;
    white-space: nowrap;
    box-shadow: 0 18px 42px rgba(0,0,0,.32);
    z-index: 4;
}

.hi-badge-live {
    top: -16px;
    right: 30px;
    background: rgba(7,7,7,.84);
    border: 1px solid rgba(34,197,94,.28);
    color: #22c55e;
    animation: lpBob 5.2s ease-in-out infinite;
}

.hi-badge-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22c55e;
    animation: pulsedot 2s ease-in-out infinite;
}

.hi-badge-loc {
    bottom: 30px;
    left: -26px;
    background: rgba(7,7,7,.86);
    border: 1px solid rgba(255,255,255,.1);
    color: #c2c2c2;
    animation: lpBob 6.8s ease-in-out .9s infinite;
}

.hi-badge-loc i { color: var(--primary); }

.hi-badge-rating {
    bottom: 102px;
    right: -24px;
    background: rgba(7,7,7,.86);
    border: 1px solid rgba(255,255,255,.1);
    color: #c2c2c2;
    animation: lpBob 7.4s ease-in-out 1.6s infinite;
}

.hi-badge-stars {
    color: var(--primary);
    font-size: .68rem;
    letter-spacing: 1.5px;
}

/* ── Scroll-Hint ─────────────────────────────────── */

.hi-scroll-hint {
    position: absolute;
    bottom: 38px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    color: #3a3a3a;
    font-size: .65rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    animation: lpFadeUp .8s cubic-bezier(.16,1,.3,1) .9s backwards;
}

.hi-scroll-mouse {
    width: 24px;
    height: 40px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.11);
    position: relative;
    overflow: hidden;
}

.hi-scroll-mouse::before {
    content: '';
    position: absolute;
    top: 7px;
    left: 50%;
    margin-left: -2px;
    width: 4px;
    height: 8px;
    border-radius: 999px;
    background: var(--primary);
    animation: lpMouseDrop 1.9s ease-in-out infinite;
}

/* ── Keyframes ───────────────────────────────────── */

@keyframes lpFadeUp {
    from { opacity: 0; transform: translateY(28px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes lpGradMove {
    0%   { background-position: 0%   center; }
    100% { background-position: 200% center; }
}

@keyframes lpScan {
    0%,100% { transform: translateY(0); }
    50%     { transform: translateY(275%); }
}

@keyframes lpBob {
    0%,100% { transform: translateY(0); }
    50%     { transform: translateY(-12px); }
}

@keyframes lpCardBob {
    0%,100% { transform: translateY(0); }
    50%     { transform: translateY(-5px); }
}

@keyframes lpMouseDrop {
    0%  { transform: translateY(0);    opacity: 0; }
    16% { opacity: 1; }
    72% { transform: translateY(17px); opacity: 1; }
    100%{ transform: translateY(22px); opacity: 0; }
}

/* ── Responsive ──────────────────────────────────── */

@media (max-width: 1100px) {
    .hi-shell {
        grid-template-columns: 1fr;
        gap: 54px;
    }
    .hi-copy {
        max-width: none;
        text-align: center;
    }
    .hi-sub  { margin-left: auto; margin-right: auto; }
    .hi-actions { justify-content: center; }
    .hi-trust   { justify-content: center; }
    .hi-browser {
        transform: none !important;
        max-width: 640px;
        margin: 0 auto;
    }
    .hi-badge-loc    { left: 16px; }
    .hi-badge-rating { right: 16px; }
}

@media (max-width: 860px) {
    #hero { padding: 128px 0 90px; }
    .hi-h1 { font-size: clamp(3rem, 12vw, 4.4rem); }
}

@media (max-width: 640px) {
    #hero { padding: 118px 0 78px; }
    .hi-h1 { font-size: clamp(2.75rem, 13vw, 3.8rem); }
    .hi-badge { display: none; }
    .hi-actions { flex-direction: column; }
    .hi-actions .btn { width: 100%; justify-content: center; }
    .hi-scroll-hint { display: none; }
    .mw-cards { grid-template-columns: 1fr; }
}


/* ════════════════════════════════════════════════════════
   PREMIUM FX LAYER  —  Cursor · Noise · Tilt · Ripple ·
   Particles · Aurora · Magnetic · Word-Split · Beams
════════════════════════════════════════════════════════ */

/* ── CURSOR AMBER GLOW ─────────────────────────────── */
#cursor-glow {
    position: fixed;
    top: 0; left: 0;
    width: 520px; height: 520px;
    border-radius: 50%;
    background: radial-gradient(circle,
        rgba(255,159,28,.09) 0%,
        rgba(255,159,28,.04) 35%,
        transparent 70%
    );
    pointer-events: none;
    z-index: 9997;
    transform: translate(-260px,-260px);
    will-change: transform;
    mix-blend-mode: screen;
}

/* ── NOISE / GRAIN OVERLAY ─────────────────────────── */
body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 9996;
    pointer-events: none;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
    background-size: 220px 220px;
    opacity: .032;
}

/* ── HERO PARTICLE CANVAS ──────────────────────────── */
#hero-particles {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

/* ── CARD 3D TILT (base) ───────────────────────────── */
.card,
.path-card,
.tcard,
.trust-metric {
    will-change: transform;
}

/* ── BUTTON RIPPLE ─────────────────────────────────── */
.btn-ripple {
    position: absolute;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,.52);
    transform: translate(-50%,-50%) scale(0);
    animation: fxRipple .65s linear forwards;
    pointer-events: none;
}

@keyframes fxRipple {
    to { transform: translate(-50%,-50%) scale(90); opacity: 0; }
}

/* ── WORD-SPLIT ANIMATION ──────────────────────────── */
.word-wrap {
    display: inline-block;
    overflow: hidden;
    vertical-align: bottom;
    line-height: 1.12;
}

.word {
    display: inline-block;
    opacity: 0;
    transform: translateY(115%);
    transition:
        opacity  .6s cubic-bezier(.16,1,.3,1),
        transform .6s cubic-bezier(.16,1,.3,1);
}

.reveal.on .word {
    opacity: 1;
    transform: translateY(0);
}

/* ── SECTION LABEL SHIMMER ─────────────────────────── */
.section-label {
    position: relative;
    overflow: hidden;
}

.section-label::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 55%; height: 100%;
    background: linear-gradient(90deg,
        transparent,
        rgba(255,255,255,.3),
        transparent
    );
    animation: fxLabelShimmer 3.8s ease-in-out infinite;
    pointer-events: none;
}

@keyframes fxLabelShimmer {
    0%   { left: -100%; }
    55%  { left: 160%; }
    100% { left: 160%; }
}

/* ── DIVIDER SWEEP ─────────────────────────────────── */
.divider {
    position: relative;
    overflow: hidden;
}

.divider::after {
    content: '';
    position: absolute;
    top: 0; left: -60%;
    width: 40%; height: 100%;
    background: linear-gradient(90deg,
        transparent,
        rgba(255,159,28,.65),
        transparent
    );
    animation: fxDividerSweep 4.5s ease-in-out infinite;
}

@keyframes fxDividerSweep {
    0%   { left: -60%; opacity: .7; }
    100% { left: 120%; opacity: .7; }
}

/* ── STEP TIMELINE DRAW ────────────────────────────── */
.bsteps::before {
    transform-origin: top center;
    transform: scaleY(0);
    transition: transform 1.4s cubic-bezier(.16,1,.3,1);
}

.bsteps.fx-animated::before {
    transform: scaleY(1);
}

.bstep-n {
    transition: background .3s, box-shadow .3s, transform .25s cubic-bezier(.16,1,.3,1);
}

.bstep:hover .bstep-n {
    background: var(--primary);
    color: #000;
    box-shadow: 0 0 24px var(--pglow);
    transform: scale(1.15);
}

/* ── CARD ICON POP ON HOVER ────────────────────────── */
.card:hover .card-icon {
    animation: fxIconPop .45s cubic-bezier(.16,1,.3,1) forwards;
}

@keyframes fxIconPop {
    0%   { transform: scale(1)   rotate(0deg); }
    45%  { transform: scale(1.2) rotate(-5deg); }
    100% { transform: scale(1.1) rotate(0deg); }
}

/* ── PATH CARD AMBER GLOW ──────────────────────────── */
.path-a:hover {
    box-shadow:
        0 32px 90px rgba(0,0,0,.52),
        0 0 90px  rgba(255,159,28,.22),
        inset 0 0 60px rgba(255,159,28,.045);
}

/* ── STAT NUMBER GLOW ON HOVER ─────────────────────── */
.stat-block:hover .stat-big {
    text-shadow: 0 0 50px rgba(255,159,28,.5);
}

/* ── PREFOOTER AURORA ──────────────────────────────── */
.prefooter-panel {
    position: relative;
    overflow: hidden;
}

.prefooter-panel::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 18% 55%, rgba(255,159,28,.2), transparent 40%),
        radial-gradient(ellipse at 82% 45%, rgba(99,179,237,.14), transparent 40%);
    animation: fxAurora 8s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 0;
}

.prefooter-panel > * { position: relative; z-index: 1; }

@keyframes fxAurora {
    from { transform: translateX(-7%) scale(1.05); opacity: .8; }
    to   { transform: translateX( 7%) scale(.95);  opacity: 1; }
}

/* ── NAV CTA PULSE RING ────────────────────────────── */
.nav-cta {
    position: relative;
}

.nav-cta::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 10px;
    border: 1px solid rgba(255,159,28,.45);
    opacity: 0;
    pointer-events: none;
    animation: fxCtaPulse 3.2s ease-in-out infinite;
}

@keyframes fxCtaPulse {
    0%,100% { opacity: 0; transform: scale(1); }
    50%     { opacity: 1; transform: scale(1.07); }
}

/* ── FORM INPUT GLOW ───────────────────────────────── */
.fgroup input:focus,
.fgroup select:focus,
.fgroup textarea:focus {
    box-shadow:
        0 0 0 3px rgba(255,159,28,.13),
        0 0 22px rgba(255,159,28,.09) !important;
}

/* ── REVIEW TILE 3D ────────────────────────────────── */
.review-tile {
    will-change: transform;
    transition:
        transform .3s cubic-bezier(.16,1,.3,1),
        border-color .3s,
        background .3s;
}

/* ── HERO KICKER ENTRANCE PULSE ────────────────────── */
.hi-kicker {
    animation: lpFadeUp .85s cubic-bezier(.16,1,.3,1) backwards,
               fxKickerGlow 3s ease-in-out 2s infinite;
}

@keyframes fxKickerGlow {
    0%,100% { box-shadow: 0 0 0 0 rgba(255,159,28,0); }
    50%     { box-shadow: 0 0 18px 2px rgba(255,159,28,.12); }
}

/* ── SCROLL-PROGRESS GLOW ──────────────────────────── */
.scroll-progress {
    filter: drop-shadow(0 0 6px rgba(255,159,28,.6));
}

/* ── TRUST METRIC HOVER ────────────────────────────── */
.trust-metric {
    transition: transform .35s cubic-bezier(.16,1,.3,1),
                border-color .35s, box-shadow .35s;
}

/* ── MOBILE: disable heavy effects ────────────────── */
@media (hover: none) {
    #cursor-glow,
    .nav-cta::after { display: none; }
}