@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

/* ============ Tokens — Smart Repair King ============
   Ruhige Graphit-Basis + warme Paper-Sektionen im Wechsel;
   ein einziger Akzent: gedecktes Champagner-Gold (Krone). */
:root{
  --asphalt:#0C0D10; --asphalt-2:#111318; --panel:#16181E; --panel-2:#1C1F26;
  --ice:#F3F2EF; --ice-soft:rgba(243,242,239,.74); --ice-dim:rgba(243,242,239,.46);
  --paper:#F4F3F0; --paper-2:#EAE8E3;
  --ink:#16181D; --ink-soft:rgba(22,24,29,.72); --ink-dim:rgba(22,24,29,.5);
  --line-ink:rgba(22,24,29,.12);
  --gold:#C6A15B; --gold-soft:#D4B47A; --gold-deep:#9A7B3F;
  --whatsapp:#25D366;
  --line:rgba(243,242,239,.1);
  --font-display:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
  --shadow-lg:0 40px 90px -40px rgba(0,0,0,.7);
  --shadow-md:0 24px 50px -30px rgba(0,0,0,.6);
  --shadow-light:0 26px 60px -38px rgba(30,30,25,.35);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{margin:0;background:var(--asphalt);color:var(--ice);font-family:var(--font-body);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.1;margin:0;letter-spacing:-.02em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:var(--gold);color:#16130B}

.wrap{max-width:1240px;margin:0 auto;padding:0 clamp(1.25rem,4vw,3rem)}
.section{padding:clamp(4.5rem,9vw,8rem) 0;position:relative}
section[id]{scroll-margin-top:5.5rem}

/* Fokus-Ringe (Tastatur) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:.3rem}

/* Scrollbar dezent */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--asphalt-2)}
::-webkit-scrollbar-thumb{background:#2A2D35;border-radius:6px;border:2px solid var(--asphalt-2)}
::-webkit-scrollbar-thumb:hover{background:#3A3E48}

/* Geblurrte Foto-Hintergründe (sehr zurückhaltend) */
.section-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.section-bg img{width:100%;height:100%;object-fit:cover;filter:blur(52px) brightness(.4) saturate(.9);transform:scale(1.2)}
.section-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--asphalt) 0%,rgba(12,13,16,.55) 30%,rgba(12,13,16,.55) 70%,var(--asphalt) 100%)}

/* ============ Helle Sektionen (Paper) ============ */
.section.light{background:var(--paper);color:var(--ink)}
.section.light .lede{color:var(--ink-soft)}
.section.light h2,.section.light h3{color:var(--ink)}
.section.light .eyebrow{color:var(--gold-deep)}
.section.light .accent{color:var(--gold-deep)}
.section.light .section-bg img{filter:blur(52px) brightness(1.05) saturate(.9);opacity:.4}
.section.light .section-bg::after{background:linear-gradient(180deg,var(--paper) 0%,rgba(244,243,240,.75) 30%,rgba(244,243,240,.75) 70%,var(--paper) 100%)}
.section.light .step{background:#fff;border-color:#E5E2DB;box-shadow:0 12px 32px -28px rgba(30,30,25,.25)}
.section.light .step p{color:var(--ink-soft)}
.section.light .step__n{color:var(--gold-deep)}
.section.light .btn-ghost{border-color:rgba(22,24,29,.3);color:var(--ink)}
.section.light .btn-ghost:hover{border-color:var(--gold-deep);color:var(--gold-deep)}
.section.light .trust-chip{border-color:var(--line-ink);background:transparent;color:var(--ink-soft);font-weight:500}
.section.light .trust-chip svg{color:var(--gold-deep)}
.maxw-2xl{max-width:44rem}
.maxw-xl{max-width:34rem}
.mt-s{margin-top:.9rem}
.mt-m{margin-top:1.8rem}
.mt-l{margin-top:3.2rem}

/* Akzent im Titel — ruhig, ohne Animation */
.accent{color:var(--gold)}

.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font-family:var(--font-display);font-weight:500;font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.eyebrow::before{content:"";width:2rem;height:1px;background:currentColor;opacity:.7}

.h1{font-size:clamp(2.2rem,5.4vw,4rem);font-weight:700}
.h2{font-size:clamp(1.6rem,3.6vw,2.7rem)}
.h3{font-size:clamp(1.1rem,2vw,1.4rem)}
.lede{font-size:clamp(1rem,1.3vw,1.14rem);color:var(--ice-soft);font-weight:300}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:1rem 1.7rem;border-radius:.35rem;font-family:var(--font-display);font-weight:600;font-size:.86rem;letter-spacing:.03em;transition:transform .35s var(--ease),box-shadow .35s,background .3s,color .3s,border-color .3s;position:relative}
.btn svg{width:1.05rem;height:1.05rem;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-gold{background:var(--gold);color:#16130B;box-shadow:0 14px 38px -16px rgba(198,161,91,.55)}
.btn-gold:hover{transform:translateY(-2px);background:var(--gold-soft);box-shadow:0 20px 48px -16px rgba(198,161,91,.6)}
.btn-wa{background:var(--whatsapp);color:#062812}
.btn-wa:hover{transform:translateY(-2px);background:#2EE476}
.btn-ghost{border:1px solid var(--line);color:var(--ice)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}

/* ============ Nav ============ */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:1.15rem 0;transition:background .35s var(--ease),padding .35s var(--ease),box-shadow .35s,border-color .35s;border-bottom:1px solid transparent}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.nav.scrolled,.nav.menu-open{background:rgba(12,13,16,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:.75rem 0;border-color:var(--line);box-shadow:0 20px 44px -30px rgba(0,0,0,.8)}
.brand{display:flex;align-items:center;gap:.65rem}
.brand-mark{width:2.2rem;height:2.2rem;flex:none}
.brand-word{font-family:var(--font-display);font-weight:700;font-size:.92rem;letter-spacing:.04em;line-height:1.15}
.brand-word small{display:block;font-family:var(--font-body);font-weight:600;font-size:.56rem;letter-spacing:.3em;color:var(--ice-dim);text-transform:uppercase}

.nav-links{display:none;align-items:center;gap:1.9rem}
@media (min-width:1024px){ .nav-links{display:flex} }
.nav-link{font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ice-soft);position:relative;padding:.3rem 0;transition:color .3s}
.nav-link:hover,.nav-link.active{color:var(--ice)}
.nav-link::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:1px;background:var(--gold);transition:right .35s var(--ease)}
.nav-link:hover::after,.nav-link.active::after{right:0}
.nav-cta{display:none;align-items:center;gap:1rem}
@media (min-width:1024px){ .nav-cta{display:flex} }
.nav-cta .btn{padding:.75rem 1.3rem;font-size:.78rem}

.m-burger{display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border:1px solid var(--line);border-radius:.4rem;cursor:pointer}
@media (min-width:1024px){ .m-burger{display:none} }
.m-burger span{display:block;width:1.15rem;height:2px;border-radius:2px;background:var(--ice);position:relative}
.m-burger span::before,.m-burger span::after{content:"";position:absolute;left:0;width:100%;height:2px;border-radius:2px;background:var(--ice)}
.m-burger span::before{top:-.4rem}
.m-burger span::after{top:.4rem}

#mobileMenu{position:fixed;inset:0;z-index:99;background:var(--asphalt);padding:6.5rem 1.6rem 2rem;display:flex;flex-direction:column;gap:.3rem;transform:translateY(-100%);transition:transform .45s var(--ease);overflow-y:auto}
#mobileMenu.open{transform:translateY(0)}
.m-link{display:block;padding:1.05rem 0;font-family:var(--font-display);font-weight:600;font-size:1.4rem;border-bottom:1px solid var(--line);color:var(--ice)}
.m-cta{margin-top:1.6rem}

/* ============ Hero ============ */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;padding-top:9rem}
.hero-media{position:absolute;inset:-6% 0;z-index:0;background:var(--asphalt);will-change:transform}
.hero-media video,.hero-media img{width:100%;height:100%;object-fit:cover;filter:brightness(1.05) saturate(.96)}
.hero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(10deg,rgba(12,13,16,.95) 0%,rgba(12,13,16,.58) 40%,rgba(12,13,16,.18) 75%),linear-gradient(180deg,rgba(12,13,16,.6) 0%,rgba(12,13,16,0) 28%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:7rem;z-index:1;background:linear-gradient(180deg,transparent,var(--asphalt));pointer-events:none}
.hero-content{position:relative;z-index:2;padding-bottom:clamp(3rem,7vw,5rem);width:100%}
.hero-kicker{display:inline-flex;align-items:center;gap:.8rem;font-family:var(--font-display);font-weight:500;font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ice-soft)}
.hero-kicker::before{content:"";width:2.4rem;height:1px;background:var(--gold)}
.hero h1{color:var(--ice)}
.trust-row{display:flex;flex-wrap:wrap;gap:.7rem}
.trust-chip{display:flex;align-items:center;gap:.5rem;padding:.55rem 1rem;border:1px solid var(--line);border-radius:.35rem;background:rgba(12,13,16,.35);font-size:.8rem;font-weight:400;color:var(--ice-soft)}
.trust-chip svg{width:1rem;height:1rem;color:var(--gold)}

.scroll-hint{position:absolute;right:clamp(1.2rem,4vw,3rem);bottom:2.2rem;z-index:3;display:flex;flex-direction:column;align-items:center;gap:.7rem;color:var(--ice-dim);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;writing-mode:vertical-rl}
.scroll-hint::after{content:"";width:1px;height:3.2rem;background:linear-gradient(180deg,var(--gold),transparent)}

/* ============ Leistungs-Karten (Foto-Hintergründe) ============ */
.svc-grid{display:grid;grid-template-columns:1fr;gap:1.2rem;position:relative;z-index:2}
@media (min-width:560px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1100px){ .svc-grid{grid-template-columns:repeat(4,1fr);gap:1.4rem} }
.svc-card{position:relative;overflow:hidden;border-radius:.7rem;aspect-ratio:3/4;background:#1A1C22;border:1px solid rgba(198,161,91,.12);box-shadow:0 24px 55px -34px rgba(20,20,15,.55);transform:translateZ(0);transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease)}
@media (max-width:559px){ .svc-card{aspect-ratio:4/3} }
.svc-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:rgba(198,161,91,.4)}
.svc-card__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.9) brightness(.88);transition:transform .8s var(--ease)}
.svc-card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(9,10,13,.4) 0%,rgba(9,10,13,.04) 22%,rgba(9,10,13,.1) 48%,rgba(9,10,13,.6) 78%,rgba(9,10,13,.92) 100%);pointer-events:none}
.svc-card:hover .svc-card__bg{transform:scale(1.06)}
.svc-card__num{position:absolute;top:1.1rem;left:1.1rem;z-index:3;font-family:var(--font-display);font-weight:600;font-size:.62rem;letter-spacing:.22em;color:var(--gold);padding:.4rem .65rem;border-radius:.3rem;background:rgba(10,11,14,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.svc-card__body{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:2.2rem 1.4rem 1.5rem;background:linear-gradient(180deg,rgba(9,10,13,0) 0%,rgba(9,10,13,.72) 22%,rgba(9,10,13,.94) 52%,rgba(9,10,13,.98) 100%)}
.svc-card__body::before{content:"";display:block;width:2rem;height:2px;background:var(--gold);box-shadow:0 0 8px rgba(198,161,91,.6);margin-bottom:.9rem;transition:width .5s var(--ease)}
.svc-card:hover .svc-card__body::before{width:3.4rem}
.svc-card h3,.section.light .svc-card h3{font-size:1.04rem;color:var(--ice);margin-bottom:.55rem;letter-spacing:-.01em;text-shadow:0 2px 14px rgba(0,0,0,.65)}
.svc-card p,.section.light .svc-card p{font-size:.84rem;color:rgba(243,242,239,.85);font-weight:300;line-height:1.6;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.svc-card .tag{position:absolute;top:1.1rem;right:1.1rem;z-index:3;font-size:.56rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:.4rem .65rem;border-radius:.3rem;border:1px solid rgba(198,161,91,.55);color:var(--gold);background:rgba(10,11,14,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

/* ============ Vorher/Nachher-Slider ============ */
.ba{position:relative;border-radius:.6rem;overflow:hidden;box-shadow:var(--shadow-lg);user-select:none;touch-action:none;border:1px solid var(--line)}
.ba img{width:100%;display:block;pointer-events:none}
.ba .ba-top{position:absolute;inset:0;overflow:hidden}
.ba .ba-top img{position:absolute;inset:0;height:100%;width:100%;object-fit:cover}
.ba-handle{position:absolute;top:0;bottom:0;width:1px;background:var(--gold);z-index:3;cursor:ew-resize}
.ba-handle::after{content:"";display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2.9rem;height:2.9rem;border-radius:50%;background:rgba(12,13,16,.82);backdrop-filter:blur(6px);border:1px solid var(--gold);box-shadow:0 10px 30px -8px rgba(0,0,0,.8);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C6A15B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8l-4 4 4 4M16 8l4 4-4 4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:1.3rem;transition:transform .25s}
.ba:hover .ba-handle::after{transform:translate(-50%,-50%) scale(1.06)}
.ba-label{position:absolute;top:1.1rem;z-index:2;font-family:var(--font-display);font-weight:600;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;padding:.45rem .9rem;border-radius:.3rem;background:rgba(12,13,16,.72);backdrop-filter:blur(6px);color:var(--ice)}
.ba-label.before{left:1.1rem}
.ba-label.after{right:1.1rem}
.ba-note{margin-top:.8rem;font-size:.74rem;color:var(--ice-dim);text-align:center}
/* Echte Kundenfälle: Vorher/Nachher-Karten */
.case-grid{display:grid;gap:1.1rem;position:relative;z-index:2}
@media (min-width:900px){ .case-grid{grid-template-columns:repeat(3,1fr);gap:1.4rem} }
.case{margin:0;border:1px solid var(--line);border-radius:.7rem;overflow:hidden;background:rgba(243,242,239,.03);transition:border-color .45s var(--ease),transform .45s var(--ease)}
.case:hover{border-color:rgba(198,161,91,.4);transform:translateY(-3px)}
.case-imgs{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--asphalt)}
.case-img{position:relative}
.case-img img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.case-label{position:absolute;left:.55rem;bottom:.55rem;z-index:2;font-family:var(--font-display);font-weight:600;font-size:.5rem;letter-spacing:.16em;text-transform:uppercase;padding:.32rem .6rem;border-radius:.3rem;background:rgba(12,13,16,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:var(--ice)}
.case-label--after{background:rgba(198,161,91,.88);color:#14150F}
.case-body{padding:1.05rem 1.15rem 1.2rem}
.case-body h3{font-size:.9rem;color:var(--ice);letter-spacing:-.01em;margin-bottom:.35rem}
.case-body p{font-size:.76rem;color:var(--ice-dim);font-weight:300;line-height:1.55}

/* ============ Video-Einleger ============ */
.einleger{position:relative;border-radius:.6rem;overflow:hidden;box-shadow:var(--shadow-lg);border:1px solid var(--line)}
.einleger video{width:100%;display:block}
.einleger .badge{position:absolute;top:1.1rem;left:1.1rem;z-index:2;font-family:var(--font-display);font-weight:600;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;padding:.45rem .9rem;border-radius:.3rem;background:rgba(12,13,16,.72);backdrop-filter:blur(6px);color:var(--ice)}

/* ============ Split/Feature ============ */
.feature{display:grid;grid-template-columns:1fr;gap:2.4rem;align-items:center;position:relative;z-index:2}
@media (min-width:920px){ .feature{grid-template-columns:1fr 1fr;gap:3.5rem} }
.feature.rev{direction:rtl}
.feature.rev>*{direction:ltr}
.feature ul{display:grid;gap:.8rem;margin-top:1.4rem}
.feature ul li{display:flex;gap:.75rem;font-size:.95rem;color:var(--ice-soft);font-weight:300}
.feature ul svg{width:1.1rem;height:1.1rem;color:var(--gold);flex:none;margin-top:.2rem}
.feature-media{position:relative;border-radius:.6rem;overflow:hidden;box-shadow:var(--shadow-md);border:1px solid var(--line)}
.feature-media img{width:100%;aspect-ratio:4/3;object-fit:cover}

/* ============ Ablauf (Steps) ============ */
.steps{display:grid;grid-template-columns:1fr;gap:1.3rem;counter-reset:step;position:relative;z-index:2}
@media (min-width:760px){ .steps{grid-template-columns:repeat(4,1fr)} }
.step{position:relative;padding:1.8rem 1.5rem;border-radius:.6rem;background:var(--panel);border:1px solid var(--line)}
.step__n{font-family:var(--font-display);font-weight:700;font-size:1.9rem;color:var(--gold);line-height:1}
.step h3{font-size:.98rem;margin-top:.7rem}
.step p{font-size:.88rem;color:var(--ice-soft);margin-top:.5rem;font-weight:300}

/* ============ Stats (ruhig, ohne Boxen) ============ */
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem 1.6rem;position:relative;z-index:2}
@media (min-width:760px){ .stats{grid-template-columns:repeat(4,1fr)} }
.stat{padding-top:1.4rem;border-top:1px solid var(--line)}
.stat-num{font-family:var(--font-display);font-weight:700;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--gold)}
.stat-label{font-size:.84rem;color:var(--ice-soft);margin-top:.4rem;font-weight:400}

/* ============ Arbeits-Galerie ============ */
.work-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.1rem;position:relative;z-index:2}
@media (min-width:900px){ .work-grid{grid-template-columns:repeat(3,1fr);gap:1.4rem} }
.work-item{position:relative;display:block;margin:0;border-radius:.6rem;overflow:hidden;border:1px solid var(--line-ink);box-shadow:0 20px 46px -32px rgba(30,30,25,.4)}
.work-item img{width:100%;aspect-ratio:4/5;display:block;object-fit:cover;transition:transform .6s var(--ease)}
.work-item:hover img{transform:scale(1.04)}
.work-item .work-tag{position:absolute;left:.9rem;bottom:.9rem;z-index:2;font-family:var(--font-display);font-weight:600;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;padding:.4rem .8rem;border-radius:.3rem;background:rgba(12,13,16,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:var(--ice)}
@media (max-width:640px){ .work-item .work-tag{left:.6rem;bottom:.6rem;font-size:.48rem;letter-spacing:.1em;padding:.3rem .55rem} }
.work-item::after{content:"";position:absolute;inset:55% 0 0 0;background:linear-gradient(180deg,transparent,rgba(12,13,16,.38));opacity:0;transition:opacity .4s;pointer-events:none}
.work-item:hover::after{opacity:1}
.work-more{display:flex;align-items:center;gap:.6rem;justify-content:center;margin-top:2.2rem;font-size:.9rem;color:var(--ink-soft);position:relative;z-index:2}
.work-more a{font-weight:600;color:var(--gold-deep);border-bottom:1px solid rgba(154,123,63,.4);padding-bottom:.1rem;transition:border-color .3s,color .3s}
.work-more a:hover{color:#7C6231;border-color:#7C6231}

/* ============ FAQ-Akkordeon (native <details>) ============ */
.faq-list{position:relative;z-index:2;display:grid;gap:.9rem;max-width:52rem}
.faq-item{background:#fff;border:1px solid #E5E2DB;border-radius:.6rem;overflow:hidden;box-shadow:0 12px 32px -28px rgba(30,30,25,.3);transition:box-shadow .3s,border-color .3s}
.faq-item[open]{box-shadow:0 20px 44px -26px rgba(30,30,25,.35);border-color:rgba(154,123,63,.4)}
.faq-q{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.3rem 1.5rem;font-family:var(--font-display);font-weight:600;font-size:.98rem;color:var(--ink);-webkit-tap-highlight-color:transparent}
.faq-q::-webkit-details-marker{display:none}
.faq-q svg{width:1.2rem;height:1.2rem;flex:none;color:var(--gold-deep);transition:transform .35s var(--ease)}
.faq-item[open] .faq-q svg{transform:rotate(180deg)}
.faq-q:hover{color:var(--gold-deep)}
.faq-a{padding:0 1.5rem 1.4rem;font-size:.92rem;color:var(--ink-soft);font-weight:300;line-height:1.7}
.faq-a p{max-width:42rem}

/* ============ Kontakt ============ */
.contact-grid{display:grid;grid-template-columns:1fr;gap:2rem;position:relative;z-index:2}
@media (min-width:960px){ .contact-grid{grid-template-columns:1fr 1fr} }
.card{background:var(--panel);border:1px solid var(--line);border-radius:.6rem;padding:2.2rem;box-shadow:var(--shadow-md)}
.contact-row{display:flex;gap:1rem;align-items:flex-start;padding:1rem 0;border-bottom:1px solid var(--line)}
.contact-row:last-child{border-bottom:none}
.contact-row svg{width:1.25rem;height:1.25rem;color:var(--gold);flex:none;margin-top:.2rem}
.contact-row b{display:block;font-size:.95rem;font-weight:600}
.contact-row span{font-size:.86rem;color:var(--ice-soft);font-weight:300}
.field{display:block;margin-bottom:1.1rem}
.field label{display:block;font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;margin-bottom:.45rem;color:var(--ice-soft)}
.field input,.field textarea,.field select{width:100%;padding:.9rem 1rem;background:var(--asphalt-2);border:1px solid var(--line);border-radius:.35rem;color:var(--ice);font-family:var(--font-body);font-size:1rem;transition:border-color .3s}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--gold)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:520px){ .field-row{grid-template-columns:1fr} }
.map-frame{border-radius:.6rem;overflow:hidden;border:1px solid var(--line);position:relative;min-height:20rem;background:var(--panel)}
.map-cta{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;cursor:pointer;z-index:2;text-align:center;padding:1.5rem;transition:background .3s}
.map-cta:hover{background:rgba(198,161,91,.05)}
.map-cta b{font-family:var(--font-display);font-weight:600;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}
.map-cta svg{width:2.2rem;height:2.2rem;color:var(--gold)}
.map-frame iframe{width:100%;height:100%;min-height:20rem;border:0;position:absolute;inset:0;filter:invert(.92) hue-rotate(180deg) saturate(.6)}

/* ============ Footer ============ */
.footer{background:var(--asphalt-2);border-top:1px solid var(--line);padding:3.5rem 0 1.8rem;position:relative}
.footer-grid{display:grid;grid-template-columns:1fr;gap:2.5rem}
@media (min-width:768px){ .footer-grid{grid-template-columns:1.4fr 1fr 1fr} }
.footer h4{font-family:var(--font-display);font-size:.68rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.footer-links{display:grid;gap:.6rem}
.footer-links a{font-size:.92rem;color:var(--ice-soft);transition:color .3s;font-weight:300}
.footer-links a:hover{color:var(--ice)}
.footer-bottom{margin-top:3rem;padding-top:1.6rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:.8rem;color:var(--ice-dim)}
.footer-bottom a{color:var(--ice-dim)}
.footer-bottom a:hover{color:var(--gold)}

/* ============ Pagehead (Recht) ============ */
.pagehead{padding:10rem 0 3.5rem}

/* ============ Reveal ============ */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
[data-reveal].in{opacity:1;transform:translateY(0)}
[data-reveal].d1{transition-delay:.08s}
[data-reveal].d2{transition-delay:.16s}
[data-reveal].d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){ [data-reveal]{opacity:1;transform:none;transition:none} }

.totop{position:fixed;right:1.4rem;bottom:1.4rem;width:2.9rem;height:2.9rem;border-radius:50%;background:var(--panel-2);border:1px solid var(--line);color:var(--gold);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity .3s,transform .3s,border-color .3s;z-index:60}
.totop:hover{border-color:var(--gold)}
.totop.show{opacity:1;pointer-events:auto;transform:translateY(0)}
.totop svg{width:1.15rem;height:1.15rem}

/* WhatsApp-Float */
.wa-float{position:fixed;right:1.4rem;bottom:5rem;width:3.4rem;height:3.4rem;border-radius:50%;background:var(--whatsapp);color:#062812;display:flex;align-items:center;justify-content:center;box-shadow:0 16px 40px -12px rgba(37,211,102,.5);z-index:60;transition:transform .3s}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:1.7rem;height:1.7rem}