/* ════════════════════════════════════════════════════════════════
   enjoy the little moments — Stylesheet
   Fotografin Alina Mund · www.alinamund.com
   Stand: April 2026 · Single Source of Truth: CI_BRAND.md
   ────────────────────────────────────────────────────────────────
   Inhaltsverzeichnis
   01 · Reset & Basis
   02 · Design-Tokens (Farben, Fonts, Easing)
   03 · Globals (Body, Scrollbar, Progress, Cursor)
   04 · Header & Navigation (Sprungmarken-Menü)
   05 · Mobile Menu
   06 · Hero
   07 · Sections (Basis, Helper)
   08 · About
   09 · Specials Strip
   10 · Theme-Splits (Events / Business / Winzer / Privat)
   11 · Biz-Strip · Winzer-ATM · Event-Mosaic · Privat-Grid
   12 · Portfolio (Mason + Filter)
   13 · Lightbox
   14 · Leistungen (Tabs)
   15 · Process · Testimonials
   16 · Kontakt-Form & Map
   17 · FAQ Accordion
   18 · Regionen-Grid
   19 · Footer
   20 · Reveals & Premium-Effects
   21 · Photo-Placeholders
   22 · Legal-Modals
   23 · Responsive Breakpoints
   24 · Reduced-Motion · Print
   ════════════════════════════════════════════════════════════════ */

/* ═══ 00 · SELF-HOSTED FONTS (DSGVO-konform, kein Google Fonts) ═══ */
@font-face{
  font-family:"Lato";
  font-style:normal;font-weight:300;font-display:swap;
  src:url('../fonts/Lato/Lato-Light.woff2') format('woff2'),
      url('../fonts/Lato/Lato-Light.ttf')   format('truetype');
}
@font-face{
  font-family:"Lato";
  font-style:italic;font-weight:300;font-display:swap;
  src:url('../fonts/Lato/Lato-LightItalic.woff2') format('woff2'),
      url('../fonts/Lato/Lato-LightItalic.ttf')   format('truetype');
}
@font-face{
  font-family:"Lato";
  font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/Lato/Lato-Regular.woff2') format('woff2'),
      url('../fonts/Lato/Lato-Regular.ttf')   format('truetype');
}
@font-face{
  font-family:"Lato";
  font-style:italic;font-weight:400;font-display:swap;
  src:url('../fonts/Lato/Lato-Italic.woff2') format('woff2'),
      url('../fonts/Lato/Lato-Italic.ttf')   format('truetype');
}
@font-face{
  font-family:"Lato";
  font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/Lato/Lato-Bold.woff2') format('woff2'),
      url('../fonts/Lato/Lato-Bold.ttf')   format('truetype');
}
@font-face{
  font-family:"Lato";
  font-style:italic;font-weight:700;font-display:swap;
  src:url('../fonts/Lato/Lato-BoldItalic.woff2') format('woff2'),
      url('../fonts/Lato/Lato-BoldItalic.ttf')   format('truetype');
}
@font-face{
  font-family:"Shadows Into Light";
  font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/Shadows_Into_Light/ShadowsIntoLight-Regular.woff2') format('woff2'),
      url('../fonts/Shadows_Into_Light/ShadowsIntoLight-Regular.ttf')   format('truetype');
}

/* ═══ 01 · RESET & BASIS ═══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:99999}
.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}
.skip-link:focus{position:fixed;left:12px;top:12px;width:auto;height:auto;padding:10px 20px;background:var(--primary);color:var(--cream);font-family:var(--ss);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;outline:2px solid var(--gold);outline-offset:2px}

/* ═══ 02 · DESIGN-TOKENS (CI_BRAND.md) ═══ */
:root{
  color-scheme:light;
  /* Light Mode — Basis */
  --cream:#f5f5f9;--warm:#f0ece5;--sand:#e8dfd2;--taupe:#c4b8a8;
  --mocha:#8a7565;--esp:#3f301d;--ink:#0f0000;
  /* CI-Hierarchie */
  --primary:#2b2514;   /* Dunkeloliv — Text + dunkle Hintergründe */
  --tertiary:#d5c19f;  /* Warmes Beige — Akzentfarbe auf Dunkel */
  /* Akzente */
  --gold:#d5c19f;--gold2:#c8b08a;--rose:#c4a090;--sage:#9aaa94;
  --wine:#7a3040;--steel:#2a3540;
  /* Text */
  --tp:#2b2514;--ts:#3f301d;--tm:#9a8c82;--bg:#f5f5f9;
  /* Layout */
  --nav:80px;
  /* Typografie — NEU: Shadows Into Light / Lato */
  --sf:"Shadows Into Light",cursive;
  --ss:"Lato",system-ui,sans-serif;
  /* Easing */
  --ease:cubic-bezier(.25,.46,.45,.94);
  --expo:cubic-bezier(.19,1,.22,1);
}
[data-theme=dark]{
  color-scheme:dark;
  --cream:#141210;--warm:#1c1916;--sand:#2a2520;--taupe:#5a5048;
  --mocha:#9a8878;--esp:#c8b8a8;--ink:#f5f5f9;
  --tp:#f0ece6;--ts:#c8b8a8;--tm:#7a6a60;--bg:#141210;
  --primary:#d5c19f;
  --tertiary:#3f301d;
  /* Edge fix: explicit background/color so dark theme is applied even before variables resolve */
  background:#141210;
  color:#f0ece6;
}

/* ═══ 03 · GLOBALS ═══ */
/* Edge fix: explicit background/color on html prevents black-flash before CSS variables resolve */
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav) + 20px);overscroll-behavior-y:auto;background:#f5f5f9;color:#2b2514}
/* Edge fix: hard fallbacks on body — var(--bg) fallback to #f5f5f9 so Edge never composites black */
/* Edge fix: no-transition-on-load class prevents the background:var(--bg) transition from flashing black */
body{font-family:var(--ss);background:var(--bg,#f5f5f9);color:var(--tp,#2b2514);overflow-x:hidden;transition:background .4s,color .4s;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body.no-transition,body.no-transition *{transition:none!important}
[data-theme=dark] html,[data-theme=dark] body{background:#141210;color:#f0ece6}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
::-webkit-scrollbar{width:3px}
::-webkit-scrollbar-thumb{background:var(--taupe);border-radius:2px}
.pbar{position:fixed;top:0;left:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--rose));z-index:9999;width:0;transition:width .1s}
/* Edge fix: mix-blend-mode:multiply on a fixed element causes entire-page compositor darkening in Edge.
   Use screen blend-mode instead — visually similar on light backgrounds, no dark-layer side-effect.
   isolation:isolate prevents blend-mode from compositing against the viewport background. */
.cur{position:fixed;width:10px;height:10px;background:var(--gold,#d5c19f);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width .3s,height .3s,opacity .3s;mix-blend-mode:screen;isolation:isolate}
/* Edge fallback: disable blend-mode entirely for browsers that mishandle it */
@supports not (mix-blend-mode:screen){
  .cur{mix-blend-mode:normal}
}
.cur-r{position:fixed;width:36px;height:36px;border:1px solid var(--gold);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .4s,height .4s,opacity .3s}
.cur.h{width:54px;height:54px;opacity:.3}
.cur-r.h{width:0;height:0;opacity:0}

/* ═══ 04 · HEADER & NAVIGATION (Sprungmarken-Menü) ═══ */
.site-header{position:fixed;top:0;left:0;right:0;height:var(--nav);z-index:1000;transition:background .5s,backdrop-filter .5s,box-shadow .5s}
.site-header.scrolled{background:rgba(250,248,245,.92);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:0 1px 0 rgba(196,184,168,.2)}
nav.nav-inner{position:fixed;top:0;left:0;right:0;height:var(--nav);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,64px);z-index:1000;transition:transform .7s var(--expo),background .5s,backdrop-filter .5s,box-shadow .5s}
nav.nav-inner.sc{background:rgba(250,248,245,.92);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:0 1px 0 rgba(196,184,168,.2)}
nav.nav-inner.nav-up{transform:translateY(-110%)}
.nlogo-img{display:flex;align-items:center;flex-shrink:0;text-decoration:none;transition:opacity .3s}
.nlogo-img:hover{opacity:.75}
.nlogo-avatar{width:44px;height:44px;display:block;flex-shrink:0;opacity:.85;transition:opacity .3s}
.nlogo-img:hover .nlogo-avatar{opacity:1}
.nlogo{font-family:var(--sf);font-size:1.35rem;font-weight:400;letter-spacing:.02em;color:var(--tp);text-decoration:none;line-height:1.3}
.nlogo span{display:block;font-size:.62rem;letter-spacing:.22em;font-family:var(--ss);font-weight:300;color:var(--tm);text-transform:uppercase;margin-top:2px}
.nlinks{display:flex;align-items:center;gap:26px;list-style:none}
.nlinks a{font-family:var(--ss);font-size:.68rem;font-weight:300;letter-spacing:.13em;text-transform:uppercase;color:var(--ts);text-decoration:none;position:relative;transition:color .3s}
.nlinks a::after{content:"";position:absolute;bottom:-3px;left:0;right:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}
.nlinks a:hover{color:var(--tp)}
.nlinks a:hover::after{transform:scaleX(1);transform-origin:left}
.nlinks a.nav-active{color:var(--tp)}
.nlinks a.nav-active::after{transform:scaleX(1);transform-origin:left}

/* Dropdown — Mehrspaltige Sprungmarken-Liste */
.ndrop{position:relative}
.ndrop::after{content:'';position:absolute;top:100%;left:-10px;right:-10px;height:18px}
.ndd{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-8px);background:var(--bg);border:1px solid var(--sand);min-width:240px;padding:6px 0;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s var(--ease);box-shadow:0 20px 50px rgba(0,0,0,.08)}
.ndrop:hover .ndd,.ndrop:focus-within .ndd{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0)}
.ndd a{display:block;padding:9px 18px;font-family:var(--ss);font-size:.67rem;font-weight:300;letter-spacing:.1em;text-transform:uppercase;color:var(--ts);text-decoration:none;transition:background .2s,color .2s;white-space:nowrap}
.ndd a::after{display:none!important}
.ndd a:hover,.ndd a:focus-visible{background:var(--tertiary);color:var(--primary)}
.ndd hr{border:none;height:1px;background:var(--sand);margin:4px 0}

/* Primär-CTA (Anfragen) */
.ncta{touch-action:manipulation;font-family:var(--ss)!important;font-size:.68rem!important;letter-spacing:.13em!important;text-transform:uppercase!important;color:var(--cream)!important;background:var(--primary);padding:9px 18px;transition:background .3s!important}
.ncta::after{display:none!important}
.ncta:hover{background:var(--mocha)!important}

/* Theme-Toggle */
.ntbtn{background:none;border:1px solid var(--sand);border-radius:20px;padding:5px 11px;cursor:pointer;font-size:.7rem;font-family:var(--ss);color:var(--tm);transition:all .3s}
.ntbtn:hover{border-color:var(--gold);color:var(--gold)}

/* Burger */
.ham{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none}
.ham span{width:22px;height:1px;background:var(--tp);transition:all .3s;display:block}

/* ═══ 05 · MOBILE MENU ═══ */
.mobm{position:fixed;inset:0;background:var(--bg);z-index:999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;opacity:0;pointer-events:none;transition:opacity .4s;overflow-y:auto;padding:80px 40px 40px}
.mobm.op{opacity:1;pointer-events:all}
.mobm a{font-family:var(--sf);font-size:1.6rem;font-weight:300;color:var(--tp);text-decoration:none;transition:color .3s}
.mobm a:hover,.mobm a:focus-visible{color:var(--gold)}
.mobm .ms{font-size:1rem;color:var(--tm)}
.mobm .mhd{font-family:var(--ss);font-size:.62rem;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-top:14px;display:flex;align-items:center;gap:10px}
.mobm .mhd::before,.mobm .mhd::after{content:"";flex:1;height:1px;background:rgba(184,150,90,.4);min-width:30px}

/* ═══ 06 · HERO ═══ */
#hero{min-height:100svh;display:grid;grid-template-columns:1fr 1fr;overflow:hidden}
.hl{display:flex;flex-direction:column;justify-content:center;padding:calc(var(--nav) + 60px) clamp(24px,5vw,80px) 80px;position:relative;z-index:2}
.hey{font-family:var(--ss);font-size:.65rem;font-weight:300;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:24px;display:flex;align-items:center;gap:12px;opacity:0;transform:translateY(20px);animation:fup .8s var(--expo) .3s forwards}
.hey::before{content:"";width:28px;height:1px;background:var(--gold);flex-shrink:0}
.htit{font-family:var(--sf);font-weight:400;font-size:clamp(2.2rem,3.8vw,3.6rem);line-height:1.25;color:var(--tp);margin-bottom:22px;opacity:0;transform:translateY(30px);animation:fup 1s var(--expo) .5s forwards}
.htit em{font-style:italic;color:var(--mocha)}
.hsub{font-family:var(--ss);font-weight:300;font-size:clamp(.88rem,1.1vw,1rem);line-height:1.85;color:var(--ts);max-width:360px;margin-bottom:44px;opacity:0;transform:translateY(20px);animation:fup .8s var(--expo) .7s forwards}
.hact{display:flex;align-items:center;gap:22px;flex-wrap:wrap;opacity:0;transform:translateY(20px);animation:fup .8s var(--expo) .9s forwards;margin-bottom:48px}
.btn{font-family:var(--ss);font-size:.72rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);background:var(--primary);padding:15px 32px;text-decoration:none;border:none;cursor:pointer;position:relative;overflow:hidden;transition:all .4s;display:inline-block}
.btn::before{content:"";position:absolute;inset:0;background:var(--gold);transform:translateX(-101%);transition:transform .5s var(--expo)}
.btn:hover::before{transform:translateX(0)}
.btn span{position:relative;z-index:1}
.btng{touch-action:manipulation;font-family:var(--ss);font-size:.72rem;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:var(--ts);text-decoration:none;display:flex;align-items:center;gap:10px;transition:color .3s,gap .3s}
.btng:hover{color:var(--tp);gap:16px}
.hst{position:absolute;bottom:44px;left:clamp(24px,5vw,80px);display:flex;gap:36px;opacity:0;animation:fup .8s var(--expo) 1.1s forwards}
.hsn{font-family:var(--sf);font-size:1.9rem;font-weight:300;color:var(--esp);line-height:1.5}
.hsl{font-family:var(--ss);font-size:.62rem;font-weight:300;letter-spacing:.16em;text-transform:uppercase;color:var(--tm);margin-top:8px}
.hr{position:relative;overflow:hidden;opacity:0;animation:fi 1.2s var(--expo) .2s forwards}
.hrw{position:absolute;inset:0;transform:scale(1.08);animation:zo 8s var(--expo) .2s forwards}
@keyframes zo{to{transform:scale(1)}}
.hrov{position:absolute;inset:0;background:linear-gradient(135deg,rgba(74,55,40,.15) 0%,transparent 60%)}
.hbadge{position:absolute;bottom:44px;right:44px;width:96px;height:96px;background:rgba(250,248,245,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid rgba(184,150,90,.3);animation:sp 20s linear infinite}
.hbi{animation:spr 20s linear infinite;display:flex;flex-direction:column;align-items:center}
@keyframes sp{to{transform:rotate(360deg)}}
@keyframes spr{to{transform:rotate(-360deg)}}
.hbn{font-family:var(--sf);font-size:1.3rem;font-weight:300;color:var(--esp);line-height:1}
.hbt{font-family:var(--ss);font-size:.44rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mocha);margin-top:2px;text-align:center}
@keyframes fup{to{opacity:1;transform:translateY(0)}}
@keyframes fi{to{opacity:1}}

/* ═══ 07 · SECTIONS · BASIS ═══ */
section{padding:clamp(72px,9vw,128px) clamp(20px,4vw,64px)}
.mw{max-width:1200px;margin:0 auto}
.ey{font-family:var(--ss);font-size:.65rem;font-weight:300;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:12px;margin-bottom:18px}
.ey::before{content:"";width:24px;height:1px;background:var(--gold)}
.st{font-family:var(--sf);font-weight:400;font-size:clamp(1.7rem,3vw,2.6rem);line-height:1.3;color:var(--tp);margin-bottom:20px}
.st em{font-style:italic;color:var(--mocha)}

/* ═══ 08 · ABOUT ═══ */
#about{background:var(--warm)}
.agrid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,96px);align-items:center}
.aims{position:relative;padding:24px 0 24px 24px}
.amain{width:78%;aspect-ratio:3/4;display:block;position:relative;z-index:2;filter:brightness(.95) saturate(.88)}
.aacc{width:50%;aspect-ratio:4/5;position:absolute;bottom:0;right:0;border:5px solid var(--bg);z-index:3;filter:brightness(.95) saturate(.88)}
.afr{position:absolute;top:0;left:0;width:65%;height:65%;border:1px solid var(--gold);opacity:.4;pointer-events:none}
.ab{font-family:var(--ss);font-size:.93rem;line-height:1.9;color:var(--ts);font-weight:300;margin-bottom:18px}
.ab strong{font-weight:500;color:var(--tp)}
.aq{font-family:var(--sf);font-size:1.35rem;font-weight:300;font-style:italic;line-height:1.5;color:var(--mocha);border-left:2px solid var(--gold);padding-left:22px;margin:28px 0}
.asig{font-family:var(--sf);font-size:1.9rem;font-weight:300;font-style:italic;color:var(--primary);margin-top:28px}
.alogo{display:flex;align-items:center;gap:14px}
.alogo img{transition:transform .4s var(--ease),box-shadow .4s}
.alogo img:hover{transform:scale(1.06);box-shadow:0 12px 40px rgba(43,37,20,.28)!important}

/* ═══ 09 · SPECIALS ═══ */
#specials{padding-bottom:0}
.sps{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * clamp(20px,4vw,64px));padding:0 clamp(20px,4vw,64px)}
.sps::-webkit-scrollbar{display:none}
.spc{flex:0 0 340px;position:relative;overflow:hidden;cursor:pointer;text-decoration:none}
.spci{height:480px;transition:transform .7s var(--expo),filter .5s;filter:brightness(.72) saturate(.8)}
.spc:hover .spci{transform:scale(1.06);filter:brightness(.55) saturate(.9)}
.spco{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,14,10,.9) 0%,rgba(20,14,10,.1) 55%,transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:32px 28px}
.spct{font-family:var(--ss);font-size:.58rem;font-weight:300;letter-spacing:.2em;text-transform:uppercase;color:var(--gold2);margin-bottom:8px}
.spcn{font-family:var(--sf);font-size:1.35rem;font-weight:400;color:rgba(255,255,255,.95);line-height:1.3;margin-bottom:10px}
.spcl{font-family:var(--ss);font-size:.65rem;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);display:flex;align-items:center;gap:8px;transition:gap .3s,color .3s}
.spc:hover .spcl{gap:14px;color:var(--gold2)}
.spnav{display:flex;justify-content:flex-end;gap:8px;padding:clamp(14px,2vw,20px) clamp(20px,4vw,64px);background:var(--bg)}
.spbtn{width:40px;height:40px;border:1px solid var(--sand);background:none;cursor:pointer;color:var(--tm);display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .3s}
.spbtn:hover{border-color:var(--primary);color:var(--primary)}

/* ═══ 10 · THEME-SPLITS ═══ */
.ts{overflow:hidden}
.tsp{display:grid;grid-template-columns:1fr 1fr;min-height:600px}
.tsp.rv{direction:rtl}
.tsp.rv>*{direction:ltr}
.tvis{position:relative;overflow:hidden}
.tvi{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--expo);filter:brightness(.9) saturate(.88)}
.ts:hover .tvi{transform:scale(1.04)}
.tvl{position:absolute;bottom:22px;left:22px;font-family:var(--ss);font-size:.58rem;font-weight:300;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.6);background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:5px 11px;border:1px solid rgba(255,255,255,.1)}
.tacc{font-family:var(--sf);font-size:6rem;font-weight:300;line-height:1;position:absolute;top:20px;right:26px;opacity:.4;pointer-events:none;-webkit-user-select:none;user-select:none}
.tcon{display:flex;flex-direction:column;justify-content:center;padding:clamp(48px,7vw,100px) clamp(32px,5vw,72px);background:var(--warm);position:relative}
.tcon.dk{background:var(--primary)}
.tcon.dk .ey{color:var(--gold2)}
.tcon.dk .ey::before{background:var(--gold2)}
.tcon.dk .st{color:rgba(255,255,255,.95)}
.tcon.dk .st em{color:var(--gold2)}
.tcon.dk .tb{color:rgba(255,255,255,.65)}
.tcon.dk .tf{color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.12)}
.tcon.dk .tf::before{background:var(--gold2)}
.tcon.dk .tacc{color:rgba(255,255,255,.06)}
.tcon.wn{background:var(--wine)}
.tcon.wn .ey{color:#e8c090}
.tcon.wn .ey::before{background:#e8c090}
.tcon.wn .st{color:rgba(255,255,255,.95)}
.tcon.wn .st em{color:#e8c090}
.tcon.wn .tb{color:rgba(255,255,255,.68)}
.tcon.wn .tf{color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.15)}
.tcon.wn .tf::before{background:#e8c090}
.tcon.wn .tacc{color:rgba(255,255,255,.05)}
.tcon.st{background:var(--steel)}
.tcon.st .ey{color:#90b8d0}
.tcon.st .ey::before{background:#90b8d0}
.tcon.st .st{color:rgba(255,255,255,.95)}
.tcon.st .st em{color:#90b8d0}
.tcon.st .tb{color:rgba(255,255,255,.65)}
.tcon.st .tf{color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.12)}
.tcon.st .tf::before{background:#90b8d0}
.tcon.st .tacc{color:rgba(255,255,255,.05)}
.tprice{display:inline-flex;align-items:center;font-family:var(--ss);font-size:.65rem;font-weight:300;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold);padding:7px 16px;margin-bottom:28px}
.tb{font-family:var(--ss);font-size:.92rem;line-height:1.85;color:var(--ts);font-weight:300;margin-bottom:26px}
.tfl{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:34px}
.tf{font-family:var(--ss);font-size:.82rem;font-weight:300;color:var(--ts);display:flex;align-items:center;gap:12px;padding-bottom:11px;border-bottom:1px solid var(--sand)}
.tf::before{content:"";width:18px;height:1px;background:var(--gold);flex-shrink:0}
.bginv{font-family:var(--ss);font-size:.72rem;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);padding:15px 32px;text-decoration:none;cursor:pointer;display:inline-block;transition:all .4s}
.bginv:hover{background:rgba(255,255,255,.2)}

/* ═══ 11 · BIZ-STRIP / WINZER / EVENT / PERSÖNLICH ═══ */
.bzs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--sand);border-bottom:1px solid var(--sand);background:var(--bg)}
.bzsi{padding:32px 26px;border-right:1px solid var(--sand);transition:background .3s}
.bzsi:last-child{border-right:none}
.bzsi:hover{background:var(--warm)}
.bzic{font-size:1.4rem;color:var(--gold);margin-bottom:14px;display:block}
.bzt{font-family:var(--sf);font-size:1.1rem;font-weight:400;color:var(--tp);margin-bottom:8px}
.bztx{font-family:var(--ss);font-size:.78rem;font-weight:300;line-height:1.6;color:var(--tm)}

.wnatm{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.wncl{position:relative;overflow:hidden;aspect-ratio:3/4}
.wncl:hover .wni{transform:scale(1.06);filter:brightness(.62)}
.wni{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--expo),filter .5s;filter:brightness(.78) saturate(.75)}
.wnlb{position:absolute;bottom:0;left:0;right:0;padding:22px 18px;background:linear-gradient(to top,rgba(100,20,40,.85) 0%,transparent 100%);font-family:var(--sf);font-size:1.05rem;font-style:italic;font-weight:300;color:rgba(255,255,255,.9)}


.evmo{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:300px 300px;gap:3px}
.evmo .evcl:first-child{grid-row:span 2}
.evcl{position:relative;overflow:hidden}
.evcl:hover .evi{transform:scale(1.05);filter:brightness(.62)}
.evi{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--expo),filter .5s;filter:brightness(.85) saturate(.85)}
.evov{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,14,10,.72) 0%,transparent 55%);display:flex;align-items:flex-end;padding:18px;opacity:0;transition:opacity .4s}
.evcl:hover .evov{opacity:1}
.evcap{font-family:var(--ss);font-size:.68rem;font-weight:300;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.9)}

.unst{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--sand);background:var(--bg)}

/* ═══ 12 · PORTFOLIO (Mason + Filter) ═══ */
#portfolio{background:var(--warm)}
.pfh{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:36px;flex-wrap:wrap;gap:18px}
.pff{display:flex;gap:6px;flex-wrap:wrap}
.fb{font-family:var(--ss);font-size:.65rem;font-weight:300;letter-spacing:.13em;text-transform:uppercase;padding:7px 15px;border:1px solid var(--sand);background:none;cursor:pointer;color:var(--tm);transition:all .3s}
.fb:hover,.fb.ac{border-color:var(--primary);background:var(--primary);color:var(--cream)}
.mason{columns:3;gap:14px}
.mi{break-inside:avoid;margin-bottom:14px;position:relative;overflow:hidden;cursor:pointer}
.mi:hover .mph{transform:scale(1.06);filter:brightness(1) saturate(1)}
.mph{width:100%;display:block;transition:transform .7s var(--expo),filter .5s;filter:brightness(.94) saturate(.84)}
.mca{position:absolute;inset:0;background:linear-gradient(to top,rgba(26,20,16,.65) 0%,transparent 55%);display:flex;align-items:flex-end;padding:18px;opacity:0;transition:opacity .4s}
.mi:hover .mca{opacity:1}
.mccat{font-family:var(--ss);font-size:.58rem;font-weight:300;letter-spacing:.18em;text-transform:uppercase;color:var(--gold2);margin-bottom:3px}
.mccap{font-family:var(--ss);font-size:.7rem;font-weight:300;color:rgba(255,255,255,.9)}

/* ═══ 13 · LIGHTBOX ═══ */
.lbox{position:fixed;inset:0;background:rgba(15,12,10,.96);z-index:9000;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s}
.lbox.op{opacity:1;pointer-events:all}
.lbcl{position:absolute;top:20px;right:20px;background:none;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.7);width:42px;height:42px;border-radius:50%;cursor:pointer;font-size:1.1rem;display:flex;align-items:center;justify-content:center;transition:all .3s}
.lbcl:hover{background:rgba(255,255,255,.1);color:#fff}
.lbnv{position:absolute;top:50%;transform:translateY(-50%);background:none;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.7);width:48px;height:48px;border-radius:50%;cursor:pointer;font-size:1.1rem;display:flex;align-items:center;justify-content:center;transition:all .3s}
.lbnv:hover{background:rgba(255,255,255,.1);color:#fff}
.lbpr{left:20px}
.lbnx{right:20px}

/* ═══ 14 · LEISTUNGEN (Tabs) ═══ */
#leistungen{background:var(--bg)}
.ltabs{display:flex;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--sand);margin-bottom:44px}
.ltabs::-webkit-scrollbar{display:none}
.ltab{font-family:var(--ss);font-size:.67rem;font-weight:300;letter-spacing:.13em;text-transform:uppercase;padding:14px 22px;border:none;background:none;cursor:pointer;color:var(--tm);border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .3s;white-space:nowrap}
.ltab:hover{color:var(--tp)}
.ltab.ac{color:var(--primary);border-bottom-color:var(--gold)}
.lpanel{display:none}
.lpanel.ac{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding-bottom:20px;cursor:grab}
.lpanel.ac:active{cursor:grabbing}
.lpanel.ac::-webkit-scrollbar{height:4px}
.lpanel.ac::-webkit-scrollbar-track{background:rgba(255,255,255,.06)}
.lpanel.ac::-webkit-scrollbar-thumb{background:var(--gold);border-radius:2px}
.svc{background:var(--warm);padding:38px 30px;border:1px solid var(--sand);position:relative;overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s,border-color .4s;flex:0 0 280px;min-width:280px;scroll-snap-align:start}
.svc::after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--rose));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--expo)}
.svc:hover{transform:translateY(-5px);box-shadow:0 18px 50px rgba(0,0,0,.07);border-color:var(--taupe)}
.svc:hover::after{transform:scaleX(1)}
.svic{font-size:1.5rem;margin-bottom:14px;display:block;color:var(--gold)}
.svn{font-family:var(--sf);font-size:1.2rem;font-weight:400;color:var(--tp);margin-bottom:6px}
.svp{font-family:var(--ss);font-size:.72rem;font-weight:300;color:var(--gold);margin-bottom:14px}
.svd{font-family:var(--ss);font-size:.83rem;line-height:1.7;color:var(--ts);font-weight:300;margin-bottom:18px}
.svfl{list-style:none;border-top:1px solid var(--sand);padding-top:14px;display:flex;flex-direction:column;gap:8px}
.svfi{font-family:var(--ss);font-size:.78rem;font-weight:300;color:var(--ts);display:flex;align-items:center;gap:10px}
.svfi::before{content:"";width:14px;height:1px;background:var(--gold);flex-shrink:0}

/* ═══ 15 · PROCESS · TESTIMONIALS ═══ */
#process{background:var(--warm)}
.proc{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--sand)}
.ps{padding:34px 26px;border-right:1px solid var(--sand);transition:background .3s}
.ps:last-child{border-right:none}
.ps:hover{background:var(--bg)}
.psn{font-family:var(--sf);font-size:2.6rem;font-weight:300;color:var(--sand);line-height:1;margin-bottom:16px;transition:color .3s}
.ps:hover .psn{color:var(--gold);opacity:.4}
.pst{font-family:var(--sf);font-size:1.1rem;font-weight:400;color:var(--tp);margin-bottom:9px}
.pstx{font-family:var(--ss);font-size:.79rem;line-height:1.7;color:var(--tm);font-weight:300}

#stimmen{background:var(--primary);padding:clamp(72px,9vw,128px) clamp(20px,4vw,64px);overflow:hidden}
#stimmen .ey{color:var(--gold2)}
#stimmen .ey::before{background:var(--gold2)}
#stimmen .st{color:rgba(255,255,255,.95)}

/* Header-Zeile: Überschrift + Google-Badge */
.tghd{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:44px;flex-wrap:wrap}

/* Google-Badge */
.gbadge{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);padding:14px 20px;text-decoration:none;transition:background .3s}
.gbadge:hover{background:rgba(255,255,255,.11)}
.glogo{width:32px;height:32px;flex-shrink:0}
.gbinfo{display:flex;flex-direction:column;gap:2px}
.gbscore{font-family:var(--sf);font-size:1.5rem;font-weight:400;color:rgba(255,255,255,.95);line-height:1}
.gbstars{color:#fbbc05;font-size:.78rem;letter-spacing:2px;line-height:1}
.gbcount{font-family:var(--ss);font-size:.6rem;font-weight:300;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.4)}

/* Slider-Container */
.tslider-wrap{position:relative;display:flex;align-items:center;gap:0}
.tslider{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding:8px 4px 20px;cursor:grab;user-select:none}
.tslider:active{cursor:grabbing}
.tslider::-webkit-scrollbar{height:3px}
.tslider::-webkit-scrollbar-track{background:rgba(255,255,255,.06)}
.tslider::-webkit-scrollbar-thumb{background:rgba(184,150,90,.35);border-radius:2px}

/* Bewertungs-Karte */
.tc{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);padding:24px 22px 20px;flex:0 0 288px;min-width:288px;scroll-snap-align:start;transition:background .3s,transform .4s var(--ease);display:flex;flex-direction:column;gap:0}
.tc:hover{background:rgba(255,255,255,.12);transform:translateY(-3px)}
/* Edge fix: IntersectionObserver doesn't reliably fire inside overflow-x:auto sliders.
   Testimonial cards must always be visible — no JS-triggered reveal needed in this context. */
#stimmen .tc{opacity:1!important;transform:none!important}

/* Karten-Header: Avatar + Name */
.tchead{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.tcavi{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--ss);font-size:.88rem;font-weight:500;color:#fff;flex-shrink:0}
.tcn{font-family:var(--ss);font-size:.78rem;font-weight:500;color:rgba(255,255,255,.92);line-height:1.2}
.tcr{font-family:var(--ss);font-size:.62rem;font-weight:300;color:rgba(255,255,255,.38);margin-top:2px}

/* Sterne */
.tcst{color:#fbbc05;font-size:.72rem;letter-spacing:3px;margin-bottom:12px;flex-shrink:0}

/* Bewertungstext */
.tctx{font-family:var(--ss);font-size:.84rem;font-weight:300;font-style:normal;line-height:1.65;color:rgba(255,255,255,.75);margin:0 0 14px;flex:1;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}

/* Kategorie-Tag */
.tccat{font-family:var(--ss);font-size:.58rem;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:rgba(184,150,90,.6);padding-top:12px;border-top:1px solid rgba(255,255,255,.07);margin-top:auto}

/* Slider-Buttons */
.tslider-btn{position:relative;z-index:2;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.7);width:40px;height:40px;flex-shrink:0;cursor:pointer;font-size:1rem;transition:background .3s,color .3s;align-self:center;margin:0 6px}
.tslider-btn:hover{background:rgba(184,150,90,.25);color:#fff;border-color:rgba(184,150,90,.4)}

/* ═══ 16 · KONTAKT ═══ */
#kontakt{background:var(--warm)}
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,96px);align-items:start}
.cbody{font-family:var(--ss);font-size:.93rem;line-height:1.8;color:var(--ts);font-weight:300;margin-bottom:32px}
.cdet{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.cdic{width:38px;height:38px;border:1px solid var(--sand);display:flex;align-items:center;justify-content:center;font-size:.9rem;color:var(--gold);flex-shrink:0}
.cdl{font-family:var(--ss);font-size:.62rem;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:var(--tm)}
.cdv{font-family:var(--ss);font-size:.88rem;font-weight:300;color:var(--tp);margin-top:2px}
.mapp{width:100%;height:170px;background:linear-gradient(135deg,var(--sand),var(--warm));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;border:1px solid var(--sand);transition:background .3s;margin-top:28px}
.mapp:hover{background:linear-gradient(135deg,var(--taupe),var(--sand))}
.fg{margin-bottom:18px}
.fl{display:block;font-family:var(--ss);font-size:.62rem;font-weight:300;letter-spacing:.15em;text-transform:uppercase;color:var(--tm);margin-bottom:7px}
.fi,.fta,.fse{width:100%;font-family:var(--ss);font-size:.88rem;font-weight:300;color:var(--tp);background:var(--bg);border:1px solid var(--sand);padding:12px 15px;outline:none;transition:border-color .3s,box-shadow .3s}
.fi:focus,.fta:focus,.fse:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,150,90,.1)}
.fta{resize:vertical;min-height:105px}
.fse{-webkit-appearance:none;appearance:none;background-image:none;cursor:pointer}

/* Shooting-Thema – Custom-Dropdown */
.fg-shooting{margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--sand)}
.fls{font-size:.68rem;color:var(--gold);letter-spacing:.18em;margin-bottom:10px}
.fse-wrap{position:relative}

/* Native select: versteckt, nur für Formular-Submission */
.fcs-native{position:absolute;opacity:0;pointer-events:none;width:100%;height:1px;top:48px;left:0;z-index:-1}
.fcs-native.fi-err~.fcs-btn{border-color:#c0392b}

/* Trigger-Button */
.fcs-btn{
  width:100%;display:flex;align-items:center;gap:12px;
  padding:14px 44px 14px 18px;
  background:var(--bg);border:1px solid var(--gold);
  color:var(--ts);font-family:var(--ss);font-size:.9rem;font-weight:300;
  text-align:left;cursor:pointer;border-radius:2px;
  transition:border-color .3s,box-shadow .3s,background .3s;
  position:relative;
}
.fcs-btn:hover,.fcs-btn:focus-visible{
  border-color:var(--gold2);
  box-shadow:0 0 0 3px rgba(184,150,90,.12);
  outline:none;
}
.fcs-btn[aria-expanded="true"]{
  border-color:var(--gold2);
  box-shadow:0 0 0 3px rgba(184,150,90,.12);
  border-bottom-color:transparent;
  border-radius:2px 2px 0 0;
}
.fcs-val{flex:1;color:var(--tm);transition:color .2s}
.fcs-btn.fcs-sel .fcs-val{color:var(--tp)}
.fse-arrow{
  position:absolute;right:16px;top:50%;
  transform:translateY(-50%);
  font-size:1.15rem;color:var(--gold);
  pointer-events:none;line-height:1;
  transition:transform .35s var(--ease);
}
.fcs-btn[aria-expanded="true"] .fse-arrow{transform:translateY(-50%) rotate(180deg)}

/* Vintage-Kamera SVG */
.fcs-cam{
  width:24px;height:17px;flex-shrink:0;
  fill:none;stroke:var(--gold);
  stroke-linecap:round;stroke-linejoin:round;
  transition:stroke .2s;
}

/* Options-Liste */
.fcs-list{
  position:absolute;top:100%;left:0;right:0;
  background:var(--bg);
  border:1px solid var(--gold2);border-top:none;
  list-style:none;padding:4px 0;margin:0;
  z-index:300;
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .38s var(--ease),opacity .25s;
  border-radius:0 0 2px 2px;
  box-shadow:0 12px 32px rgba(0,0,0,.14);
}
.fcs-wrap.fcs-open .fcs-list{max-height:420px;overflow-y:auto;opacity:1}

.fcs-opt{
  display:flex;align-items:center;gap:12px;
  padding:11px 18px;
  font-family:var(--ss);font-size:.86rem;font-weight:300;
  color:var(--ts);cursor:pointer;
  transition:background .18s,color .18s;
  outline:none;
}
.fcs-opt:hover,.fcs-opt:focus{
  background:rgba(184,150,90,.09);
  color:var(--tp);
}
.fcs-opt[aria-selected="true"]{color:var(--gold)}
.fcs-opt[aria-selected="true"] .fcs-cam{stroke:var(--gold2)}

@keyframes fse-pulse{
  0%{box-shadow:0 0 0 0 rgba(184,150,90,.4)}
  60%{box-shadow:0 0 0 10px transparent}
  100%{box-shadow:0 0 0 0 transparent}
}
.fse-highlight .fcs-btn{animation:fse-pulse .95s var(--ease);border-color:var(--gold2)}
.fchkw{display:flex;align-items:flex-start;gap:10px}
.fchk{width:17px;height:17px;border:1px solid var(--sand);flex-shrink:0;margin-top:2px;cursor:pointer;accent-color:var(--gold)}
.fchkl{font-family:var(--ss);font-size:.75rem;font-weight:300;line-height:1.5;color:var(--tm)}
.fchkl a{color:var(--mocha)}
.fsub{width:100%;font-family:var(--ss);font-size:.72rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);background:var(--primary);padding:17px;border:none;cursor:pointer;position:relative;overflow:hidden;margin-top:8px}
.fsub::before{content:"";position:absolute;inset:0;background:var(--gold);transform:translateX(-101%);transition:transform .5s var(--expo)}
.fsub:hover::before{transform:translateX(0)}
.fsub span{position:relative;z-index:1}
.fsuc{display:none;text-align:center;padding:26px;font-family:var(--sf);font-size:1.15rem;font-style:italic;color:var(--sage)}
.err-msg{display:block;font-family:var(--ss);font-size:.65rem;color:#c0392b;margin-top:4px;font-weight:400}
input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:#c0392b!important}
.fi-err{border-color:#c0392b!important}

/* ═══ 17 · FAQ ACCORDION ═══ */
.faq-list{display:flex;flex-direction:column}
.faq-item{border-bottom:1px solid var(--sand)}
.faq-item:first-child{border-top:1px solid var(--sand)}
.faq-q{width:100%;background:none;border:none;display:flex;align-items:center;justify-content:space-between;padding:22px 0;cursor:pointer;text-align:left;gap:20px}
.faq-q h3{font-family:var(--ss);font-size:.95rem;font-weight:400;color:var(--tp);margin:0;max-width:none}
.faq-ic{width:28px;height:28px;border:1px solid var(--taupe);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;color:var(--tm);flex-shrink:0;transition:all .3s;line-height:1}
.faq-item.open .faq-ic{transform:rotate(45deg);border-color:var(--gold);color:var(--gold)}
.faq-ans{overflow:hidden;max-height:0;transition:max-height .5s var(--ease)}
.faq-ans p{padding-bottom:22px;font-size:.9rem;max-width:80ch}
.faq-item.open .faq-ans{max-height:600px}

/* ═══ 18 · REGIONEN-GRID ═══ */
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:0;border:1px solid var(--sand)}
.rcell{padding:18px 20px;border-right:1px solid var(--sand);border-bottom:1px solid var(--sand)}
.rtit{font-family:var(--ss);font-size:.65rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--tm);margin-bottom:10px}
.rlist{list-style:none;padding:0}
.rlist li{font-family:var(--ss);font-size:.78rem;font-weight:300;color:var(--ts);padding:3px 0;max-width:none}
.rlist a{color:var(--ts);text-decoration:none;transition:color .2s}
.rlist a:hover{color:var(--gold)}

/* Container für Regionen-Section */
.container{max-width:1200px;margin:0 auto;padding:0 clamp(20px,4vw,64px)}

/* ═══ 19 · FOOTER ═══ */
footer{background:var(--ink);color:rgba(255,255,255,.5);padding:56px clamp(20px,4vw,64px) 26px}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:36px;max-width:1200px;margin:0 auto 40px}
.flogo{font-family:var(--sf);font-size:1.15rem;font-weight:400;color:rgba(255,255,255,.9);margin-bottom:12px;display:block;letter-spacing:.01em}
.ftag{font-family:var(--ss);font-size:.79rem;font-weight:300;line-height:1.7;color:rgba(255,255,255,.38);margin-bottom:22px}
.fsoc{display:flex;gap:10px}
.fsi{width:34px;height:34px;border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.42);text-decoration:none;transition:all .3s;border-radius:50%}
.fsi:hover{border-color:var(--gold);color:var(--gold)}
.fct{font-family:var(--ss);font-size:.62rem;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.62);margin-bottom:16px}
.flinks{list-style:none;display:flex;flex-direction:column;gap:8px}
.flinks a{font-family:var(--ss);font-size:.79rem;font-weight:300;color:rgba(255,255,255,.38);text-decoration:none;transition:color .3s}
.flinks a:hover{color:rgba(255,255,255,.8)}
.fbot{max-width:1200px;margin:0 auto;border-top:1px solid rgba(255,255,255,.08);padding-top:22px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.fcp{font-family:var(--ss);font-size:.69rem;font-weight:300;color:rgba(255,255,255,.26)}
.flg{display:flex;gap:18px}
.flg a{font-family:var(--ss);font-size:.69rem;font-weight:300;color:rgba(255,255,255,.26);text-decoration:none;transition:color .3s}
.flg a:hover{color:rgba(255,255,255,.6)}

/* ═══ 20 · REVEALS · PREMIUM-EFFECTS ═══
   Progressive Enhancement Pattern:
   Elemente sind standardmäßig SICHTBAR.
   Nur wenn JS aktiv ist (html.js-rv gesetzt), wird opacity:0 angewendet.
   So ist der Inhalt in JEDEM Browser sichtbar — auch bei JS-Verzögerung, Edge-
   IntersectionObserver-Problemen oder Overflow-Container-Sonderverhalten.
   Das .vi-Flag (gesetzt per IntersectionObserver + Timeout-Fallback) macht sichtbar. */
.rv{transition:opacity .9s var(--expo),transform .9s var(--expo)}
html.js-rv .rv{opacity:0;transform:translateY(40px)}
.rv.vi{opacity:1!important;transform:translateY(0)!important}

.rvl{transition:opacity .9s var(--expo),transform .9s var(--expo)}
html.js-rv .rvl{opacity:0;transform:translateX(-40px)}
.rvl.vi{opacity:1!important;transform:translateX(0)!important}

.rvr{transition:opacity .9s var(--expo),transform .9s var(--expo)}
html.js-rv .rvr{opacity:0;transform:translateX(40px)}
.rvr.vi{opacity:1!important;transform:translateX(0)!important}

/* Word-by-word reveal */
.word{display:inline-block;overflow:hidden;vertical-align:bottom;line-height:inherit}
.word-inner{will-change:transform;transition:transform 1.1s cubic-bezier(.19,1,.22,1),opacity .35s ease}
html.js-rv .word-inner{display:inline-block;transform:translateY(108%);opacity:0}
.word-reveal.vi .word-inner{transform:translateY(0)!important;opacity:1!important}
/* Image wipe overlay (JS) */
.wipe-ov{position:absolute;inset:0;z-index:6;pointer-events:none;transition:transform 1.45s cubic-bezier(.19,1,.22,1)}
/* Magnetic buttons — JS adds inline transform */
.btn,.bginv{transition:transform .5s cubic-bezier(.19,1,.22,1),background .3s,color .3s,box-shadow .4s!important}

/* ═══ 21 · PHOTO-PLACEHOLDERS ═══ */
.pb{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background-size:cover;background-position:center;background-repeat:no-repeat}
.pbl{position:absolute;font-family:var(--ss);font-size:.56rem;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5);text-align:center;padding:8px;pointer-events:none}
.phero{background-color:#8a7868}
.pwarm{background:#c4a87a url('../img/startseite/beach-portrait-1200w.jpg') center/cover no-repeat}
.psoft{background:#9090a0 url('../img/hochzeit/couple-lake-1200w.jpg') center/cover no-repeat}
.pbiz{background:#303840 url('../img/startseite/hero-portrait-1200w.jpg') center top/cover no-repeat}
.pbiz2{background:#303840 url('../img/startseite/hero-portrait-1200w.jpg') center top/cover no-repeat}
.pwine{background:#3a1020 url('../img/winzer/wine-bottle-1200w.jpg') center/cover no-repeat}
.pwine2{background:#2a1808 url('../img/winzer/gastro-event-1200w.jpg') center/cover no-repeat}
.pwine3{background:#3a1020 url('../img/winzer/wine-bottle-800w.jpg') center/cover no-repeat}
.pevent{background:#786058 url('../img/hochzeit/wedding-couple-1200w.jpg') center/cover no-repeat}
.pevent2{background:#908070 url('../img/hochzeit/couple-embrace-1200w.jpg') center/cover no-repeat}
.pcorp{background:#303840 url('../img/startseite/hero-portrait-1200w.jpg') center top/cover no-repeat}
.pprivat{background:#2a2434 url('../img/startseite/beach-portrait-1200w.jpg') center/cover no-repeat}
.pcorp2{background:#707880 url('../img/hochzeit/couple-lake-1200w.jpg') center/cover no-repeat}
.pdusk{background:#786050 url('../img/winzer/gastro-event-1200w.jpg') center/cover no-repeat}
.pgolden{background:#a09050 url('../img/hochzeit/couple-golden-1200w.jpg') center/cover no-repeat}

/* ═══ 22 · LEGAL-MODALS ═══ */
.legal-modal{position:fixed;inset:0;z-index:9500;display:flex;align-items:flex-start;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s;padding:clamp(16px,4vw,48px) clamp(16px,4vw,48px) 16px;overflow-y:auto;background:rgba(15,12,10,.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.legal-modal.open{opacity:1;pointer-events:all}
.legal-modal-inner{background:var(--bg);max-width:760px;width:100%;padding:clamp(28px,5vw,56px);position:relative;margin:auto;border:1px solid var(--sand)}
.legal-modal-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:1.1rem;cursor:pointer;color:var(--tm);line-height:1;padding:4px 8px;transition:color .2s;touch-action:manipulation}
.legal-modal-close:hover{color:var(--tp)}
.legal-modal-inner h1{font-family:var(--sf);font-size:clamp(1.4rem,3vw,2rem);font-weight:300;margin-bottom:28px;color:var(--tp)}
.legal-modal-inner h2{font-family:var(--sf);font-size:1.05rem;font-weight:400;margin:24px 0 8px;color:var(--esp)}
.legal-modal-inner p{font-family:var(--ss);font-size:.82rem;line-height:1.8;color:var(--ts);margin-bottom:12px}
.legal-modal-inner ul{margin:8px 0 12px 20px}
.legal-modal-inner li{font-family:var(--ss);font-size:.82rem;line-height:1.8;color:var(--ts);margin-bottom:4px}
.legal-modal-inner a{color:var(--gold);text-decoration:none}
.legal-modal-inner a:hover{text-decoration:underline}
.legal-modal-inner strong{color:var(--tp);font-weight:500}

/* ═══ Shooting-Button (floating left) ═══ */
#sb{position:fixed;left:0;top:50%;transform:translateY(-50%) translateX(-110%);z-index:900;display:flex;flex-direction:column;align-items:center;gap:13px;text-decoration:none;padding:18px 13px;background:var(--primary);border-right:1px solid rgba(184,150,90,.25);transition:transform .6s cubic-bezier(.19,1,.22,1),opacity .4s;touch-action:manipulation}
#sb.sb-on{transform:translateY(-50%) translateX(0)}
#sb.sb-off{transform:translateY(-50%) translateX(-110%)}
.sb-dot{width:5px;height:5px;border-radius:50%;background:var(--gold);flex-shrink:0;transition:transform .3s}
#sb:hover .sb-dot{transform:scale(1.6)}
.sb-lw{display:block;writing-mode:vertical-lr;transform:rotate(180deg);font-family:var(--ss);font-size:.75rem;font-weight:300;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);white-space:nowrap;line-height:1}

/* ═══ 23 · RESPONSIVE BREAKPOINTS ═══ */
@media(max-width:1100px){
  .hbadge{display:none}
  .sps{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
  :root{--nav:64px}
  .nlinks,.ntbtn,.ncta{display:none}
  .ham{display:flex}
  .hero{flex-direction:column;height:auto;min-height:100svh}
  .hl{width:100%;padding:calc(var(--nav) + 48px) clamp(24px,6vw,64px) 180px}
  .hr{width:100%;height:55vw;min-height:280px;max-height:480px}
  .hst{bottom:32px;left:clamp(24px,6vw,64px)}
  .about-g{grid-template-columns:1fr;gap:40px}
  .amain{width:70%;margin:0 auto}
  .sps{grid-template-columns:repeat(2,1fr)}
  .ts{grid-template-columns:1fr}
  .timg{display:none}
  .bzsi{flex-direction:column;gap:8px}
  .wnatm{grid-template-columns:repeat(2,1fr)}
    .ems{grid-template-columns:repeat(2,1fr)}
  .pf{grid-template-columns:1fr}
  .cgrid{grid-template-columns:1fr;gap:48px}
  .svt{grid-template-columns:repeat(2,1fr)}
  .tg{grid-template-columns:1fr}
  .rg{grid-template-columns:repeat(2,1fr)}
  .fgrid{grid-template-columns:1fr 1fr}
  .fbtm{flex-direction:column;gap:12px;text-align:center}
  .flg{flex-wrap:wrap;justify-content:center}
  .mca{opacity:1}
}
@media(max-width:600px){
  .sps{grid-template-columns:1fr}
  .svt{grid-template-columns:1fr}
  .svtabs{flex-wrap:wrap}
  .wnatm{grid-template-columns:1fr}
    .ems{grid-template-columns:1fr}
  .rg{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
  .hst{gap:20px}
  .ps{flex-direction:column;gap:8px}
  .legal-modal-inner{padding:clamp(20px,5vw,36px)}
}

/* ═══ 24 · REDUCED-MOTION · PRINT ═══ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  /* Reveal-Animationen bei reduzierter Bewegung immer sofort sichtbar */
  html.js-rv .rv,html.js-rv .rvl,html.js-rv .rvr{opacity:1!important;transform:none!important}
  html.js-rv .word-inner{transform:translateY(0)!important;opacity:1!important}
  .hst,.hey,.htit,.hsub,.hact{opacity:1;transform:none}
}
@supports(color:color-mix(in srgb,red,blue)){
  .site-header.scrolled{background:color-mix(in srgb,var(--bg) 92%,transparent)}
  nav.nav-inner.sc{background:color-mix(in srgb,var(--bg) 92%,transparent)}
}
@media print{
  #sb,nav.nav-inner,.pbar,.cur,.cur-r,.ham,.mobm,.legal-modal,.ntbtn{display:none!important}
  body{background:#fff;color:#000}
  a{color:#000;text-decoration:underline}
  .hero{height:auto;min-height:0}
}
/* ═══ Edge High-Contrast / forced-colors Guard ═══
   Wenn Windows "Hoher Kontrast" aktiviert ist, überschreibt der Browser alle Farben.
   Wir blenden dekorative Elemente aus und stellen sicher, dass Borders sichtbar bleiben. */
@media(forced-colors:active){
  .cur,.cur-r,.pbar{display:none!important}
  .btn,.btn-o,.lp-breadcrumb a,.nlinks a{forced-color-adjust:none}
  :focus-visible{outline:3px solid ButtonText}
}
/* ═══ 25 · COOKIE CONSENT (DSGVO · TTDSG § 25 · ePrivacy) ════════
   Banner + Settings Modal — rechtssicher, barrierefrei, responsive
   Konform: BGH Cookie II, EuGH C-673/17 (Planet49), TTDSG 2021
   ════════════════════════════════════════════════════════════════ */

/* ── Banner (Bottom-Bar) ── */
.ckb{position:fixed;bottom:0;left:0;right:0;z-index:10000;padding:0 clamp(12px,3vw,40px) clamp(12px,2vw,20px);pointer-events:none;animation:ckb-slide .35s var(--ease) both}
.ckb[hidden]{display:none!important}
@keyframes ckb-slide{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}
.ckb-bar{background:var(--primary);color:var(--cream);border-radius:10px 10px 0 0;padding:clamp(14px,2.5vw,24px) clamp(16px,3vw,32px);display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;box-shadow:0 -4px 40px rgba(0,0,0,.22);pointer-events:all;border-top:1px solid rgba(255,255,255,.07)}

/* Banner Text */
.ckb-txt{flex:1;min-width:220px}
.ckb-title{font-family:var(--sf);font-size:1rem;font-weight:600;letter-spacing:.03em;color:var(--tertiary);margin-bottom:3px}
.ckb-desc{font-size:.75rem;line-height:1.55;color:rgba(255,255,255,.65);max-width:600px}
.ckb-link{color:var(--tertiary);text-decoration:underline;text-underline-offset:2px;transition:color .2s}
.ckb-link:hover{color:#fff}

/* Banner Buttons */
.ckb-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center;flex-shrink:0}
.ckb-btn{font-family:var(--ss);font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:9px 20px;border-radius:4px;border:1px solid transparent;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);white-space:nowrap;line-height:1}
/* Primär: Alle akzeptieren */
.ckb-btn-accept{background:var(--gold);color:var(--primary);border-color:var(--gold)}
.ckb-btn-accept:hover{background:var(--gold2);border-color:var(--gold2);box-shadow:0 2px 12px rgba(184,150,90,.4)}
.ckb-btn-accept:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
/* Sekundär: Ablehnen — gleiches Gewicht wie Akzeptieren (DSGVO-konform) */
.ckb-btn-reject{background:transparent;color:rgba(255,255,255,.88);border-color:rgba(255,255,255,.35)}
.ckb-btn-reject:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.6);color:#fff}
.ckb-btn-reject:focus-visible{outline:2px solid rgba(255,255,255,.6);outline-offset:3px}
/* Tertiar: Einstellungen-Link-Style */
.ckb-btn-settings{background:transparent;color:rgba(255,255,255,.45);border-color:transparent;font-size:.68rem;letter-spacing:.08em;padding-left:0;padding-right:0}
.ckb-btn-settings:hover{color:rgba(255,255,255,.85)}
.ckb-btn-settings:focus-visible{outline:2px solid rgba(255,255,255,.45);outline-offset:3px;border-radius:2px}

/* ── Modal ── */
.ckm{position:fixed;inset:0;z-index:10001;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,40px)}
.ckm[aria-hidden=true]{display:none!important}
.ckm-overlay{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);cursor:pointer}
.ckm-inner{position:relative;z-index:1;background:var(--bg);border:1px solid var(--sand);border-radius:12px;width:100%;max-width:540px;max-height:90dvh;max-height:90vh;overflow-y:auto;box-shadow:0 28px 72px rgba(0,0,0,.22);animation:ckm-in .28s var(--expo) both}
@keyframes ckm-in{from{opacity:0;transform:scale(.96) translateY(16px)}to{opacity:1;transform:none}}

/* Modal Header */
.ckm-head{display:flex;align-items:center;justify-content:space-between;padding:22px 26px 18px;border-bottom:1px solid var(--sand);position:sticky;top:0;background:var(--bg);z-index:1}
.ckm-title{font-family:var(--sf);font-size:1.25rem;font-weight:600;letter-spacing:.01em;color:var(--tp)}
.ckm-close{background:none;border:none;cursor:pointer;color:var(--tm);font-size:.9rem;padding:6px;line-height:1;border-radius:4px;transition:color .2s,background .2s;margin:-6px}
.ckm-close:hover{color:var(--tp);background:var(--warm)}
.ckm-close:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* Modal Body */
.ckm-body{padding:22px 26px}
.ckm-intro{font-size:.76rem;color:var(--ts);line-height:1.65;margin-bottom:18px}

/* Consent-Kategorien */
.ckm-cat{border:1px solid var(--sand);border-radius:8px;padding:14px 16px;margin-bottom:10px;transition:border-color .2s}
.ckm-cat:hover{border-color:var(--taupe)}
.ckm-cat-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.ckm-cat-info{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.ckm-cat-name{font-family:var(--ss);font-size:.8rem;font-weight:700;color:var(--tp);letter-spacing:.03em}
.ckm-cat-badge{font-size:.62rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;background:var(--sage);color:#fff;padding:2px 8px;border-radius:20px;white-space:nowrap}
.ckm-cat-desc{font-size:.72rem;color:var(--tm);line-height:1.6}
.ckm-cat-desc strong{color:var(--ts);font-weight:600}

/* Toggle-Switch (WCAG 2.1 AA-konform) */
.ckm-toggle{position:relative;flex-shrink:0;line-height:0}
.ckm-toggle input{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden}
.ckm-toggle-track{display:block;width:44px;height:25px;background:var(--sand);border-radius:13px;cursor:pointer;transition:background .22s var(--ease);position:relative;border:1px solid rgba(0,0,0,.05)}
.ckm-toggle-track::after{content:'';position:absolute;top:3px;left:3px;width:17px;height:17px;background:#fff;border-radius:50%;transition:transform .22s var(--ease);box-shadow:0 1px 4px rgba(0,0,0,.18)}
/* Checked */
.ckm-toggle input:checked+.ckm-toggle-track{background:var(--gold);border-color:var(--gold)}
.ckm-toggle input:checked+.ckm-toggle-track::after{transform:translateX(19px)}
/* Focus */
.ckm-toggle input:focus-visible+.ckm-toggle-track{outline:2px solid var(--gold);outline-offset:3px}
/* Disabled (Notwendig) */
.ckm-toggle-disabled .ckm-toggle-track{background:var(--sage);border-color:var(--sage);cursor:not-allowed;opacity:.75}
.ckm-toggle-disabled input:checked+.ckm-toggle-track::after{transform:translateX(19px)}
.ckm-toggle-on.ckm-toggle-disabled .ckm-toggle-track{background:var(--sage)}

/* Legal-Info (Kleinschrift) */
.ckm-legal{font-size:.67rem;color:var(--tm);line-height:1.55;margin-top:16px;padding-top:14px;border-top:1px solid var(--sand)}
.ckm-legal a{color:var(--mocha);text-decoration:underline;text-underline-offset:2px}
.ckm-legal a:hover{color:var(--tp)}

/* Modal Footer */
.ckm-foot{display:flex;flex-wrap:wrap;gap:8px;padding:16px 26px 22px;border-top:1px solid var(--sand);justify-content:flex-end;position:sticky;bottom:0;background:var(--bg);z-index:1}
/* Sekundäre Modal-Buttons */
.ckm-btn-secondary{background:var(--warm);color:var(--ts);border-color:var(--sand)}
.ckm-btn-secondary:hover{background:var(--sand);color:var(--tp);border-color:var(--taupe)}
.ckm-btn-secondary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
/* Speichern mit leichter Hervorhebung */
.ckm-btn-save{border-color:var(--taupe)}
/* Primär: Alle akzeptieren im Modal */
.ckm-btn-primary{background:var(--gold);color: