*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}


.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.fb-fl{color:inherit}
.fb-be{color:var(--accent);font-weight:800}
/* ════════ DESIGN TOKENS ════════ */
:root{
  --rand:calc(5% + max(0px, (100% - 1400px) / 2));
  --bg:#FFFFFF;--bg2:#F5F7F8;--bg3:#ECF0F1;--bg4:#DDE3E6;
  --tx:#1A2228;--tx2:#3A464E;--tx3:#4F5E66;
  --accent:#F68E3F;--accent2:#FFAB65;--accent3:#D07020;
  --stone:#D2DADD;--stone2:#E0E6E8;
  --radius:16px;--ease:cubic-bezier(.22,1,.36,1);
}


html{scroll-behavior:smooth;overflow-x:clip}
body{font-family:'Outfit',sans-serif;background:var(--bg);color:var(--tx);overflow-x:clip;-webkit-font-smoothing:antialiased;line-height:1.6;min-width:0;width:100%}
.mq-wrap{overflow:hidden!important}
img{max-width:100%;height:auto}
::selection{background:var(--accent);color:#fff}

/* ════════ CURSOR ════════ */
.cur,.cur-d{position:fixed;pointer-events:none;z-index:10000;border-radius:50%;transform:translate(-50%,-50%)}
.cur{width:40px;height:40px;border:1.5px solid var(--accent);opacity:.6;transition:width .4s var(--ease),height .4s var(--ease)}
.cur.h{width:64px;height:64px}
.cur-d{width:6px;height:6px;background:var(--accent);z-index:10001}
@media(pointer:coarse){.cur,.cur-d{display:none}}


/* ════════ NAV ════════ */
nav{position:fixed;top:0;left:0;right:0;z-index:900;display:flex;gap:2rem;align-items:center;justify-content:space-between;padding:1rem var(--rand);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid color-mix(in srgb,var(--tx) 4%,transparent);transition:all .4s var(--ease)}
nav.fix{padding:1rem var(--rand);background:color-mix(in srgb,var(--bg) 96%,transparent);border-bottom:1px solid color-mix(in srgb,var(--tx) 8%,transparent);box-shadow:0 4px 20px -10px rgba(0,0,0,.06)}
nav .logo{display:inline-flex;align-items:center;flex-shrink:0;min-width:max-content;text-decoration:none;color:var(--tx)}
nav .logo img{height:36px;width:auto;max-width:none;transition:height .3s;display:block;flex-shrink:0}

nav ul{display:flex;align-items:center;gap:2rem;list-style:none}
nav a{color:var(--tx3);text-decoration:none;font-size:.91rem;font-weight:500;transition:color .3s;white-space:nowrap}
nav a:hover{color:var(--tx)}
.nav-cta{background:var(--accent);color:#1A2228!important;padding:.55rem 1.4rem;border-radius:100px;font-weight:700;transition:all .3s var(--ease)}
.nav-cta:hover{background:var(--accent2);transform:translateY(-1px)}

/* Einsatzgebiet Dropdown */
.nav-drop{position:relative}
.nav-drop-trig{background:none;border:none;cursor:pointer;font-family:inherit;color:var(--tx3);font-size:.91rem;font-weight:500;display:inline-flex;align-items:center;gap:.35rem;padding:0;transition:color .3s;white-space:nowrap}
.nav-drop-trig:hover,.nav-drop.open .nav-drop-trig{color:var(--tx)}
.nav-drop-trig svg{transition:transform .3s var(--ease)}
.nav-drop.open .nav-drop-trig svg{transform:rotate(180deg)}
.nav-drop-menu{position:absolute;top:calc(100% + 1rem);left:50%;transform:translateX(-50%) translateY(-4px);min-width:340px;width:max-content;max-width:420px;background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 8%,transparent);border-radius:16px;box-shadow:0 20px 50px -15px rgba(0,0,0,.18),0 6px 20px -8px rgba(0,0,0,.08);padding:.6rem;opacity:0;visibility:hidden;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s}
.nav-drop.open .nav-drop-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-drop-head{font-family:'Outfit',sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);padding:.85rem 1rem .55rem;margin-bottom:.2rem}
.nav-drop-menu a{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:.75rem 1rem;border-radius:10px;text-decoration:none;color:var(--tx)!important;font-size:.88rem;font-weight:500;transition:background .25s,color .25s;white-space:nowrap}
.nav-drop-menu a:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}
.nav-drop-menu a:hover .ndm-city{color:var(--accent)}
.ndm-city{transition:color .25s;white-space:nowrap}
.ndm-meta{font-size:.78rem;color:var(--tx3);font-weight:400;font-feature-settings:"tnum";white-space:nowrap;flex-shrink:0}
.ndm-other{margin-top:.3rem;border-top:1px solid color-mix(in srgb,var(--tx) 6%,transparent);padding-top:.85rem!important;font-size:.8rem!important;color:var(--accent)!important;font-weight:600!important}
.ndm-other:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)!important}
.ndm-other svg{flex-shrink:0;transition:transform .3s var(--ease)}
.ndm-other:hover svg{transform:translateX(2px)}

.burger{display:none;background:none;border:none;width:28px;height:20px;position:relative;cursor:pointer}
.burger span{position:absolute;left:0;height:2px;width:100%;background:var(--tx);border-radius:2px;transition:.3s}
.burger span:nth-child(1){top:0}.burger span:nth-child(2){top:9px}.burger span:nth-child(3){top:18px}
.burger.on span:nth-child(1){top:9px;transform:rotate(45deg)}.burger.on span:nth-child(2){opacity:0}.burger.on span:nth-child(3){top:9px;transform:rotate(-45deg)}

/* Mobile menu */
.mob-menu{position:fixed;inset:0;z-index:899;background:var(--bg);display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s var(--ease);padding:5rem 1.2rem 2rem;overflow-y:auto;-webkit-overflow-scrolling:touch}
.mob-menu.on{opacity:1;visibility:visible}
.mob-menu a{font-family:'Outfit',sans-serif;font-size:1.05rem;font-weight:600;color:var(--tx);text-decoration:none;padding:1rem 1.2rem;border-bottom:1px solid color-mix(in srgb,var(--tx) 6%,transparent);display:flex;align-items:center;justify-content:space-between;transition:background .25s,color .25s;border-radius:0}
.mob-menu a:active,.mob-menu a:hover{background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent)}
.mob-menu a::after{content:"\203A";color:var(--tx3);font-size:1.4rem;font-weight:300;transition:transform .25s,color .25s}
.mob-menu a:hover::after,.mob-menu a:active::after{color:var(--accent);transform:translateX(2px)}

/* ════════ HERO ════════ */
.hero{min-height:100vh;display:flex;align-items:center;padding:10rem var(--rand) 6rem;position:relative}
.hero-inner{max-width:1400px;margin:0 auto;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.hero-tag{display:inline-flex;align-items:center;gap:.6rem;color:var(--accent);font-size:.82rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;margin-bottom:1.5rem}
.hero-tag i{width:24px;height:1px;background:var(--accent)}
.hero h1{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(2.4rem,4.88vw,4.5rem);font-weight:800;line-height:.95;letter-spacing:-.04em;color:var(--tx);margin-bottom:1.5rem}
.hero h1 span{color:var(--accent);display:block}
.hero p{font-size:1.05rem;color:var(--tx2);max-width:440px;line-height:1.75;margin-bottom:2.5rem}
.hero-btns{display:flex;gap:.8rem;flex-wrap:wrap}
.btn-p,.btn-s{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 2rem;border-radius:100px;font-family:'Outfit',sans-serif;font-size:.94rem;font-weight:600;text-decoration:none;transition:all .4s var(--ease);border:none;cursor:pointer}
.btn-p{background:var(--accent);color:#1A2228;font-weight:700}.btn-p:hover{background:var(--accent2);transform:translateY(-2px);box-shadow:0 8px 30px rgba(240,128,48,.25)}
.btn-s{background:var(--bg3);color:var(--tx);border:1px solid var(--bg4)}.btn-s:hover{background:var(--bg4);transform:translateY(-2px)}
.btn-p svg,.btn-s svg{width:16px;height:16px;transition:transform .3s}.btn-p:hover svg{transform:translateX(3px)}

/* Hero Illustration */

/* ════════ HERO FLOATING ELEMENTS ════════ */
.hero-vis{position:relative}
.hero-badge{position:absolute;background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:100px;padding:.35rem .75rem;display:flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:600;color:var(--tx2);white-space:nowrap;box-shadow:0 4px 16px rgba(0,0,0,.05);z-index:3;animation:badgeFloat 5s ease-in-out infinite}
/* Left column — aligned to house elements */
.hb-tl{top:8%;left:-2%;animation-delay:0s}
.hb-ml{top:38%;left:-14%;animation-delay:-1s}
.hb-bl{top:62%;left:-12%;animation-delay:-2s}
/* Right column */
.hb-tr{top:12%;right:0%;animation-delay:-0.5s}
.hb-mr{top:44%;right:-4%;animation-delay:-1.5s}
.hb-br{top:64%;right:-10%;animation-delay:-2.5s}
/* Review pills at bottom */
.hero-review{position:absolute;background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:100px;padding:.4rem .8rem;display:flex;align-items:center;gap:.3rem;box-shadow:0 4px 16px rgba(0,0,0,.05);z-index:3}
.hero-review b{font-family:'Bricolage Grotesque',sans-serif;font-size:.82rem;font-weight:700;margin:0 .15rem}
.hr-google{bottom:8%;left:12%}
.hr-trust{bottom:8%;right:12%}
@keyframes badgeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hero-review{animation:reviewPulse 4s ease-in-out infinite}
.hr-google{animation-delay:0s}
.hr-trust{animation-delay:-2s}
@keyframes reviewPulse{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.02)}}
@media(max-width:1100px){.hero-badge,.hero-review{display:none}}

.hero-card{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:24px;padding:2.5rem;position:relative;overflow:hidden}
.hero-card::before{content:'';position:absolute;top:-50%;right:-30%;width:300px;height:300px;background:radial-gradient(circle,rgba(240,128,48,.08),transparent 70%);pointer-events:none}
.hc-badge{display:inline-flex;align-items:center;gap:.4rem;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font-size:.65rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:.4rem .9rem;border-radius:100px;margin-bottom:1.5rem}
.hc-badge i{width:6px;height:6px;background:#5EAE4A;border-radius:50%;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.hc-title{font-family:'Bricolage Grotesque',sans-serif;font-size:1.5rem;font-weight:700;margin-bottom:.4rem}
.hc-desc{font-size:.82rem;color:var(--tx2);line-height:1.6;margin-bottom:2rem}
.hc-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.hc-stat{background:var(--bg);border-radius:14px;padding:1.1rem;text-align:center;border:1px solid color-mix(in srgb,var(--tx) 4%,transparent)}
.hc-stat b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-size:2rem;font-weight:700;color:var(--accent);line-height:1}
.hc-stat small{font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--tx3);margin-top:.3rem;display:block}


/* ════════ MARQUEE ════════ */
.mq-wrap{border-top:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-bottom:1px solid color-mix(in srgb,var(--tx) 5%,transparent);padding:1.3rem 0;overflow:hidden;background:var(--bg2)}
.mq{display:flex;gap:2.5rem;animation:mqa 60s linear infinite;width:max-content}
.mq span{display:flex;align-items:center;gap:.6rem;font-size:.88rem;font-weight:500;color:var(--tx3);white-space:nowrap}
.mq span svg{width:16px;height:16px;color:var(--accent)}
@keyframes mqa{to{transform:translateX(-50%)}}


/* Tooltips */

/* Pulsing hint dots on zones */

@keyframes ihPulse{0%,100%{opacity:0;transform:scale(.5)}50%{opacity:.4;transform:scale(1)}}

/* ════════ SHARED ════════ */
.wrap{max-width:1400px;margin:0 auto;padding:7rem 5%}
.label{font-size:.82rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:1rem;display:flex;align-items:center;gap:.6rem}
.label svg{width:14px;height:14px}
.title{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(2rem,4vw,3.4rem);font-weight:800;line-height:1.08;letter-spacing:-.03em;margin-bottom:.7rem}
.desc{font-size:1rem;color:var(--tx2);max-width:480px;line-height:1.7;margin-bottom:3rem}
[data-a]{opacity:0;transform:translateY(40px);transition:all .8s var(--ease)}
[data-a].in{opacity:1;transform:translateY(0)}

/* ════════ SERVICES ════════ */

/* ════════ SERVICES ════════ */
.sv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.sv{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:20px;overflow:hidden;transition:all .45s var(--ease)}
.sv:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 20%,transparent);box-shadow:0 16px 48px rgba(0,0,0,.06)}
.sv-img{padding:2rem 2.5rem 1rem;display:flex;align-items:center;justify-content:center}
.sv-img svg{width:100%;height:auto;max-height:200px}
.sv-txt{padding:0 2rem 2rem}
.sv-txt h3{font-family:'Bricolage Grotesque',sans-serif;font-size:1.3rem;font-weight:700;margin-bottom:.5rem;color:var(--tx)}
.sv-txt p{font-size:.85rem;color:var(--tx2);line-height:1.65;margin-bottom:1rem}
.sv-tags{display:flex;flex-wrap:wrap;gap:.35rem}
.sv-tags span{font-size:.72rem;font-weight:600;padding:.3rem .7rem;border-radius:100px;background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent);letter-spacing:.03em;text-transform:uppercase}
@media(max-width:1100px){.sv-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.sv-grid{grid-template-columns:1fr}}

/* ════════ ABOUT ════════ */
.about-g{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.about-img{border-radius:24px;overflow:hidden;background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);aspect-ratio:1;position:relative}
.about-img svg{width:100%;height:100%}
/* Inhaber-Card im Über-Uns Text-Bereich */
.inhaber-card{display:flex;align-items:center;gap:1.1rem;width:100%;margin:1.8rem 0;padding:1rem 1.1rem 1rem 1rem;background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:18px;cursor:pointer;font:inherit;color:inherit;text-align:left;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease),background .35s var(--ease)}
.inhaber-card:hover{transform:translateY(-2px);box-shadow:0 16px 40px -16px rgba(246,142,63,.28),0 4px 16px -8px rgba(0,0,0,.06);border-color:color-mix(in srgb,var(--accent) 28%,transparent);background:var(--bg)}
.inhaber-card:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent)}
.ic-photo{width:62px;height:62px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--bg3);border:2px solid var(--bg)}
.ic-photo svg{width:100%;height:100%;display:block}
.ic-text{flex:1;display:flex;flex-direction:column;gap:.15rem;min-width:0}
.ic-label{font-family:'Outfit',sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.ic-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;color:var(--tx);line-height:1.2}
.ic-meta{font-size:.78rem;color:var(--tx3);font-weight:500;margin-top:.15rem}
.ic-cta{width:38px;height:38px;border-radius:50%;background:var(--tx);color:var(--bg);display:grid;place-items:center;flex-shrink:0;transition:background .3s,transform .3s var(--ease)}
.inhaber-card:hover .ic-cta{background:var(--accent);transform:translateX(2px)}

/* Frank Modal */
.frank-modal{position:fixed;inset:0;z-index:9000;display:none;align-items:center;justify-content:center;padding:2rem;background:rgba(26,34,40,.55);backdrop-filter:blur(8px);opacity:0;transition:opacity .35s var(--ease)}
.frank-modal.show{display:flex;opacity:1}
.frank-card{background:var(--bg);border-radius:24px;max-width:560px;width:100%;padding:2.5rem;position:relative;box-shadow:0 32px 80px -20px rgba(0,0,0,.3);transform:translateY(20px);transition:transform .4s var(--ease)}
.frank-modal.show .frank-card{transform:translateY(0)}
.frank-close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:10px;background:var(--bg2);border:none;cursor:pointer;display:grid;place-items:center;color:var(--tx2);transition:background .3s,color .3s}
.frank-close:hover{background:var(--tx);color:var(--bg)}
.frank-photo-wrap{width:120px;height:120px;border-radius:50%;background:var(--bg3);margin:0 auto 1.5rem;overflow:hidden;border:3px solid var(--bg);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.frank-photo-wrap svg{width:100%;height:100%}
.frank-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.6rem;font-weight:700;text-align:center;color:var(--tx);margin-bottom:.3rem}
.frank-role{text-align:center;font-size:.85rem;color:var(--tx3);text-transform:uppercase;letter-spacing:.15em;margin-bottom:1.5rem}
.frank-bio{font-size:.95rem;color:var(--tx2);line-height:1.7;margin-bottom:1.5rem}
.frank-meta{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding-top:1.2rem;border-top:1px solid color-mix(in srgb,var(--tx) 8%,transparent)}
.frank-meta-item{display:flex;flex-direction:column;gap:.2rem}
.frank-meta-item small{font-size:.7rem;color:var(--tx3);text-transform:uppercase;letter-spacing:.1em}
.frank-meta-item strong{font-size:.92rem;color:var(--tx);font-weight:600}
.ctrs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin-top:2.2rem}
.ctr{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:16px;padding:1.3rem;text-align:center;transition:.3s}
.ctr:hover{border-color:color-mix(in srgb,var(--accent) 20%,transparent)}
.ctr b{font-family:'Bricolage Grotesque',sans-serif;font-size:2.4rem;font-weight:800;color:var(--accent);display:block;line-height:1}
.ctr small{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--tx3);margin-top:.3rem;display:block}

/* ════════ PROCESS ════════ */
.proc-wrap{background:var(--bg2);border-radius:28px;padding:4rem;margin:0 var(--rand)}
.proc-g{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:2.5rem}
.proc{text-align:center;position:relative}
.proc-n{width:64px;height:64px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--accent) 20%,transparent);display:grid;place-items:center;margin:0 auto 1.2rem;font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;color:var(--accent);transition:.3s var(--ease)}
.proc:hover .proc-n{background:color-mix(in srgb,var(--accent) 10%,transparent);transform:scale(1.06)}
.proc h3{font-size:.92rem;font-weight:600;margin-bottom:.4rem}.proc p{font-size:.78rem;color:var(--tx2);line-height:1.55}

/* ════════ TESTIMONIALS ════════ */
.tst-g{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.tst{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:20px;padding:2rem;transition:.4s var(--ease)}
.tst:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 15%,transparent)}
.tst-stars{display:flex;gap:2px;margin-bottom:1rem}.tst-stars svg{width:14px;height:14px;fill:var(--accent);color:var(--accent)}
.tst q{display:block;font-size:.91rem;color:var(--tx2);line-height:1.65;font-style:italic;margin-bottom:1.2rem}
.tst-who{display:flex;align-items:center;gap:.6rem}
.tst-av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent3));display:grid;place-items:center;font-family:'Bricolage Grotesque',sans-serif;font-size:.85rem;font-weight:700;color:#1A2228}
.tst-name{font-size:.84rem;font-weight:600}.tst-role{font-size:.75rem;color:var(--tx3)}

/* ════════ CTA ════════ */
.cta{margin:0 5%;background:var(--bg2);border:1px solid color-mix(in srgb,var(--accent) 10%,transparent);border-radius:28px;padding:4rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;position:relative;overflow:hidden}
.cta::before{content:'';position:absolute;right:-5%;top:-60%;width:350px;height:350px;border-radius:50%;background:rgba(240,128,48,.05);filter:blur(80px)}
.cta h2{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.8rem,3vw,2.6rem);font-weight:700;line-height:1.12;position:relative;z-index:1}
.cta h2 span{color:var(--accent)}
.cta-btns{display:flex;gap:.8rem;position:relative;z-index:1;flex-shrink:0}

/* ════════ CONTACT ════════ */
.con-g{display:grid;grid-template-columns:1fr 1.3fr;gap:2.5rem}
.con-cards{display:flex;flex-direction:column;gap:.6rem}
.con-c{display:flex;align-items:center;gap:.9rem;padding:1.1rem 1.3rem;background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:14px;transition:.3s var(--ease)}
.con-c:hover{border-color:color-mix(in srgb,var(--accent) 15%,transparent);transform:translateX(4px)}
.con-ic{width:40px;height:40px;border-radius:11px;background:color-mix(in srgb,var(--accent) 8%,transparent);display:grid;place-items:center;flex-shrink:0}
.con-ic svg{width:18px;height:18px;color:var(--accent)}
.con-c h3{font-size:.82rem;font-weight:600;margin-bottom:.05rem}.con-c p{font-size:.78rem;color:var(--tx2);line-height:1.4}
.con-c a{color:var(--accent);text-decoration:none}.con-c a:hover{color:var(--accent2)}
.form-box{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:22px;padding:2.5rem}
.form-box h3{font-family:'Bricolage Grotesque',sans-serif;font-size:1.4rem;font-weight:700;margin-bottom:1.5rem}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-bottom:.7rem}
.fg{margin-bottom:.7rem}
.fg label{display:block;font-size:.62rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3);margin-bottom:.35rem}
.fg input,.fg textarea,.fg select{width:100%;padding:.85rem 1rem;background:var(--bg);border:1.5px solid color-mix(in srgb,var(--tx) 8%,transparent);border-radius:10px;color:var(--tx);font-family:'Outfit',sans-serif;font-size:.84rem;outline:none;transition:.3s}
.fg input:focus,.fg textarea:focus,.fg select:focus{border-color:var(--accent)}
.fg select option{background:var(--bg2);color:var(--tx)}
.fg textarea{resize:vertical;min-height:90px}
.f-btn{width:100%;padding:.95rem;border:none;border-radius:12px;font-family:'Outfit',sans-serif;font-size:.88rem;font-weight:700;background:var(--accent);color:#1A2228;cursor:pointer;transition:.4s var(--ease);margin-top:.2rem}
.f-btn:hover{background:var(--accent2);transform:translateY(-2px);box-shadow:0 8px 30px rgba(240,128,48,.2)}

/* ════════ MAP ════════ */
.map-sec{max-width:1400px;margin:0 auto;padding:0 5% 6rem}











.map-frame:hover{border-color:color-mix(in srgb,var(--accent) 20%,transparent);box-shadow:0 8px 30px rgba(0,0,0,.06)}


/* ════════ SOCIAL & TRUST ════════ */
.social-bar{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:24px;padding:2.5rem}
.social-head{margin-bottom:2rem}
.social-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.social-card{display:flex;align-items:center;gap:.8rem;padding:1rem 1.2rem;background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:14px;text-decoration:none;color:var(--tx);transition:all .35s var(--ease);position:relative}
.social-card:hover{border-color:color-mix(in srgb,var(--accent) 25%,transparent);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.05)}
.sc-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;flex-shrink:0;background:var(--bg2)}
.sc-info{flex:1;min-width:0}
.sc-name{font-family:'Bricolage Grotesque',sans-serif;font-size:.88rem;font-weight:700}
.sc-sub{font-size:.78rem;color:var(--tx3);font-weight:500}
.sc-rating{text-align:right;flex-shrink:0;margin-right:1.5rem}
.sc-score{font-family:'Bricolage Grotesque',sans-serif;font-size:1.3rem;font-weight:800;line-height:1}
.sc-stars{display:flex;gap:1px;justify-content:flex-end;margin-top:.15rem}
.sc-arrow{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:var(--tx3);opacity:.3;transition:all .3s}
.social-card:hover .sc-arrow{opacity:.7;color:var(--accent);transform:translateY(-50%) translate(2px,-2px)}
/* Platform-specific hover tints */
.sc-google:hover{border-color:rgba(66,133,244,.2)}
.sc-linkedin:hover{border-color:rgba(10,102,194,.2)}
.sc-instagram:hover{border-color:rgba(225,48,108,.2)}
.sc-facebook:hover{border-color:rgba(24,119,242,.2)}
.sc-whatsapp:hover{border-color:rgba(37,211,102,.2)}
@media(max-width:900px){.social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.social-grid{grid-template-columns:1fr}.social-bar{padding:1.5rem}}

/* Invisible hotspot overlays — no jitter because they don't change size */

/* Tooltip */

@media(max-width:700px){}

/* ════════ RUNDUM-HAUS ════════ */

.rh-zone:hover,.rh-zone.on{border-color:var(--accent);background:rgba(246,142,63,.06)}

.rh-info.show{display:flex}

/* ════════ RUNDUM HAUS ════════ */
.rh{max-width:1000px;margin:0 auto;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
@media(max-width:900px){.rh{grid-template-columns:1fr;max-width:550px}}
.rh svg{width:100%;height:auto;display:block}
.rh-zone{cursor:pointer;transition:filter .25s}
.rh-zone:hover{filter:brightness(.92) drop-shadow(0 0 6px rgba(246,142,63,.25))}
.rh-panel{display:none;position:relative;background:var(--bg2);border:1.5px solid color-mix(in srgb,var(--accent) 15%,transparent);border-radius:20px;padding:1.8rem 2rem;gap:1.2rem;align-items:flex-start}
.rh-panel.on{display:flex}
.rh-panel-ic{width:48px;min-width:48px;height:48px;border-radius:13px;background:color-mix(in srgb,var(--accent) 10%,transparent);display:grid;place-items:center;color:var(--accent)}
.rh-panel-ic svg{width:22px;height:22px}
.rh-panel b{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;display:block;margin-bottom:.3rem}
.rh-panel p{font-size:.88rem;color:var(--tx2);line-height:1.65;margin:0}
.rh-panel-tags{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.7rem}
.rh-panel-tags span{font-size:.58rem;font-weight:600;padding:.25rem .6rem;border-radius:100px;background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent);text-transform:uppercase;letter-spacing:.03em}
.rh-left{position:relative}
.rh-right{display:flex;flex-direction:column;justify-content:center;min-height:300px}
.rh-panel-x{position:absolute;top:.8rem;right:1rem;background:none;border:none;font-size:1.2rem;color:var(--tx3);cursor:pointer;padding:.2rem}


.f-note{font-size:.72rem;color:var(--tx3);text-align:center;margin:1rem 0 .5rem}
.f-wa{display:flex;cursor:pointer;font-family:'Outfit',sans-serif;width:100%;justify-content:center;align-items:center;justify-content:center;gap:.5rem;padding:.8rem;border-radius:12px;background:#ECFCE5;border:1.5px solid #C6F0B8;font-family:'Outfit',sans-serif;font-size:.85rem;font-weight:600;color:#1B5E20;text-decoration:none;transition:all .3s var(--ease)}
.f-wa:hover{background:#D4F4CC;transform:translateY(-1px);box-shadow:0 4px 16px rgba(37,211,102,.15)}

/* ════════ LEGAL MODALS ════════ */
.legal-modal{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.5);backdrop-filter:blur(6px);overflow-y:auto;padding:2rem}
.legal-modal.on{display:flex;align-items:flex-start;justify-content:center}
.legal-box{background:var(--bg);border-radius:20px;max-width:720px;width:100%;padding:3rem;position:relative;margin:2rem auto}
.legal-box h2{font-family:'Bricolage Grotesque',sans-serif;font-size:2rem;font-weight:800;margin-bottom:2rem;color:var(--tx);word-break:break-word;overflow-wrap:anywhere;hyphens:auto;line-height:1.15}
@media(max-width:600px){.legal-box{padding:2rem 1.4rem}.legal-box h2{font-size:1.4rem;margin-bottom:1.5rem}.legal-modal{padding:1rem .5rem}}
.legal-box h3{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;margin:1.5rem 0 .5rem;color:var(--tx)}
.legal-box h3{font-size:.94rem;font-weight:600;margin:1rem 0 .3rem;color:var(--tx)}
.legal-box p{font-size:.94rem;color:var(--tx2);line-height:1.7;margin-bottom:.8rem}
.legal-box a{color:var(--accent);text-decoration:none}.legal-box a:hover{text-decoration:underline}
.legal-close{position:absolute;top:1.2rem;right:1.5rem;background:none;border:none;font-size:1.8rem;color:var(--tx3);cursor:pointer;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;transition:.2s}
.legal-close:hover{background:var(--bg2);color:var(--tx)}
.placeholder{background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent);padding:.15rem .5rem;border-radius:4px;font-size:.8rem;font-weight:600}


.pulse-dots{pointer-events:none;transition:opacity 1s}
.rh.clicked .pulse-dots{opacity:0}
.rh-hint{display:flex;align-items:center;justify-content:flex-start;gap:.4rem;font-size:.75rem;color:var(--accent);font-weight:500;margin-top:.8rem;opacity:.7;animation:hintPulse 2.5s ease-in-out infinite}
@keyframes hintPulse{0%,100%{opacity:.7}50%{opacity:.3}}
.rh.clicked .pulse-dots{pointer-events:none;transition:opacity 1s}
.rh.clicked .pulse-dots{opacity:0}
.rh-hint{display:none}

/* ════════ REVIEWS ════════ */
.review-platforms{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.rev-platform{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:20px;padding:2rem;transition:.4s var(--ease)}
.rev-platform:hover{border-color:color-mix(in srgb,var(--accent) 15%,transparent)}
.rev-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;padding-bottom:1.2rem;border-bottom:1px solid color-mix(in srgb,var(--tx) 5%,transparent)}
.rev-logo{display:flex;align-items:center;gap:.8rem}
.rev-plat-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700}
.rev-plat-sub{font-size:.82rem;color:var(--tx3);font-weight:500}
.rev-score{text-align:right}
.rev-number{font-family:'Bricolage Grotesque',sans-serif;font-size:2rem;font-weight:800;color:var(--tx);line-height:1}
.rev-stars-row{display:flex;gap:1px;margin-top:.2rem;justify-content:flex-end}
.rev-cards{display:flex;flex-direction:column;gap:.8rem}
.rev-card{background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 4%,transparent);border-radius:14px;padding:1.3rem}
.rev-card-stars{display:flex;gap:1px;margin-bottom:.6rem}
.rev-card p{font-size:.84rem;color:var(--tx2);line-height:1.6;font-style:italic}
.rev-author{margin-top:.8rem;display:flex;align-items:center;gap:.5rem}
.rev-author b{font-size:.88rem;font-weight:600;color:var(--tx)}
.rev-author span{font-size:.78rem;color:var(--tx3)}
@media(max-width:900px){.review-platforms{grid-template-columns:1fr}}


/* ════════ RESPONSIVE ════════ */
@media(max-width:1100px){.hero-inner{grid-template-columns:1fr}.hero-vis{max-width:400px}.about-g{grid-template-columns:1fr}}
@media(max-width:900px){.proc-g{grid-template-columns:repeat(2,1fr)}.tst-g{grid-template-columns:1fr 1fr}.con-g{grid-template-columns:1fr}.cta{flex-direction:column;text-align:center}.cta-btns{justify-content:center}.proc-wrap{margin:0 3%;padding:2.5rem}}
@media(max-width:1200px){nav ul{display:none}.burger{display:block}nav .logo img{height:30px}}
@media(max-width:700px){nav ul{display:none}.burger{display:block}nav .logo img{height:26px}.wrap{padding:4.5rem 5%}.hero{padding:7rem 5% 4rem}.tst-g,.proc-g{grid-template-columns:1fr}.fr{grid-template-columns:1fr}.cta{margin:0 3%;padding:2.5rem}.cta-btns{flex-direction:column;width:100%}.cta-btns .btn-p,.cta-btns .btn-s{justify-content:center}.map-sec{padding:0 3% 4rem}.foot-in{flex-direction:column;text-align:center}footer{padding:1.5rem 3%}}

/* Mobile-specific (kleinere Phones) */
@media(max-width:520px){
  nav{padding:.7rem 5%}
  nav.fix{padding:.7rem 5%}
  nav .logo img{height:22px}
  
  .burger{width:24px;height:18px;flex-shrink:0}
  .burger span:nth-child(2){top:8px}.burger span:nth-child(3){top:16px}
  .burger.on span:nth-child(1){top:8px}.burger.on span:nth-child(3){top:8px}
  h1,.hero h1{font-size:clamp(2rem,9vw,3rem)!important;line-height:1.05!important}
  .hero{padding-top:5.5rem!important}
  .wrap{padding:3rem 5%!important}
  .tech-grid{grid-template-columns:1fr!important;gap:.8rem!important}
  .tech-card{min-height:auto;padding:1.4rem 1.2rem}
  .foot-main{grid-template-columns:1fr!important;gap:2rem!important}
  .foot-bottom{flex-direction:column;gap:.8rem;text-align:center}
  .foot-legal{justify-content:center;flex-wrap:wrap}
  .ctrs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .inhaber-card{flex-direction:column;text-align:center;align-items:center}
  .ic-text{align-items:center;text-align:center}
  .ic-cta{margin-top:.4rem}
  .label,.hero-tag{font-size:.72rem!important}
  .desc{font-size:.95rem!important}
  .title{font-size:clamp(1.6rem,7vw,2.4rem)!important;line-height:1.15!important}
  .sub-hero,.std-hero{padding:6.5rem 5% 3rem!important}
  .sub-h1,.std-h1{font-size:clamp(2rem,8vw,2.8rem)!important;line-height:1.08!important}
  .sub-grid2,.std-why-grid{grid-template-columns:1fr!important;gap:2rem!important}
  .sub-svc-grid,.std-svc-grid{grid-template-columns:1fr!important}
  .sub-locs-grid,.std-locs-grid{grid-template-columns:1fr!important}
  .mat-card{grid-template-columns:1fr!important;gap:1.2rem!important;padding:1.6rem!important}
  .mat-icon{max-width:100px!important;justify-self:start}
  .mat-grid{grid-template-columns:1fr!important}
  .schad-grid{grid-template-columns:1fr!important}
  .partner-grid{grid-template-columns:1fr!important}
  .ref-grid{grid-template-columns:1fr!important}
  .sub-philo-grid{grid-template-columns:1fr!important}
  .comp-wrap{margin:0 -5%}
  table.comp{font-size:.78rem}
  table.comp th,table.comp td{padding:.7rem .8rem}
  .nav-drop-menu{position:fixed;top:auto;bottom:0;left:0;right:0;transform:translateY(100%);min-width:0;max-width:100vw;width:100vw;border-radius:20px 20px 0 0;padding:1rem .8rem 2rem;max-height:75vh;overflow-y:auto}
  .nav-drop.open .nav-drop-menu{transform:translateY(0)}
}

@media(max-width:380px){
  nav .logo img{height:20px}
  
  h1,.hero h1{font-size:1.85rem!important}
}

/* ════════ MAP CARD ════════ */
.map-card{display:flex;align-items:center;justify-content:space-between;gap:2rem;background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:20px;padding:2rem 2.5rem;text-decoration:none;color:var(--tx);transition:all .4s var(--ease)}
.map-card:hover{border-color:color-mix(in srgb,var(--accent) 20%,transparent);transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.06)}
.map-left{display:flex;align-items:center;gap:1.2rem}
.map-pin{width:52px;height:52px;border-radius:14px;background:color-mix(in srgb,var(--accent) 8%,transparent);display:grid;place-items:center;flex-shrink:0}
.map-title{font-family:'Bricolage Grotesque',sans-serif;font-size:1.15rem;font-weight:700;margin-bottom:.15rem}
.map-addr{font-size:.85rem;color:var(--tx2);margin-bottom:.4rem}
.map-link-text{display:flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:600;color:var(--accent)}
.map-right svg{width:160px;height:auto;opacity:.7}
.map-card:hover .map-right svg{opacity:1}
@media(max-width:700px){.map-right{display:none}.map-card{padding:1.5rem}}

/* ════════ FOOTER ════════ */
footer{background:var(--bg2);border-top:1px solid color-mix(in srgb,var(--tx) 5%,transparent);padding:0}
.foot-main{max-width:1400px;margin:0 auto;padding:4rem 5% 3rem;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3rem}
.foot-brand{margin-bottom:.8rem}.foot-logo-img{height:30px;width:auto;max-width:100%;display:block}
.foot-brand span{color:var(--accent)}
.foot-desc{font-size:.95rem;color:var(--tx3);line-height:1.6;margin-bottom:1.2rem;max-width:300px}
.foot-social{display:flex;gap:.6rem}
.foot-social a{width:36px;height:36px;border-radius:10px;border:1px solid color-mix(in srgb,var(--tx) 8%,transparent);display:grid;place-items:center;color:var(--tx3);transition:all .3s}
.foot-social a:hover{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 5%,transparent)}
.foot-col h3{font-family:'Bricolage Grotesque',sans-serif;font-size:1.05rem;font-weight:700;color:var(--tx);margin-bottom:1rem}
.foot-col ul{list-style:none}
.foot-col li{font-size:.95rem;color:var(--tx3);padding:.32rem 0;line-height:1.45}
.foot-col a{color:var(--tx3);text-decoration:none;transition:color .3s}.foot-col a:hover{color:var(--accent)}
.foot-bottom{max-width:1400px;margin:0 auto;padding:1.5rem 5%;border-top:1px solid color-mix(in srgb,var(--tx) 5%,transparent);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}

.foot-collab{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.fc-year{font-size:.72rem;color:var(--tx3)}
.fc-logo{height:20px;opacity:.7}
.fc-x{font-size:.9rem;color:var(--tx3);font-weight:300}
.fc-aicore{font-family:'Manrope',sans-serif;font-weight:800;font-size:.82rem;letter-spacing:1.2px;text-decoration:none;transition:opacity .3s}
.fc-ai{color:#bf5af2}
.fc-core{color:var(--tx2)}
.fc-aicore:hover{opacity:.7}
.fc-aicore-logo{height:18px;display:block}

.foot-bottom span{font-size:.9rem;color:var(--tx3)}
.foot-legal{display:flex;gap:1.5rem}
.foot-legal a{font-size:.9rem;color:var(--tx3);text-decoration:none;transition:color .3s}.foot-legal a:hover{color:var(--accent)}
@media(max-width:900px){.foot-main{grid-template-columns:1fr 1fr;gap:2rem}}
@media(max-width:600px){.foot-main{grid-template-columns:1fr}.foot-bottom{flex-direction:column;text-align:center}}






.aicore-credit{display:inline-flex;align-items:center;gap:0;text-decoration:none!important;font-family:'Manrope',sans-serif!important;font-weight:800!important;font-size:.85rem!important;letter-spacing:1.2px!important;background:#070710;color:#fff;padding:.3em .7em;border-radius:6px;transition:background .2s}
.aicore-credit{-webkit-user-drag:none;user-select:text;-webkit-user-select:text}
.aic-ai{background:linear-gradient(135deg,#A78BFA,#22D3EE,#34D399)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;font-weight:800!important}
.aic-core{color:#fff!important}
.aicore-credit:hover{background:#0F0F18}


.foot-credit a{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:.02em}

.foot-credit{text-align:center;padding:0;font-size:.78rem;color:var(--tx3);letter-spacing:.05em}

.foot-credit a{color:var(--accent);text-decoration:none;font-weight:600;transition:color .3s}
.foot-credit a:hover{color:var(--accent2)}



.budget-hint{display:block;font-size:.68rem;margin-top:.3rem;min-height:1.1rem;transition:.3s}
.budget-hint.ok{color:#5EAE4A}
.budget-hint.warn{color:var(--accent)}
.budget-hint.low{color:#E53935}



/* ════════ FAQ ════════ */
.faq-list{margin:2rem 0 0;display:flex;flex-direction:column;gap:.5rem}
.faq-item{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:14px;overflow:hidden;transition:all .3s var(--ease)}
.faq-item.open{border-color:color-mix(in srgb,var(--accent) 15%,transparent)}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1.4rem;background:none;border:none;cursor:pointer;font-family:'Outfit',sans-serif;font-size:.88rem;font-weight:600;color:var(--tx);text-align:left;gap:1rem;transition:color .3s}
.faq-q:hover{color:var(--accent)}
.faq-q svg{flex-shrink:0;color:var(--tx3);transition:transform .3s}
.faq-item.open .faq-q svg{transform:rotate(180deg);color:var(--accent)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease),padding .4s;padding:0 1.4rem;font-size:.82rem;color:var(--tx2);line-height:1.7}
.faq-item.open .faq-a{max-height:300px;padding:0 1.4rem 1.2rem}

/* ════════ TECHNOLOGIEN ════════ */
.tech-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.5rem;margin-top:2.5rem}
.tech-card{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:16px;padding:1.8rem 1.4rem;text-align:center;transition:all .4s var(--ease);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;min-height:180px}
.tech-card:hover{border-color:color-mix(in srgb,var(--accent) 20%,transparent);transform:translateY(-10px);box-shadow:0 16px 48px rgba(0,0,0,.08)}
.tech-card-partner{border-color:color-mix(in srgb,#bf5af2 12%,transparent);background:color-mix(in srgb,#bf5af2 2%,var(--bg2))}
.tech-card-partner:hover{border-color:#bf5af2}
.tech-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.05rem;font-weight:700;color:var(--tx);margin-bottom:.3rem}
.tech-desc{font-size:.74rem;color:var(--tx3);line-height:1.55;max-width:200px;margin:0 auto}
.tech-tag{font-size:.72rem;font-weight:600;padding:.25rem .7rem;border-radius:100px;background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent);text-transform:uppercase;letter-spacing:.05em;margin-top:auto}
.tech-tag.partner{background:color-mix(in srgb,#bf5af2 10%,transparent);color:#bf5af2}
@media(max-width:900px){.tech-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.tech-grid{grid-template-columns:repeat(2,1fr)}}


.file-drop{border:2px dashed color-mix(in srgb,var(--tx) 10%,transparent);border-radius:12px;padding:1.5rem;text-align:center;cursor:pointer;transition:.3s;display:flex;flex-direction:column;align-items:center;gap:.3rem}
.file-drop:hover,.file-drop.drag{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 3%,transparent)}
.file-drop svg{color:var(--tx3)}
.file-drop span{font-size:.78rem;color:var(--tx2);font-weight:500}
.file-drop small{font-size:.72rem;color:var(--tx3)}
.file-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.file-item{display:flex;align-items:center;gap:.4rem;padding:.35rem .6rem;background:var(--bg2);border:1px solid var(--bg3);border-radius:8px;font-size:.7rem;font-weight:500;color:var(--tx2)}
.file-item button{background:none;border:none;color:var(--tx3);cursor:pointer;font-size:.8rem;padding:0 .2rem}.file-item button:hover{color:var(--red)}

/* ════════ CHATBOT ════════ */

.chat-opts{display:flex;flex-wrap:wrap;gap:.4rem;padding:.2rem 0}
.chat-opt{background:var(--bg);border:1.5px solid color-mix(in srgb,var(--accent) 20%,transparent);border-radius:100px;padding:.45rem .9rem;font-family:'Outfit',sans-serif;font-size:.75rem;font-weight:500;color:var(--accent);cursor:pointer;transition:all .25s var(--ease)}
.chat-opt:hover{background:color-mix(in srgb,var(--accent) 8%,transparent);border-color:var(--accent);transform:translateY(-1px)}

.chat-btn{position:fixed;bottom:1.5rem;right:1.5rem;width:56px;height:56px;border-radius:50%;background:var(--accent);border:none;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 20px rgba(240,128,48,.3);z-index:800;transition:all .3s var(--ease)}
.chat-btn:hover{transform:scale(1.08);box-shadow:0 6px 28px rgba(240,128,48,.4)}
.chat-btn svg{width:26px;height:26px;color:#fff}
.chat-btn .chat-close{display:none}
.chat-btn.open .chat-open{display:none}
.chat-btn.open .chat-close{display:block}
.chat-box{position:fixed;bottom:5.5rem;right:1.5rem;width:380px;max-height:520px;background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 8%,transparent);border-radius:20px;box-shadow:0 16px 60px rgba(0,0,0,.12);z-index:799;display:none;flex-direction:column;overflow:hidden}
.chat-box.open{display:flex}
.chat-head{padding:1.2rem 1.4rem;border-bottom:1px solid color-mix(in srgb,var(--tx) 5%,transparent);display:flex;align-items:center;gap:.8rem}
.chat-av{width:38px;height:38px;border-radius:10px;background:color-mix(in srgb,var(--accent) 10%,transparent);display:grid;place-items:center;flex-shrink:0}
.chat-av svg{width:20px;height:20px;color:var(--accent)}
.chat-head-tx b{font-family:'Bricolage Grotesque',sans-serif;font-size:.92rem;display:block}
.chat-head-tx span{font-size:.68rem;color:var(--accent);font-weight:500}
.chat-msgs{flex:1;overflow-y:auto;padding:1rem 1.2rem;display:flex;flex-direction:column;gap:.6rem;max-height:340px}
.chat-msg{max-width:85%;padding:.7rem 1rem;border-radius:14px;font-size:.82rem;line-height:1.5}
.chat-msg.bot{background:var(--bg2);color:var(--tx);align-self:flex-start;border-bottom-left-radius:4px}
.chat-msg.usr{background:var(--accent);color:#1A2228;align-self:flex-end;border-bottom-right-radius:4px}
.chat-msg.typing{color:var(--tx3);font-style:italic}
.chat-input{display:flex;gap:.5rem;padding:.8rem 1rem;border-top:1px solid color-mix(in srgb,var(--tx) 5%,transparent)}
.chat-input input{flex:1;border:1.5px solid color-mix(in srgb,var(--tx) 8%,transparent);border-radius:10px;padding:.6rem .9rem;font-family:'Outfit',sans-serif;font-size:.82rem;color:var(--tx);background:var(--bg);outline:none;transition:.3s}
.chat-input input:focus{border-color:var(--accent)}
.chat-input button{width:38px;height:38px;border-radius:10px;background:var(--accent);border:none;cursor:pointer;display:grid;place-items:center;transition:.3s}
.chat-input button:hover{background:var(--accent2)}
.chat-input button svg{width:18px;height:18px;color:#fff}
@media(max-width:500px){.chat-box{width:calc(100vw - 2rem);right:1rem;bottom:5rem}}


/* ════════ COOKIE BANNER ════════ */
.cookie-bar{position:fixed;bottom:0;left:0;right:0;background:var(--bg);border-top:1px solid color-mix(in srgb,var(--tx) 6%,transparent);padding:1rem 5%;display:none;align-items:center;justify-content:space-between;gap:1rem;z-index:900;box-shadow:0 -4px 24px rgba(0,0,0,.06)}
.cookie-bar.show{display:flex}
.cookie-tx{font-size:.78rem;color:var(--tx2);line-height:1.5;flex:1}
.cookie-tx a{color:#A65820;text-decoration:underline;font-weight:600}
.cookie-btns{display:flex;gap:.5rem;flex-shrink:0}
.cookie-btn{padding:.5rem 1.2rem;border-radius:10px;font-family:'Outfit',sans-serif;font-size:.75rem;font-weight:600;cursor:pointer;border:none;transition:.3s}
.cookie-btn-ok{background:var(--accent);color:#1A2228;font-weight:700}
.cookie-btn-ok:hover{background:var(--accent2)}
.cookie-btn-no{background:var(--bg2);color:var(--tx2);border:1px solid color-mix(in srgb,var(--tx) 8%,transparent)}
.cookie-btn-no:hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:600px){.cookie-bar{flex-direction:column;text-align:center}}



.sub-hero{padding:9rem 5% 4rem;max-width:1400px;margin:0 auto}
.sub-crumbs{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:var(--tx3);margin-bottom:2rem;flex-wrap:wrap}
.sub-crumbs a{color:var(--tx3);transition:color .3s;text-decoration:none}
.sub-crumbs a:hover{color:var(--accent)}
.sub-crumbs span.sep{color:var(--tx3);opacity:.5}
.sub-tag{display:inline-flex;align-items:center;gap:.6rem;color:var(--accent);font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;margin-bottom:1.2rem}
.sub-tag::before{content:"";width:24px;height:1px;background:var(--accent)}
.sub-h1{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(2.4rem,5vw,4rem);font-weight:800;line-height:1.05;letter-spacing:-.02em;margin-bottom:1.2rem;color:var(--tx)}
.sub-h1 em{font-style:normal;color:var(--accent)}
.sub-lede{font-size:1.1rem;max-width:680px;color:var(--tx2);margin-bottom:2rem}
.sub-cta{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center}
.btn-p,.btn-s{display:inline-flex;align-items:center;gap:.5rem;padding:.95rem 1.8rem;border-radius:100px;font-weight:600;font-size:.94rem;text-decoration:none;transition:background .3s,transform .3s var(--ease);font-family:inherit;border:none;cursor:pointer}
.btn-p{background:var(--accent);color:#1A2228;font-weight:700}
.btn-p:hover{background:var(--accent2);transform:translateY(-1px)}
.btn-s{background:var(--bg2);color:var(--tx);border:1px solid color-mix(in srgb,var(--tx) 8%,transparent)}
.btn-s:hover{background:var(--bg3)}
.sub-section{padding:5rem 5%;max-width:1400px;margin:0 auto}
.sub-label{display:inline-flex;align-items:center;gap:.6rem;color:var(--accent);font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;margin-bottom:1.2rem}
.sub-label::before{content:"";width:24px;height:1px;background:var(--accent)}
.sub-h2{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.8rem,4vw,3rem);font-weight:800;line-height:1.1;letter-spacing:-.02em;color:var(--tx);margin-bottom:1rem}
.sub-lede2{font-size:1rem;color:var(--tx2);max-width:680px;margin-bottom:3rem}
.sub-cta-band{background:var(--tx);color:#fff;padding:4rem 5%;text-align:center;border-radius:24px;margin:3rem auto;max-width:1340px}
.sub-cta-band h2{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.6rem,3.5vw,2.5rem);font-weight:800;margin-bottom:1rem}
.sub-cta-band p{color:color-mix(in srgb,#fff 70%,transparent);max-width:560px;margin:0 auto 2rem;font-size:1rem}
.sub-cta-band .btn-s{background:transparent;color:#fff;border-color:color-mix(in srgb,#fff 25%,transparent)}
.sub-cta-band .btn-s:hover{background:color-mix(in srgb,#fff 8%,transparent)}
.sub-faq{background:var(--bg2);padding:5rem 5%}
.sub-faq-in{max-width:900px;margin:0 auto}
.sub-faq-i{background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:14px;margin-bottom:.6rem;overflow:hidden}
.sub-faq-q{width:100%;padding:1.1rem 1.5rem;background:transparent;border:none;text-align:left;font-size:.95rem;font-weight:600;color:var(--tx);cursor:pointer;font-family:inherit;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.sub-faq-q::after{content:"+";font-size:1.4rem;color:var(--accent);transition:transform .3s}
.sub-faq-i.open .sub-faq-q::after{transform:rotate(45deg)}
.sub-faq-a{padding:0 1.5rem;max-height:0;overflow:hidden;transition:max-height .35s var(--ease),padding .35s var(--ease);color:var(--tx2);font-size:.92rem;line-height:1.65}
.sub-faq-i.open .sub-faq-a{max-height:600px;padding:0 1.5rem 1.2rem}
.sub-trust{padding:1.5rem 5%;background:var(--bg2);border-top:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-bottom:1px solid color-mix(in srgb,var(--tx) 5%,transparent)}
.sub-trust-in{max-width:1400px;margin:0 auto;display:flex;flex-wrap:wrap;gap:2.5rem;justify-content:center;align-items:center;font-size:.82rem;color:var(--tx3)}
.sub-trust-in span{display:inline-flex;align-items:center;gap:.5rem}
.sub-trust-in svg{color:var(--accent);flex-shrink:0}

/* Materialien specific */
.mat-card{background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:20px;padding:2.5rem;margin-bottom:1.5rem;display:grid;grid-template-columns:160px 1fr;gap:2.5rem;align-items:start;transition:border-color .35s,transform .35s var(--ease)}
.mat-card:hover{border-color:color-mix(in srgb,var(--accent) 20%,transparent)}
.mat-icon{aspect-ratio:1;border-radius:18px;background:var(--bg2);display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--tx) 5%,transparent)}
.mat-icon svg{width:60%;height:60%}
.mat-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.6rem;font-weight:700;color:var(--tx);margin-bottom:.4rem}
.mat-tagline{color:var(--accent);font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;margin-bottom:1rem}
.mat-text{color:var(--tx2);font-size:.95rem;line-height:1.7;margin-bottom:1.4rem}
.mat-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1rem}
.mat-spec{padding:.8rem 0;border-bottom:1px solid color-mix(in srgb,var(--tx) 6%,transparent);display:flex;justify-content:space-between;font-size:.88rem}
.mat-spec span:first-child{color:var(--tx3)}
.mat-spec span:last-child{color:var(--tx);font-weight:600}
.mat-spec:last-child{border:none}
.mat-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.mat-tags span{font-size:.7rem;background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent3);padding:.3rem .65rem;border-radius:99px;font-weight:600}
@media(max-width:800px){.mat-card{grid-template-columns:1fr;gap:1.5rem}.mat-icon{max-width:120px}.mat-grid{grid-template-columns:1fr}}

/* Comparison table */
.comp-wrap{overflow-x:auto;border-radius:18px;border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);background:var(--bg)}
table.comp{width:100%;border-collapse:collapse;font-size:.88rem;min-width:700px}
table.comp th,table.comp td{padding:1rem 1.2rem;text-align:left;border-bottom:1px solid color-mix(in srgb,var(--tx) 5%,transparent)}
table.comp thead th{background:var(--bg2);color:var(--tx3);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600}
table.comp tbody td{color:var(--tx2)}
table.comp tbody td:first-child{font-weight:600;color:var(--tx);font-family:'Bricolage Grotesque',sans-serif}
table.comp tbody tr:hover{background:color-mix(in srgb,var(--accent) 4%,transparent)}

/* Schaden cards */
.schad-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;margin-top:2rem}
.schad-card{background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:18px;padding:2rem;transition:border-color .3s,transform .3s var(--ease)}
.schad-card:hover{border-color:color-mix(in srgb,var(--accent) 22%,transparent);transform:translateY(-2px)}
.schad-icon{width:54px;height:54px;border-radius:14px;background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent);display:grid;place-items:center;margin-bottom:1.2rem}
.schad-card h3{font-family:'Bricolage Grotesque',sans-serif;font-size:1.15rem;font-weight:700;margin-bottom:.6rem}
.schad-symp{color:var(--tx2);font-size:.92rem;line-height:1.6;margin-bottom:1.1rem}
.schad-list{list-style:none;padding:0;margin:0}
.schad-list li{padding:.5rem 0;display:flex;gap:.7rem;font-size:.86rem;color:var(--tx2);border-bottom:1px solid color-mix(in srgb,var(--tx) 5%,transparent)}
.schad-list li:last-child{border:none}
.schad-list li svg{flex-shrink:0;margin-top:2px;color:var(--accent)}
.schad-list li b{color:var(--tx);font-weight:600;display:block;margin-bottom:.2rem}
@media(max-width:780px){.schad-grid{grid-template-columns:1fr}}

/* Presse */
.partner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2rem}
.partner-card{background:var(--bg);border:1px solid color-mix(in srgb,var(--tx) 6%,transparent);border-radius:18px;padding:2rem;transition:border-color .3s,transform .3s var(--ease)}
a.partner-card,a.aic-partner-card{-webkit-user-drag:none;user-select:text;-webkit-user-select:text}
.partner-card:hover{border-color:color-mix(in srgb,var(--accent) 22%,transparent);transform:translateY(-2px)}
.partner-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.3rem;font-weight:700;margin-bottom:.4rem}
.partner-role{color:var(--accent);font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;margin-bottom:1rem}
.partner-text{font-size:.88rem;color:var(--tx2);line-height:1.65}
.press-list{display:flex;flex-direction:column;gap:.8rem;margin-top:2rem}
.press-item{background:var(--bg2);border:1px solid color-mix(in srgb,var(--tx) 5%,transparent);border-radius:14px;padding:1.4rem 1.6rem;display:grid;grid-template-columns:130px 1fr;gap:1.5rem;align-items:start}
.press-date{font-family:'JetBrains Mono',monospace;font-size:.78rem;color:var(--tx3);text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.press-title{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:700;color:var(--tx);margin-bottom:.3rem}
.press-desc{font-size:.86rem;color:var(--tx2)}
.press-empty{padding:3rem 2rem;text-align:center;background:var(--bg2);border-radius:18px;border:2px dashed color-mix(in srgb,var(--tx) 12%,transparent);color:var(--tx3)}
.press-empty svg{color:var(--accent);opacity:.5;margin-bottom:1rem}
@media(max-width:900px){.partner-grid{grid-template-columns:1fr}.press-item{grid-template-columns:1fr}}


@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.marq{animation:none!important}}

/* A11y skip link */
.skip-link{position:absolute;top:0;left:0;background:var(--accent);color:#1A2228;padding:.85rem 1.4rem;font-weight:600;font-size:.85rem;border-radius:0 0 12px 0;z-index:99999;transform:translateY(-110%);transition:transform .25s var(--ease);text-decoration:none}
.skip-link:focus{transform:translateY(0);outline:2px solid var(--bg);outline-offset:2px}
/* Focus-visible — universal */
:focus{outline:none}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
/* Better focus contrast on dark CTA-band */
.cta-band a:focus-visible,.std-cta-band a:focus-visible,.sub-cta-band a:focus-visible{outline-color:#fff}
/* Better focus visibility for form inputs */
input:focus-visible,select:focus-visible,textarea:focus-visible{border-color:var(--accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}

.mob-grp{border-bottom:1px solid color-mix(in srgb,var(--tx) 6%,transparent)}
.mob-grp-trig{width:100%;padding:1rem 1.2rem;background:none;border:none;font-family:'Outfit',sans-serif;font-size:1.05rem;font-weight:600;color:var(--tx);cursor:pointer;display:flex;align-items:center;justify-content:space-between;text-align:left}
.mob-grp-trig svg{transition:transform .3s var(--ease);color:var(--tx3)}
.mob-grp.open .mob-grp-trig svg{transform:rotate(180deg);color:var(--accent)}
.mob-grp.open .mob-grp-trig{color:var(--accent)}
.mob-grp-items{max-height:0;overflow:hidden;transition:max-height .35s var(--ease);background:var(--bg2)}
.mob-grp.open .mob-grp-items{max-height:600px}
.mob-grp-items a{padding:.85rem 1.2rem .85rem 2.2rem;font-size:.95rem;font-weight:500;border-bottom:1px solid color-mix(in srgb,var(--tx) 4%,transparent);color:var(--tx2);display:grid;grid-template-columns:1fr 90px 1.2rem;align-items:center;gap:.6rem}
.mob-grp-items a:last-child{border-bottom:none}
.mob-grp-items a small{color:var(--tx3);font-weight:400;font-size:.78rem;text-align:right;font-feature-settings:"tnum"}
.mob-grp-items a::after{font-size:1.1rem;justify-self:end}
.mob-cta{background:var(--accent)!important;color:#1A2228!important;margin-top:1.2rem;border-radius:14px!important;border-bottom:none!important;padding:1.1rem 1.5rem!important;justify-content:center!important;text-align:center}
.mob-cta::after{display:none!important}
.mob-cta:hover{background:var(--accent2)!important;color:#1A2228!important}

/* Apple-style sub-page injection */
[data-a]{opacity:0;transform:translateY(28px) scale(.985);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
[data-a].in{opacity:1;transform:translateY(0) scale(1)}
.sub-svc,.std-svc,.locs-card,.std-locs-card,.sub-locs-card,.partner-card,.schad-card,.mat-card,.ref-card{transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s cubic-bezier(.22,1,.36,1),border-color .35s ease}
.sub-svc:hover,.std-svc:hover,.locs-card:hover,.std-locs-card:hover,.sub-locs-card:hover,.partner-card:hover,.schad-card:hover,.mat-card:hover,.ref-card:hover{transform:translateY(-4px);box-shadow:0 24px 48px -28px color-mix(in srgb,var(--tx) 30%,transparent)}
.btn-p,.btn-s,.nav-cta{transition:transform .35s cubic-bezier(.22,1,.36,1),background .3s,box-shadow .35s,border-color .3s}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 12px 28px -10px color-mix(in srgb,var(--accent) 50%,transparent)}
:root{color-scheme:light dark}
[data-theme="dark"]{--bg:#0E1216;--bg2:#161B21;--bg3:#1F262E;--bg4:#2B3540;--tx:#F2F4F6;--tx2:#C7CCD2;--tx3:#8893A0;--stone:#3B4651;--stone2:#2D3742;color-scheme:dark}
[data-theme="dark"] nav{background:color-mix(in srgb,var(--bg) 88%,transparent)}

.theme-toggle{background:none;border:1px solid color-mix(in srgb,var(--tx) 14%,transparent);color:var(--tx2);width:38px;height:38px;border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:all .3s var(--ease);margin-right:.4rem;flex-shrink:0}
.theme-toggle:hover{border-color:var(--accent);color:var(--accent);transform:rotate(15deg)}
.theme-toggle .ti-sun{display:none}
[data-theme="dark"] .theme-toggle .ti-sun{display:block}
[data-theme="dark"] .theme-toggle .ti-moon{display:none}
.sound-toggle{background:none;border:1px solid color-mix(in srgb,var(--tx) 14%,transparent);color:var(--tx2);width:38px;height:38px;border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:all .3s var(--ease);margin-right:.4rem;flex-shrink:0}
.sound-toggle:hover{border-color:var(--accent);color:var(--accent)}
.sound-toggle .so-on{display:none}
.sound-toggle.on .so-off{display:none}
.sound-toggle.on .so-on{display:block}
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:798;padding:.85rem 1rem calc(.85rem + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid color-mix(in srgb,var(--tx) 8%,transparent);display:none;align-items:center;gap:.6rem}
.sticky-cta.show{transform:translateY(0)}
.sticky-cta a{flex:1;text-align:center;padding:.85rem 1rem;border-radius:12px;font-weight:600;font-size:.9rem;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:.4rem}
.sticky-cta-call{background:var(--bg2);color:var(--tx);border:1px solid color-mix(in srgb,var(--tx) 8%,transparent)}
.sticky-cta-anfrage{background:var(--accent);color:#1A2228;font-weight:700}
@media(max-width:760px){.sticky-cta{display:flex}body{padding-bottom:5rem}}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.4s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-old(root){animation-name:vt-out}
::view-transition-new(root){animation-name:vt-in}
@keyframes vt-out{to{opacity:0;transform:translateY(-12px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(12px)}}
@media(prefers-reduced-motion:reduce){[data-a]{opacity:1!important;transform:none!important;transition:none!important}}

/* CTA-Bands: helle Cards im Light Mode, dunkel im Dark Mode */
.cta-band,.sub-cta-band,.std-cta-band{background:var(--bg2)!important;color:var(--tx)!important;border:1px solid var(--bg4)!important}
.cta-band h2,.sub-cta-band h2,.std-cta-band h2{color:var(--tx)!important}
.cta-band p,.sub-cta-band p,.std-cta-band p{color:var(--tx2)!important}
.cta-band .btn-s,.sub-cta-band .btn-s,.std-cta-band .btn-s{background:transparent!important;color:var(--tx)!important;border:1px solid var(--bg4)!important}
[data-theme="dark"] .cta-band,[data-theme="dark"] .sub-cta-band,[data-theme="dark"] .std-cta-band{background:#0E1216!important;color:#fff!important;border:1px solid color-mix(in srgb,var(--accent) 18%,transparent)!important}
[data-theme="dark"] .cta-band h2,[data-theme="dark"] .sub-cta-band h2,[data-theme="dark"] .std-cta-band h2{color:#fff!important}
[data-theme="dark"] .cta-band p,[data-theme="dark"] .sub-cta-band p,[data-theme="dark"] .std-cta-band p{color:rgba(255,255,255,.7)!important}
[data-theme="dark"] .cta-band .btn-s,[data-theme="dark"] .sub-cta-band .btn-s,[data-theme="dark"] .std-cta-band .btn-s{color:#fff!important;border:1px solid rgba(255,255,255,.25)!important}
/* Foot-mig flag in dark mode — keep authentic colors */
[data-theme="dark"] [data-theme="dark"] [data-theme="dark"] [data-theme="dark"] [data-theme="dark"] /* Dark mode: ensure text readability on cards */
[data-theme="dark"] .cta-band,[data-theme="dark"] .sub-cta-band,[data-theme="dark"] .std-cta-band{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 20%,transparent)}

/* COOKIE BANNER (injected) */
.cookie-bar{position:fixed;bottom:0;left:0;right:0;background:var(--bg);border-top:1px solid color-mix(in srgb,var(--tx) 6%,transparent);padding:1rem 5%;display:none;align-items:center;justify-content:space-between;gap:1rem;z-index:900;box-shadow:0 -4px 24px rgba(0,0,0,.06)}
.cookie-bar.show{display:flex}
.cookie-tx{font-size:.78rem;color:var(--tx2);line-height:1.5;flex:1}
.cookie-tx a{color:#A65820;text-decoration:underline;font-weight:600}
.cookie-btns{display:flex;gap:.5rem;flex-shrink:0}
.cookie-btn{padding:.5rem 1.2rem;border-radius:10px;font-family:'Outfit',sans-serif;font-size:.75rem;font-weight:600;cursor:pointer;border:none;transition:.3s}
.cookie-btn-ok{background:var(--accent);color:#1A2228;font-weight:700}
.cookie-btn-ok:hover{background:var(--accent2)}
.cookie-btn-no{background:var(--bg2);color:var(--tx2);border:1px solid color-mix(in srgb,var(--tx) 8%,transparent)}
.cookie-btn-no:hover{border-color:var(--accent);color:var(--accent)}

/* LEGAL MODALS (injected) */
.legal-modal{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.5);backdrop-filter:blur(6px);overflow-y:auto;padding:2rem}
.legal-modal.on{display:flex;align-items:flex-start;justify-content:center}
.legal-box{background:var(--bg);border-radius:20px;max-width:720px;width:100%;padding:3rem;position:relative;margin:2rem auto}
.legal-box h2{font-family:'Bricolage Grotesque',sans-serif;font-size:2rem;font-weight:800;margin-bottom:2rem;color:var(--tx);word-break:break-word;overflow-wrap:anywhere;hyphens:auto;line-height:1.15}
@media(max-width:600px){.legal-box{padding:2rem 1.4rem}.legal-box h2{font-size:1.4rem;margin-bottom:1.5rem}.legal-modal{padding:1rem .5rem}}
.legal-box h3{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;margin:1.5rem 0 .5rem;color:var(--tx)}
.legal-box h3{font-size:.94rem;font-weight:600;margin:1rem 0 .3rem;color:var(--tx)}
.legal-box p{font-size:.94rem;color:var(--tx2);line-height:1.7;margin-bottom:.8rem}
.legal-box a{color:var(--accent);text-decoration:none}.legal-box a:hover{text-decoration:underline}
.legal-close{position:absolute;top:1.2rem;right:1.5rem;background:none;border:none;font-size:1.8rem;color:var(--tx3);cursor:pointer;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;transition:.2s}
.legal-close:hover{background:var(--bg2);color:var(--tx)}

:root{--accent-ink:#F68E3F}
.sub-tag,.sub-label,.sub-h1 em,.mat-tagline,.mat-tags span,.ref-meta-tags span,.partner-role,.partner-text,.sub-svc-icon strong{color:var(--accent-ink)!important}
@media(min-width:1500px){nav a,.nav-drop-trig{font-size:.97rem}nav ul{gap:1.6rem}}
.hero-house{width:100%}.hero-house-svg{display:block;width:100%;height:auto;aspect-ratio:540/500}
