/* =========================================================
   Fixed production typography: title 15 and body copy 17
   ========================================================= */
h1,h2,h3{
    font-family:"DM Sans",sans-serif;
    font-weight:800;
    letter-spacing:.2px;
    text-transform:uppercase;
}
body{
    font-family:"DM Sans",sans-serif;
    font-weight:520;
    letter-spacing:-.25px;
    line-height:1.7;
}
.section-lead,.module-card p{
    font-family:inherit;
    font-size:var(--type-section-copy);
}
.section-cta p{
    font-family:inherit;
    font-size:var(--type-cta-copy);
}
.hero-copy-zone p,.footer-brand p,.footer-links a,.footer-links span,.contact-form{
    font-family:inherit;
    font-size:18px;
}

/* =========================================================
   Fixed production button: system 15, Magnetkontakt detail 5
   ========================================================= */
.btn{
    min-height:52px;
    background:transparent;
    color:var(--surface-fg);
    border:0;
    clip-path:none;
    padding:5px 4px 5px 18px;
    box-shadow:none;
    transition:color .24s ease,transform .18s ease,box-shadow .24s ease;
}
.btn::before,.btn::after{
    content:"";
    position:absolute;
    z-index:-1;
    pointer-events:none;
    top:0;
    bottom:0;
    width:50%;
    background:var(--interactive-bg);
    transition:transform .34s cubic-bezier(.2,.8,.2,1);
}
.btn::before{left:0;transform:translateX(-102%)}
.btn::after{right:0;transform:translateX(102%)}
.btn__label{transition:color .24s ease,transform .24s ease}
.btn__icon{
    height:36px;
    width:36px;
    flex:0 0 36px;
    background:transparent;
    color:var(--interactive-accent);
    border-radius:var(--radius-ui);
    clip-path:none;
    transition:transform .28s ease,color .24s ease;
}
.btn__icon svg{width:19px;height:19px}
.btn:hover,.btn:focus-visible{
    color:var(--interactive-fg);
    box-shadow:0 13px 30px rgba(0,0,0,.14);
}
.btn:hover::before,.btn:hover::after,.btn:focus-visible::before,.btn:focus-visible::after{transform:translateX(0)}
.btn:hover .btn__icon,.btn:focus-visible .btn__icon{color:inherit;transform:translateX(4px)}
.btn:active{transform:translateY(2px) scale(.985);box-shadow:none}

/* Yellow priority buttons in header and hero */
.header-cta,.hero .btn{
    min-height:46px;
    padding-top:3px;
    padding-bottom:3px;
    background:var(--brand);
    color:var(--ink);
}
.header-cta .btn__icon,.hero .btn .btn__icon{color:var(--ink)}
.header-cta::before,.header-cta::after,.hero .btn::before,.hero .btn::after{z-index:1;background:var(--ink)}
.header-cta:hover,.header-cta:focus-visible,.hero .btn:hover,.hero .btn:focus-visible{color:var(--white)}

/* =========================================================
   Fixed hero compositions: home/general 2 and services 3
   ========================================================= */
.hero--split .hero-media{left:48%;clip-path:polygon(10% 0,100% 0,100% 100%,0 100%)}
.hero--split .hero-media::after{background:linear-gradient(90deg,var(--ink),transparent 48%)}
.hero--split .hero-grid{grid-template-columns:46% 1fr;grid-template-areas:"title ." "copy ." "benefits ." "cta .";align-content:center}
.hero--split .hero-benefits{grid-template-columns:repeat(2,minmax(0,1fr))}
.hero--split .hero-title-zone{animation:rise-in .7s ease both}
.hero--split .hero-cta{animation:contact-in .8s .18s ease both}

.hero--stage .hero-media::after{background:linear-gradient(0deg,rgba(10,11,10,.94) 0%,rgba(10,11,10,.22) 68%),linear-gradient(90deg,rgba(10,11,10,.62),transparent 65%)}
.hero--stage .hero-grid{align-content:end;grid-template-columns:1.4fr .6fr;grid-template-areas:"title benefits" "copy benefits" "cta cta";padding-bottom:66px}
.hero--stage .hero-benefits{align-self:end}
.hero--stage .hero-title-zone{animation:contact-in .85s ease both}
.hero--stage .hero-copy-zone{animation:rise-in .75s .12s ease both}

/* =========================================================
   10 structural architectures for every content section
   ========================================================= */
.content-section[data-variant="1"].is-revealed .section-paint{animation:contact-in .8s ease both}

.content-section[data-variant="2"] .section-layout{grid-template-columns:minmax(280px,.62fr) minmax(0,1.38fr);grid-template-areas:"head media" "modules media" "cta media";align-items:start}
.content-section[data-variant="2"] .section-heading{position:sticky;top:120px}
.content-section[data-variant="2"] .section-modules{grid-template-columns:1fr}
.content-section[data-variant="2"] .section-media{height:100%;min-height:620px}
.content-section[data-variant="2"] .section-image{height:100%;aspect-ratio:auto}
.content-section[data-variant="2"] .section-cta{align-items:flex-start;flex-direction:column}
.content-section[data-variant="2"].is-revealed .section-media{animation:iris-in .9s ease both}

.content-section[data-variant="3"]{background:var(--ink);color:var(--paper)}
.content-section[data-variant="3"] .section-layout{min-height:650px;grid-template-columns:1fr 1fr;grid-template-areas:"head ." "modules modules" ". cta";align-content:center}
.content-section[data-variant="3"] .section-media{position:absolute;inset:-125px calc((100vw - min(100vw,var(--container)))/-2 - var(--side-pad));z-index:-1;opacity:.28;clip-path:none;box-shadow:none}
.content-section[data-variant="3"] .section-media,.content-section[data-variant="3"] .section-image{width:100%;height:calc(100% + 250px);aspect-ratio:auto}
.content-section[data-variant="3"] .section-modules{grid-template-columns:repeat(4,1fr)}
.content-section[data-variant="3"] .module-card{background:rgba(23,24,23,.74);backdrop-filter:blur(9px);border-color:rgba(255,255,255,.18)}
.content-section[data-variant="3"] .module-card p,.content-section[data-variant="3"] .section-lead,.content-section[data-variant="3"] .section-cta p{color:#d5d7d1}
.content-section[data-variant="3"].is-revealed .section-modules{animation:fold-in .8s ease both}

.content-section[data-variant="4"] .section-layout{grid-template-columns:330px minmax(0,1fr);grid-template-areas:"head modules" "media modules" "cta modules"}
.content-section[data-variant="4"] .section-modules{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 18px}
.content-section[data-variant="4"] .module-card{flex:0 0 330px;scroll-snap-align:start}
.content-section[data-variant="4"] .section-media{height:220px}
.content-section[data-variant="4"] .section-image{height:100%;aspect-ratio:auto}
.content-section[data-variant="4"] .section-cta{flex-direction:column;align-items:flex-start}
.content-section[data-variant="4"].is-revealed .module-card{animation:slide-rail .55s ease both}

.content-section[data-variant="5"] .section-layout{grid-template-columns:repeat(12,1fr);grid-template-areas:none}
.content-section[data-variant="5"] .section-heading{grid-column:7/13;grid-row:1}
.content-section[data-variant="5"] .section-media{grid-column:1/7;grid-row:1/3;align-self:stretch}
.content-section[data-variant="5"] .section-image{height:100%;aspect-ratio:auto;object-fit:contain;background:color-mix(in srgb,var(--surface-bg) 82%,var(--surface-fg) 18%)}
.content-section[data-variant="5"] .section-modules{grid-column:5/13;grid-row:2;display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px}
.content-section[data-variant="5"] .module-card:first-child{grid-column:span 2;min-height:280px}
.content-section[data-variant="5"] .section-cta{grid-column:1/5;grid-row:3;flex-direction:column;align-items:flex-start;border-top:0;border-left:6px solid var(--brand);padding:24px}
.content-section[data-variant="5"].is-revealed .module-card:first-child{animation:iris-in .8s ease both}

.content-section[data-variant="6"] .section-layout{grid-template-columns:110px minmax(0,1fr) 310px;grid-template-areas:"head modules cta"}
.content-section[data-variant="6"] .section-heading{writing-mode:vertical-rl;transform:rotate(180deg);max-height:680px}
.content-section[data-variant="6"] .section-heading h2,.content-section[data-variant="6"] .section-heading .section-h1{margin:0}
.content-section[data-variant="6"] .section-heading .section-lead{display:none}
.content-section[data-variant="6"] .section-media{display:none}
.content-section[data-variant="6"] .section-modules{grid-template-columns:1fr}
.content-section[data-variant="6"] .module-card{display:block;background:transparent;border:0;border-top:1px solid var(--surface-line)}
.content-section[data-variant="6"] .module-image{width:72px}
.content-section[data-variant="6"] .module-body{display:grid;grid-template-columns:72px minmax(0,1fr);padding:20px 10px 22px 22px}
.content-section[data-variant="6"] .module-icon{grid-row:1/5}
.content-section[data-variant="6"] .section-cta{position:sticky;top:120px;flex-direction:column;align-items:flex-start;border:0;padding:26px}
.content-section[data-variant="6"].is-revealed .section-heading{animation:contact-in .7s ease both}

.content-section[data-variant="7"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "media" "modules" "cta";text-align:center}
.content-section[data-variant="7"] .section-heading,.content-section[data-variant="7"] .section-media{margin-inline:auto}
.content-section[data-variant="7"] .section-media{width:min(520px,100%);clip-path:polygon(50% 0,100% 18%,100% 82%,50% 100%,0 82%,0 18%)}
.content-section[data-variant="7"] .section-modules{display:flex;justify-content:center;position:relative;gap:0}
.content-section[data-variant="7"] .section-modules::before{content:"";position:absolute;left:3%;right:3%;top:36px;height:2px;background:var(--brand)}
.content-section[data-variant="7"] .module-card{flex:1;max-width:250px;background:transparent;border:0;padding-top:58px}
.content-section[data-variant="7"] .module-card::before{content:"";position:absolute;top:28px;left:50%;width:18px;height:18px;background:var(--brand);border:5px solid var(--surface-bg);transform:translateX(-50%) rotate(45deg)}
.content-section[data-variant="7"] .module-icon{margin-inline:auto}
.content-section[data-variant="7"] .section-cta{justify-content:center;flex-direction:column}
.content-section[data-variant="7"].is-revealed .section-modules::before{animation:contact-in .9s ease both}

.content-section[data-variant="8"] .section-layout{grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);grid-template-areas:"head head" "modules media" "modules cta"}
.content-section[data-variant="8"] .section-modules{grid-template-columns:repeat(2,1fr);grid-auto-flow:dense}
.content-section[data-variant="8"] .module-card:first-child{grid-row:span 2;background:var(--brand);color:var(--ink);min-height:420px}
.content-section[data-variant="8"] .module-card:first-child p{color:#3b3118}
.content-section[data-variant="8"] .section-media{height:300px}
.content-section[data-variant="8"] .section-image{height:100%;aspect-ratio:auto}
.content-section[data-variant="8"] .section-cta{flex-direction:column;align-items:flex-start;padding:24px;border:0}
.content-section[data-variant="8"].is-revealed .module-card:first-child{animation:fold-in .85s ease both}

.content-section[data-variant="9"] .section-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"head modules" "cta modules" "media media"}
.content-section[data-variant="9"] .section-media{width:100vw;max-width:none;margin-left:calc((100vw - min(100vw,var(--container)))/-2 - var(--side-pad));margin-right:calc((100vw - min(100vw,var(--container)))/-2 - var(--side-pad));height:390px;clip-path:none}
.content-section[data-variant="9"] .section-image{height:100%;aspect-ratio:auto}
.content-section[data-variant="9"] .section-modules{grid-template-columns:repeat(2,1fr)}
.content-section[data-variant="9"] .section-cta{flex-direction:column;align-items:flex-start}
.content-section[data-variant="9"].is-revealed .section-media{animation:iris-in 1s ease both}

.content-section[data-variant="10"] .section-layout{grid-template-columns:1fr 2fr;grid-template-areas:"head modules" "cta modules"}
.content-section[data-variant="10"] .section-media{display:none}
.content-section[data-variant="10"] .section-modules{grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--surface-line)}
.content-section[data-variant="10"] .module-card{background:transparent;border:0;border-bottom:1px solid var(--surface-line)}
.content-section[data-variant="10"] .module-body{display:grid;grid-template-columns:54px 1fr;column-gap:18px}
.content-section[data-variant="10"] .module-icon,.content-section[data-variant="10"] .module-meta{grid-row:1/4}
.content-section[data-variant="10"] .section-cta{flex-direction:column;align-items:flex-start;border-top:0}
.content-section[data-variant="10"].is-revealed .module-card{animation:contact-in .65s ease both}
.content-section[data-section-kind][data-variant="4"] .section-heading h1,
.content-section[data-section-kind][data-variant="4"] .section-heading h2,
.content-section[data-section-kind][data-variant="10"] .section-heading h1,
.content-section[data-section-kind][data-variant="10"] .section-heading h2{
    max-width:100%;
    overflow-wrap:break-word;
    word-break:normal;
    hyphens:auto;
}

/* Partners retain their logo content while adopting the ten architectures. */
.section--partners[data-variant="2"] .partner-grid{grid-area:modules;grid-template-columns:repeat(4,1fr)}
.section--partners[data-variant="3"] .partner-grid{grid-area:modules;display:flex;flex-wrap:wrap;justify-content:center}.section--partners[data-variant="3"] .partner-logo{width:190px}
.section--partners[data-variant="4"] .partner-grid{grid-area:modules;display:flex;overflow-x:auto}.section--partners[data-variant="4"] .partner-logo{flex:0 0 210px}
.section--partners[data-variant="5"] .partner-grid{grid-area:modules;grid-template-columns:repeat(8,1fr)}.section--partners[data-variant="5"] .partner-logo:nth-child(3n){grid-column:span 2}
.section--partners[data-variant="6"] .partner-grid{grid-area:modules;grid-template-columns:repeat(3,1fr)}
.section--partners[data-variant="7"] .partner-grid{grid-area:modules;display:flex;flex-wrap:wrap;justify-content:center}.section--partners[data-variant="7"] .partner-logo{width:170px;border-radius:50%;clip-path:none}
.section--partners[data-variant="8"] .partner-grid{grid-area:modules;grid-template-columns:repeat(5,1fr)}.section--partners[data-variant="8"] .partner-logo:first-child{grid-column:span 2;grid-row:span 2}
.section--partners[data-variant="9"] .partner-grid{grid-area:modules;grid-template-columns:repeat(6,1fr);padding:34px 0}
.section--partners[data-variant="10"] .partner-grid{grid-area:modules;grid-template-columns:repeat(2,1fr)}.section--partners[data-variant="10"] .partner-logo{justify-items:start}

/* Fixed production submenu 4 */
.submenu-shell{grid-template-columns:1.1fr 1.9fr}
.submenu-intro{
    background:var(--brand);
    color:var(--ink);
    padding:28px;
    clip-path:none;
    border-left:8px solid var(--paper);
}
.submenu-intro strong,.submenu-intro p{color:var(--ink)}

/* =========================================================
   10 footer architectures
   ========================================================= */
.site-footer[data-variant="2"] .footer-container{grid-template-columns:1fr}.site-footer[data-variant="2"] .footer-brand{display:grid;grid-template-columns:260px 1fr;align-items:center;border-bottom:1px solid rgba(255,255,255,.16);padding-bottom:28px}.site-footer[data-variant="2"] .footer-links{grid-template-columns:repeat(3,1fr)}
.site-footer[data-variant="3"]{background:var(--brand);color:var(--ink)}.site-footer[data-variant="3"] .footer-container{grid-template-columns:1fr 2fr}.site-footer[data-variant="3"] .footer-brand img{filter:brightness(0)}.site-footer[data-variant="3"] .footer-brand p,.site-footer[data-variant="3"] .footer-links a,.site-footer[data-variant="3"] .footer-links span,.site-footer[data-variant="3"] .footer-bottom{color:#312a19}.site-footer[data-variant="3"] .footer-links h2{color:var(--ink)}
.site-footer[data-variant="4"] .footer-container{grid-template-columns:260px 1fr}.site-footer[data-variant="4"] .footer-brand{border-right:1px solid rgba(255,255,255,.16);padding-right:40px}.site-footer[data-variant="4"] .footer-links>div{border-top:5px solid var(--brand);padding-top:22px}
.site-footer[data-variant="5"] .footer-container{grid-template-columns:1fr}.site-footer[data-variant="5"] .footer-brand{text-align:center}.site-footer[data-variant="5"] .footer-brand img{margin-inline:auto}.site-footer[data-variant="5"] .footer-brand p{max-width:700px;margin-inline:auto}.site-footer[data-variant="5"] .footer-links{text-align:center}.site-footer[data-variant="5"] .footer-links>div{align-items:center}
.site-footer[data-variant="6"] .footer-container{grid-template-columns:1fr}.site-footer[data-variant="6"] .footer-links{order:-1;grid-template-columns:2fr 1fr 1fr}.site-footer[data-variant="6"] .footer-brand{display:flex;align-items:center;gap:40px}.site-footer[data-variant="6"] .footer-brand p{max-width:700px}
.site-footer[data-variant="7"]{clip-path:polygon(0 55px,55px 0,100% 0,100% 100%,0 100%);padding-top:130px}.site-footer[data-variant="7"] .footer-links{gap:0}.site-footer[data-variant="7"] .footer-links>div{padding:24px;border:1px solid rgba(255,255,255,.12)}
.site-footer[data-variant="8"] .footer-container{grid-template-columns:1fr 1fr}.site-footer[data-variant="8"] .footer-links{grid-template-columns:1fr}.site-footer[data-variant="8"] .footer-links>div{display:grid;grid-template-columns:180px repeat(2,1fr);border-bottom:1px solid rgba(255,255,255,.15);padding:15px 0}.site-footer[data-variant="8"] .footer-links h2{grid-row:1/4}
.site-footer[data-variant="9"]{padding-top:45px}.site-footer[data-variant="9"] .footer-container{grid-template-columns:1fr}.site-footer[data-variant="9"] .footer-brand{display:none}.site-footer[data-variant="9"] .footer-links{grid-template-columns:repeat(3,1fr)}.site-footer[data-variant="9"] .footer-bottom{margin-top:40px}
.site-footer[data-variant="10"]::before{background:linear-gradient(100deg,var(--brand) 0 30%,transparent 30%)}.site-footer[data-variant="10"] .footer-brand{color:var(--ink);padding-right:55px}.site-footer[data-variant="10"] .footer-brand img{filter:brightness(0)}.site-footer[data-variant="10"] .footer-brand p{color:var(--ink)}

@media (max-width:1100px){
    .content-section[data-variant="5"] .section-modules{grid-column:4/13}
    .content-section[data-variant="6"] .section-layout{grid-template-columns:90px 1fr;grid-template-areas:"head modules" "cta modules"}
    .content-section[data-variant="6"] .section-cta{position:static}
    .content-section[data-variant="7"] .section-modules{overflow-x:auto;justify-content:flex-start}
    .content-section[data-variant="7"] .module-card{flex:0 0 230px}
}

@media (max-width:900px){
    .hero--home-variants .variant-dock{
        top:50%;
        right:6px;
        bottom:auto;
        width:46px;
        max-width:none;
        min-height:0;
        padding:7px 5px;
        display:block;
        transform:translate(14px,-50%);
    }
    .hero--home-variants .variant-dock.is-dock-active{transform:translate(0,-50%)}
    .hero--home-variants .variant-dock__label{
        writing-mode:vertical-rl;
        transform:rotate(180deg);
        max-height:70px;
        margin:3px auto 7px;
        text-align:center;
        white-space:normal;
    }
    .hero--home-variants .variant-dock__numbers{display:grid;grid-template-columns:1fr;justify-items:center}
    .hero--home-variants .variant-dock button{width:27px;height:26px}
    .hero--split .hero-media{left:35%;opacity:.65}
    .hero--split .hero-grid{grid-template-columns:1fr;grid-template-areas:"title" "copy" "benefits" "cta"}
    .content-section[data-variant="2"] .section-layout,.content-section[data-variant="3"] .section-layout,.content-section[data-variant="4"] .section-layout,.content-section[data-variant="8"] .section-layout,.content-section[data-variant="9"] .section-layout,.content-section[data-variant="10"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "media" "modules" "cta"}
    .content-section[data-variant="2"] .section-heading{position:static}
    .content-section[data-variant="2"] .section-media{min-height:380px}
    .content-section[data-variant="3"] .section-media{position:relative;inset:auto;z-index:0;width:100%;max-width:none;height:420px;margin:0;opacity:1}
    .content-section[data-variant="3"] .section-image{height:100%}
    .content-section[data-variant="3"] .section-modules{grid-template-columns:repeat(2,1fr)}
    .content-section[data-variant="4"] .section-media{height:300px}
    .content-section[data-variant="5"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "media" "modules" "cta"}
    .content-section[data-variant="5"] .section-heading,.content-section[data-variant="5"] .section-media,.content-section[data-variant="5"] .section-modules,.content-section[data-variant="5"] .section-cta{grid-column:auto;grid-row:auto;margin:0}
    .content-section[data-variant="5"] .section-modules{grid-template-columns:repeat(2,1fr)}
    .content-section[data-variant="6"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "modules" "cta"}
    .content-section[data-variant="6"] .section-heading{writing-mode:horizontal-tb;transform:none;max-height:none}
    .content-section[data-variant="8"] .section-media{height:360px}
    .content-section[data-variant="9"] .section-media{margin-left:calc(-1 * var(--side-pad));margin-right:calc(-1 * var(--side-pad));width:calc(100% + (2 * var(--side-pad)))}
    .section--partners[data-variant] .partner-grid{grid-template-columns:repeat(4,1fr)}
    .service-submenu{left:0;right:0}
    .submenu-shell{display:flex!important;flex-direction:column!important;width:100%!important;max-width:100%!important;gap:20px!important}
    .submenu-intro{grid-column:auto!important;width:100%!important;transform:none!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.18)!important;padding:20px!important}
    .submenu-links{display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;gap:10px!important;padding-bottom:10px!important;scroll-snap-type:x mandatory}
    .submenu-links>a{flex:0 0 min(280px,78vw)!important;width:auto!important;min-height:118px!important;transform:none!important;grid-template-columns:42px minmax(0,1fr) 20px!important;scroll-snap-align:start}
}

@media (max-width:680px){
    .btn{font-size:14px}
    .hero-cta .btn{font-size:14px}
    .footer-prompt .btn{font-size:16px}
    .section-cta>.btn{font-size:var(--type-action)}
    .hero--stage .hero-grid{grid-template-columns:1fr;grid-template-areas:"title" "copy" "benefits" "cta"}
    .hero--split .hero-media{left:0;top:38%;opacity:.46}
    .hero--split .hero-grid{align-content:start}
    .hero--stage{min-height:1400px}
    .hero--stage .hero-media{bottom:auto;height:500px}
    .hero--stage .hero-media::after{background:linear-gradient(0deg,var(--ink) 0,rgba(10,11,10,.12) 60%),linear-gradient(90deg,rgba(10,11,10,.38),transparent)}
    .hero--stage .hero-grid{min-height:1400px;padding-top:340px;grid-template-areas:"title" "benefits" "copy" "cta";align-content:start}
    .hero--stage .hero-title-zone{margin-right:48px;padding:24px 22px;background:var(--paper);color:var(--ink);clip-path:polygon(0 0,100% 0,100% calc(100% - 20px),calc(100% - 20px) 100%,0 100%)}
    .hero--stage h1{text-align:left}
    .hero--stage .hero-benefits{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-right:calc(-1 * var(--side-pad));padding-right:var(--side-pad)}
    .hero--stage .hero-benefits li{flex:0 0 248px;scroll-snap-align:start}
    .hero--stage .hero-copy-zone,.hero--stage .hero-cta{border-left:5px solid var(--brand);padding-left:18px}
    .hero--stage .hero-copy-zone p,.hero--stage .hero-cta>p{text-align:left}
    .content-section[data-variant="3"] .section-modules,.content-section[data-variant="5"] .section-modules,.content-section[data-variant="8"] .section-modules,.content-section[data-variant="9"] .section-modules,.content-section[data-variant="10"] .section-modules{grid-template-columns:1fr}
    .content-section[data-variant="4"] .section-modules{display:flex!important}
    .content-section[data-variant="4"] .module-card{flex-basis:82vw}
    .content-section[data-variant="6"] .module-body{grid-template-columns:52px minmax(0,1fr)}
    .content-section[data-variant="7"] .section-modules{display:flex!important}
    .content-section[data-variant="7"] .module-card{flex-basis:78vw}
    .content-section[data-variant="8"] .module-card:first-child{min-height:0}
    .content-section[data-variant="9"] .section-media{height:300px}
    .section--partners[data-variant] .partner-grid{grid-template-columns:repeat(2,1fr)}
    .site-footer[data-variant] .footer-container{grid-template-columns:1fr}
    .site-footer[data-variant] .footer-brand{display:block;border:0;padding:0;text-align:left;color:inherit}
    .site-footer[data-variant] .footer-brand img{margin-left:0;filter:none}
    .site-footer[data-variant] .footer-links,.site-footer[data-variant="8"] .footer-links{grid-template-columns:1fr!important}
    .site-footer[data-variant="8"] .footer-links>div{display:flex}
}

/* =========================================================
   V3: content-aware section architectures
   Every occupied zone is driven by section metadata.
   ========================================================= */
.content-section[data-section-kind] .section-layout{
    display:grid;
    grid-template-columns:minmax(0,0.78fr) minmax(0,1.22fr);
    grid-template-areas:"head head" "media modules" "cta cta";
    gap:48px 56px;
    align-items:start;
}
.content-section[data-section-kind][data-has-media="false"] .section-layout{
    grid-template-columns:1fr;
    grid-template-areas:"head" "modules" "cta";
}
.content-section[data-section-kind].section--interactive[data-has-media="true"] .section-layout{
    grid-template-areas:"head head" "media modules" "explorer explorer" "cta cta";
}
.content-section[data-section-kind].section--interactive[data-has-media="false"] .section-layout{
    grid-template-areas:"head" "modules" "explorer" "cta";
}
.content-section[data-section-kind] .section-heading,
.content-section[data-section-kind] .section-media,
.content-section[data-section-kind] .section-modules,
.content-section[data-section-kind] .section-explorer,
.content-section[data-section-kind] .section-cta{
    position:relative;
    inset:auto;
    width:auto;
    height:auto;
    min-height:0;
    max-width:none;
    margin:0;
    transform:none;
}
.content-section[data-section-kind] .section-heading{grid-area:head;max-width:960px}
.content-section[data-section-kind] .section-media{grid-area:media}
.content-section[data-section-kind] .section-modules{grid-area:modules;display:grid;grid-auto-flow:row;overflow:visible}
.content-section[data-section-kind] .section-explorer{grid-area:explorer}
.content-section[data-section-kind] .section-cta{grid-area:cta}
.content-section[data-section-kind] .section-heading .section-lead{display:block}
.content-section[data-section-kind] .section-media,
.content-section[data-section-kind] .section-image{aspect-ratio:auto}
.content-section[data-section-kind] .section-image{height:100%;min-height:320px;object-fit:cover}
.content-section[data-section-kind] .module-card{min-height:0;transform:none}
.content-section[data-section-kind] .module-body{display:block}
.content-section[data-section-kind] .section-modules{
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.content-section[data-section-kind][data-item-count="2"] .section-modules{grid-template-columns:repeat(2,minmax(0,1fr))}
.content-section[data-section-kind][data-item-count="3"] .section-modules{grid-template-columns:repeat(3,minmax(0,1fr))}
.content-section[data-section-kind][data-item-count="4"] .section-modules{grid-template-columns:repeat(4,minmax(0,1fr))}
.content-section[data-section-kind][data-item-count="5"] .section-modules{grid-template-columns:repeat(5,minmax(0,1fr))}
.content-section[data-section-kind][data-item-count="6"] .section-modules{grid-template-columns:repeat(3,minmax(0,1fr))}
.content-section[data-section-kind] .module-icon,
.content-section[data-section-kind] .submenu-icon,
.btn__icon{
    border-radius:0!important;
    clip-path:none!important;
}

/* V1 — balanced project overview */
.content-section[data-section-kind][data-variant="1"] .section-paint{opacity:.18}
.content-section[data-section-kind][data-variant="1"] .module-card{border-top:4px solid var(--brand)}
.content-section[data-section-kind][data-variant="1"].is-revealed .module-card{animation:rise-in .52s ease both}

/* V2 — editorial workshop split */
.content-section[data-section-kind][data-variant="2"][data-has-media="true"] .section-layout{
    grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr);
    grid-template-areas:"head media" "modules media" "cta explorer";
}
.content-section[data-section-kind][data-variant="2"][data-has-media="false"] .section-layout{
    grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr);
    grid-template-areas:"head modules" "cta explorer";
}
.content-section[data-section-kind][data-variant="2"]:not(.section--interactive)[data-has-media="false"] .section-layout{
    grid-template-areas:"head modules" "cta modules";
}
.content-section[data-section-kind][data-variant="2"] .section-heading{position:relative;top:auto}
.content-section[data-section-kind][data-variant="2"] .section-media{align-self:stretch}
.content-section[data-section-kind][data-variant="2"] .section-image{min-height:580px}
.content-section[data-section-kind][data-variant="2"] .section-modules{grid-template-columns:1fr}
.content-section[data-section-kind][data-variant="2"] .module-card{display:grid;grid-template-columns:auto minmax(0,1fr)}
.content-section[data-section-kind][data-variant="2"] .module-image{width:190px;border:0;border-right:1px solid var(--surface-line)}
.content-section[data-section-kind][data-variant="2"] .module-image .card-image{height:100%}
.content-section[data-section-kind][data-variant="2"] .section-cta{align-items:flex-start;flex-direction:column}

/* V3 — full-stage image or circuit field */
.content-section[data-section-kind][data-variant="3"]{background:var(--ink);color:var(--paper);isolation:isolate}
.content-section[data-section-kind][data-variant="3"] .section-layout{
    grid-template-columns:1fr;
    grid-template-areas:"head" "modules" "explorer" "cta";
    min-height:0;
    align-content:center;
}
.content-section[data-section-kind][data-variant="3"] .section-paint{
    opacity:.5;background-image:linear-gradient(90deg,rgba(232,164,7,.14) 1px,transparent 1px),linear-gradient(0deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:120px 100%,100% 120px;
}
.content-section[data-section-kind][data-variant="3"][data-has-media="true"] .section-media{
    position:absolute;z-index:-2;inset:0;width:100%;height:100%;opacity:.33;box-shadow:none;clip-path:none;
}
.content-section[data-section-kind][data-variant="3"][data-has-media="true"] .section-media::after{inset:0;height:auto;background:linear-gradient(90deg,rgba(23,24,23,.92),rgba(23,24,23,.46)),linear-gradient(0deg,rgba(23,24,23,.72),transparent)}
.content-section[data-section-kind][data-variant="3"][data-has-media="true"] .section-image{width:100%;height:100%;min-height:100%;object-fit:cover}
.content-section[data-section-kind][data-variant="3"] .section-modules{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.content-section[data-section-kind][data-variant="3"] .module-card,
.content-section[data-section-kind][data-variant="3"] .section-explorer{background:rgba(23,24,23,.78);border-color:rgba(255,255,255,.2);backdrop-filter:blur(10px)}
.content-section[data-section-kind][data-variant="3"] .module-card p,
.content-section[data-section-kind][data-variant="3"] .section-lead,
.content-section[data-section-kind][data-variant="3"] .section-cta p,
.content-section[data-section-kind][data-variant="3"] .section-explorer p{color:#d7d8d2}
.content-section[data-section-kind][data-variant="3"].is-revealed .section-heading{animation:contact-in .7s ease both}

/* V4 — controlled horizontal power rail */
.content-section[data-section-kind][data-variant="4"][data-has-media="true"] .section-layout{
    grid-template-columns:300px minmax(0,1fr);
    grid-template-areas:"head modules" "media modules" "cta explorer";
}
.content-section[data-section-kind][data-variant="4"][data-has-media="false"] .section-layout{
    grid-template-columns:300px minmax(0,1fr);
    grid-template-areas:"head modules" "cta explorer";
}
.content-section[data-section-kind][data-variant="4"]:not(.section--interactive)[data-has-media="false"] .section-layout{
    grid-template-areas:"head modules" "cta modules";
}
.content-section[data-section-kind][data-variant="4"] .section-media{height:250px}
.content-section[data-section-kind][data-variant="4"] .section-image{min-height:250px}
.content-section[data-section-kind][data-variant="4"] .section-modules{
    display:flex;flex-wrap:nowrap;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:8px;
}
.content-section[data-section-kind][data-variant="4"] .module-card{flex:0 0 320px;scroll-snap-align:start}
.content-section[data-section-kind][data-variant="4"] .section-cta{align-items:flex-start;flex-direction:column}
.content-section[data-section-kind][data-variant="4"].is-revealed .module-card{animation:slide-rail .55s ease both}

/* V5 — asymmetric dossier mosaic */
.content-section[data-section-kind][data-variant="5"] .section-layout{
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-template-areas:none;
    gap:30px;
}
.content-section[data-section-kind][data-variant="5"] .section-heading{grid-column:1/6;grid-row:1}
.content-section[data-section-kind][data-variant="5"][data-has-media="true"] .section-media{grid-column:7/13;grid-row:1/3;align-self:stretch}
.content-section[data-section-kind][data-variant="5"] .section-modules{grid-column:1/13;grid-row:3;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.content-section[data-section-kind][data-variant="5"][data-has-media="false"] .section-modules{grid-column:6/13;grid-row:1/3}
.content-section[data-section-kind][data-variant="5"] .section-explorer{grid-column:1/9;grid-row:4}
.content-section[data-section-kind][data-variant="5"][data-has-media="false"] .section-explorer{grid-column:1/6;grid-row:2}
.content-section[data-section-kind][data-variant="5"] .section-cta{grid-column:9/13;grid-row:4;align-items:flex-start;flex-direction:column;padding:24px;border:0}
.content-section[data-section-kind][data-variant="5"][data-has-media="false"] .section-cta{grid-column:1/6;grid-row:3}
.content-section[data-section-kind][data-variant="5"]:not(.section--interactive)[data-has-media="false"] .section-cta{grid-column:1/6;grid-row:2}
.content-section[data-section-kind][data-variant="5"] .module-card:nth-child(3n+1){transform:translateY(24px)}

/* V6 — indexed editorial ledger */
.content-section[data-section-kind][data-variant="6"] .section-layout{
    grid-template-columns:210px minmax(0,1fr) 310px;
    grid-template-areas:"head media cta" "head modules cta" "head explorer cta";
}
.content-section[data-section-kind][data-variant="6"][data-has-media="false"] .section-layout{
    grid-template-areas:"head modules cta" "head explorer cta";
}
.content-section[data-section-kind][data-variant="6"]:not(.section--interactive)[data-has-media="false"] .section-layout{
    grid-template-areas:"head modules cta";
}
.content-section[data-section-kind][data-variant="6"] .section-heading{align-self:stretch;border-left:7px solid var(--brand);padding-left:22px}
.content-section[data-section-kind][data-variant="6"] .section-media{height:260px}
.content-section[data-section-kind][data-variant="6"] .section-image{min-height:260px}
.content-section[data-section-kind][data-variant="6"] .section-modules{grid-template-columns:1fr;gap:0;border-top:1px solid var(--surface-line)}
.content-section[data-section-kind][data-variant="6"] .module-card{background:transparent;border:0;border-bottom:1px solid var(--surface-line)}
.content-section[data-section-kind][data-variant="6"] .module-body{display:grid;grid-template-columns:58px minmax(0,1fr);column-gap:18px}
.content-section[data-section-kind][data-variant="6"] .module-icon,
.content-section[data-section-kind][data-variant="6"] .module-meta{grid-row:1/4}
.content-section[data-section-kind][data-variant="6"] .section-cta{position:sticky;top:118px;align-items:flex-start;flex-direction:column;padding:25px;border:0}

/* V7 — centered system node */
.content-section[data-section-kind][data-variant="7"] .section-layout{
    grid-template-columns:1fr;
    grid-template-areas:"head" "media" "modules" "explorer" "cta";
    text-align:center;
}
.content-section[data-section-kind][data-variant="7"][data-has-media="false"] .section-layout{
    grid-template-areas:"head" "modules" "explorer" "cta";
}
.content-section[data-section-kind][data-variant="7"]:not(.section--interactive)[data-has-media="false"] .section-layout{
    grid-template-areas:"head" "modules" "cta";
}
.content-section[data-section-kind][data-variant="7"] .section-heading,
.content-section[data-section-kind][data-variant="7"] .section-media{margin-inline:auto}
.content-section[data-section-kind][data-variant="7"] .section-media{width:min(620px,100%);height:370px;clip-path:none}
.content-section[data-section-kind][data-variant="7"] .section-image{min-height:370px}
.content-section[data-section-kind][data-variant="7"] .section-modules{display:flex;justify-content:center;gap:0;overflow-x:auto;scrollbar-width:none;position:relative}
.content-section[data-section-kind][data-variant="7"] .section-modules::before{content:"";position:absolute;left:3%;right:3%;top:35px;height:2px;background:var(--brand)}
.content-section[data-section-kind][data-variant="7"] .module-card{flex:1 0 220px;max-width:270px;background:transparent;border:0;padding-top:56px}
.content-section[data-section-kind][data-variant="7"] .module-card::before{content:"";position:absolute;top:27px;left:50%;width:18px;height:18px;background:var(--brand);border:5px solid var(--surface-bg);transform:translateX(-50%)}
.content-section[data-section-kind][data-variant="7"] .module-icon{margin-inline:auto}
.content-section[data-section-kind][data-variant="7"] .section-cta{justify-content:center;flex-direction:column}
.content-section[data-section-kind][data-variant="7"] .section-explorer{text-align:left}

/* V8 — selection-led control room */
.content-section[data-section-kind][data-variant="8"].section--interactive[data-has-media="true"] .section-layout{
    grid-template-columns:minmax(0,1.3fr) minmax(310px,.7fr);
    grid-template-areas:"head head" "modules media" "explorer media" "cta media";
}
.content-section[data-section-kind][data-variant="8"].section--interactive[data-has-media="false"] .section-layout{
    grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);
    grid-template-areas:"head explorer" "modules explorer" "cta explorer";
}
.content-section[data-section-kind][data-variant="8"]:not(.section--interactive)[data-has-media="true"] .section-layout{
    grid-template-columns:minmax(0,1.3fr) minmax(310px,.7fr);
    grid-template-areas:"head head" "modules media" "cta media";
}
.content-section[data-section-kind][data-variant="8"]:not(.section--interactive)[data-has-media="false"] .section-layout{
    grid-template-columns:1fr;
    grid-template-areas:"head" "modules" "cta";
}
.content-section[data-section-kind][data-variant="8"] .section-media{height:100%;align-self:stretch}
.content-section[data-section-kind][data-variant="8"] .section-image{min-height:520px}
.content-section[data-section-kind][data-variant="8"] .section-modules{grid-template-columns:repeat(2,minmax(0,1fr))}
.content-section[data-section-kind][data-variant="8"] .module-card.is-selected{background:var(--brand);color:var(--ink)}
.content-section[data-section-kind][data-variant="8"] .module-card.is-selected p{color:#3b3118}
.content-section[data-section-kind][data-variant="8"] .section-explorer{position:sticky;top:118px;grid-template-columns:1fr}
.content-section[data-section-kind][data-variant="8"] .section-explorer__copy{border-left:0;border-top:1px solid var(--surface-line);padding:18px 0 0}

/* V9 — media horizon */
.content-section[data-section-kind][data-variant="9"][data-has-media="true"] .section-layout{
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    grid-template-areas:"head modules" "explorer modules" "cta modules" "media media";
}
.content-section[data-section-kind][data-variant="9"][data-has-media="false"].section--interactive .section-layout{
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    grid-template-areas:"head modules" "explorer modules" "cta modules";
}
.content-section[data-section-kind][data-variant="9"][data-has-media="false"]:not(.section--interactive) .section-layout{
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    grid-template-areas:"head modules" "cta modules";
}
.content-section[data-section-kind][data-variant="9"] .section-media{
    width:100vw;max-width:none;margin-left:calc((100vw - min(100vw,var(--container)))/-2 - var(--side-pad));height:390px;clip-path:none;
}
.content-section[data-section-kind][data-variant="9"] .section-image{min-height:390px}
.content-section[data-section-kind][data-variant="9"] .section-modules{grid-template-columns:repeat(2,minmax(0,1fr))}
.content-section[data-section-kind][data-variant="9"] .section-cta{align-items:flex-start;flex-direction:column}

/* V10 — compact technical dossier */
.content-section[data-section-kind][data-variant="10"][data-has-media="true"] .section-layout{
    grid-template-columns:minmax(0,1fr) 240px;
    grid-template-areas:"head media" "modules modules" "explorer explorer" "cta cta";
}
.content-section[data-section-kind][data-variant="10"][data-has-media="false"] .section-layout{
    grid-template-columns:minmax(250px,.6fr) minmax(0,1.4fr);
    grid-template-areas:"head modules" "explorer modules" "cta modules";
}
.content-section[data-section-kind][data-variant="10"][data-has-media="false"]:not(.section--interactive) .section-layout{
    grid-template-areas:"head modules" "cta modules";
}
.content-section[data-section-kind][data-variant="10"] .section-media{height:220px;box-shadow:none;clip-path:none}
.content-section[data-section-kind][data-variant="10"] .section-image{min-height:220px}
.content-section[data-section-kind][data-variant="10"] .section-modules{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:1px solid var(--surface-line)}
.content-section[data-section-kind][data-variant="10"] .module-card{background:transparent;border:0;border-bottom:1px solid var(--surface-line)}
.content-section[data-section-kind][data-variant="10"] .module-body{display:grid;grid-template-columns:54px minmax(0,1fr);column-gap:18px}
.content-section[data-section-kind][data-variant="10"] .module-icon,
.content-section[data-section-kind][data-variant="10"] .module-meta{grid-row:1/4}
.content-section[data-section-kind][data-variant="10"] .section-cta{align-items:flex-start;flex-direction:column;border:0;padding:24px}

/* =========================================================
   Dedicated About systems — ten independent compositions
   ========================================================= */
.section--about[data-variant="1"] .section-layout{
    grid-template-columns:repeat(12,minmax(0,1fr));grid-template-areas:none;
}
.section--about[data-variant="1"] .section-media{grid-column:1/13;grid-row:1;height:510px;clip-path:none}
.section--about[data-variant="1"] .section-image{min-height:510px}
.section--about[data-variant="1"] .section-heading{grid-column:1/8;grid-row:1;z-index:2;align-self:end;margin:0 0 28px 28px;padding:26px;background:rgba(23,24,23,.9);color:var(--paper)}
.section--about[data-variant="1"] .section-heading .section-lead{color:#d6d7d1}
.section--about[data-variant="1"] .section-modules{grid-column:1/13;grid-row:2;grid-template-columns:repeat(3,1fr)}
.section--about[data-variant="1"] .section-cta{grid-column:1/13;grid-row:3}

.section--about[data-variant="2"] .section-layout{grid-template-columns:minmax(0,1fr) minmax(390px,.75fr);grid-template-areas:"head media" "modules media" "cta media"}
.section--about[data-variant="2"] .section-heading{position:static}
.section--about[data-variant="2"] .section-modules{grid-template-columns:1fr}
.section--about[data-variant="2"] .module-card{grid-template-columns:72px 1fr}
.section--about[data-variant="2"] .section-media{height:100%}
.section--about[data-variant="2"] .section-image{min-height:700px}

.section--about[data-variant="3"] .section-layout{min-height:610px;grid-template-areas:"head" "modules" "cta"}
.section--about[data-variant="3"] .section-heading{max-width:720px}
.section--about[data-variant="3"] .section-modules{align-self:end;grid-template-columns:repeat(3,1fr)}
.section--about[data-variant="3"] .module-card{background:rgba(23,24,23,.66)}

.section--about[data-variant="4"] .section-layout{grid-template-columns:280px minmax(0,1fr);grid-template-areas:"head modules" "media modules" "cta modules"}
.section--about[data-variant="4"] .section-modules{display:flex}
.section--about[data-variant="4"] .module-card{flex:0 0 360px;min-height:360px}
.section--about[data-variant="4"] .module-meta::before{content:"Verbindung ";color:var(--surface-muted)}

.section--about[data-variant="5"] .section-heading{grid-column:7/13;grid-row:1}
.section--about[data-variant="5"] .section-media{grid-column:1/7;grid-row:1/4}
.section--about[data-variant="5"] .section-modules{grid-column:5/13;grid-row:2;grid-template-columns:repeat(3,1fr);z-index:2}
.section--about[data-variant="5"] .module-card:nth-child(1){transform:translateY(38px)}
.section--about[data-variant="5"] .module-card:nth-child(2){transform:translateY(0)}
.section--about[data-variant="5"] .module-card:nth-child(3){transform:translateY(-38px)}
.section--about[data-variant="5"] .section-cta{grid-column:7/13;grid-row:3}

.section--about[data-variant="6"] .section-layout{grid-template-columns:150px minmax(0,1fr) 280px;grid-template-areas:"head modules media" "head modules cta"}
.section--about[data-variant="6"] .section-heading{position:static;border-left:0;border-top:7px solid var(--brand);padding:20px 0 0}
.section--about[data-variant="6"] .section-heading h2{writing-mode:vertical-rl;transform:rotate(180deg);margin-inline:auto}
.section--about[data-variant="6"] .section-heading .section-lead{margin-top:24px}
.section--about[data-variant="6"] .section-modules{grid-template-columns:1fr}
.section--about[data-variant="6"] .section-media{height:290px}
.section--about[data-variant="6"] .section-cta{position:static}

.section--about[data-variant="7"] .section-media{width:min(720px,100%);height:440px}
.section--about[data-variant="7"] .section-modules{overflow:visible;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.section--about[data-variant="7"] .section-modules::before{top:-24px;left:18%;right:18%}
.section--about[data-variant="7"] .module-card{max-width:none;transform:none;padding-top:34px;border:1px solid var(--surface-line);background:var(--surface-bg)}
.section--about[data-variant="7"] .module-card::before{top:-33px}

.section--about[data-variant="8"] .section-layout{grid-template-columns:minmax(0,1fr) minmax(360px,.7fr);grid-template-areas:"head head" "media modules" "media cta"}
.section--about[data-variant="8"] .section-media{height:100%}
.section--about[data-variant="8"] .section-modules{grid-template-columns:1fr}
.section--about[data-variant="8"] .module-card{border-left:7px solid transparent}
.section--about[data-variant="8"] .module-card:hover{border-left-color:var(--brand);transform:translateX(8px)}

.section--about[data-variant="9"] .section-layout{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);grid-template-areas:"head modules" "cta modules" "media media"}
.section--about[data-variant="9"] .section-modules{grid-template-columns:1fr}
.section--about[data-variant="9"] .module-card{display:grid;grid-template-columns:70px 1fr}
.section--about[data-variant="9"] .section-media{height:420px}

.section--about[data-variant="10"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "media" "modules" "cta"}
.section--about[data-variant="10"] .section-heading{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:end;max-width:none}
.section--about[data-variant="10"] .section-heading h2{font-size:var(--type-section-title);margin:0}
.section--about[data-variant="10"] .section-media{width:250px;height:160px;justify-self:end}
.section--about[data-variant="10"] .section-image{min-height:160px}
.section--about[data-variant="10"] .section-modules{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;border:0}
.section--about[data-variant="10"] .module-card{flex:1 0 300px;scroll-snap-align:start;border:1px solid var(--surface-line)}

/* Full company story and values use their own narrative signatures. */
.section--about-full[data-variant="1"] .module-card,.section--values[data-variant="1"] .module-card{text-align:center}
.section--about-full[data-variant="2"] .module-card h3{font-size:var(--type-card-title)}
.section--about-full[data-variant="3"] .section-media{opacity:.42}
.section--about-full[data-variant="4"] .module-card{flex-basis:380px}
.section--about-full[data-variant="5"] .module-card:nth-child(even){transform:translateY(42px)}
.section--about-full[data-variant="6"] .module-meta,.section--about-full[data-variant="6"] .module-icon{background:transparent;color:var(--brand)}
.section--about-full[data-variant="7"] .module-card{max-width:300px}
.section--about-full[data-variant="8"] .module-card:first-child{grid-column:1/-1}
.section--about-full[data-variant="9"] .section-heading{border-top:7px solid var(--brand);padding-top:22px}
.section--about-full[data-variant="10"] .module-card h3{font-size:var(--type-card-title)}
.section--values[data-variant="1"] .module-icon{margin-inline:auto}
.section--values[data-variant="2"] .module-card{grid-template-columns:64px 1fr}
.section--values[data-variant="3"] .module-card{background:rgba(23,24,23,.78)}
.section--values[data-variant="4"] .module-card{flex-basis:340px}
.section--values[data-variant="5"] .module-card:nth-child(odd){transform:translateY(28px)}
.section--values[data-variant="6"] .module-card{counter-increment:value}.section--values[data-variant="6"] .module-card::after{content:"0" counter(value);position:absolute;right:18px;top:15px;color:var(--brand);font:700 13px Sora,sans-serif}
.section--values[data-variant="7"] .module-card{max-width:280px}
.section--values[data-variant="8"] .module-card.is-selected{background:var(--brand)}
.section--values[data-variant="9"] .module-card{border-left:6px solid var(--brand)}
.section--values[data-variant="10"] .module-body{grid-template-columns:54px 1fr}

/* =========================================================
   Dedicated interaction systems
   ========================================================= */
.section--process[data-variant] .module-select{right:12px;top:12px}
.section--process[data-variant="1"] .section-modules{grid-template-columns:repeat(5,1fr);position:relative}
.section--process[data-variant="1"] .section-modules::before{content:"";position:absolute;left:7%;right:7%;top:54px;height:3px;background:var(--ink)}
.section--process[data-variant="1"] .module-card{padding-top:28px}
.section--process[data-variant="2"] .section-modules{grid-template-columns:1fr}
.section--process[data-variant="2"] .module-card{grid-template-columns:90px 1fr}
.section--process[data-variant="3"] .section-modules{grid-template-columns:repeat(5,1fr)}
.section--process[data-variant="3"] .module-card{background:rgba(23,24,23,.8)}
.section--process[data-variant="4"] .module-card{flex-basis:300px}
.section--process[data-variant="5"] .module-card:first-child{grid-column:span 2}
.section--process[data-variant="6"] .module-card{display:block}
.section--process[data-variant="7"] .module-card{max-width:250px}
.section--process[data-variant="8"] .section-modules{grid-template-columns:repeat(5,1fr)}
.section--process[data-variant="8"] .module-card:not(.is-selected){opacity:.58}
.section--process[data-variant="9"] .section-modules{grid-template-columns:1fr}
.section--process[data-variant="9"] .module-card{border-left:8px solid var(--brand)}
.section--process[data-variant="10"] .section-modules{grid-template-columns:1fr}
.section--process[data-variant="10"] .module-body{grid-template-columns:80px 1fr}

.section--reviews[data-variant] .section-modules{scrollbar-width:none}
.section--reviews[data-variant="1"] .section-modules{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}
.section--reviews[data-variant="1"] .module-card{flex:0 0 420px}
.section--reviews[data-variant="2"] .section-modules{display:grid;grid-template-columns:1fr}
.section--reviews[data-variant="2"] .module-card{display:grid;grid-template-columns:180px 1fr}
.section--reviews[data-variant="3"] .section-modules{display:flex;overflow-x:auto}
.section--reviews[data-variant="3"] .module-card{flex:0 0 460px;background:rgba(23,24,23,.82)}
.section--reviews[data-variant="4"] .module-card{flex-basis:360px}
.section--reviews[data-variant="5"] .section-modules{grid-template-columns:repeat(4,1fr)}
.section--reviews[data-variant="5"] .module-card:nth-child(n+9){display:none}
.section--reviews[data-variant="6"] .section-modules{grid-template-columns:1fr}
.section--reviews[data-variant="6"] .module-card{display:block}
.section--reviews[data-variant="7"] .module-card{max-width:360px}
.section--reviews[data-variant="8"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--reviews[data-variant="8"] .module-card:not(.is-selected){opacity:.52}
.section--reviews[data-variant="9"] .section-modules{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}
.section--reviews[data-variant="9"] .module-card{flex:0 0 520px}
.section--reviews[data-variant="10"] .section-modules{grid-template-columns:1fr}
.section--reviews[data-variant="10"] .module-body{grid-template-columns:64px 1fr}

.section--reference-teaser[data-variant="1"] .section-modules{grid-template-columns:repeat(4,1fr)}
.section--reference-teaser[data-variant="2"] .section-modules{grid-template-columns:1fr}
.section--reference-teaser[data-variant="3"] .module-card{background:rgba(23,24,23,.76)}
.section--reference-teaser[data-variant="4"] .module-card{flex-basis:390px}
.section--reference-teaser[data-variant="5"] .module-card:first-child{grid-column:span 2;grid-row:span 2}
.section--reference-teaser[data-variant="6"] .module-card{display:grid;grid-template-columns:180px 1fr}
.section--reference-teaser[data-variant="7"] .module-card{max-width:330px}
.section--reference-teaser[data-variant="8"] .module-card:not(.is-selected){opacity:.62}
.section--reference-teaser[data-variant="9"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--reference-teaser[data-variant="10"] .section-modules{grid-template-columns:repeat(2,1fr)}

.section--other-services[data-variant="1"] .module-card{border-top:6px solid var(--brand)}
.section--other-services[data-variant="2"] .module-card{grid-template-columns:170px 1fr}
.section--other-services[data-variant="3"] .module-card{background:rgba(23,24,23,.78)}
.section--other-services[data-variant="4"] .module-card{flex-basis:380px}
.section--other-services[data-variant="5"] .module-card:first-child{grid-column:span 2}
.section--other-services[data-variant="6"] .module-card{display:grid;grid-template-columns:70px 1fr}
.section--other-services[data-variant="7"] .module-card{max-width:300px}
.section--other-services[data-variant="8"] .module-card:not(.is-selected){opacity:.55}
.section--other-services[data-variant="9"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--other-services[data-variant="10"] .section-modules{grid-template-columns:1fr}
@media (min-width:901px){
    .content-section.section--other-services[data-section-kind][data-variant="10"] .module-card{
        display:grid;
        grid-template-columns:260px minmax(0,1fr);
        align-items:stretch;
    }
    .content-section.section--other-services[data-section-kind][data-variant="10"] .module-image{
        width:260px;
        height:100%;
        min-height:240px;
    }
    .content-section.section--other-services[data-section-kind][data-variant="10"] .module-image .card-image{
        height:100%;
        min-height:240px;
    }
    .content-section.section--other-services[data-section-kind][data-variant="10"] .module-body{display:block}
}

/* =========================================================
   Partner directory — filter, selection and detail in every V
   ========================================================= */
.section--partners[data-variant] .section-layout{
    grid-template-columns:1fr;
    grid-template-areas:"head" "filters" "modules" "explorer" "cta";
}
.section--partners[data-variant] .partner-filters{grid-area:filters}
.section--partners[data-variant] .partner-grid{grid-area:modules}
.section--partners[data-variant] .partner-explorer{grid-area:explorer}
.section--partners[data-variant="1"] .partner-grid{grid-template-columns:repeat(6,1fr)}
.section--partners[data-variant="2"] .section-layout{grid-template-columns:300px minmax(0,1fr);grid-template-areas:"head filters" "head modules" "cta explorer"}
.section--partners[data-variant="2"] .section-heading{position:sticky;top:118px}
.section--partners[data-variant="2"] .partner-grid{grid-template-columns:repeat(4,1fr)}
.section--partners[data-variant="3"] .partner-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}
.section--partners[data-variant="3"] .partner-logo{flex:0 0 230px}
.section--partners[data-variant="4"] .section-layout{grid-template-columns:280px minmax(0,1fr);grid-template-areas:"head filters" "cta modules" "cta explorer"}
.section--partners[data-variant="4"] .partner-grid{display:flex;overflow-x:auto}
.section--partners[data-variant="4"] .partner-logo{flex:0 0 220px}
.section--partners[data-variant="5"] .partner-grid{grid-template-columns:repeat(8,1fr)}
.section--partners[data-variant="5"] .partner-logo:nth-child(5n+1){grid-column:span 2}
.section--partners[data-variant="6"] .section-layout{grid-template-columns:210px minmax(0,1fr) 310px;grid-template-areas:"head filters cta" "head modules cta" "head explorer cta"}
.section--partners[data-variant="6"] .partner-grid{grid-template-columns:repeat(3,1fr)}
.section--partners[data-variant="7"] .partner-grid{display:flex;flex-wrap:wrap;justify-content:center}
.section--partners[data-variant="7"] .partner-logo{width:190px;max-width:190px}
.section--partners[data-variant="8"] .section-layout{grid-template-columns:minmax(0,1.3fr) 370px;grid-template-areas:"head explorer" "filters explorer" "modules explorer" "cta explorer"}
.section--partners[data-variant="8"] .partner-grid{grid-template-columns:repeat(5,1fr)}
.section--partners[data-variant="9"] .partner-grid{grid-template-columns:repeat(6,1fr)}
.section--partners[data-variant="9"] .partner-logo{min-height:150px}
.section--partners[data-variant="10"] .section-layout{grid-template-columns:330px minmax(0,1fr);grid-template-areas:"head filters" "explorer modules" "cta modules"}
.section--partners[data-variant="10"] .partner-grid{grid-template-columns:repeat(2,1fr)}
.section--partners[data-variant="10"] .partner-logo{grid-template-columns:100px 1fr;justify-items:start;text-align:left}

/* Reference archive gets an explicit filter row instead of grid auto-placement. */
.section--reference-gallery[data-variant] .section-layout{
    grid-template-columns:1fr;
    grid-template-areas:"head" "filters" "modules" "explorer" "cta";
}
.section--reference-gallery[data-variant] .reference-filter{grid-area:filters}
.section--reference-gallery[data-variant] .reference-grid{grid-area:modules}
.section--reference-gallery[data-variant="1"] .reference-grid{grid-template-columns:repeat(3,1fr)!important}
.section--reference-gallery[data-variant="2"] .reference-grid{grid-template-columns:repeat(2,1fr)!important}
.section--reference-gallery[data-variant="3"] .reference-grid{grid-template-columns:repeat(4,1fr)!important}
.section--reference-gallery[data-variant="4"] .reference-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}
.section--reference-gallery[data-variant="4"] .reference-card{flex:0 0 380px}
.section--reference-gallery[data-variant="5"] .reference-grid{grid-template-columns:repeat(4,1fr)!important}
.section--reference-gallery[data-variant="5"] .reference-card:nth-child(7n+1){grid-column:span 2}
.section--reference-gallery[data-variant="6"] .reference-grid{grid-template-columns:1fr!important}
.section--reference-gallery[data-variant="6"] .reference-card{display:grid;grid-template-columns:240px 1fr}
.section--reference-gallery[data-variant="7"] .reference-grid{display:flex;overflow-x:auto}
.section--reference-gallery[data-variant="7"] .reference-card{flex:0 0 330px;max-width:330px}
.section--reference-gallery[data-variant="8"] .reference-grid{grid-template-columns:repeat(2,1fr)!important}
.section--reference-gallery[data-variant="8"] .reference-card:not(.is-selected){opacity:.68}
.section--reference-gallery[data-variant="9"] .reference-grid{grid-template-columns:repeat(3,1fr)!important}
.section--reference-gallery[data-variant="10"] .reference-grid{grid-template-columns:repeat(2,1fr)!important}

/* Contact teaser has ten CTA-specific silhouettes. */
.section--contact-teaser[data-variant="1"] .section-media{height:460px}
.section--contact-teaser[data-variant="1"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--contact-teaser[data-variant="2"] .section-layout{grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);grid-template-areas:"head media" "modules media" "cta media"}
.section--contact-teaser[data-variant="2"] .section-heading{position:static}
.section--contact-teaser[data-variant="2"] .section-modules{grid-template-columns:1fr}
.section--contact-teaser[data-variant="3"] .section-layout{min-height:600px}
.section--contact-teaser[data-variant="3"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--contact-teaser[data-variant="4"] .module-card{flex:0 0 360px}
.section--contact-teaser[data-variant="5"] .section-modules{grid-column:7/13;grid-row:2;grid-template-columns:1fr}
.section--contact-teaser[data-variant="5"] .section-cta{grid-column:7/13}
.section--contact-teaser[data-variant="6"] .section-modules{grid-template-columns:1fr}
.section--contact-teaser[data-variant="7"] .module-card{max-width:420px}
.section--contact-teaser[data-variant="8"] .section-modules{grid-template-columns:1fr}
.section--contact-teaser[data-variant="9"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--contact-teaser[data-variant="10"] .section-modules{grid-template-columns:1fr}

/* Card-family identities: each type retains its semantic fingerprint. */
.section--services[data-variant] .module-image{aspect-ratio:4/3}
.section--services[data-variant="1"] .module-card:nth-child(1),.section--services[data-variant="1"] .module-card:nth-child(6){grid-column:span 1}
.section--services[data-variant="2"] .module-image{width:210px}
.section--services[data-variant="3"] .module-card{background:rgba(23,24,23,.8)}
.section--services[data-variant="4"] .module-card{flex-basis:390px}
.section--services[data-variant="5"] .module-card:first-child{grid-column:span 2}
.section--services[data-variant="6"] .module-card{display:grid;grid-template-columns:180px 1fr}
.section--services[data-variant="7"] .module-card{max-width:310px}
.section--services[data-variant="8"] .module-card:first-child{grid-column:span 2}
.section--services[data-variant="9"] .section-modules{grid-template-columns:repeat(3,1fr)}
.section--services[data-variant="10"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--advantages[data-variant] .module-icon,.section--quick-benefits[data-variant] .module-icon{box-shadow:inset 0 0 0 1px rgba(23,24,23,.2)}
.section--advantages[data-variant="5"] .module-card:nth-child(odd),.section--quick-benefits[data-variant="5"] .module-card:nth-child(odd){transform:translateY(26px)}
.section--advantages[data-variant="7"] .module-card,.section--quick-benefits[data-variant="7"] .module-card{max-width:290px}
.section--advantages[data-variant="10"] .module-body,.section--quick-benefits[data-variant="10"] .module-body{grid-template-columns:60px 1fr}
.section--service-details[data-variant="1"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--service-details[data-variant="2"] .module-image{display:none}
.section--service-details[data-variant="4"] .module-card{flex-basis:420px}
.section--service-details[data-variant="5"] .module-card:nth-child(3n+1){transform:translateY(28px)}
.section--service-details[data-variant="7"] .module-card{max-width:360px}
.section--service-details[data-variant="10"] .section-modules{grid-template-columns:repeat(2,1fr)}

/* Form and legal content never reserve nonexistent media or explorer zones. */
.section--form[data-variant] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "modules"}
.section--form[data-variant="2"] .contact-form{max-width:900px;margin-left:auto;margin-right:0}
.section--form[data-variant="3"]{background:var(--ink);color:var(--paper)}
.section--form[data-variant="3"] .section-lead{color:#d0d2cc}
.section--form[data-variant="4"] .form-grid{display:flex;flex-wrap:wrap}.section--form[data-variant="4"] .form-grid>label{flex:1 1 360px}
.section--form[data-variant="5"] .contact-form{padding:34px;border:1px solid var(--surface-line)}
.section--form[data-variant="6"] .form-grid{grid-template-columns:1fr}
.section--form[data-variant="7"] .contact-form{max-width:980px}
.section--form[data-variant="8"] .form-grid{grid-template-columns:repeat(3,1fr)}.section--form[data-variant="8"] .form-wide{grid-column:1/-1}
.section--form[data-variant="9"] .contact-form{border-left:8px solid var(--brand);padding-left:34px}
.section--form[data-variant="10"] .form-grid{gap:0}.section--form[data-variant="10"] .form-grid label{padding:16px;border-bottom:1px solid var(--surface-line)}
.section--legal[data-variant] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "modules" "cta"}
.section--legal[data-variant="2"] .section-modules{grid-template-columns:1fr}
.section--legal[data-variant="3"] .module-card{background:rgba(23,24,23,.82)}
.section--legal[data-variant="4"] .module-card{flex-basis:400px}
.section--legal[data-variant="5"] .module-card:nth-child(odd){transform:translateY(24px)}
.content-section.section--legal[data-section-kind][data-variant="5"] .section-heading{grid-area:head;grid-column:1;grid-row:auto}
.content-section.section--legal[data-section-kind][data-variant="5"] .section-modules{grid-area:modules;grid-column:1;grid-row:auto;grid-template-columns:repeat(2,minmax(0,1fr))}
.content-section.section--legal[data-section-kind][data-variant="5"] .section-cta{grid-area:cta;grid-column:1;grid-row:auto}
.section--legal[data-variant="6"] .module-card{display:block}
.section--legal[data-variant="7"] .module-card{max-width:360px}
.section--legal[data-variant="8"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--legal[data-variant="9"] .section-modules{grid-template-columns:repeat(2,1fr)}
.section--legal[data-variant="10"] .section-modules{grid-template-columns:1fr}

/* =========================================================
   Ten complete footer architectures
   ========================================================= */
.site-footer[data-variant] .footer-container{
    display:grid;grid-template-columns:330px minmax(0,1fr);
    grid-template-areas:"prompt prompt" "brand links" "bottom bottom";
    gap:56px 76px;
}
.site-footer[data-variant] .footer-prompt{grid-area:prompt}
.site-footer[data-variant] .footer-brand{grid-area:brand;display:block}
.site-footer[data-variant] .footer-links{grid-area:links}
.site-footer[data-variant] .footer-bottom{grid-area:bottom}
.site-footer[data-variant="1"] .footer-prompt{border-left:8px solid var(--brand);padding-left:28px}
.site-footer[data-variant="1"] .footer-links>div{border-top:1px solid rgba(255,255,255,.18);padding-top:18px}

.site-footer[data-variant="2"] .footer-container{grid-template-columns:1fr;grid-template-areas:"prompt" "brand" "links" "bottom"}
.site-footer[data-variant="2"] .footer-prompt{margin-inline:calc(-1 * var(--side-pad));padding:34px var(--side-pad);background:var(--brand);color:var(--ink);border:0}
.site-footer[data-variant="2"] .footer-prompt .module-meta,.site-footer[data-variant="2"] .footer-prompt p{color:var(--ink)}
.site-footer[data-variant="2"] .footer-brand{display:grid;grid-template-columns:260px 1fr;gap:42px;align-items:center;border-bottom:1px solid rgba(255,255,255,.16);padding-bottom:28px}

.site-footer[data-variant="3"]{background:var(--brand);color:var(--ink)}
.site-footer[data-variant="3"] .footer-container{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-areas:"brand prompt" "brand links" "bottom bottom"}
.site-footer[data-variant="3"] .footer-prompt{grid-template-columns:1fr;grid-template-areas:"tag" "title" "text" "action";border:1px solid rgba(23,24,23,.25);padding:30px}
.site-footer[data-variant="3"] .footer-brand{align-self:stretch;padding:32px;background:var(--ink);color:var(--paper)}
.site-footer[data-variant="3"] .footer-brand img{filter:none}
.site-footer[data-variant="3"] .footer-brand p{color:#d2d4ce}
.site-footer[data-variant="3"] .footer-links a,.site-footer[data-variant="3"] .footer-links span,.site-footer[data-variant="3"] .footer-bottom,.site-footer[data-variant="3"] .footer-prompt p{color:#332b18}
.site-footer[data-variant="3"] .footer-links h2,.site-footer[data-variant="3"] .footer-prompt .module-meta{color:var(--ink)}

.site-footer[data-variant="4"] .footer-container{grid-template-columns:260px minmax(0,1fr);grid-template-areas:"brand prompt" "brand links" "brand bottom"}
.site-footer[data-variant="4"] .footer-brand{border-right:1px solid rgba(255,255,255,.18);padding-right:32px}
.site-footer[data-variant="4"] .footer-prompt{grid-template-columns:1fr auto;grid-template-areas:"tag action" "title action" "text action";border:0;border-bottom:1px solid rgba(255,255,255,.16);padding-bottom:28px}
.site-footer[data-variant="4"] .footer-links>div{border-top:5px solid var(--brand);padding-top:20px}

.site-footer[data-variant="5"] .footer-container{grid-template-columns:1fr;grid-template-areas:"prompt" "brand" "links" "bottom";text-align:center}
.site-footer[data-variant="5"] .footer-prompt{grid-template-columns:1fr;grid-template-areas:"tag" "title" "text" "action";justify-items:center;max-width:900px;margin-inline:auto;border:0}
.site-footer[data-variant="5"] .footer-brand img{margin-inline:auto}
.site-footer[data-variant="5"] .footer-brand p{max-width:720px;margin-inline:auto}
.site-footer[data-variant="5"] .footer-links>div{align-items:center}

.site-footer[data-variant="6"] .footer-container{grid-template-columns:minmax(0,1fr) 320px;grid-template-areas:"links prompt" "links brand" "bottom bottom"}
.site-footer[data-variant="6"] .footer-links{order:0;grid-template-columns:repeat(3,1fr);padding:28px;border:1px solid rgba(255,255,255,.16)}
.site-footer[data-variant="6"] .footer-prompt{grid-template-columns:1fr;grid-template-areas:"tag" "title" "text" "action";border:0;padding:0}
.site-footer[data-variant="6"] .footer-brand{display:block;border-top:1px solid rgba(255,255,255,.16);padding-top:24px}

.site-footer[data-variant="7"]{clip-path:none;padding-top:120px}
.site-footer[data-variant="7"]::after{content:"";position:absolute;left:0;right:0;top:0;height:46px;background:repeating-linear-gradient(90deg,var(--brand) 0 70px,var(--ink) 70px 84px)}
.site-footer[data-variant="7"] .footer-container{grid-template-columns:repeat(3,1fr);grid-template-areas:"prompt prompt brand" "links links brand" "bottom bottom bottom"}
.site-footer[data-variant="7"] .footer-prompt{grid-template-columns:1fr auto;grid-template-areas:"tag action" "title action" "text action";padding:28px;border:1px solid rgba(255,255,255,.16)}
.site-footer[data-variant="7"] .footer-brand{padding:28px;border:1px solid rgba(255,255,255,.16)}
.site-footer[data-variant="7"] .footer-links>div{padding:22px;border:1px solid rgba(255,255,255,.14)}

.site-footer[data-variant="8"] .footer-container{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"prompt brand" "links brand" "bottom bottom"}
.site-footer[data-variant="8"] .footer-prompt{grid-template-columns:1fr;grid-template-areas:"tag" "title" "text" "action";padding-right:50px;border:0}
.site-footer[data-variant="8"] .footer-brand{align-self:stretch;display:grid;align-content:end;padding:40px;background:rgba(255,255,255,.05);border-left:8px solid var(--brand)}
.site-footer[data-variant="8"] .footer-links{grid-template-columns:1fr}
.site-footer[data-variant="8"] .footer-links>div{display:grid;grid-template-columns:170px repeat(2,minmax(0,1fr));padding:15px 0;border-bottom:1px solid rgba(255,255,255,.15)}
.site-footer[data-variant="8"] .footer-links h2{grid-row:1/5}

.site-footer[data-variant="9"]{padding-top:54px}
.site-footer[data-variant="9"] .footer-container{grid-template-columns:260px minmax(0,1fr);grid-template-areas:"brand prompt" "links links" "bottom bottom"}
.site-footer[data-variant="9"] .footer-brand{display:block}
.site-footer[data-variant="9"] .footer-prompt{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"tag action" "title action" "text action";padding-bottom:25px}
.site-footer[data-variant="9"] .footer-links{grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.16);padding-top:28px}

.site-footer[data-variant="10"]::before{background:linear-gradient(90deg,var(--brand) 0 33%,var(--ink) 33%)}
.site-footer[data-variant="10"] .footer-container{grid-template-columns:32% minmax(0,1fr);grid-template-areas:"brand prompt" "brand links" "bottom bottom"}
.site-footer[data-variant="10"] .footer-brand{color:var(--ink);padding-right:62px}
.site-footer[data-variant="10"] .footer-brand img{filter:brightness(0)}
.site-footer[data-variant="10"] .footer-brand p{color:var(--ink)}
.site-footer[data-variant="10"] .footer-prompt{grid-template-columns:1fr auto;grid-template-areas:"tag action" "title action" "text action";padding-left:34px}
.site-footer[data-variant="10"] .footer-links{padding-left:34px}

/* =========================================================
   Fixed production component signatures
   ========================================================= */
.site-header .brand{transition:background .28s ease,transform .28s ease,border-color .28s ease}
.site-header .brand:hover{transform:translateY(-2px)}
.nav-link>span{display:inline-block;transition:transform .26s ease,letter-spacing .26s ease}
.nav-link:hover{transform:translateY(-2px)}

.submenu-links>a{position:relative;overflow:hidden;isolation:isolate}
.submenu-links>a::before{
    content:"";
    position:absolute;
    z-index:-1;
    inset:4px;
    background:var(--brand);
    transform:scaleX(.08);
    transform-origin:right;
    opacity:.16;
    transition:transform .3s cubic-bezier(.2,.8,.2,1);
}
.submenu-links>a:hover::before,.submenu-links>a:focus-visible::before{transform:scaleX(1)}
.submenu-icon,.btn__icon{border-radius:0!important;clip-path:none!important}

/* Fixed title 15 and body 17 relationships */
.hero h1,.content-section h1,.content-section h2{position:relative}
.section-heading h1,.section-heading h2{padding-bottom:14px;border-bottom:7px solid var(--brand)}
.section-lead{max-width:780px;padding-left:20px;border-left:5px solid var(--brand)}

/* =========================================================
   Content-aware responsive translations
   ========================================================= */
@media (max-width:1100px){
    .content-section[data-section-kind][data-item-count="4"] .section-modules,
    .content-section[data-section-kind][data-item-count="5"] .section-modules,
    .content-section[data-section-kind][data-item-count="6"] .section-modules{grid-template-columns:repeat(2,minmax(0,1fr))}
    .content-section[data-section-kind][data-variant="5"] .section-modules{grid-column:1/13}
    .content-section[data-section-kind][data-variant="6"] .section-layout{grid-template-columns:190px minmax(0,1fr);grid-template-areas:"head media" "head modules" "cta explorer"}
    .content-section[data-section-kind][data-variant="6"][data-has-media="false"] .section-layout{grid-template-areas:"head modules" "cta explorer"}
    .content-section[data-section-kind][data-variant="6"]:not(.section--interactive)[data-has-media="false"] .section-layout{grid-template-areas:"head modules" "cta modules"}
    .content-section[data-section-kind][data-variant="6"] .section-cta{position:static}
    .section--about[data-variant="6"] .section-layout{grid-template-columns:140px minmax(0,1fr);grid-template-areas:"head modules" "media modules" "cta modules"}
    .section--partners[data-variant="1"] .partner-grid,.section--partners[data-variant="9"] .partner-grid{grid-template-columns:repeat(4,1fr)}
    .section--partners[data-variant="5"] .partner-grid{grid-template-columns:repeat(5,1fr)}
    .section--process[data-variant="1"] .section-modules,.section--process[data-variant="3"] .section-modules,.section--process[data-variant="8"] .section-modules{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}
    .section--process[data-variant="1"] .module-card,.section--process[data-variant="3"] .module-card,.section--process[data-variant="8"] .module-card{flex:0 0 260px}
    .section--reviews[data-variant="5"] .section-modules{grid-template-columns:repeat(3,1fr)}
    .section--reference-gallery[data-variant="3"] .reference-grid,.section--reference-gallery[data-variant="5"] .reference-grid{grid-template-columns:repeat(3,1fr)!important}
}

@media (max-width:900px){
    .content-section[data-section-kind] .section-layout,
    .section--partners[data-variant] .section-layout,
    .section--reference-gallery[data-variant] .section-layout,
    .section--form[data-variant] .section-layout,
    .section--legal[data-variant] .section-layout{
        display:flex!important;flex-direction:column;gap:36px;
    }
    .content-section[data-section-kind] .section-layout>.section-heading{order:1;width:100%}
    .content-section[data-section-kind] .section-layout>.section-media{order:2;width:100%}
    .content-section[data-section-kind] .section-layout>.partner-filters,
    .content-section[data-section-kind] .section-layout>.reference-filter{order:3;width:100%}
    .content-section[data-section-kind] .section-layout>.section-modules,
    .content-section[data-section-kind] .section-layout>.partner-grid,
    .content-section[data-section-kind] .section-layout>.contact-form{order:4;width:100%}
    .content-section[data-section-kind] .section-layout>.section-explorer{order:5;width:100%}
    .content-section[data-section-kind] .section-layout>.section-cta{order:6;width:100%}
    .content-section[data-section-kind][data-variant="2"] .section-layout>.section-modules{order:2}
    .content-section[data-section-kind][data-variant="2"] .section-layout>.section-media{order:3}
    .content-section[data-section-kind][data-variant="8"] .section-layout>.section-explorer{order:2}
    .content-section[data-section-kind][data-variant="8"] .section-layout>.section-media{order:3}
    .content-section[data-section-kind][data-variant="8"] .section-layout>.section-modules{order:4}
    .content-section[data-section-kind][data-variant="9"] .section-layout>.section-modules{order:2}
    .content-section[data-section-kind][data-variant="9"] .section-layout>.section-explorer{order:3}
    .content-section[data-section-kind][data-variant="9"] .section-layout>.section-media{order:4}
    .content-section[data-section-kind][data-variant="2"] .section-heading,
    .content-section[data-section-kind][data-variant="6"] .section-cta,
    .content-section[data-section-kind][data-variant="8"] .section-explorer{position:relative;top:auto}
    .content-section[data-section-kind][data-variant="3"][data-has-media="true"] .section-layout>.section-media{position:absolute;inset:0;order:0;width:100%;height:100%}
    .content-section[data-section-kind][data-variant="5"] .section-heading,
    .content-section[data-section-kind][data-variant="5"] .section-media,
    .content-section[data-section-kind][data-variant="5"] .section-modules,
    .content-section[data-section-kind][data-variant="5"] .section-explorer,
    .content-section[data-section-kind][data-variant="5"] .section-cta{grid-column:auto;grid-row:auto}
    .content-section[data-section-kind][data-variant="5"] .module-card:nth-child(n){transform:none}
    .content-section[data-section-kind][data-variant="6"] .section-heading{border-left:7px solid var(--brand);padding-left:22px}
    .content-section[data-section-kind][data-variant="7"] .section-modules{justify-content:flex-start}
    .content-section[data-section-kind][data-variant="9"] .section-media{margin-left:calc(-1 * var(--side-pad));width:calc(100% + (2 * var(--side-pad)))}
    .section--about[data-variant="1"] .section-heading{position:relative;align-self:auto;margin:0;padding:24px;background:var(--ink);color:var(--paper)}
    .section--about[data-variant="1"] .section-media{height:430px}
    .section--about[data-variant="1"] .section-image{min-height:430px}
    .section--about[data-variant="6"] .section-heading h2{writing-mode:horizontal-tb;transform:none}
    .section--about[data-variant="10"] .section-heading{display:block}
    .section--about[data-variant="10"] .section-heading h2{margin-bottom:20px}
    .section--partners[data-variant="2"] .section-heading{position:relative;top:auto}
    .section--partners[data-variant] .partner-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
    .section--reference-gallery[data-variant] .reference-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .section--reference-gallery[data-variant="4"] .reference-grid,.section--reference-gallery[data-variant="7"] .reference-grid{display:flex}
    .section--form[data-variant="8"] .form-grid{grid-template-columns:repeat(2,1fr)}
    .site-footer[data-variant] .footer-container{
        grid-template-columns:1fr!important;
        grid-template-areas:"prompt" "brand" "links" "bottom"!important;
    }
    .site-footer[data-variant] .footer-prompt{grid-template-columns:1fr auto;grid-template-areas:"tag action" "title action" "text text";padding:28px}
    .site-footer[data-variant] .footer-brand{padding:0;border:0;background:transparent;color:inherit}
    .site-footer[data-variant] .footer-links{padding:0}
    .site-footer[data-variant="3"] .footer-brand p,.site-footer[data-variant="10"] .footer-brand p{color:inherit}
    .site-footer[data-variant="3"] .footer-brand img,.site-footer[data-variant="10"] .footer-brand img{filter:none}
    .site-footer[data-variant="10"]::before{background:linear-gradient(180deg,var(--brand) 0 290px,var(--ink) 290px)}
    .submenu-links>a{border-radius:var(--radius-ui)!important;flex-basis:330px!important}
}

@media (max-width:680px){
    .content-section[data-section-kind]{padding:var(--section-space-y) 0}
    .content-section[data-section-kind] .section-layout{gap:30px}
    .content-section[data-section-kind] .section-heading,
    .content-section[data-section-kind] .section-heading h1,
    .content-section[data-section-kind] .section-heading h2,
    .content-section[data-section-kind] .section-heading .section-lead,
    .content-section[data-section-kind] .section-cta,
    .content-section[data-section-kind] .section-cta p{text-align:center;margin-inline:auto}
    .content-section[data-section-kind] .section-cta{align-items:stretch}
    .content-section[data-section-kind] .section-cta>.btn{width:100%;min-height:52px;font-size:var(--type-action)}
    .content-section[data-section-kind] .section-modules{grid-template-columns:1fr!important}
    .content-section[data-section-kind][data-variant="4"] .section-modules,
    .content-section[data-section-kind][data-variant="7"] .section-modules,
    .section--process[data-variant="1"] .section-modules,
    .section--process[data-variant="3"] .section-modules,
    .section--process[data-variant="8"] .section-modules,
    .section--reviews[data-variant="1"] .section-modules,
    .section--reviews[data-variant="3"] .section-modules,
    .section--reviews[data-variant="9"] .section-modules,
    .section--reference-gallery[data-variant="4"] .reference-grid,
    .section--reference-gallery[data-variant="7"] .reference-grid{
        display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;
    }
    .content-section[data-section-kind][data-variant="4"] .module-card,
    .content-section[data-section-kind][data-variant="7"] .module-card,
    .section--process[data-variant="1"] .module-card,
    .section--process[data-variant="3"] .module-card,
    .section--process[data-variant="8"] .module-card,
    .section--reviews[data-variant="1"] .module-card,
    .section--reviews[data-variant="3"] .module-card,
    .section--reviews[data-variant="9"] .module-card{
        flex:0 0 84vw;max-width:84vw;scroll-snap-align:start;
    }
    .content-section[data-section-kind][data-variant="2"] .module-card,
    .content-section[data-section-kind][data-variant="6"] .module-card,
    .section--reference-gallery[data-variant="6"] .reference-card,
    .section--services[data-variant="6"] .module-card{display:block}
    .content-section[data-section-kind][data-variant="2"] .module-image,
    .section--services[data-variant="2"] .module-image{width:100%;border-right:0}
    .content-section[data-section-kind][data-variant="6"] .module-body,
    .content-section[data-section-kind][data-variant="10"] .module-body{display:block}
    .content-section[data-section-kind][data-variant="9"] .section-media{height:300px}
    .content-section[data-section-kind][data-variant="9"] .section-image{min-height:300px}
    .section--about[data-variant="1"] .section-modules,.section--about[data-variant="7"] .section-modules{grid-template-columns:1fr}
    .section--about[data-variant="1"] .section-heading{padding:20px}
    .section--about[data-variant="6"] .section-heading{border-left:0;border-top:7px solid var(--brand);padding-left:0}
    .section--partners[data-variant] .partner-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .section--partners[data-variant="3"] .partner-grid,.section--partners[data-variant="4"] .partner-grid,.section--partners[data-variant="7"] .partner-grid{display:flex;flex-wrap:nowrap;overflow-x:auto}
    .section--partners[data-variant="3"] .partner-logo,.section--partners[data-variant="4"] .partner-logo,.section--partners[data-variant="7"] .partner-logo{flex:0 0 190px;width:190px}
    .section--partners[data-variant="10"] .partner-logo{display:grid;grid-template-columns:1fr;justify-items:center;text-align:center}
    .section--reference-gallery[data-variant] .reference-grid{grid-template-columns:1fr!important}
    .section--reference-gallery[data-variant="4"] .reference-card,.section--reference-gallery[data-variant="7"] .reference-card{flex:0 0 84vw;max-width:84vw}
    .section--form[data-variant] .form-grid{grid-template-columns:1fr}
    .section--form[data-variant="4"] .form-grid{display:grid}
    .section--form[data-variant="5"] .contact-form{padding:18px}
    .site-footer[data-variant] .footer-container{gap:38px}
    .site-footer[data-variant] .footer-prompt{grid-template-columns:1fr;grid-template-areas:"tag" "title" "text" "action";text-align:center;padding:24px 0}
    .site-footer[data-variant] .footer-prompt .btn{width:100%;min-height:56px;font-size:16px}
    .site-footer[data-variant] .footer-brand{text-align:center}
    .site-footer[data-variant] .footer-brand img{margin-inline:auto}
    .site-footer[data-variant] .footer-links,.site-footer[data-variant="8"] .footer-links{grid-template-columns:1fr!important}
    .site-footer[data-variant] .footer-links>div,.site-footer[data-variant="8"] .footer-links>div{display:flex;align-items:center;text-align:center}
    .site-footer[data-variant="10"]::before{background:var(--ink)}
    .section-heading h1,.section-heading h2{border-left:0;border-right:0;text-indent:0}
    .section-lead{border-left:0;text-align:center;padding-left:0;margin-inline:auto}
}

@media (max-width:480px){
    .hero h1{font-size:32px}
    .brand-logo{width:150px!important;height:56px!important}
    .content-section .section-heading h2,.content-section .section-h1{font-size:var(--type-section-title)}
    .content-section[data-section-kind] .section-media,.section--about[data-variant="1"] .section-media{height:300px}
    .content-section[data-section-kind] .section-image,.section--about[data-variant="1"] .section-image{min-height:300px}
    .section--partners[data-variant] .partner-grid{grid-template-columns:1fr}
    .partner-logo{min-height:112px}
}

.submenu-icon,.btn__icon{
    border-radius:0!important;
    clip-path:none!important;
}
.content-section[data-section-kind] .section-media{display:block!important}

/* High-specificity semantic zone plans override the legacy generic pool. */
.content-section.section--about[data-section-kind][data-variant="1"] .section-layout{grid-template-columns:repeat(12,minmax(0,1fr));grid-template-areas:none}
.content-section.section--about[data-section-kind][data-variant="1"] .section-media{grid-column:1/13;grid-row:1}
.content-section.section--about[data-section-kind][data-variant="1"] .section-heading{grid-column:1/8;grid-row:1}
.content-section.section--about[data-section-kind][data-variant="1"] .section-modules{grid-column:1/13;grid-row:2;grid-template-columns:repeat(3,1fr)}
.content-section.section--about[data-section-kind][data-variant="1"] .section-cta{grid-column:1/13;grid-row:3}
.content-section.section--about[data-section-kind][data-variant="2"] .section-layout{grid-template-columns:minmax(0,1fr) minmax(390px,.75fr);grid-template-areas:"head media" "modules media" "cta media"}
.content-section.section--about[data-section-kind][data-variant="2"] .section-heading{position:relative;top:auto}
.content-section.section--about[data-section-kind][data-variant="2"] .section-modules{grid-template-columns:1fr}
.content-section.section--about[data-section-kind][data-variant="3"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "modules" "cta"}
.content-section.section--about[data-section-kind][data-variant="3"] .section-modules{grid-template-columns:repeat(3,1fr)}
.content-section.section--about[data-section-kind][data-variant="4"] .section-layout{grid-template-columns:280px minmax(0,1fr);grid-template-areas:"head modules" "media modules" "cta modules"}
.content-section.section--about[data-section-kind][data-variant="5"] .section-heading{grid-column:7/13;grid-row:1}
.content-section.section--about[data-section-kind][data-variant="5"] .section-media{grid-column:1/7;grid-row:1/4}
.content-section.section--about[data-section-kind][data-variant="5"] .section-modules{grid-column:5/13;grid-row:2;grid-template-columns:repeat(3,1fr)}
.content-section.section--about[data-section-kind][data-variant="5"] .section-cta{grid-column:7/13;grid-row:3}
.content-section.section--about[data-section-kind][data-variant="6"] .section-layout{grid-template-columns:150px minmax(0,1fr) 280px;grid-template-areas:"head modules media" "head modules cta"}
.content-section.section--about[data-section-kind][data-variant="6"] .section-heading{writing-mode:horizontal-tb;transform:none}
.content-section.section--about[data-section-kind][data-variant="6"] .section-modules{align-self:stretch;grid-template-rows:repeat(3,minmax(0,1fr))}
.content-section.section--about[data-section-kind][data-variant="6"] .module-card{display:flex;align-items:center}
.content-section.section--about[data-section-kind][data-variant="6"] .section-media{height:290px}
.content-section.section--about[data-section-kind][data-variant="6"] .section-cta{position:relative;top:auto}
.content-section.section--about[data-section-kind][data-variant="7"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "media" "modules" "cta"}
.content-section.section--about[data-section-kind][data-variant="7"] .section-modules{display:grid;grid-template-columns:repeat(3,1fr)}
.content-section.section--about[data-section-kind][data-variant="8"] .section-layout{grid-template-columns:minmax(0,1fr) minmax(360px,.7fr);grid-template-areas:"head head" "media modules" "media cta"}
.content-section.section--about[data-section-kind][data-variant="8"] .section-modules{grid-template-columns:1fr}
.content-section.section--about[data-section-kind][data-variant="9"] .section-layout{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);grid-template-areas:"head modules" "cta modules" "media media"}
.content-section.section--about[data-section-kind][data-variant="9"] .section-modules{grid-template-columns:1fr}
.content-section.section--about[data-section-kind][data-variant="10"] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "media" "modules" "cta"}
.content-section.section--about[data-section-kind][data-variant="10"] .section-modules{display:flex;grid-template-columns:none}

.content-section.section--partners[data-section-kind][data-variant] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "filters" "modules" "explorer" "cta"}
.content-section.section--partners[data-section-kind][data-variant="2"] .section-layout{grid-template-columns:300px minmax(0,1fr);grid-template-areas:"head filters" "head modules" "cta explorer"}
.content-section.section--partners[data-section-kind][data-variant="4"] .section-layout{grid-template-columns:280px minmax(0,1fr);grid-template-areas:"head filters" "cta modules" "cta explorer"}
.content-section.section--partners[data-section-kind][data-variant="6"] .section-layout{grid-template-columns:210px minmax(0,1fr) 310px;grid-template-areas:"head filters cta" "head modules cta" "head explorer cta"}
.content-section.section--partners[data-section-kind][data-variant="8"] .section-layout{grid-template-columns:minmax(0,1.3fr) 370px;grid-template-areas:"head explorer" "filters explorer" "modules explorer" "cta explorer"}
.content-section.section--partners[data-section-kind][data-variant="10"] .section-layout{grid-template-columns:330px minmax(0,1fr);grid-template-areas:"head filters" "explorer modules" "cta modules"}
.content-section.section--reference-gallery[data-section-kind][data-variant] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "filters" "modules" "explorer" "cta"}
.content-section.section--form[data-section-kind][data-variant] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "modules"}
.content-section.section--legal[data-section-kind][data-variant] .section-layout{grid-template-columns:1fr;grid-template-areas:"head" "modules" "cta"}
.content-section.section--contact-teaser[data-section-kind][data-variant="2"] .section-layout{grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);grid-template-areas:"head media" "modules media" "cta media"}
.content-section.section--process[data-section-kind][data-variant="8"] .section-modules{grid-template-columns:repeat(5,1fr)}
.content-section.section--reviews[data-section-kind][data-variant="5"] .section-modules{grid-template-columns:repeat(4,1fr)}
.content-section.section--reviews[data-section-kind][data-variant="8"] .section-modules{grid-template-columns:repeat(2,1fr)}
.content-section.section--reference-teaser[data-section-kind][data-variant="1"] .section-modules{grid-template-columns:repeat(4,1fr)}
.content-section.section--reference-teaser[data-section-kind][data-variant="9"] .section-modules,
.content-section.section--reference-teaser[data-section-kind][data-variant="10"] .section-modules{grid-template-columns:repeat(2,1fr)}
.content-section.section--other-services[data-section-kind][data-variant="10"] .section-modules{grid-template-columns:1fr}
.content-section.section--services[data-section-kind][data-variant="10"] .section-modules{grid-template-columns:repeat(2,1fr)}

/* Interactive directories need their filter row in the named grid.
   These desktop rules deliberately outrank the generic interactive V8/V9 layouts. */
@media (min-width:901px){
    .content-section.section--partners.section--interactive[data-section-kind][data-has-media="false"][data-variant] .section-heading{grid-area:head}
    .content-section.section--partners.section--interactive[data-section-kind][data-has-media="false"][data-variant] .partner-filters{grid-area:filters}
    .content-section.section--partners.section--interactive[data-section-kind][data-has-media="false"][data-variant] .partner-grid{grid-area:modules}
    .content-section.section--partners.section--interactive[data-section-kind][data-has-media="false"][data-variant] .partner-explorer{grid-area:explorer}
    .content-section.section--partners.section--interactive[data-section-kind][data-has-media="false"][data-variant] .section-cta{grid-area:cta}
    .content-section.section--partners.section--interactive[data-section-kind][data-has-media="false"][data-variant="8"] .section-layout{
        grid-template-columns:minmax(0,1.3fr) 370px;
        grid-template-areas:"head explorer" "filters explorer" "modules explorer" "cta explorer";
    }
    .content-section.section--partners.section--interactive[data-section-kind][data-has-media="false"][data-variant="9"] .section-layout{
        grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);
        grid-template-areas:"head explorer" "filters explorer" "modules modules" "cta cta";
    }

    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant] .section-heading{grid-area:head}
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant] .reference-filter{grid-area:filters}
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant] .reference-grid{grid-area:modules}
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant] .section-explorer{grid-area:explorer}
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant] .section-cta{grid-area:cta}
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant="8"] .section-layout{
        grid-template-columns:minmax(0,1.2fr) 370px;
        grid-template-areas:"head explorer" "filters explorer" "modules explorer" "cta explorer";
    }
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant="9"] .section-layout{
        grid-template-columns:300px minmax(0,1fr);
        grid-template-areas:"head filters" "explorer modules" "cta modules";
    }
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant="9"] .section-explorer{
        grid-template-columns:1fr;
        align-self:start;
    }
    .content-section.section--reference-gallery.section--interactive[data-section-kind][data-has-media="true"][data-variant="9"] .section-explorer__copy{
        min-width:0;
        padding:18px 0 0;
        border-top:1px solid var(--surface-line);
        border-left:0;
        overflow-wrap:anywhere;
    }
}

/* Fixed mobile translations for the two production hero layouts. */
@media (max-width:680px){
    .hero{min-height:820px}
    .hero .hero-grid{min-height:820px;padding-top:58px;padding-bottom:64px;align-content:center}
    .hero .hero-title-zone,.hero .hero-copy-zone,.hero .hero-cta{margin:0;max-width:none}
    .hero .hero-benefits{margin:0}
    .hero--split .hero-grid,.hero--stage .hero-grid{
        width:min(100%,var(--container));
        display:grid;
        grid-template-columns:1fr;
        grid-template-rows:auto;
        grid-template-areas:"title" "copy" "benefits" "cta";
        gap:22px;
        text-align:center;
        padding-left:var(--side-pad);
        padding-right:var(--side-pad);
    }
    .hero .hero-copy-zone p,.hero .hero-cta>p,.hero h1{text-align:center}
    .hero .button-row{justify-content:center}
    .hero .hero-benefits{display:grid;grid-template-columns:1fr;overflow:visible}
    .hero .hero-benefits li{justify-content:flex-start;text-align:left;flex:initial}
    .hero--stage .hero-media{inset:0;height:100%;opacity:1;clip-path:none}
    .hero--split .hero-media{left:0;right:0;top:45%;bottom:0;height:auto;opacity:.6;clip-path:none}
    .hero--split .hero-media::after{background:linear-gradient(180deg,var(--ink),rgba(23,24,23,.2))}
}

/* Balanced partner rows: the final row is centered instead of reserving empty cells. */
.section--partners[data-variant="1"] .partner-grid,
.section--partners[data-variant="2"] .partner-grid,
.section--partners[data-variant="5"] .partner-grid,
.section--partners[data-variant="6"] .partner-grid,
.section--partners[data-variant="8"] .partner-grid,
.section--partners[data-variant="9"] .partner-grid,
.section--partners[data-variant="10"] .partner-grid{display:flex;flex-wrap:wrap;justify-content:center}
.section--partners[data-variant="1"] .partner-logo,.section--partners[data-variant="9"] .partner-logo{flex:0 1 calc((100% - 50px)/6)}
.section--partners[data-variant="2"] .partner-logo{flex:0 1 calc((100% - 30px)/4)}
.section--partners[data-variant="5"] .partner-logo{flex:0 1 calc((100% - 70px)/8)}
.section--partners[data-variant="5"] .partner-logo:nth-child(5n+1){grid-column:auto}
.section--partners[data-variant="6"] .partner-logo{flex:0 1 calc((100% - 20px)/3)}
.section--partners[data-variant="8"] .partner-logo{flex:0 1 calc((100% - 40px)/5)}
.section--partners[data-variant="10"] .partner-logo{flex:0 1 calc((100% - 10px)/2)}
@media (max-width:900px){
    .section--partners[data-variant="1"] .partner-logo,.section--partners[data-variant="2"] .partner-logo,.section--partners[data-variant="5"] .partner-logo,.section--partners[data-variant="6"] .partner-logo,.section--partners[data-variant="8"] .partner-logo,.section--partners[data-variant="9"] .partner-logo,.section--partners[data-variant="10"] .partner-logo{flex-basis:calc((100% - 30px)/4)}
}
@media (max-width:680px){
    .section--partners[data-variant="1"] .partner-logo,.section--partners[data-variant="2"] .partner-logo,.section--partners[data-variant="5"] .partner-logo,.section--partners[data-variant="6"] .partner-logo,.section--partners[data-variant="8"] .partner-logo,.section--partners[data-variant="9"] .partner-logo,.section--partners[data-variant="10"] .partner-logo{flex-basis:calc((100% - 10px)/2)}
}
@media (max-width:480px){
    .section--partners[data-variant="1"] .partner-logo,.section--partners[data-variant="2"] .partner-logo,.section--partners[data-variant="5"] .partner-logo,.section--partners[data-variant="6"] .partner-logo,.section--partners[data-variant="8"] .partner-logo,.section--partners[data-variant="9"] .partner-logo,.section--partners[data-variant="10"] .partner-logo{flex-basis:100%}
}
@media (max-width:900px){
    :root{--header-height:74px}
    .header-main .header-container{min-height:74px!important}
    .brand-logo{width:160px!important;height:60px!important}
    .nav-rail{justify-content:flex-start}
    .service-submenu{top:74px!important}
}

/* =========================================================
   Mobile architecture signatures
   Each variant keeps its own composition instead of collapsing
   into one generic single-column template.
   ========================================================= */
@media (max-width:680px){
    .content-section[data-section-kind]{
        position:relative;
        isolation:isolate;
    }
    .content-section[data-section-kind] .section-layout,
    .content-section.section--partners[data-section-kind] .section-layout,
    .content-section.section--reference-gallery[data-section-kind] .section-layout,
    .content-section.section--form[data-section-kind] .section-layout,
    .content-section.section--legal[data-section-kind] .section-layout{
        display:grid!important;
        grid-template-columns:repeat(6,minmax(0,1fr))!important;
        grid-auto-flow:row;
        gap:24px!important;
    }
    .content-section[data-section-kind] .section-layout>.section-heading,
    .content-section[data-section-kind] .section-layout>.section-media,
    .content-section[data-section-kind] .section-layout>.section-modules,
    .content-section[data-section-kind] .section-layout>.partner-filters,
    .content-section[data-section-kind] .section-layout>.reference-filter,
    .content-section[data-section-kind] .section-layout>.partner-grid,
    .content-section[data-section-kind] .section-layout>.contact-form,
    .content-section[data-section-kind] .section-layout>.section-explorer,
    .content-section[data-section-kind] .section-layout>.section-cta{
        grid-area:auto!important;
        grid-column:1/-1!important;
        grid-row:auto!important;
        width:auto!important;
        min-width:0;
        position:relative!important;
        inset:auto!important;
        transform:none!important;
        margin-top:0;
        align-self:auto;
    }
    .content-section[data-section-kind] .section-heading{
        writing-mode:horizontal-tb!important;
        transform:none!important;
    }
    .content-section[data-section-kind] .section-heading h1,
    .content-section[data-section-kind] .section-heading h2{
        font-size:var(--type-section-title)!important;
        line-height:1.08!important;
        writing-mode:horizontal-tb!important;
        transform:none!important;
    }
    .content-section[data-section-kind] .section-heading .section-lead,
    .content-section[data-section-kind] .module-body p,
    .content-section[data-section-kind] .section-explorer p{
        font-size:var(--type-section-copy);
    }
    .content-section[data-section-kind] .section-cta p{
        font-size:var(--type-cta-copy);
    }

    /* 01 · framed editorial opening */
    .content-section[data-section-kind][data-variant="1"] .section-heading{
        padding:24px 20px!important;
        border:1px solid currentColor;
        border-bottom:7px solid var(--brand);
    }
    .content-section[data-section-kind][data-variant="1"][data-theme="light"] .section-heading{
        background:var(--ink);
        color:var(--paper);
    }
    .content-section[data-section-kind][data-variant="1"] .module-card{
        border-left:5px solid var(--brand);
    }

    /* 02 · staggered module-first ledger */
    .content-section[data-section-kind][data-variant="2"] .section-heading{
        grid-column:1/6!important;
        padding:0 0 0 20px!important;
        border-left:8px solid var(--brand);
        border-bottom:0;
    }
    .content-section[data-section-kind][data-variant="2"] .section-heading h1,
    .content-section[data-section-kind][data-variant="2"] .section-heading h2,
    .content-section[data-section-kind][data-variant="2"] .section-heading .section-lead{
        text-align:left!important;
        margin-left:0!important;
    }
    .content-section[data-section-kind][data-variant="2"] .section-layout>.section-modules,
    .content-section[data-section-kind][data-variant="2"] .section-layout>.partner-grid,
    .content-section[data-section-kind][data-variant="2"] .section-layout>.contact-form{
        order:2;
    }
    .content-section[data-section-kind][data-variant="2"] .section-layout>.section-explorer{order:3}
    .content-section[data-section-kind][data-variant="2"] .section-layout>.section-media{order:4}
    .content-section[data-section-kind][data-variant="2"] .module-card:nth-child(even){
        width:calc(100% - 36px);
        margin-left:36px;
    }

    /* 03 · dark technical stage with a swipe rail */
    .content-section[data-section-kind][data-variant="3"] .section-heading{
        padding:26px 18px!important;
        border:1px solid rgba(240,173,0,.55);
        background:rgba(0,0,0,.22);
    }
    .content-section[data-section-kind][data-variant="3"] .section-modules{
        display:flex!important;
        gap:12px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
    }
    .content-section[data-section-kind][data-variant="3"] .module-card{
        flex:0 0 82vw;
        max-width:82vw;
        scroll-snap-align:center;
        border:1px solid rgba(240,173,0,.6);
    }

    /* 04 · asymmetric carousel stage */
    .content-section[data-section-kind][data-variant="4"] .section-heading{
        grid-column:2/7!important;
        padding:0 0 20px 0!important;
        border-bottom:8px solid var(--brand);
    }
    .content-section[data-section-kind][data-variant="4"] .section-heading h1,
    .content-section[data-section-kind][data-variant="4"] .section-heading h2,
    .content-section[data-section-kind][data-variant="4"] .section-heading .section-lead{
        text-align:right!important;
        margin-right:0!important;
    }
    .content-section[data-section-kind][data-variant="4"] .section-modules,
    .content-section[data-section-kind][data-variant="4"] .partner-grid,
    .content-section[data-section-kind][data-variant="4"] .reference-grid{
        display:flex!important;
        flex-wrap:nowrap!important;
        gap:12px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
    }
    .content-section[data-section-kind][data-variant="4"] .module-card,
    .content-section[data-section-kind][data-variant="4"] .partner-logo,
    .content-section[data-section-kind][data-variant="4"] .reference-card{
        flex:0 0 82vw!important;
        max-width:82vw!important;
        scroll-snap-align:start;
    }

    /* 05 · dark masthead and compact two-column mosaic */
    .content-section[data-section-kind][data-variant="5"] .section-heading{
        margin-left:-15px!important;
        margin-right:-15px!important;
        padding:30px 22px!important;
        background:var(--ink);
        color:var(--paper);
        border:0;
        box-shadow:inset 0 -8px 0 var(--brand);
    }
    .content-section[data-section-kind][data-variant="5"] .section-modules{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:10px;
    }
    .content-section[data-section-kind][data-variant="5"] .module-card{
        min-width:0;
        width:calc(100% - 38px);
    }
    .content-section[data-section-kind][data-variant="5"] .module-card:first-child,
    .section--services[data-variant="8"] .module-card:first-child{
        grid-column:auto!important;
        grid-row:auto!important;
    }
    .section--reference-gallery[data-variant="5"] .reference-card:nth-child(7n+1){
        grid-column:auto!important;
    }
    .content-section[data-section-kind][data-variant="5"] .module-card:nth-child(even){margin-left:38px}
    .content-section[data-section-kind][data-variant="5"] .module-body{padding:18px}
    .content-section[data-section-kind][data-variant="5"] .partner-grid{
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .content-section[data-section-kind][data-variant="5"] .section-media{
        width:calc(100% + 30px)!important;
        margin-left:-15px;
    }

    /* 06 · left rail and compact technical rows */
    .content-section[data-section-kind][data-variant="6"] .section-heading{
        grid-column:1/6!important;
        padding:0 0 0 18px!important;
        border-left:8px solid var(--brand)!important;
        border-top:0!important;
    }
    .content-section[data-section-kind][data-variant="6"] .section-heading h1,
    .content-section[data-section-kind][data-variant="6"] .section-heading h2,
    .content-section[data-section-kind][data-variant="6"] .section-heading .section-lead{
        text-align:left!important;
        margin-left:0!important;
    }
    .content-section[data-section-kind][data-variant="6"] .module-card{
        display:grid!important;
        grid-template-columns:72px minmax(0,1fr)!important;
        align-items:start;
        border:0;
        border-bottom:1px solid currentColor;
    }
    .content-section[data-section-kind][data-variant="6"] .module-image{
        width:72px!important;
        height:92px!important;
        min-height:92px!important;
    }
    .content-section[data-section-kind][data-variant="6"] .module-body{
        grid-column:2;
        padding:16px;
    }

    /* 07 · centred crosshair with a panoramic rail */
    .content-section[data-section-kind][data-variant="7"] .section-heading{
        padding:24px 12px!important;
        border-top:2px solid var(--brand);
        border-bottom:2px solid var(--brand);
    }
    .content-section[data-section-kind][data-variant="7"] .section-heading::after{
        content:"";
        display:block;
        width:10px;
        height:10px;
        margin:18px auto -31px;
        background:var(--brand);
        outline:7px solid var(--paper);
    }
    .content-section[data-section-kind][data-variant="7"] .section-modules,
    .content-section[data-section-kind][data-variant="7"] .partner-grid,
    .content-section[data-section-kind][data-variant="7"] .reference-grid{
        display:flex!important;
        flex-wrap:nowrap!important;
        gap:14px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
    }
    .content-section[data-section-kind][data-variant="7"] .module-card,
    .content-section[data-section-kind][data-variant="7"] .partner-logo,
    .content-section[data-section-kind][data-variant="7"] .reference-card{
        flex:0 0 88vw!important;
        max-width:88vw!important;
        scroll-snap-align:center;
    }

    /* 08 · control panel: explorer precedes the content */
    .content-section[data-section-kind][data-variant="8"] .section-heading{
        grid-column:2/7!important;
        padding:24px!important;
        border:2px solid currentColor;
        box-shadow:-14px 14px 0 var(--brand);
    }
    .content-section[data-section-kind][data-variant="8"] .section-heading h1,
    .content-section[data-section-kind][data-variant="8"] .section-heading h2,
    .content-section[data-section-kind][data-variant="8"] .section-heading .section-lead{
        text-align:left!important;
        margin-left:0!important;
    }
    .content-section[data-section-kind][data-variant="4"] .section-heading,
    .content-section[data-section-kind][data-variant="8"] .section-heading{
        grid-column:1/-1!important;
        width:100%!important;
        max-width:100%!important;
        box-sizing:border-box;
    }
    .content-section[data-section-kind][data-variant="4"] .section-heading h1,
    .content-section[data-section-kind][data-variant="4"] .section-heading h2,
    .content-section[data-section-kind][data-variant="8"] .section-heading h1,
    .content-section[data-section-kind][data-variant="8"] .section-heading h2{
        max-width:100%!important;
        overflow-wrap:anywhere;
        hyphens:auto;
    }
    .content-section.section--reference-gallery[data-section-kind][data-variant] .reference-card h2{
        max-width:100%;
        overflow-wrap:break-word;
        hyphens:auto;
    }
    .content-section[data-section-kind][data-variant="8"] .section-layout>.section-explorer{order:2}
    .content-section[data-section-kind][data-variant="8"] .section-layout>.section-modules,
    .content-section[data-section-kind][data-variant="8"] .section-layout>.partner-grid,
    .content-section[data-section-kind][data-variant="8"] .section-layout>.contact-form{order:3}
    .content-section[data-section-kind][data-variant="8"] .section-layout>.section-media{order:4}
    .content-section[data-section-kind][data-variant="8"] .module-card:first-child,
    .content-section[data-section-kind][data-variant="8"] .partner-logo:first-child,
    .content-section[data-section-kind][data-variant="8"] .reference-card:first-child{
        background:var(--brand);
        color:var(--ink);
        border-color:var(--ink);
    }

    /* 09 · narrow title column with alternating cards */
    .content-section[data-section-kind][data-variant="9"] .section-heading{
        grid-column:1/5!important;
        padding:20px 18px 20px 0!important;
        border-top:8px solid var(--brand);
        border-bottom:1px solid currentColor;
    }
    .content-section[data-section-kind][data-variant="9"] .section-heading h1,
    .content-section[data-section-kind][data-variant="9"] .section-heading h2,
    .content-section[data-section-kind][data-variant="9"] .section-heading .section-lead{
        text-align:left!important;
        margin-left:0!important;
    }
    .content-section[data-section-kind][data-variant="9"] .module-card:nth-child(odd){width:calc(100% - 34px)}
    .content-section[data-section-kind][data-variant="9"] .module-card:nth-child(even){
        width:calc(100% - 34px);
        margin-left:34px;
    }

    /* 10 · brand placard with a reduced index list */
    .content-section[data-section-kind][data-variant="10"] .section-heading{
        padding:30px 22px!important;
        background:var(--brand);
        color:var(--ink);
        border:4px solid var(--ink);
        box-shadow:10px 10px 0 rgba(0,0,0,.18);
    }
    .content-section[data-section-kind][data-variant="10"] .section-heading h1,
    .content-section[data-section-kind][data-variant="10"] .section-heading h2,
    .content-section[data-section-kind][data-variant="10"] .section-heading .section-lead{
        color:var(--ink)!important;
    }
    .content-section[data-section-kind][data-variant="10"] .module-card{
        background:transparent;
        border:0;
        border-bottom:2px solid currentColor;
        box-shadow:none;
    }
    .content-section[data-section-kind][data-variant="10"] .module-body{padding:18px 4px}

    /* Forms inherit the ten stages without sacrificing field usability. */
    .section--form[data-variant="2"] .contact-form{border-left:8px solid var(--brand);padding-left:18px}
    .section--form[data-variant="3"] .contact-form{padding:18px;border:1px solid rgba(240,173,0,.55)}
    .section--form[data-variant="4"] .contact-form{padding:20px;border-top:8px solid var(--brand)}
    .section--form[data-variant="5"] .contact-form{padding:20px;border:4px solid var(--ink);box-shadow:10px 10px 0 var(--brand)}
    .section--form[data-variant="6"] .contact-form{padding-left:18px;border-left:8px solid var(--brand)}
    .section--form[data-variant="7"] .contact-form{padding:22px;border-top:2px solid var(--brand);border-bottom:2px solid var(--brand)}
    .section--form[data-variant="8"] .contact-form{padding:20px;background:var(--brand);color:var(--ink)}
    .section--form[data-variant="9"] .contact-form{padding:20px 0 20px 18px;border-left:1px solid currentColor}
    .section--form[data-variant="10"] .contact-form{padding:0;background:transparent;border:0}
}

/* =========================================================
   Fixed production components: navigation 5 and dark button 1
   ========================================================= */
.btn{justify-content:center;gap:9px}

/* Navigation 5: broad register track, no side contacts. */
.nav-link::before,
.nav-link::after{
    content:none!important;
    display:none!important;
}
.nav-link{
    overflow:visible;
    border:0;
    box-shadow:none;
    transition:background-color .24s ease,color .24s ease,transform .24s ease,box-shadow .24s ease;
}
.nav-rail{gap:12px;padding:0;background:transparent}
.nav-link{padding-inline:18px;background:#f2f1ec;color:var(--ink)}
.nav-link:hover,
.nav-link:focus-visible{background:#deddd7;color:var(--ink);transform:translateY(-2px)}
.nav-link.is-active,
.nav-service.is-active .nav-link,
.nav-service-toggle[aria-expanded="true"]{
    background:var(--brand);
    color:var(--ink);
    min-height:46px;
    border:1px solid var(--brand);
    box-shadow:none;
    transform:none;
}

/* Dark button 1: compact closing contact. */
[data-surface-tone="dark"] .btn{
    min-height:46px;
    border:0;
    background:var(--brand);
    color:var(--ink);
    box-shadow:none;
}
[data-surface-tone="dark"] .btn::before,
[data-surface-tone="dark"] .btn::after{
    content:"";
    display:block;
    z-index:1;
    top:0;
    bottom:0;
    width:50%;
    height:auto;
    background:var(--paper);
}
[data-surface-tone="dark"] .btn::before{left:0;right:auto;transform:translateX(-102%)}
[data-surface-tone="dark"] .btn::after{left:auto;right:0;transform:translateX(102%)}
[data-surface-tone="dark"] .btn:hover,
[data-surface-tone="dark"] .btn:focus-visible{color:var(--ink);box-shadow:0 13px 30px rgba(0,0,0,.2)}
[data-surface-tone="dark"] .btn:hover::before,
[data-surface-tone="dark"] .btn:hover::after,
[data-surface-tone="dark"] .btn:focus-visible::before,
[data-surface-tone="dark"] .btn:focus-visible::after{transform:translateX(0)}
[data-surface-tone="dark"] .btn .btn__icon{background:transparent;color:var(--ink)}

@media (max-width:1100px) and (min-width:901px){
    .nav-link{min-width:82px;padding-inline:8px}
    .nav-rail{gap:8px}
}

@media (max-width:900px){
    .nav-rail{justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain}
    .nav-link{min-width:108px}
}

/* =========================================================
   Startseiten-Hero: fünf linke Bühnen und Vorteilsarchitekturen
   ========================================================= */
.hero--home-variants{
    isolation:isolate;
    min-height:820px;
}
.hero--home-variants::before,
.hero--home-variants::after{
    content:"";
    position:absolute;
    z-index:1;
    pointer-events:none;
}
.hero--home-variants .hero-grid{
    min-height:820px;
    padding-top:74px;
    padding-bottom:74px;
    gap:24px 34px;
}
.hero--home-variants .hero-media{z-index:0}
.hero--home-variants .hero-benefits li{
    min-width:0;
    font-size:18px;
    line-height:1.45;
    backdrop-filter:none;
}
.hero--home-variants .hero-benefits svg{
    flex:0 0 auto;
    margin:0;
}
.hero--home-variants .hero-benefits span{
    min-width:0;
    overflow-wrap:break-word;
    hyphens:auto;
}

/* 01 · Graphitisches Kontaktfeld */
.hero--home-variants[data-variant="1"]{
    background:#171917;
    color:var(--paper);
}
.hero--home-variants[data-variant="1"]::before{
    inset:0 48% 0 0;
    background:
        linear-gradient(90deg,rgba(232,164,7,.12) 1px,transparent 1px),
        linear-gradient(0deg,rgba(255,255,255,.055) 1px,transparent 1px),
        linear-gradient(135deg,#20231f,#111311);
    background-size:74px 100%,100% 74px,100% 100%;
}
.hero--home-variants[data-variant="1"]::after{
    top:0;
    bottom:0;
    left:51%;
    width:7px;
    background:var(--brand);
    transform:skewX(-7deg);
    transform-origin:top;
}
.hero--home-variants[data-variant="1"] .hero-media{
    left:51%;
    clip-path:polygon(8% 0,100% 0,100% 100%,0 100%);
}
.hero--home-variants[data-variant="1"] .hero-media::after{
    background:linear-gradient(90deg,rgba(17,19,17,.72),rgba(17,19,17,.04) 42%),linear-gradient(0deg,rgba(17,19,17,.42),transparent 58%);
}
.hero--home-variants[data-variant="1"] .hero-grid{
    grid-template-columns:48% 52%;
    grid-template-areas:"title ." "copy ." "benefits ." "cta .";
    align-content:center;
    --surface-explicit-tone:dark;
}
.hero--home-variants[data-variant="1"] .hero-benefits{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}
.hero--home-variants[data-variant="1"] .hero-benefits li{
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:12px;
    padding:0 14px 0 0;
    min-height:72px;
    background:#2b2e29;
    border:1px solid rgba(255,255,255,.16);
    border-bottom:4px solid var(--brand);
    animation:hero-contact-in .52s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="1"] .hero-benefits li:nth-child(2){animation-delay:.07s}
.hero--home-variants[data-variant="1"] .hero-benefits li:nth-child(3){animation-delay:.14s}
.hero--home-variants[data-variant="1"] .hero-benefits li:nth-child(4){animation-delay:.21s}
.hero--home-variants[data-variant="1"] .hero-benefits svg{
    width:40px;
    height:40px;
    padding:10px;
    background:var(--brand);
    color:var(--ink);
}

/* 02 · Orange Diagonalplatte mit kartenloser Stromschiene */
.hero--home-variants[data-variant="2"]{
    background:var(--ink);
    color:var(--ink);
}
.hero--home-variants[data-variant="2"]::before{
    inset:0 38% 0 0;
    background:linear-gradient(135deg,var(--brand-bright),var(--brand) 68%,#cd8500);
    clip-path:polygon(0 0,100% 0,92% 100%,0 100%);
    animation:hero-diagonal-in .7s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="2"]::after{
    content:none;
    display:none;
}
.hero--home-variants[data-variant="2"] .hero-media{
    left:55%;
    clip-path:none;
}
.hero--home-variants[data-variant="2"] .hero-media::after{
    background:linear-gradient(90deg,rgba(23,24,23,.62),transparent 38%),linear-gradient(0deg,rgba(23,24,23,.3),transparent 54%);
}
.hero--home-variants[data-variant="2"] .hero-grid{
    grid-template-columns:35% 23% 42%;
    grid-template-areas:"title title ." "copy benefits ." "cta benefits .";
    align-content:center;
    --surface-explicit-tone:accent;
}
.hero--home-variants[data-variant="2"] .hero-title-zone{max-width:760px}
.hero--home-variants[data-variant="2"] .hero-copy-zone p,
.hero--home-variants[data-variant="2"] .hero-cta>p{color:#292414}
.hero--home-variants[data-variant="2"] .hero-benefits{
    position:relative;
    grid-template-columns:1fr;
    gap:0;
    padding-left:30px;
}
.hero--home-variants[data-variant="2"] .hero-benefits::before{
    content:none;
    display:none;
}
.hero--home-variants[data-variant="2"] .hero-benefits li{
    position:relative;
    align-items:center;
    gap:10px;
    padding:13px 0;
    background:transparent;
    border:0;
    border-bottom:1px solid rgba(23,24,23,.35);
    color:var(--ink);
    animation:hero-rail-in .5s ease both;
}
.hero--home-variants[data-variant="2"] .hero-benefits li:nth-child(2){animation-delay:.08s}
.hero--home-variants[data-variant="2"] .hero-benefits li:nth-child(3){animation-delay:.16s}
.hero--home-variants[data-variant="2"] .hero-benefits li:nth-child(4){animation-delay:.24s}
.hero--home-variants[data-variant="2"] .hero-benefits svg{
    width:24px;
    height:24px;
    padding:5px;
    background:var(--ink);
    color:var(--brand);
}
.hero--home-variants[data-variant="2"] .btn{
    background:var(--ink);
    color:var(--paper);
}
.hero--home-variants[data-variant="2"] .btn .btn__icon{color:var(--paper)}
.hero--home-variants[data-variant="2"] .btn::before,
.hero--home-variants[data-variant="2"] .btn::after{background:var(--paper)}
.hero--home-variants[data-variant="2"] .btn:hover,
.hero--home-variants[data-variant="2"] .btn:focus-visible{color:var(--ink)}

/* 03 · Helles Dossier mit schwarzen Registerlaschen */
.hero--home-variants[data-variant="3"]{
    background:var(--paper);
    color:var(--ink);
}
.hero--home-variants[data-variant="3"]::before{
    inset:0 49% 0 0;
    background:
        radial-gradient(circle,rgba(23,24,23,.17) 1px,transparent 1.5px),
        linear-gradient(135deg,#fff,#f0ede4);
    background-size:28px 28px,100% 100%;
    animation:hero-dossier-in .74s ease both;
}
.hero--home-variants[data-variant="3"]::after{
    left:0;
    bottom:0;
    width:53%;
    height:12px;
    background:linear-gradient(90deg,var(--ink) 0 78%,var(--brand) 78% 100%);
}
.hero--home-variants[data-variant="3"] .hero-media{
    left:53%;
    clip-path:none;
    border-left:8px solid var(--brand);
}
.hero--home-variants[data-variant="3"] .hero-media::after{
    background:linear-gradient(90deg,rgba(247,245,239,.38),transparent 28%),linear-gradient(0deg,rgba(23,24,23,.22),transparent 58%);
}
.hero--home-variants[data-variant="3"] .hero-grid{
    grid-template-columns:49% 51%;
    grid-template-areas:"title ." "benefits ." "copy ." "cta .";
    align-content:center;
    --surface-explicit-tone:light;
}
.hero--home-variants[data-variant="3"] .hero-copy-zone p,
.hero--home-variants[data-variant="3"] .hero-cta>p{color:#4a4d47}
.hero--home-variants[data-variant="3"] .hero-benefits{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}
.hero--home-variants[data-variant="3"] .hero-benefits li{
    align-items:center;
    gap:10px;
    min-height:62px;
    padding:10px 13px;
    background:var(--ink);
    color:var(--paper);
    border:0;
    box-shadow:inset 5px 0 0 var(--brand);
    animation:hero-register-in .48s ease both;
}
.hero--home-variants[data-variant="3"] .hero-benefits li:nth-child(even){animation-delay:.11s}
.hero--home-variants[data-variant="3"] .hero-benefits svg{
    width:20px;
    height:20px;
    color:var(--brand);
}
.hero--home-variants[data-variant="3"] .btn--secondary{
    background:var(--ink);
    color:var(--paper);
}
.hero--home-variants[data-variant="3"] .btn--secondary .btn__icon{color:var(--paper)}
.hero--home-variants[data-variant="3"] .btn--secondary::before,
.hero--home-variants[data-variant="3"] .btn--secondary::after{background:var(--brand)}
.hero--home-variants[data-variant="3"] .btn--secondary:hover,
.hero--home-variants[data-variant="3"] .btn--secondary:focus-visible{color:var(--ink)}

/* 04 · Gerahmte Schaltkonsole mit zusammenhängendem Ledger */
.hero--home-variants[data-variant="4"]{
    background:#101210;
    color:var(--paper);
}
.hero--home-variants[data-variant="4"]::before{
    top:30px;
    bottom:30px;
    left:26px;
    width:49%;
    background:linear-gradient(150deg,#262925,#171917 72%);
    border:1px solid rgba(255,255,255,.32);
    box-shadow:14px 14px 0 var(--brand);
    animation:hero-frame-in .72s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="4"]::after{
    top:82px;
    left:26px;
    width:9px;
    height:146px;
    background:var(--brand);
}
.hero--home-variants[data-variant="4"] .hero-media{
    left:56%;
    opacity:.78;
    clip-path:polygon(12% 0,100% 0,100% 100%,0 100%);
}
.hero--home-variants[data-variant="4"] .hero-media::after{
    background:linear-gradient(90deg,#101210,rgba(16,18,16,.08) 50%),linear-gradient(0deg,rgba(16,18,16,.5),transparent 62%);
}
.hero--home-variants[data-variant="4"] .hero-grid{
    grid-template-columns:31% 20% 49%;
    grid-template-areas:"title title ." "copy benefits ." "cta benefits .";
    align-content:center;
    padding-left:62px;
    --surface-explicit-tone:dark;
}
.hero--home-variants[data-variant="4"] .hero-title-zone{padding-left:22px;border-left:7px solid var(--brand)}
.hero--home-variants[data-variant="4"] .hero-benefits{
    grid-template-columns:1fr;
    gap:0;
    padding:7px;
    background:#101210;
    border:1px solid rgba(255,255,255,.34);
}
.hero--home-variants[data-variant="4"] .hero-benefits li{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:10px;
    padding:10px 8px;
    background:transparent;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.18);
    animation:hero-ledger-in .5s ease both;
}
.hero--home-variants[data-variant="4"] .hero-benefits li:last-child{border-bottom:0}
.hero--home-variants[data-variant="4"] .hero-benefits li:nth-child(2){animation-delay:.07s}
.hero--home-variants[data-variant="4"] .hero-benefits li:nth-child(3){animation-delay:.14s}
.hero--home-variants[data-variant="4"] .hero-benefits li:nth-child(4){animation-delay:.21s}
.hero--home-variants[data-variant="4"] .hero-benefits svg{
    width:34px;
    height:34px;
    padding:8px;
    background:var(--brand);
    color:var(--ink);
}

/* 05 · Gestufte Signalbänder mit versetzten Vorteilskarten */
.hero--home-variants[data-variant="5"]{
    background:var(--ink);
    color:var(--paper);
}
.hero--home-variants[data-variant="5"]::before{
    inset:0 41% 0 0;
    background:linear-gradient(180deg,#111311 0 22%,var(--brand) 22% 31%,#30332f 31% 57%,var(--brand) 57% 64%,#1d201d 64% 100%);
    clip-path:polygon(0 0,88% 0,100% 20%,88% 39%,100% 60%,89% 79%,100% 100%,0 100%);
    animation:hero-steps-in .7s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="5"]::after{
    top:22%;
    left:0;
    width:52%;
    height:3px;
    background:rgba(23,24,23,.66);
}
.hero--home-variants[data-variant="5"] .hero-media{
    left:44%;
    clip-path:polygon(18% 0,100% 0,100% 100%,0 100%);
}
.hero--home-variants[data-variant="5"] .hero-media::after{
    background:linear-gradient(90deg,rgba(23,24,23,.88),rgba(23,24,23,.08) 46%),linear-gradient(0deg,rgba(23,24,23,.48),transparent 58%);
}
.hero--home-variants[data-variant="5"] .hero-grid{
    grid-template-columns:32% 18% 50%;
    grid-template-areas:"title title ." "copy copy ." "cta benefits benefits";
    align-content:center;
    --surface-explicit-tone:dark;
}
.hero--home-variants[data-variant="5"] .hero-title-zone{
    max-width:700px;
    padding:20px 24px;
    background:rgba(17,19,17,.96);
    border-left:8px solid var(--brand);
}
.hero--home-variants[data-variant="5"] .hero-copy-zone{
    max-width:650px;
    padding:16px 22px;
    background:rgba(23,24,23,.94);
}
.hero--home-variants[data-variant="5"] .hero-cta{
    max-width:450px;
    padding:17px 22px;
    background:rgba(23,24,23,.96);
}
.hero--home-variants[data-variant="5"] .hero-benefits{
    align-self:end;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    max-width:600px;
}
.hero--home-variants[data-variant="5"] .hero-benefits li{
    align-items:center;
    gap:10px;
    min-height:72px;
    padding:13px 14px;
    background:var(--brand);
    color:var(--ink);
    border:0;
    box-shadow:8px 8px 0 rgba(0,0,0,.24);
    animation:hero-signal-in .52s ease both;
}
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(even){
    background:var(--graphite);
    color:var(--paper);
    transform:translateY(18px);
    animation-name:hero-signal-offset-in;
}
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(2){animation-delay:.08s}
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(3){animation-delay:.16s}
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(4){animation-delay:.24s}
.hero--home-variants[data-variant="5"] .hero-benefits svg{
    width:28px;
    height:28px;
    padding:6px;
    background:var(--ink);
    color:var(--brand);
}
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(even) svg{
    background:var(--brand);
    color:var(--ink);
}

@keyframes hero-contact-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes hero-diagonal-in{from{clip-path:polygon(0 0,0 0,0 100%,0 100%)}to{clip-path:polygon(0 0,100% 0,92% 100%,0 100%)}}
@keyframes hero-rail-in{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes hero-dossier-in{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes hero-register-in{from{opacity:0;transform:scaleX(.78);transform-origin:left}to{opacity:1;transform:scaleX(1);transform-origin:left}}
@keyframes hero-frame-in{from{opacity:0;transform:translate(-18px,18px)}to{opacity:1;transform:none}}
@keyframes hero-ledger-in{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
@keyframes hero-steps-in{from{clip-path:polygon(0 0,0 0,0 20%,0 39%,0 60%,0 79%,0 100%,0 100%)}to{clip-path:polygon(0 0,88% 0,100% 20%,88% 39%,100% 60%,89% 79%,100% 100%,0 100%)}}
@keyframes hero-signal-in{from{opacity:0;transform:translate(-20px,20px)}to{opacity:1;transform:none}}
@keyframes hero-signal-offset-in{from{opacity:0;transform:translate(-20px,38px)}to{opacity:1;transform:translateY(18px)}}

/* Websiteweit engerer Abstand zwischen Buttonlabel und Pfeil. */
.btn{gap:4px}
.btn .btn__icon{
    width:22px;
    height:30px;
    flex:0 0 22px;
}
.btn--card .btn__icon{
    width:22px;
    height:28px;
    flex-basis:22px;
}

@media (max-width:900px){
    .hero--home-variants,
    .hero--home-variants .hero-grid{min-height:980px}
    .hero--home-variants .hero-grid,
    .hero--home-variants[data-variant] .hero-grid{
        grid-template-columns:1fr;
        grid-template-areas:"title" "copy" "benefits" "cta";
        align-content:start;
        padding-top:62px;
        padding-bottom:72px;
        padding-left:var(--side-pad);
        padding-right:88px;
        gap:22px;
    }
    .hero--home-variants .hero-title-zone,
    .hero--home-variants .hero-copy-zone,
    .hero--home-variants .hero-benefits,
    .hero--home-variants .hero-cta{max-width:650px}
    .hero--home-variants .hero-media,
    .hero--home-variants[data-variant] .hero-media{
        inset:58% 0 0;
        height:auto;
        opacity:.64;
        clip-path:none;
        border:0;
    }
    .hero--home-variants[data-variant] .hero-media::after{
        background:linear-gradient(180deg,var(--ink),rgba(23,24,23,.06) 58%),linear-gradient(0deg,rgba(23,24,23,.38),transparent 58%);
    }
    .hero--home-variants[data-variant="1"]::before{inset:0 0 28% 0}
    .hero--home-variants[data-variant="1"]::after{top:0;bottom:28%;left:auto;right:0;width:7px;transform:none}
    .hero--home-variants[data-variant="2"]::before{inset:0 0 29% 0;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
    .hero--home-variants[data-variant="2"]::after{top:67%;bottom:auto;left:0;width:100%;height:30px;clip-path:polygon(0 0,100% 54%,100% 100%,0 46%)}
    .hero--home-variants[data-variant="3"]::before{inset:0 0 25% 0}
    .hero--home-variants[data-variant="3"]::after{left:0;bottom:25%;width:100%;height:10px}
    .hero--home-variants[data-variant="4"]::before{top:24px;right:42px;bottom:29%;left:24px;width:auto}
    .hero--home-variants[data-variant="4"]::after{top:72px;left:24px}
    .hero--home-variants[data-variant="5"]::before{inset:0 0 25% 0;clip-path:polygon(0 0,100% 0,100% 84%,88% 84%,88% 92%,75% 92%,75% 100%,0 100%)}
    .hero--home-variants[data-variant="5"]::after{top:22%;width:100%}
    .hero--home-variants[data-variant="1"] .hero-benefits,
    .hero--home-variants[data-variant="3"] .hero-benefits,
    .hero--home-variants[data-variant="5"] .hero-benefits{grid-template-columns:repeat(2,minmax(0,1fr))}
    .hero--home-variants[data-variant="2"] .hero-benefits,
    .hero--home-variants[data-variant="4"] .hero-benefits{grid-template-columns:1fr}
    .hero--home-variants[data-variant="2"] .hero-benefits{margin-right:16px}
    .hero--home-variants[data-variant="2"] .hero-copy-zone p,
    .hero--home-variants[data-variant="2"] .hero-cta>p{text-align:left}
    .hero--home-variants[data-variant="4"] .hero-grid{padding-left:58px}
    .hero--home-variants[data-variant="5"] .hero-benefits{align-self:auto}
    .hero--home-variants[data-variant="5"] .hero-cta{max-width:650px}
}

@media (max-width:680px){
    .hero--home-variants,
    .hero--home-variants .hero-grid{min-height:1220px}
    .hero--home-variants .hero-grid,
    .hero--home-variants[data-variant] .hero-grid{
        padding-top:52px;
        padding-right:58px;
        padding-bottom:72px;
        gap:20px;
    }
    .hero--home-variants .hero-media,
    .hero--home-variants[data-variant] .hero-media{inset:76% 0 0}
    .hero--home-variants[data-variant="1"]::before{inset:0 0 24% 0}
    .hero--home-variants[data-variant="1"]::after{bottom:24%}
    .hero--home-variants[data-variant="2"]::before{inset:0 0 10% 0}
    .hero--home-variants[data-variant="2"]::after{top:89%}
    .hero--home-variants[data-variant="3"]::before{inset:0 0 10% 0}
    .hero--home-variants[data-variant="3"]::after{bottom:10%}
    .hero--home-variants[data-variant="4"]::before{right:18px;bottom:15%;left:18px;box-shadow:8px 8px 0 var(--brand)}
    .hero--home-variants[data-variant="4"]::after{left:18px}
    .hero--home-variants[data-variant="4"] .hero-grid{padding-left:42px;padding-right:58px}
    .hero--home-variants[data-variant="5"]::before{inset:0 0 22% 0}
    .hero--home-variants[data-variant="1"] .hero-benefits,
    .hero--home-variants[data-variant="3"] .hero-benefits{grid-template-columns:1fr}
    .hero--home-variants[data-variant="5"] .hero-benefits{grid-template-columns:1fr}
    .hero--home-variants[data-variant="5"] .hero-benefits li{min-height:78px}
    .hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(even){
        width:calc(100% - 24px);
        margin-left:24px;
        transform:none;
        animation-name:hero-signal-in;
    }
    .hero--home-variants[data-variant="2"] .hero-copy-zone p,
    .hero--home-variants[data-variant="2"] .hero-cta>p,
    .hero--home-variants[data-variant="4"] .hero-copy-zone p,
    .hero--home-variants[data-variant="4"] .hero-cta>p{text-align:center}
}

@media (prefers-reduced-motion:reduce){
    .hero--home-variants::before,
    .hero--home-variants .hero-benefits li{animation:none!important}
}

/* =========================================================
   Hero correction: identical content order, five card skins
   ========================================================= */
.hero--home-variants{
    --home-hero-height:calc(var(--viewport-height,100dvh) - var(--header-height));
    height:var(--home-hero-height);
    min-height:var(--home-hero-height);
    max-height:var(--home-hero-height);
}
.hero--home-variants .hero-grid,
.hero--home-variants[data-variant] .hero-grid{
    height:var(--home-hero-height);
    min-height:var(--home-hero-height);
    max-height:var(--home-hero-height);
    grid-template-columns:50% 50%;
    grid-template-areas:"title ." "copy ." "benefits ." "cta .";
    align-content:start;
    align-content:safe center;
    gap:14px 36px;
    padding-left:var(--side-pad);
    padding-right:88px;
    padding-top:30px;
    padding-bottom:30px;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:none;
}
.hero--home-variants .hero-grid::-webkit-scrollbar{display:none}
.hero--home-variants .hero-title-zone,
.hero--home-variants .hero-copy-zone,
.hero--home-variants .hero-benefits,
.hero--home-variants .hero-cta{
    width:100%;
    max-width:680px;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
}
.hero--home-variants[data-variant] .hero-title-zone,
.hero--home-variants[data-variant] .hero-copy-zone,
.hero--home-variants[data-variant] .hero-benefits,
.hero--home-variants[data-variant] .hero-cta{
    width:100%;
    max-width:680px;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
}
.hero--home-variants .hero-benefits,
.hero--home-variants[data-variant] .hero-benefits{
    position:relative;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-self:stretch;
    gap:10px;
    padding:0;
    margin:0;
    background:transparent;
    border:0;
}
.hero--home-variants .hero-benefits::before{content:none;display:none}
.hero--home-variants .hero-benefits li{
    position:relative;
    min-width:0;
    width:auto;
    min-height:74px;
    margin:0;
    transform:none;
    align-items:center;
    gap:11px;
    padding:12px 14px;
    font-size:18px;
    line-height:1.35;
    backdrop-filter:none;
}
.hero--home-variants .hero-benefits svg{flex:0 0 auto;margin:0}
.hero--home-variants .hero-benefits span{min-width:0;overflow-wrap:break-word;hyphens:auto}
.hero--home-variants .hero-copy-zone p{line-height:1.48}
.hero--home-variants .hero-cta>p{line-height:1.45;margin-bottom:14px}

/* Vertikale Dekorleisten sind im Hero vollständig entfernt. */
.hero--home-variants[data-variant="1"]::after,
.hero--home-variants[data-variant="2"]::after,
.hero--home-variants[data-variant="4"]::after{content:none;display:none}
.hero--home-variants[data-variant="3"] .hero-media{border-left:0}
.hero--home-variants[data-variant="4"] .hero-title-zone{padding-left:0;border-left:0}

/* 01: Graphit-Kontaktkarte mit eigener gelber Iconkammer. */
.hero--home-variants[data-variant="1"] .hero-benefits li{
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    padding:0 14px 0 0;
    background:#2b2e29;
    color:var(--paper);
    border:1px solid rgba(255,255,255,.16);
    border-bottom:4px solid var(--brand);
    box-shadow:none;
    animation:hero-card-contact-in .52s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="1"] .hero-benefits svg{width:40px;height:40px;padding:10px;background:var(--brand);color:var(--ink);border:0}

/* 02: Orange Konturplatte mit abgeschnittener Ecke, ohne Schiene. */
.hero--home-variants[data-variant="2"] .hero-benefits li{
    display:grid;
    grid-template-columns:30px minmax(0,1fr);
    padding:12px 14px;
    background:rgba(255,255,255,.2);
    color:var(--ink);
    border:1px solid rgba(23,24,23,.42);
    border-bottom:1px solid rgba(23,24,23,.42);
    clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);
    box-shadow:inset 0 -3px 0 rgba(23,24,23,.14);
    animation:hero-card-outline-in .5s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="2"] .hero-benefits svg{width:30px;height:30px;padding:7px;background:var(--ink);color:var(--brand);border:0}

/* 03: Schwarzes Dossier-Register mit gelber Kopfkante. */
.hero--home-variants[data-variant="3"] .hero-benefits li{
    display:grid;
    grid-template-columns:24px minmax(0,1fr);
    padding:12px 14px;
    background:var(--ink);
    color:var(--paper);
    border:0;
    border-top:5px solid var(--brand);
    box-shadow:0 8px 0 rgba(23,24,23,.12);
    animation:hero-card-register-in .48s ease both;
}
.hero--home-variants[data-variant="3"] .hero-benefits svg{width:24px;height:24px;padding:0;background:transparent;color:var(--brand);border:0}

/* 04: Doppelt gerahmte Schaltkarte mit kleinem Kontaktpunkt. */
.hero--home-variants[data-variant="4"] .hero-benefits li{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    padding:12px 14px;
    background:rgba(10,12,10,.82);
    color:var(--paper);
    border:1px solid rgba(255,255,255,.38);
    box-shadow:inset 0 0 0 5px rgba(255,255,255,.045);
    animation:hero-card-console-in .5s ease both;
}
.hero--home-variants[data-variant="4"] .hero-benefits li::after{content:"";position:absolute;top:7px;right:7px;width:7px;height:7px;background:var(--brand);border-radius:50%}
.hero--home-variants[data-variant="4"] .hero-benefits svg{width:34px;height:34px;padding:7px;border:1px solid var(--brand);background:transparent;color:var(--brand)}

/* 05: Wechselnde Signalplatten mit eigener Eckmarke. */
.hero--home-variants[data-variant="5"] .hero-benefits li{
    display:grid;
    grid-template-columns:28px minmax(0,1fr);
    padding:12px 14px;
    background:var(--brand);
    color:var(--ink);
    border:0;
    box-shadow:7px 7px 0 rgba(0,0,0,.25);
    animation:hero-card-signal-in .52s ease both;
}
.hero--home-variants[data-variant="5"] .hero-benefits li::before{content:"";position:absolute;top:8px;right:8px;width:22px;height:3px;background:currentColor;opacity:.55}
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(even){width:auto;margin:0;transform:none;background:var(--graphite);color:var(--paper);animation-name:hero-card-signal-in}
.hero--home-variants[data-variant="5"] .hero-benefits svg{width:28px;height:28px;padding:6px;background:var(--ink);color:var(--brand);border:0}
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(even) svg{background:var(--brand);color:var(--ink)}

.hero--home-variants .hero-benefits li:nth-child(2){animation-delay:.07s}
.hero--home-variants .hero-benefits li:nth-child(3){animation-delay:.14s}
.hero--home-variants .hero-benefits li:nth-child(4){animation-delay:.21s}

@keyframes hero-card-contact-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes hero-card-outline-in{from{opacity:0;clip-path:polygon(0 0,0 0,0 14px,0 100%,0 100%)}to{opacity:1;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}}
@keyframes hero-card-register-in{from{opacity:0;transform:scaleX(.78);transform-origin:left}to{opacity:1;transform:scaleX(1);transform-origin:left}}
@keyframes hero-card-console-in{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
@keyframes hero-card-signal-in{from{opacity:0;transform:translate(-18px,18px)}to{opacity:1;transform:none}}

@media (max-width:900px){
    .hero--home-variants .hero-grid,
    .hero--home-variants[data-variant] .hero-grid{
        grid-template-columns:1fr;
        grid-template-areas:"title" "copy" "benefits" "cta";
        padding:26px 88px 26px var(--side-pad);
        gap:12px;
    }
    .hero--home-variants .hero-title-zone,
    .hero--home-variants .hero-copy-zone,
    .hero--home-variants .hero-benefits,
    .hero--home-variants .hero-cta{max-width:650px}
    .hero--home-variants[data-variant] .hero-benefits{grid-template-columns:repeat(2,minmax(0,1fr));margin:0}
}

@media (max-width:680px){
    .hero--home-variants .hero-grid,
    .hero--home-variants[data-variant] .hero-grid{padding:18px 58px 18px var(--side-pad);gap:9px}
    .hero--home-variants h1{font-size:30px;line-height:1.04;letter-spacing:-.5px}
    .hero--home-variants .hero-copy-zone p,
    .hero--home-variants .hero-cta>p{text-align:left;line-height:1.32}
    .hero--home-variants .hero-cta>p{margin-bottom:9px}
    .hero--home-variants .button-row{gap:7px}
    .hero--home-variants .hero-benefits,
    .hero--home-variants[data-variant] .hero-benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
    .hero--home-variants .hero-benefits li{min-height:68px;gap:7px;padding:8px;font-size:18px;line-height:1.2}
    .hero--home-variants[data-variant="1"] .hero-benefits li{grid-template-columns:30px minmax(0,1fr);padding-left:0}
    .hero--home-variants[data-variant="1"] .hero-benefits svg{width:30px;height:30px;padding:7px}
    .hero--home-variants[data-variant="2"] .hero-benefits li{grid-template-columns:24px minmax(0,1fr)}
    .hero--home-variants[data-variant="2"] .hero-benefits svg{width:24px;height:24px;padding:5px}
    .hero--home-variants[data-variant="3"] .hero-benefits li{grid-template-columns:20px minmax(0,1fr)}
    .hero--home-variants[data-variant="3"] .hero-benefits svg{width:20px;height:20px}
    .hero--home-variants[data-variant="4"] .hero-benefits li{grid-template-columns:26px minmax(0,1fr)}
    .hero--home-variants[data-variant="4"] .hero-benefits svg{width:26px;height:26px;padding:5px}
    .hero--home-variants[data-variant="5"] .hero-benefits li{grid-template-columns:24px minmax(0,1fr);box-shadow:4px 4px 0 rgba(0,0,0,.25)}
    .hero--home-variants[data-variant="5"] .hero-benefits svg{width:24px;height:24px;padding:5px}
}

@media (prefers-reduced-motion:reduce){
    .hero--home-variants .hero-benefits li{animation:none!important}
}

/* =========================================================
   Hero-Card-Dock: Die Bühne bleibt fest, nur Cards wechseln.
   ========================================================= */
.hero--home-variants[data-variant]{
    background:var(--ink);
    color:var(--ink);
}
.hero--home-variants[data-variant]::before{
    content:"";
    display:block;
    inset:0 46% 0 0;
    width:auto;
    height:auto;
    background:linear-gradient(135deg,var(--brand-bright),var(--brand) 68%,#cd8500);
    background-size:auto;
    border:0;
    box-shadow:none;
    clip-path:polygon(0 0,100% 0,92% 100%,0 100%);
    animation:none;
}
.hero--home-variants[data-variant]::after{content:none;display:none}
.hero--home-variants[data-variant] .hero-media{
    inset:0 0 0 47%;
    width:auto;
    height:auto;
    opacity:1;
    border:0;
    clip-path:none;
}
.hero--home-variants[data-variant] .hero-media::after{
    background:linear-gradient(90deg,rgba(23,24,23,.38),transparent 34%),linear-gradient(0deg,rgba(23,24,23,.3),transparent 54%);
}
.hero--home-variants[data-variant] .hero-grid{--surface-explicit-tone:accent}
.hero--home-variants[data-variant] .hero-copy-zone p,
.hero--home-variants[data-variant] .hero-cta>p{color:#292414}

/* Die gelben Hero-Buttons bleiben beim Card-Wechsel unverändert. */
.hero--home-variants[data-variant] .btn,
.hero--home-variants[data-variant] .btn--secondary{
    background:var(--brand);
    color:var(--ink);
}
.hero--home-variants[data-variant] .btn .btn__icon,
.hero--home-variants[data-variant] .btn--secondary .btn__icon{background:transparent;color:var(--ink)}
.hero--home-variants[data-variant] .btn::before,
.hero--home-variants[data-variant] .btn::after,
.hero--home-variants[data-variant] .btn--secondary::before,
.hero--home-variants[data-variant] .btn--secondary::after{background:var(--ink)}
.hero--home-variants[data-variant] .btn:hover,
.hero--home-variants[data-variant] .btn:focus-visible,
.hero--home-variants[data-variant] .btn--secondary:hover,
.hero--home-variants[data-variant] .btn--secondary:focus-visible{color:var(--white)}

/* Gemeinsame, rechteckige Grundform mit dauerhaft links sitzendem Icon. */
.hero--home-variants[data-variant] .hero-benefits li,
.hero--home-variants[data-variant] .hero-benefits li:nth-child(even){
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    align-items:center;
    min-height:76px;
    padding:11px 14px;
    gap:11px;
    margin:0;
    color:var(--paper);
    background:#20231f;
    border-radius:var(--radius-ui);
    clip-path:none;
    transform:none;
}
.hero--home-variants[data-variant] .hero-benefits svg{
    grid-column:1;
    width:38px;
    height:38px;
    padding:8px;
    border-radius:var(--radius-ui);
}
.hero--home-variants[data-variant] .hero-benefits span{grid-column:2}

/* Card 01: massiver Graphitkontakt mit gelbem Boden. */
.hero--home-variants[data-variant="1"] .hero-benefits li,
.hero--home-variants[data-variant="1"] .hero-benefits li:nth-child(even){
    background:#252824;
    border:1px solid rgba(255,255,255,.17);
    border-bottom:5px solid var(--brand);
    box-shadow:none;
    animation:hero-card-contact-in .52s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="1"] .hero-benefits svg{background:var(--brand);border:0;color:var(--ink)}

/* Card 02: tiefschwarze Präzisionsplatte mit doppelter Innenkontur. */
.hero--home-variants[data-variant="2"] .hero-benefits li,
.hero--home-variants[data-variant="2"] .hero-benefits li:nth-child(even){
    background:#111311;
    border:1px solid rgba(255,255,255,.38);
    border-bottom:1px solid rgba(255,255,255,.38);
    box-shadow:inset 0 0 0 4px #20231f;
    animation:hero-card-outline-in .5s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-variant="2"] .hero-benefits svg{background:transparent;border:1px solid var(--brand);color:var(--brand)}

/* Card 03: dunkles Register mit horizontaler gelber Kopfkante. */
.hero--home-variants[data-variant="3"] .hero-benefits li,
.hero--home-variants[data-variant="3"] .hero-benefits li:nth-child(even){
    background:#1a1c19;
    border:0;
    border-top:6px solid var(--brand);
    box-shadow:0 7px 0 rgba(0,0,0,.26);
    animation:hero-card-register-in .48s ease both;
}
.hero--home-variants[data-variant="3"] .hero-benefits svg{background:var(--brand);border:0;color:var(--ink)}

/* Card 04: gerahmte Schaltkarte mit eckigem Kontaktpunkt. */
.hero--home-variants[data-variant="4"] .hero-benefits li,
.hero--home-variants[data-variant="4"] .hero-benefits li:nth-child(even){
    background:#171917;
    border:1px solid rgba(255,255,255,.42);
    box-shadow:inset 0 0 0 5px rgba(255,255,255,.055),inset 0 -4px 0 var(--brand);
    animation:hero-card-console-in .5s ease both;
}
.hero--home-variants[data-variant="4"] .hero-benefits li::after{content:"";position:absolute;top:8px;right:8px;width:8px;height:8px;background:var(--brand);border-radius:0}
.hero--home-variants[data-variant="4"] .hero-benefits svg{background:#2c2f2a;border:1px solid var(--brand);color:var(--brand)}

/* Card 05: dunkle Signalplatte mit gelber Eckmarke und Tiefenstufe. */
.hero--home-variants[data-variant="5"] .hero-benefits li,
.hero--home-variants[data-variant="5"] .hero-benefits li:nth-child(even){
    background:linear-gradient(135deg,#30332f 0 72%,#222420 72% 100%);
    border:1px solid rgba(255,255,255,.14);
    box-shadow:6px 6px 0 #111311;
    animation:hero-card-signal-in .52s ease both;
}
.hero--home-variants[data-variant="5"] .hero-benefits li::before{content:"";position:absolute;top:0;right:0;width:34px;height:6px;background:var(--brand);opacity:1}
.hero--home-variants[data-variant="5"] .hero-benefits svg{background:var(--brand);border:0;color:var(--ink)}

.hero--home-variants[data-variant] .hero-benefits li:nth-child(2){animation-delay:.07s}
.hero--home-variants[data-variant] .hero-benefits li:nth-child(3){animation-delay:.14s}
.hero--home-variants[data-variant] .hero-benefits li:nth-child(4){animation-delay:.21s}

@media (max-width:900px){
    .hero--home-variants[data-variant]::before{inset:0 0 29% 0;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
    .hero--home-variants[data-variant] .hero-media{inset:58% 0 0;opacity:.64;clip-path:none;border:0}
    .hero--home-variants[data-variant] .hero-media::after{background:linear-gradient(180deg,var(--ink),rgba(23,24,23,.06) 58%),linear-gradient(0deg,rgba(23,24,23,.38),transparent 58%)}
}

@media (max-width:680px){
    .hero--home-variants[data-variant]::before{inset:0 0 10% 0}
    .hero--home-variants[data-variant] .hero-media{inset:76% 0 0}
    .hero--home-variants[data-variant] .hero-benefits li,
    .hero--home-variants[data-variant] .hero-benefits li:nth-child(even){grid-template-columns:28px minmax(0,1fr);min-height:68px;padding:8px;gap:8px}
    .hero--home-variants[data-variant] .hero-benefits svg{width:28px;height:28px;padding:5px}
}

@media (prefers-reduced-motion:reduce){
    .hero--home-variants[data-variant] .hero-benefits li{animation:none!important}
}

/* =========================================================
   Startseiten-Hero: fester Hintergrund 4, fünf Aufbauten
   Die Regeln überschreiben die historischen Farb-/Card-Docks.
   ========================================================= */
.hero--home-variants[data-variant]{
    --home-hero-height:calc(var(--viewport-height,100dvh) - var(--header-height));
    --home-surface:#bdc8c5;
    height:var(--home-hero-height);
    min-height:var(--home-hero-height);
    max-height:var(--home-hero-height);
    isolation:isolate;
    overflow:hidden;
    background:var(--ink);
    color:var(--ink);
}
.hero--home-variants[data-variant]::before{
    content:"";
    display:block;
    position:absolute;
    z-index:1;
    inset:0 46% 0 0;
    width:auto;
    height:auto;
    background:linear-gradient(135deg,#e4e9e7 0%,var(--home-surface) 66%,#899696 100%);
    border:0;
    box-shadow:none;
    clip-path:polygon(0 0,100% 0,92% 100%,0 100%);
    animation:none;
}
.hero--home-variants[data-variant]::after{content:none;display:none}
.hero--home-variants[data-variant] .hero-media{
    inset:0;
    width:100%;
    height:100%;
    opacity:1;
    border:0;
    clip-path:none;
}
.hero--home-variants[data-variant] .hero-image{
    object-position:60% center;
    transform:scale(1.01);
}
.hero--home-variants[data-variant] .hero-media::after{
    background:linear-gradient(90deg,rgba(23,24,23,.14) 0%,rgba(23,24,23,.06) 48%,transparent 70%),linear-gradient(0deg,rgba(23,24,23,.22),transparent 48%);
}
.hero--home-variants[data-variant] .hero-grid{
    position:relative;
    z-index:2;
    width:100%;
    max-width:1600px;
    height:var(--home-hero-height);
    min-height:var(--home-hero-height);
    max-height:var(--home-hero-height);
    margin:0 auto;
    padding:30px 80px 30px 0;
    grid-template-columns:320px 340px minmax(0,1fr);
    grid-template-areas:
        "kicker kicker ."
        "title title ."
        "copy copy ."
        "cta cta ."
        "benefits benefits .";
    align-content:safe center;
    row-gap:16px;
    column-gap:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:none;
    --surface-explicit-tone:light;
}
.hero--home-variants[data-variant] .hero-grid::-webkit-scrollbar{display:none}
.hero--home-variants[data-variant] .hero-kicker{
    grid-area:kicker;
    justify-self:start;
    width:max-content;
    max-width:100%;
    margin:0;
    padding:7px 10px;
    background:var(--ink);
    color:var(--brand-bright);
    font-family:var(--font-ui);
    font-size:14px;
    font-weight:800;
    line-height:1.2;
    letter-spacing:1.2px;
    text-transform:uppercase;
}
.hero--home-variants[data-variant] .hero-title-zone,
.hero--home-variants[data-variant] .hero-copy-zone,
.hero--home-variants[data-variant] .hero-cta,
.hero--home-variants[data-variant] .hero-benefits{
    width:100%;
    max-width:none;
    margin:0;
    border:0;
    box-shadow:none;
}
.hero--home-variants[data-variant] .hero-title-zone{grid-area:title;position:relative;padding:0;background:transparent}
.hero--home-variants[data-variant] .hero-copy-zone{grid-area:copy;position:relative;padding:0;background:transparent}
.hero--home-variants[data-variant] .hero-cta{grid-area:cta;position:relative;padding:0;background:transparent}
.hero--home-variants[data-variant] .hero-benefits{grid-area:benefits}
.hero--home-variants[data-variant] .hero-title-zone::before,
.hero--home-variants[data-variant] .hero-title-zone::after,
.hero--home-variants[data-variant] .hero-copy-zone::before,
.hero--home-variants[data-variant] .hero-copy-zone::after,
.hero--home-variants[data-variant] .hero-cta::before,
.hero--home-variants[data-variant] .hero-cta::after{content:none;display:none}
.hero--home-variants[data-variant] h1{
    margin:0;
    color:inherit;
    font-size:50px;
    line-height:1.04;
    letter-spacing:-1.3px;
    text-wrap:balance;
}
.hero--home-variants[data-variant] .hero-copy-zone p,
.hero--home-variants[data-variant] .hero-cta>p{
    margin:0;
    color:#303531;
    font-size:18px;
    line-height:1.48;
    text-align:left;
}
.hero--home-variants[data-variant] .hero-cta>p{margin-bottom:15px}
.hero--home-variants[data-variant] .button-row{gap:9px}
.hero--home-variants[data-variant] .btn,
.hero--home-variants[data-variant] .btn--secondary{
    background:#111311;
    color:var(--white);
    box-shadow:none;
}
.hero--home-variants[data-variant] .btn .btn__icon,
.hero--home-variants[data-variant] .btn--secondary .btn__icon{background:transparent;color:var(--brand)}
.hero--home-variants[data-variant] .btn::before,
.hero--home-variants[data-variant] .btn::after,
.hero--home-variants[data-variant] .btn--secondary::before,
.hero--home-variants[data-variant] .btn--secondary::after{background:var(--brand)}
.hero--home-variants[data-variant] .btn:hover,
.hero--home-variants[data-variant] .btn:focus-visible,
.hero--home-variants[data-variant] .btn--secondary:hover,
.hero--home-variants[data-variant] .btn--secondary:focus-visible{color:var(--ink)}

/* Feste Card 5: rechteckig, ohne Tiefenschatten, immer nach den Buttons. */
.hero--home-variants[data-variant] .hero-benefits{
    position:relative;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-self:stretch;
    gap:9px;
    padding:0;
    background:transparent;
}
.hero--home-variants[data-variant] .hero-benefits::before{content:none;display:none}
.hero--home-variants[data-variant] .hero-benefits li,
.hero--home-variants[data-variant] .hero-benefits li:nth-child(even){
    position:relative;
    display:grid;
    grid-template-columns:36px minmax(0,1fr);
    align-items:center;
    width:auto;
    min-width:0;
    min-height:72px;
    margin:0;
    padding:10px 13px;
    gap:10px;
    overflow:hidden;
    color:var(--paper);
    background:linear-gradient(135deg,#30332f 0 72%,#222420 72% 100%);
    border:1px solid rgba(255,255,255,.16);
    border-radius:var(--radius-ui);
    box-shadow:none!important;
    clip-path:none;
    transform:none;
    font-size:18px;
    line-height:1.28;
    transition:transform .28s ease,border-color .28s ease,background-color .28s ease;
    animation:home-card-contact-in .46s cubic-bezier(.2,.8,.2,1) backwards;
}
.hero--home-variants[data-variant] .hero-benefits li::before,
.hero--home-variants[data-variant] .hero-benefits li:nth-child(even)::before{
    content:"";
    display:block;
    position:absolute;
    top:0;
    right:0;
    width:34px;
    height:5px;
    background:var(--brand);
    opacity:1;
}
.hero--home-variants[data-variant] .hero-benefits li::after{content:none;display:none}
.hero--home-variants[data-variant] .hero-benefits svg,
.hero--home-variants[data-variant] .hero-benefits li:nth-child(even) svg{
    grid-column:1;
    width:36px;
    height:36px;
    padding:7px;
    margin:0;
    background:var(--brand);
    border:0;
    border-radius:var(--radius-ui);
    color:var(--ink);
    transition:background-color .28s ease,color .28s ease,transform .28s ease;
}
.hero--home-variants[data-variant] .hero-benefits span{grid-column:2;min-width:0;overflow-wrap:break-word;hyphens:auto}
.hero--home-variants[data-variant] .hero-benefits li:hover{
    transform:translateY(-3px);
    border-color:var(--brand);
    background:#171917;
}
.hero--home-variants[data-variant] .hero-benefits li:hover svg{background:var(--paper);transform:translateX(2px)}
.hero--home-variants[data-variant] .hero-benefits li:nth-child(2){animation-delay:.06s}
.hero--home-variants[data-variant] .hero-benefits li:nth-child(3){animation-delay:.12s}
.hero--home-variants[data-variant] .hero-benefits li:nth-child(4){animation-delay:.18s}

/* 01: Signalstapel – offene Typografie mit präzisen Anschlusskanten. */
.hero--home-variants[data-variant="1"] .hero-title-zone{padding:2px 0 15px;border-bottom:5px solid var(--ink)}
.hero--home-variants[data-variant="1"] .hero-copy-zone{padding:13px 16px;background:rgba(255,255,255,.28);border-top:1px solid rgba(23,24,23,.34)}
.hero--home-variants[data-variant="1"] .hero-kicker{animation:home-kicker-snap .38s ease both}
.hero--home-variants[data-variant="1"] .hero-title-zone{animation:home-title-rise .56s cubic-bezier(.2,.8,.2,1) .05s both}
.hero--home-variants[data-variant="1"] .hero-copy-zone{animation:home-copy-rise .5s ease .13s both}
.hero--home-variants[data-variant="1"] .hero-cta{animation:home-cta-rise .5s ease .2s both}

/* 02: Leiterrahmen – Titel und Text werden als verbundenes Dossier geführt. */
.hero--home-variants[data-variant="2"] .hero-grid{row-gap:11px}
.hero--home-variants[data-variant="2"] .hero-title-zone{
    padding:20px 22px;
    background:rgba(255,255,255,.24);
    border:1px solid rgba(23,24,23,.55);
}
.hero--home-variants[data-variant="2"] .hero-title-zone::after{
    content:"";
    display:block;
    position:absolute;
    top:-1px;
    right:-1px;
    width:84px;
    height:7px;
    background:var(--brand);
}
.hero--home-variants[data-variant="2"] .hero-copy-zone{padding:14px 17px;background:#20231f}
.hero--home-variants[data-variant="2"] .hero-copy-zone p{color:var(--paper)}
.hero--home-variants[data-variant="2"] .hero-cta{padding:14px 17px;background:rgba(232,164,7,.24);border:1px solid rgba(23,24,23,.28)}
.hero--home-variants[data-variant="2"] .hero-kicker{animation:home-kicker-slide .42s ease both}
.hero--home-variants[data-variant="2"] .hero-title-zone{animation:home-frame-draw .62s cubic-bezier(.2,.8,.2,1) .04s both}
.hero--home-variants[data-variant="2"] .hero-copy-zone{animation:home-copy-left .52s ease .13s both}
.hero--home-variants[data-variant="2"] .hero-cta{animation:home-cta-right .52s ease .2s both}

/* 03: Schaltkonsole – dunkler Titelkopf, Lead und Anfrage nebeneinander. */
.hero--home-variants[data-variant="3"] .hero-grid{
    grid-template-columns:330px 330px minmax(0,1fr);
    grid-template-areas:
        "kicker kicker ."
        "title title ."
        "copy cta ."
        "benefits benefits .";
    column-gap:10px;
    row-gap:12px;
}
.hero--home-variants[data-variant="3"] .hero-title-zone{padding:19px 22px;background:#171917;color:var(--paper);border-bottom:7px solid var(--brand)}
.hero--home-variants[data-variant="3"] .hero-copy-zone{height:100%;padding:17px;background:rgba(255,255,255,.32);border:1px solid rgba(23,24,23,.22)}
.hero--home-variants[data-variant="3"] .hero-cta{height:100%;padding:17px;background:rgba(255,255,255,.18);border:1px solid rgba(23,24,23,.48)}
.hero--home-variants[data-variant="3"] .hero-cta .button-row{display:grid;grid-template-columns:1fr}
.hero--home-variants[data-variant="3"] .hero-cta .btn{width:100%}
.hero--home-variants[data-variant="3"] .hero-kicker{animation:home-kicker-snap .38s ease both}
.hero--home-variants[data-variant="3"] .hero-title-zone{animation:home-console-open .6s cubic-bezier(.2,.8,.2,1) .04s both}
.hero--home-variants[data-variant="3"] .hero-copy-zone{animation:home-panel-up .48s ease .14s both}
.hero--home-variants[data-variant="3"] .hero-cta{animation:home-panel-up .48s ease .22s both}

/* 04: Markenplakat – kompakte gelbe Titelbühne mit zentraler Leseführung. */
.hero--home-variants[data-variant="4"] .hero-grid{row-gap:13px}
.hero--home-variants[data-variant="4"] .hero-kicker{justify-self:center;background:transparent;color:var(--ink);border:1px solid rgba(23,24,23,.52)}
.hero--home-variants[data-variant="4"] .hero-title-zone{padding:18px 22px;background:var(--brand);color:var(--ink);border-bottom:7px solid var(--ink)}
.hero--home-variants[data-variant="4"] h1{text-align:center}
.hero--home-variants[data-variant="4"] .hero-copy-zone{padding:0 24px}
.hero--home-variants[data-variant="4"] .hero-copy-zone p,
.hero--home-variants[data-variant="4"] .hero-cta>p{text-align:center}
.hero--home-variants[data-variant="4"] .hero-cta{padding:14px 18px;background:rgba(255,255,255,.24)}
.hero--home-variants[data-variant="4"] .button-row{justify-content:center}
.hero--home-variants[data-variant="4"] .hero-kicker{animation:home-kicker-drop .42s ease both}
.hero--home-variants[data-variant="4"] .hero-title-zone{animation:home-poster-reveal .62s cubic-bezier(.2,.8,.2,1) .04s both}
.hero--home-variants[data-variant="4"] .hero-copy-zone{animation:home-copy-focus .52s ease .14s both}
.hero--home-variants[data-variant="4"] .hero-cta{animation:home-copy-focus .52s ease .22s both}

/* 05: Systemraster – asymmetrische Text-/CTA-Bank unter einem freien Titel. */
.hero--home-variants[data-variant="5"] .hero-grid{
    grid-template-columns:390px 270px minmax(0,1fr);
    grid-template-areas:
        "kicker kicker ."
        "title title ."
        "copy cta ."
        "benefits benefits .";
    column-gap:12px;
    row-gap:14px;
}
.hero--home-variants[data-variant="5"] .hero-kicker{width:100%;display:flex;justify-content:space-between;background:#171917}
.hero--home-variants[data-variant="5"] .hero-kicker::after{content:"04 / SYSTEM";margin-left:20px;color:var(--paper);font-size:12px;letter-spacing:1px}
.hero--home-variants[data-variant="5"] .hero-title-zone{padding:0 0 16px;border-bottom:7px solid var(--brand)}
.hero--home-variants[data-variant="5"] .hero-copy-zone{height:100%;padding:16px 17px;background:rgba(255,255,255,.3)}
.hero--home-variants[data-variant="5"] .hero-cta{height:100%;padding:16px;background:#2a2d29}
.hero--home-variants[data-variant="5"] .hero-cta>p{color:var(--paper)}
.hero--home-variants[data-variant="5"] .hero-cta .button-row{display:grid;grid-template-columns:1fr}
.hero--home-variants[data-variant="5"] .hero-cta .btn{width:100%;border:1px solid rgba(241,181,28,.65)}
.hero--home-variants[data-variant="5"] .hero-kicker{animation:home-system-line .5s ease both}
.hero--home-variants[data-variant="5"] .hero-title-zone{animation:home-system-title .58s cubic-bezier(.2,.8,.2,1) .05s both}
.hero--home-variants[data-variant="5"] .hero-copy-zone{animation:home-system-cell-left .5s ease .15s both}
.hero--home-variants[data-variant="5"] .hero-cta{animation:home-system-cell-right .5s ease .22s both}

@keyframes home-card-contact-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes home-kicker-snap{from{opacity:0;transform:translateX(-22px);letter-spacing:4px}to{opacity:1;transform:none;letter-spacing:1.2px}}
@keyframes home-title-rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes home-copy-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes home-cta-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes home-kicker-slide{from{opacity:0;transform:translateX(36px)}to{opacity:1;transform:none}}
@keyframes home-frame-draw{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes home-copy-left{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
@keyframes home-cta-right{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes home-console-open{from{opacity:0;transform:scaleX(.76);transform-origin:left}to{opacity:1;transform:scaleX(1);transform-origin:left}}
@keyframes home-panel-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes home-kicker-drop{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:none}}
@keyframes home-poster-reveal{from{opacity:0;clip-path:inset(50% 0 50% 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes home-copy-focus{from{opacity:0;filter:blur(7px);transform:scale(.98)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes home-system-line{from{opacity:0;transform:scaleX(.45);transform-origin:left}to{opacity:1;transform:scaleX(1);transform-origin:left}}
@keyframes home-system-title{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}
@keyframes home-system-cell-left{from{opacity:0;transform:translate(-20px,16px)}to{opacity:1;transform:none}}
@keyframes home-system-cell-right{from{opacity:0;transform:translate(20px,16px)}to{opacity:1;transform:none}}

@media (max-width:1440px){
    .hero--home-variants[data-variant] .hero-grid{padding-left:var(--side-pad);padding-right:76px}
}

@media (min-width:901px) and (max-height:920px){
    .hero--home-variants[data-variant] .hero-grid{padding-top:18px;padding-bottom:18px}
    .hero--home-variants[data-variant="2"] .hero-title-zone{padding:16px 19px}
    .hero--home-variants[data-variant="3"] h1{font-size:46px}
    .hero--home-variants[data-variant="3"] .hero-title-zone{padding:14px 18px}
    .hero--home-variants[data-variant="3"] .hero-copy-zone,
    .hero--home-variants[data-variant="3"] .hero-cta{padding:13px 14px}
    .hero--home-variants[data-variant="3"] .hero-cta>p{line-height:1.38;margin-bottom:11px}
}

@media (max-width:900px){
    .hero--home-variants[data-variant]::before{inset:0 0 13% 0;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
    .hero--home-variants[data-variant] .hero-media{inset:68% 0 0;width:auto;height:auto;opacity:.72}
    .hero--home-variants[data-variant] .hero-image{object-position:center 55%;transform:none}
    .hero--home-variants[data-variant] .hero-media::after{background:linear-gradient(180deg,var(--ink),rgba(23,24,23,.04) 55%),linear-gradient(0deg,rgba(23,24,23,.28),transparent 62%)}
    .hero--home-variants[data-variant] .hero-grid,
    .hero--home-variants[data-variant="3"] .hero-grid,
    .hero--home-variants[data-variant="5"] .hero-grid{
        grid-template-columns:1fr;
        grid-template-areas:"kicker" "title" "copy" "cta" "benefits";
        padding:24px 88px 24px var(--side-pad);
        row-gap:12px;
        column-gap:0;
    }
    .hero--home-variants[data-variant] .hero-title-zone,
    .hero--home-variants[data-variant] .hero-copy-zone,
    .hero--home-variants[data-variant] .hero-cta,
    .hero--home-variants[data-variant] .hero-benefits{max-width:650px}
    .hero--home-variants[data-variant="3"] .hero-copy-zone,
    .hero--home-variants[data-variant="3"] .hero-cta,
    .hero--home-variants[data-variant="5"] .hero-copy-zone,
    .hero--home-variants[data-variant="5"] .hero-cta{height:auto}
    .hero--home-variants[data-variant="3"] .hero-cta .button-row,
    .hero--home-variants[data-variant="5"] .hero-cta .button-row{display:flex}
    .hero--home-variants[data-variant="3"] .hero-cta .btn,
    .hero--home-variants[data-variant="5"] .hero-cta .btn{width:auto}
}

@media (max-width:680px){
    .hero--home-variants[data-variant]::before{inset:0 0 7% 0}
    .hero--home-variants[data-variant] .hero-media{inset:80% 0 0}
    .hero--home-variants[data-variant] .hero-grid,
    .hero--home-variants[data-variant="3"] .hero-grid,
    .hero--home-variants[data-variant="5"] .hero-grid{padding:17px 58px 17px var(--side-pad);row-gap:9px}
    .hero--home-variants[data-variant] .hero-kicker{justify-self:center;padding:6px 8px;font-size:12px;letter-spacing:.8px;text-align:center}
    .hero--home-variants[data-variant="5"] .hero-kicker::after{display:none}
    .hero--home-variants[data-variant] h1{font-size:30px;line-height:1.05;letter-spacing:-.5px;text-align:center}
    .hero--home-variants[data-variant] .hero-copy-zone p,
    .hero--home-variants[data-variant] .hero-cta>p{font-size:18px;line-height:1.3;text-align:center}
    .hero--home-variants[data-variant] .hero-cta>p{margin-bottom:10px}
    .hero--home-variants[data-variant] .button-row{gap:7px}
    .hero--home-variants[data-variant] .hero-benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
    .hero--home-variants[data-variant] .hero-benefits li,
    .hero--home-variants[data-variant] .hero-benefits li:nth-child(even){grid-template-columns:28px minmax(0,1fr);min-height:72px;padding:8px;gap:7px;font-size:18px;line-height:1.18;box-shadow:none!important}
    .hero--home-variants[data-variant] .hero-benefits svg,
    .hero--home-variants[data-variant] .hero-benefits li:nth-child(even) svg{width:28px;height:28px;padding:5px}
    .hero--home-variants[data-variant="1"] .hero-title-zone{padding-bottom:9px;border-bottom-width:4px}
    .hero--home-variants[data-variant="1"] .hero-copy-zone,
    .hero--home-variants[data-variant="2"] .hero-title-zone,
    .hero--home-variants[data-variant="2"] .hero-copy-zone,
    .hero--home-variants[data-variant="2"] .hero-cta,
    .hero--home-variants[data-variant="3"] .hero-title-zone,
    .hero--home-variants[data-variant="3"] .hero-copy-zone,
    .hero--home-variants[data-variant="3"] .hero-cta,
    .hero--home-variants[data-variant="4"] .hero-title-zone,
    .hero--home-variants[data-variant="4"] .hero-copy-zone,
    .hero--home-variants[data-variant="4"] .hero-cta,
    .hero--home-variants[data-variant="5"] .hero-copy-zone,
    .hero--home-variants[data-variant="5"] .hero-cta{padding:9px 10px}
    .hero--home-variants[data-variant="3"] .hero-cta .button-row,
    .hero--home-variants[data-variant="5"] .hero-cta .button-row{display:flex}
    .hero--home-variants[data-variant="3"] .hero-cta .btn,
    .hero--home-variants[data-variant="5"] .hero-cta .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
    .hero--home-variants[data-variant] .hero-kicker,
    .hero--home-variants[data-variant] .hero-title-zone,
    .hero--home-variants[data-variant] .hero-copy-zone,
    .hero--home-variants[data-variant] .hero-cta,
    .hero--home-variants[data-variant] .hero-benefits li{animation:none!important;transition:none!important}
}

/* =========================================================
   Startseiten-Hero: fünf unabhängige Hintergrundsysteme
   Aufbau und Hintergrund lassen sich getrennt kombinieren.
   ========================================================= */
.hero--home-variants .variant-dock[data-for="home-hero"]{top:34%}
.hero--home-variants .variant-dock[data-for="home-hero-background"]{top:68%}

.hero--home-variants[data-hero-background]::before{
    opacity:1;
    background-size:auto;
    background-position:0 0;
    backdrop-filter:none;
    box-shadow:none;
}
.hero--home-variants[data-hero-background]::after{content:none;display:none}
.hero--home-variants[data-hero-background="1"],
.hero--home-variants[data-hero-background="2"],
.hero--home-variants[data-hero-background="4"]{color:var(--ink)}
.hero--home-variants[data-hero-background="1"] .hero-grid,
.hero--home-variants[data-hero-background="2"] .hero-grid,
.hero--home-variants[data-hero-background="4"] .hero-grid{--surface-explicit-tone:light}
.hero--home-variants[data-hero-background="1"] .hero-copy-zone p,
.hero--home-variants[data-hero-background="1"] .hero-cta>p,
.hero--home-variants[data-hero-background="2"] .hero-copy-zone p,
.hero--home-variants[data-hero-background="2"] .hero-cta>p,
.hero--home-variants[data-hero-background="4"] .hero-copy-zone p,
.hero--home-variants[data-hero-background="4"] .hero-cta>p{color:#30312d}

/* 01: Signalgelb mit einer einzelnen technischen Schrägspur. */
.hero--home-variants[data-hero-background="1"]::before{
    background:
        linear-gradient(112deg,transparent 0 63%,rgba(23,24,23,.1) 63% 65%,transparent 65% 100%),
        linear-gradient(135deg,#f7c42d 0%,#e8a407 68%,#c77f00 100%);
    animation:hero-bg-signal-in .48s cubic-bezier(.2,.8,.2,1) both;
}

/* 02: warmes Leiterplan-Weiß mit ruhigem 46-Pixel-Raster. */
.hero--home-variants[data-hero-background="2"]::before{
    background-color:#f7f5ef;
    background-image:
        linear-gradient(90deg,rgba(23,24,23,.055) 1px,transparent 1px),
        linear-gradient(0deg,rgba(23,24,23,.055) 1px,transparent 1px),
        linear-gradient(135deg,#fffdf8 0%,#eee7da 100%);
    background-size:46px 46px,46px 46px,auto;
    animation:hero-bg-plan-in .54s ease both;
}

/* 03: tiefes Graphit mit einer echten gelben Kontaktkante. */
.hero--home-variants[data-hero-background="3"]{color:var(--paper)}
.hero--home-variants[data-hero-background="3"]::before{
    background:
        linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px) 0 0/56px 100%,
        linear-gradient(135deg,#343833 0%,#181a18 68%,#090a09 100%);
    animation:hero-bg-graphite-in .52s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-hero-background="3"]::after{
    content:"";
    display:block;
    position:absolute;
    z-index:1;
    top:0;
    right:45.25%;
    bottom:0;
    width:18px;
    background:var(--brand);
    clip-path:polygon(68% 0,100% 0,32% 100%,0 100%);
    animation:hero-bg-contact-edge .48s ease both;
}
.hero--home-variants[data-hero-background="3"] .hero-grid{--surface-explicit-tone:dark}
.hero--home-variants[data-hero-background="3"] .hero-copy-zone p,
.hero--home-variants[data-hero-background="3"] .hero-cta>p{color:#efeee7}
.hero--home-variants[data-hero-background="3"][data-variant="1"] .hero-title-zone{border-bottom-color:var(--brand)}
.hero--home-variants[data-hero-background="3"][data-variant="1"] .hero-copy-zone{background:rgba(255,255,255,.08);border-top-color:rgba(255,255,255,.24)}
.hero--home-variants[data-hero-background="3"][data-variant="2"] .hero-title-zone{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.42)}
.hero--home-variants[data-hero-background="3"][data-variant="3"] .hero-copy-zone,
.hero--home-variants[data-hero-background="3"][data-variant="5"] .hero-copy-zone{background:rgba(247,245,239,.92)}
.hero--home-variants[data-hero-background="3"][data-variant="3"] .hero-copy-zone p,
.hero--home-variants[data-hero-background="3"][data-variant="5"] .hero-copy-zone p{color:var(--ink)}
.hero--home-variants[data-hero-background="3"][data-variant="4"] .hero-kicker{color:var(--paper);border-color:rgba(255,255,255,.5)}
.hero--home-variants[data-hero-background="3"][data-variant="4"] .hero-cta{background:rgba(8,9,8,.46)}

/* 04: warmer Sand-/Kupferton mit einer breiten Materialfuge. */
.hero--home-variants[data-hero-background="4"]::before{
    background:linear-gradient(126deg,#f6efe4 0 51%,#caa468 51% 53%,#e7d6ba 53% 78%,#d7bf98 78% 100%);
    animation:hero-bg-sand-in .56s ease both;
}

/* 05: dunkles Bronze-Schaltfeld mit zwei feinen Leiterbahnen. */
.hero--home-variants[data-hero-background="5"]{color:var(--paper)}
.hero--home-variants[data-hero-background="5"]::before{
    background:
        linear-gradient(118deg,transparent 0 43%,rgba(241,181,28,.14) 43% 44%,transparent 44% 70%,rgba(241,181,28,.22) 70% 72%,transparent 72% 100%),
        linear-gradient(135deg,#865d17 0%,#5f3d09 66%,#2d1b03 100%);
    animation:hero-bg-bronze-in .56s cubic-bezier(.2,.8,.2,1) both;
}
.hero--home-variants[data-hero-background="5"] .hero-grid{--surface-explicit-tone:dark}
.hero--home-variants[data-hero-background="5"] .hero-copy-zone p,
.hero--home-variants[data-hero-background="5"] .hero-cta>p{color:#f3efe4}
.hero--home-variants[data-hero-background="5"][data-variant="1"] .hero-title-zone{border-bottom-color:var(--brand-bright)}
.hero--home-variants[data-hero-background="5"][data-variant="1"] .hero-copy-zone{background:rgba(12,8,2,.2);border-top-color:rgba(255,255,255,.24)}
.hero--home-variants[data-hero-background="5"][data-variant="2"] .hero-title-zone{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.42)}
.hero--home-variants[data-hero-background="5"][data-variant="3"] .hero-copy-zone,
.hero--home-variants[data-hero-background="5"][data-variant="5"] .hero-copy-zone{background:rgba(247,245,239,.92)}
.hero--home-variants[data-hero-background="5"][data-variant="3"] .hero-copy-zone p,
.hero--home-variants[data-hero-background="5"][data-variant="5"] .hero-copy-zone p{color:var(--ink)}
.hero--home-variants[data-hero-background="5"][data-variant="4"] .hero-kicker{color:var(--paper);border-color:rgba(255,255,255,.5)}
.hero--home-variants[data-hero-background="5"][data-variant="4"] .hero-cta{background:rgba(8,5,1,.38)}

/* Dunkle Fläche: festes Buttonsystem automatisch als gelber Kontaktkörper. */
.hero--home-variants[data-hero-background="3"] .btn,
.hero--home-variants[data-hero-background="3"] .btn--secondary,
.hero--home-variants[data-hero-background="5"] .btn,
.hero--home-variants[data-hero-background="5"] .btn--secondary{
    background:var(--brand);
    color:var(--ink);
    border-color:var(--brand);
}
.hero--home-variants[data-hero-background="3"] .btn .btn__icon,
.hero--home-variants[data-hero-background="3"] .btn--secondary .btn__icon,
.hero--home-variants[data-hero-background="5"] .btn .btn__icon,
.hero--home-variants[data-hero-background="5"] .btn--secondary .btn__icon{color:var(--ink)}
.hero--home-variants[data-hero-background="3"] .btn::before,
.hero--home-variants[data-hero-background="3"] .btn::after,
.hero--home-variants[data-hero-background="3"] .btn--secondary::before,
.hero--home-variants[data-hero-background="3"] .btn--secondary::after,
.hero--home-variants[data-hero-background="5"] .btn::before,
.hero--home-variants[data-hero-background="5"] .btn::after,
.hero--home-variants[data-hero-background="5"] .btn--secondary::before,
.hero--home-variants[data-hero-background="5"] .btn--secondary::after{background:var(--paper)}

@keyframes hero-bg-signal-in{from{opacity:.2;clip-path:polygon(0 0,0 0,0 100%,0 100%)}to{opacity:1;clip-path:polygon(0 0,100% 0,92% 100%,0 100%)}}
@keyframes hero-bg-plan-in{from{opacity:0;background-position:-46px 0,0 -46px,0 0}to{opacity:1;background-position:0 0,0 0,0 0}}
@keyframes hero-bg-graphite-in{from{opacity:.2;transform:translateX(-54px)}to{opacity:1;transform:none}}
@keyframes hero-bg-contact-edge{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
@keyframes hero-bg-sand-in{from{opacity:.15;filter:saturate(.4)}to{opacity:1;filter:saturate(1)}}
@keyframes hero-bg-bronze-in{from{opacity:.15;transform:translateX(-36px);filter:saturate(.45)}to{opacity:1;transform:none;filter:saturate(1)}}

@media (max-width:900px){
    .hero--home-variants .variant-dock[data-for="home-hero"]{top:34%}
    .hero--home-variants .variant-dock[data-for="home-hero-background"]{top:68%}
    .hero--home-variants[data-hero-background="3"]::after{content:none;display:none}
}

@media (prefers-reduced-motion:reduce){
    .hero--home-variants[data-hero-background]::before,
    .hero--home-variants[data-hero-background]::after{animation:none!important}
}

@media not all {
/* =========================================================
   Historischer Produktionsblock: durch den neuen Hero-Aufbau ersetzt.
   ========================================================= */
.hero--home-variants[data-variant] .hero-grid{
    row-gap:22px;
    column-gap:36px;
}
.hero--home-variants[data-variant] .hero-cta>p{margin-bottom:18px}
.hero--home-variants[data-variant] .button-row{gap:10px}

/* Card 5 bleibt unabhängig vom Hintergrundwert unverändert. */
.hero--home-variants[data-variant] .hero-benefits li,
.hero--home-variants[data-variant] .hero-benefits li:nth-child(even){
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    align-items:center;
    min-height:76px;
    padding:11px 14px;
    gap:11px;
    margin:0;
    color:var(--paper);
    background:linear-gradient(135deg,#30332f 0 72%,#222420 72% 100%);
    border:1px solid rgba(255,255,255,.14);
    border-radius:var(--radius-ui);
    box-shadow:6px 6px 0 #111311;
    clip-path:none;
    transform:none;
    animation:hero-card-signal-in .52s ease both;
}
.hero--home-variants[data-variant] .hero-benefits li::before,
.hero--home-variants[data-variant] .hero-benefits li:nth-child(even)::before{
    content:"";
    display:block;
    position:absolute;
    top:0;
    right:0;
    width:34px;
    height:6px;
    background:var(--brand);
    opacity:1;
}
.hero--home-variants[data-variant] .hero-benefits li::after{content:none;display:none}
.hero--home-variants[data-variant] .hero-benefits svg,
.hero--home-variants[data-variant] .hero-benefits li:nth-child(even) svg{
    grid-column:1;
    width:38px;
    height:38px;
    padding:8px;
    background:var(--brand);
    border:0;
    border-radius:0;
    color:var(--ink);
}

/* 01: Elektro-Orange. */
.hero--home-variants[data-variant="1"]{--hero-mobile-surface:#e8a407;color:var(--ink)}
.hero--home-variants[data-variant="1"]::before{background:linear-gradient(135deg,#f2b515,#e8a407 65%,#c98100)}
.hero--home-variants[data-variant="1"] .hero-grid{--surface-explicit-tone:accent}
.hero--home-variants[data-variant="1"] .hero-copy-zone p,
.hero--home-variants[data-variant="1"] .hero-cta>p{color:#292414}

/* 02: Warmes Elfenbein. */
.hero--home-variants[data-variant="2"]{--hero-mobile-surface:#e8dfcc;color:var(--ink)}
.hero--home-variants[data-variant="2"]::before{background:linear-gradient(135deg,#fffdf5,#e8dfcc 70%,#cfc1a7)}
.hero--home-variants[data-variant="2"] .hero-grid{--surface-explicit-tone:light}
.hero--home-variants[data-variant="2"] .hero-copy-zone p,
.hero--home-variants[data-variant="2"] .hero-cta>p{color:#3c3b36}

/* 03: Tiefes Graphit. */
.hero--home-variants[data-variant="3"]{--hero-mobile-surface:#171917;color:var(--paper)}
.hero--home-variants[data-variant="3"]::before{background:linear-gradient(135deg,#31352f,#171917 72%,#0c0d0c)}
.hero--home-variants[data-variant="3"] .hero-grid{--surface-explicit-tone:dark}
.hero--home-variants[data-variant="3"] .hero-copy-zone p,
.hero--home-variants[data-variant="3"] .hero-cta>p{color:#e5e4dc}

/* 04: Kühles Stahlgrau. */
.hero--home-variants[data-variant="4"]{--hero-mobile-surface:#bdc8c5;color:var(--ink)}
.hero--home-variants[data-variant="4"]::before{background:linear-gradient(135deg,#e1e6e3,#bdc8c5 68%,#899696)}
.hero--home-variants[data-variant="4"] .hero-grid{--surface-explicit-tone:light}
.hero--home-variants[data-variant="4"] .hero-copy-zone p,
.hero--home-variants[data-variant="4"] .hero-cta>p{color:#303531}

/* 05: Tiefes Bronze. */
.hero--home-variants[data-variant="5"]{--hero-mobile-surface:#6e4811;color:var(--paper)}
.hero--home-variants[data-variant="5"]::before{background:linear-gradient(135deg,#956a22,#6e4811 70%,#3b2607)}
.hero--home-variants[data-variant="5"] .hero-grid{--surface-explicit-tone:dark}
.hero--home-variants[data-variant="5"] .hero-copy-zone p,
.hero--home-variants[data-variant="5"] .hero-cta>p{color:#f1ede1}

/* Dunkle Hero-Buttons; auf dunklen Bühnen mit gelber Kontur. */
.hero--home-variants[data-variant] .btn,
.hero--home-variants[data-variant] .btn--secondary{
    background:#111311;
    color:var(--white);
    box-shadow:none;
}
.hero--home-variants[data-variant="3"] .btn,
.hero--home-variants[data-variant="3"] .btn--secondary,
.hero--home-variants[data-variant="5"] .btn,
.hero--home-variants[data-variant="5"] .btn--secondary{box-shadow:inset 0 0 0 1px var(--brand)}
.hero--home-variants[data-variant] .btn .btn__icon,
.hero--home-variants[data-variant] .btn--secondary .btn__icon{background:transparent;color:var(--brand)}
.hero--home-variants[data-variant] .btn::before,
.hero--home-variants[data-variant] .btn::after,
.hero--home-variants[data-variant] .btn--secondary::before,
.hero--home-variants[data-variant] .btn--secondary::after{background:var(--brand)}
.hero--home-variants[data-variant] .btn:hover,
.hero--home-variants[data-variant] .btn:focus-visible,
.hero--home-variants[data-variant] .btn--secondary:hover,
.hero--home-variants[data-variant] .btn--secondary:focus-visible{color:var(--ink)}

@media (max-width:680px){
    .hero--home-variants[data-variant] .hero-grid{row-gap:16px;column-gap:0}
    .hero--home-variants[data-variant] h1{text-align:center}
    .hero--home-variants[data-variant] .hero-copy-zone p,
    .hero--home-variants[data-variant] .hero-cta>p{text-align:left}
    .hero--home-variants[data-variant] .hero-cta>p{margin-bottom:14px}
    .hero--home-variants[data-variant] .hero-cta{
        background:var(--hero-mobile-surface);
        box-shadow:0 0 0 15px var(--hero-mobile-surface);
    }
    .hero--home-variants[data-variant] .button-row{gap:10px}
    .hero--home-variants[data-variant] .hero-benefits li,
    .hero--home-variants[data-variant] .hero-benefits li:nth-child(even){grid-template-columns:28px minmax(0,1fr);min-height:68px;padding:8px;gap:8px;box-shadow:4px 4px 0 #111311}
    .hero--home-variants[data-variant] .hero-benefits svg,
    .hero--home-variants[data-variant] .hero-benefits li:nth-child(even) svg{width:28px;height:28px;padding:5px}
}

@media (prefers-reduced-motion:reduce){
    .hero--home-variants[data-variant] .hero-benefits li{animation:none!important}
}
}