/* ============================================================
           REV-199 · Award-Layer Homepage (System aus REV-197/198).
           Seiten-scoped: Hero-Stagger + Preis-Outline, Marquee-Boost,
           Editorial-Indexe, Scroll-Reveals, Magnetik, Progress-Rail.
           Kein Override globaler Systeme, kein Cache-Bump noetig.
           ============================================================ */
        /* Hero: Typo-Boost + Stagger */
        .hero h1{font-size:clamp(2.6rem,6.6vw,5.2rem);letter-spacing:-.045em;line-height:1.02}
        .spk-hero-price{font-style:normal;color:transparent;-webkit-text-stroke:2.5px var(--dark)}
        /* LCP-safe entrance: slide only, never opacity:0 (opacity:0 on the LCP element delays LCP). */
        .hero-content > *{transform:translateY(22px);animation:spk-up .6s cubic-bezier(.2,.7,.2,1) forwards}
        .hero-content > *:nth-child(2){animation-delay:.07s}
        .hero-content > *:nth-child(3){animation-delay:.14s}
        .hero-content > *:nth-child(4){animation-delay:.21s}
        .hero-content > *:nth-child(5){animation-delay:.28s}
        .hero-content > *:nth-child(6){animation-delay:.35s}
        @keyframes spk-up{to{transform:none}}
        /* Hero-CTA: Border-Beam */
        .spk-beam{position:relative;overflow:hidden}
        .spk-beam::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:2px;pointer-events:none;
            background:conic-gradient(from var(--gw-beam),transparent 0deg,transparent 300deg,rgba(255,255,255,.9) 332deg,transparent 360deg);
            -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
            -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
            animation:gw-care-beam 5.5s linear infinite}
        /* Marquee: Display-Boost (Markup unangetastet) */
        .marquee-track span:not(.dot){font-size:clamp(1.35rem,2.8vw,2.1rem);font-weight:900;text-transform:uppercase;letter-spacing:-.015em;color:rgba(255,255,255,.92)}
        .marquee-track span:nth-child(4n+3):not(.dot){color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.7)}
        .marquee-track .dot{font-size:1.5rem;color:rgba(255,255,255,.45)}
        /* Editorial-Index */
        .spk-idx{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:18px;font-size:.8rem;font-weight:800;color:var(--text-lighter);font-variant-numeric:tabular-nums;letter-spacing:.1em}
        .spk-idx::before,.spk-idx::after{content:'';height:1px;width:58px;background:rgba(17,17,17,.18)}
        .process .spk-idx,.spk-idx.spk-idx--dark{color:rgba(255,255,255,.45)}
        .process .spk-idx::before,.process .spk-idx::after{background:rgba(255,255,255,.2)}
        /* Progress-Rail (Desktop) */
        .spk-rail{display:none}
        @media (min-width:1400px){
            .spk-rail{position:fixed;left:26px;top:50%;transform:translateY(-50%);z-index:880;display:flex;flex-direction:column;gap:6px}
            .spk-rail a{display:flex;align-items:center;gap:10px;padding:5px 6px;border-radius:var(--radius-full);color:var(--text-lighter);transition:color var(--transition)}
            .spk-rail a i{width:7px;height:7px;border-radius:50%;background:rgba(17,17,17,.22);transition:all var(--transition);flex:0 0 auto}
            .spk-rail a em{font-style:normal;font-size:.72rem;font-weight:600;opacity:0;transform:translateX(-4px);transition:opacity var(--transition),transform var(--transition);white-space:nowrap}
            .spk-rail a:hover{color:var(--dark)}
            .spk-rail a:hover em{opacity:1;transform:none}
            .spk-rail a.is-cur{color:var(--dark)}
            .spk-rail a.is-cur i{background:var(--dark);transform:scale(1.5)}
            .spk-rail a.is-cur em{opacity:1;transform:none}
            .spk-rail.is-night a{color:rgba(255,255,255,.5)}
            .spk-rail.is-night a i{background:rgba(255,255,255,.35)}
            .spk-rail.is-night a:hover,.spk-rail.is-night a.is-cur{color:var(--white)}
            .spk-rail.is-night a.is-cur i{background:var(--white)}
        }
        /* Scroll-Driven Reveals (progressive enhancement) */
        @media (prefers-reduced-motion:no-preference){
            @supports (animation-timeline:view()){
                .spk-rev{animation:spk-rise both;animation-timeline:view();animation-range:entry 0% entry 52%}
                .bento-grid .spk-rev:nth-child(2){animation-range:entry 6% entry 58%}
                .bento-grid .spk-rev:nth-child(3){animation-range:entry 12% entry 64%}
                .bento-grid .spk-rev:nth-child(4){animation-range:entry 18% entry 70%}
                .bento-grid .spk-rev:nth-child(5){animation-range:entry 24% entry 76%}
                .bento-grid .spk-rev:nth-child(6){animation-range:entry 30% entry 82%}
                .pricing .spk-rev:nth-child(2){animation-range:entry 8% entry 62%}
                .pricing .spk-rev:nth-child(3){animation-range:entry 16% entry 72%}
                .rg-home-topics-grid .spk-rev:nth-child(2){animation-range:entry 6% entry 58%}
                .rg-home-topics-grid .spk-rev:nth-child(3){animation-range:entry 12% entry 64%}
                .rg-home-topics-grid .spk-rev:nth-child(4){animation-range:entry 18% entry 70%}
            }
        }
        @keyframes spk-rise{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
        /* REV-215 · Showroom-Gateway V3: die Kugel selbst, greifbar (CSS-3D-Armillar) */
        .srgate{position:relative;background:#0e0f12;overflow:hidden;overflow:clip;padding:clamp(70px,9vw,110px) 0;color:#fff}
        .srgate::after{content:'';position:absolute;inset:0;background-image:radial-gradient(1.5px 1.5px at 12% 22%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 78% 16%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 64% 78%,rgba(255,255,255,.35),transparent),radial-gradient(1px 1px at 28% 68%,rgba(255,255,255,.45),transparent),radial-gradient(1px 1px at 88% 56%,rgba(255,255,255,.3),transparent);pointer-events:none}
        .srgate-scene{position:relative;height:clamp(700px,70vw,820px);perspective:1300px;cursor:grab;touch-action:pan-y;isolation:isolate;z-index:1}
        .srgate-scene.is-grabbing{cursor:grabbing}
        .srgate-world{position:absolute;left:50%;top:50%;transform-style:preserve-3d;transform:translate(-50%,-50%) rotateX(12deg)}
        .srgate-ring{position:absolute;left:0;top:0;transform-style:preserve-3d;will-change:transform}
        .srgate-ring--b{transform:rotateX(72deg) rotateZ(14deg);animation:srgate-ringspin 120s linear infinite}
        @keyframes srgate-ringspin{to{transform:rotateX(72deg) rotateZ(14deg) rotateY(360deg)}}
        .srgate-tile{position:absolute;left:-110px;top:-62px;width:220px;height:124px;border-radius:9px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 44px -18px rgba(0,0,0,.8);backface-visibility:hidden}
        .srgate-tile img{width:100%;height:100%;object-fit:cover;filter:saturate(.95) brightness(.92)}
        .srgate-ring--b .srgate-tile{width:170px;height:96px;left:-85px;top:-48px;opacity:.55;filter:blur(.4px)}
        .srgate-stagewrap{position:relative}
        .srgate-core{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:2;pointer-events:none;padding:0 clamp(16px,4vw,32px)}
        .srgate-core-in{position:relative;width:min(560px,86vw)}
        .srgate-core-in::before{content:'';position:absolute;inset:-14% -10%;background:radial-gradient(ellipse 50% 50% at 50% 50%,rgba(14,15,18,.92) 30%,rgba(14,15,18,.55) 62%,transparent 78%);z-index:-1}
        .srgate-eyebrow{display:inline-flex;align-items:center;gap:9px;background:rgba(14,15,18,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:7px 17px;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.82);margin-bottom:22px}
        .srgate-dot{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.9);animation:srgate-pulse 2.4s ease-in-out infinite}
        @keyframes srgate-pulse{50%{opacity:.4}}
        .srgate h2{font-size:clamp(2.4rem,5.6vw,4.3rem);font-weight:900;letter-spacing:-.04em;line-height:1.04;color:#fff;margin:0 0 14px}
        .srgate h2 em{font-style:normal;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.9)}
        .srgate-sub{font-size:clamp(.95rem,1.5vw,1.1rem);line-height:1.6;color:rgba(255,255,255,.62);max-width:44ch;margin:0 auto 26px}
        .srgate-sub strong{color:rgba(255,255,255,.92)}
        .srgate-ctawrap{position:relative;display:inline-flex;pointer-events:auto}
        .srgate-ctawrap::before{content:'';position:absolute;inset:-9px;border-radius:999px;background:conic-gradient(from var(--gw-beam,0deg),transparent 0deg,transparent 295deg,rgba(255,255,255,.85) 330deg,transparent 360deg);filter:blur(9px);opacity:.8;animation:gw-care-beam 5.5s linear infinite;pointer-events:none}
        .srgate-cta{position:relative;display:inline-flex;align-items:center;gap:12px;background:#fff;color:#111;font-weight:800;font-size:1rem;padding:17px 36px;border-radius:999px;transition:transform .25s cubic-bezier(.4,0,.2,1),box-shadow .25s;box-shadow:0 22px 54px -18px rgba(255,255,255,.35)}
        .srgate-cta:hover{color:#111;box-shadow:0 28px 64px -16px rgba(255,255,255,.5)}
        .srgate-cta:hover svg{transform:translateX(4px)}
        .srgate-cta svg{transition:transform .25s cubic-bezier(.4,0,.2,1)}
        .srgate-hint{display:block;margin-top:18px;font-family:ui-monospace,'SF Mono',monospace;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.38)}
        .srgate-meta{position:relative;z-index:2;display:flex;gap:22px;justify-content:center;margin-top:8px;font-size:.76rem;font-weight:600;letter-spacing:.06em;color:rgba(255,255,255,.45)}
        .srgate-corner{position:absolute;width:26px;height:26px;border:1.5px solid rgba(255,255,255,.28);pointer-events:none;z-index:3}
        .srgate-corner--tl{top:22px;left:22px;border-right:0;border-bottom:0}
        .srgate-corner--tr{top:22px;right:22px;border-left:0;border-bottom:0}
        .srgate-corner--bl{bottom:22px;left:22px;border-right:0;border-top:0}
        .srgate-corner--br{bottom:22px;right:22px;border-left:0;border-top:0}
        .srgate-hud{position:absolute;font-family:ui-monospace,'SF Mono',monospace;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.34);pointer-events:none;z-index:3}
        .srgate-hud--tl{top:30px;left:62px}
        .srgate-hud--tr{top:30px;right:62px;text-align:right}
        .srgate-hud--bl{bottom:30px;left:62px}
        .srgate-hud--br{bottom:30px;right:62px;text-align:right}
        @media (max-width:720px){
            .srgate-scene{height:740px;perspective:900px}
            .srgate-tile{width:150px;height:84px;left:-75px;top:-42px}
            .srgate-ring--b .srgate-tile{width:110px;height:62px;left:-55px;top:-31px}
            .srgate-hud,.srgate-corner{display:none}
            .srgate-meta{flex-wrap:wrap;gap:10px 18px;padding:0 16px}
            .srgate-sub{max-width:30ch}
        }
        .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
        @media (prefers-reduced-motion:reduce){
            .hero-content > *{animation:none;opacity:1;transform:none}
            .spk-beam::after{animation:none}
            .srgate-row,.srgate-dot,.srgate-orbit,.srgate-satwrap,.srgate-ctawrap::before{animation:none}
            .srgate-stage{transition:none}
        }
