/* ═══════════════════════════════════════════════════════════════
   STUDIO AURÉLIE — Demo-Referenz (Medientrupp Portfolio)
   Geteiltes Stylesheet für alle Seiten.
   Aesthetik: „Prescription Beauty meets Swiss Minimalism".
   ═══════════════════════════════════════════════════════════════ */

@font-face { font-family:'Space Grotesk'; src:url('fonts/spacegrotesk.woff2') format('woff2'); font-weight:300 700; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('fonts/inter.woff2') format('woff2'); font-weight:100 900; font-style:normal; font-display:swap; }

:root {
  --canvas:#f3f2f7; --canvas-2:#eceaf3; --paper:#ffffff;
  --ink:#241b3d; --ink-soft:#544c6c; --muted:#6f6987; --faint:#b3aec6;
  --line:#e9e6f1; --line-2:#e0dcee;
  --trust:#12946a; --trust-bg:#e4f3ec;
  --blush:#c58a83; --blush-deep:#a96a63; --blush-bg:#f5e6e2;
  --lav:#ebe8f6; --lav-2:#e2ddf1;
  --shadow:0 8px 34px rgba(36,36,41,.07), 0 1px 2px rgba(37,36,41,.09);
  --shadow-lg:0 24px 64px -18px rgba(38,30,66,.22), 0 2px 6px rgba(37,36,41,.05);
  --r-card:22px; --r-tab:36px;
  --display:'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --sans:'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --nav-h:76px; --maxw:1160px;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} }
body { margin:0; background:var(--canvas); color:var(--ink-soft); font-family:var(--sans); font-size:16px; line-height:1.68; font-weight:400; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
h1,h2,h3,.display { font-family:var(--display); font-weight:400; color:var(--ink); letter-spacing:-0.022em; line-height:1.07; }
p { margin:0 0 1.1em; }
a { color:inherit; text-decoration:none; }
img,svg { display:block; max-width:100%; }
:focus-visible { outline:2px solid var(--ink); outline-offset:3px; border-radius:4px; }

.wrap { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,44px); }
.section { padding:clamp(60px,8.5vw,108px) 0; }
.eyebrow { font-family:var(--sans); font-weight:600; font-size:11.5px; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted); margin:0 0 20px; display:inline-flex; align-items:center; gap:9px; }
.eyebrow .dot { width:5px; height:5px; border-radius:50%; background:var(--blush); display:inline-block; }
.head { max-width:40rem; margin:0 0 clamp(36px,5vw,58px); }
.head.center { margin-left:auto; margin-right:auto; text-align:center; }
.head.center .eyebrow { justify-content:center; }
.head h2 { font-size:clamp(2rem,4.3vw,3.25rem); margin:0 0 16px; }
.head p { color:var(--ink-soft); font-size:1.04rem; margin:0; }
.head.center p { max-width:34rem; margin-left:auto; margin-right:auto; }

/* ── Buttons ─────────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; font-family:var(--sans); font-weight:500; font-size:14.5px; padding:14px 26px; border-radius:999px; border:1px solid transparent; cursor:pointer; transition:transform .35s cubic-bezier(.16,1,.3,1), background .3s, color .3s, box-shadow .3s, border-color .3s; white-space:nowrap; }
.btn-ink { background:var(--ink); color:#f4f2fa; }
.btn-ink:hover { transform:translateY(-2px); box-shadow:0 14px 30px -8px rgba(36,27,61,.5); }
.btn-ghost { background:transparent; color:var(--ink); border-color:#d7d2e6; }
.btn-ghost:hover { border-color:var(--ink); transform:translateY(-2px); }
.btn-light { background:#fff; color:var(--ink); }
.btn-light:hover { transform:translateY(-2px); box-shadow:0 14px 30px -8px rgba(0,0,0,.28); }
.btn[disabled]{ opacity:.45; cursor:not-allowed; transform:none; box-shadow:none; }
.tlink { font-family:var(--sans); font-weight:500; font-size:14.5px; color:var(--ink); display:inline-flex; align-items:center; gap:8px; padding-bottom:3px; box-shadow:inset 0 -1px 0 var(--blush); transition:gap .3s, box-shadow .3s; }
.tlink:hover { gap:13px; box-shadow:inset 0 -1.5px 0 var(--ink); }

/* ── Vorschau-Hinweis (Pflicht) ──────────────────────────── */
.notice { background:var(--ink); color:#d9d3ec; font-size:12.5px; letter-spacing:0.005em; text-align:center; padding:9px 20px; line-height:1.5; }
.notice .tag { display:inline-block; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; font-size:10.5px; color:#fff; background:rgba(255,255,255,.12); border-radius:999px; padding:2px 10px; margin-right:10px; vertical-align:1px; }
.notice svg { display:inline-block; vertical-align:-3px; margin-right:7px; opacity:.75; }

/* ── Header / Logo / Nav ─────────────────────────────────── */
.topbar { position:sticky; top:0; z-index:60; }
.nav { z-index:50; background:rgba(243,242,247,.82); backdrop-filter:saturate(150%) blur(12px); transition:box-shadow .3s, background .3s; }
.nav.scrolled { box-shadow:0 1px 0 var(--line), 0 10px 30px rgba(36,30,66,.05); background:rgba(243,242,247,.93); }
.nav-inner { height:var(--nav-h); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.logo { display:flex; align-items:center; gap:12px; color:var(--ink); }
.logo .mark { width:40px; height:40px; flex:0 0 auto; color:var(--blush-deep); }
.logo .mark svg { width:100%; height:100%; }
.logo .wm { display:flex; flex-direction:column; line-height:1; }
.logo .wm .name { font-family:var(--display); font-weight:500; font-size:21px; letter-spacing:0.2em; color:var(--ink); }
.logo .wm .sub { font-family:var(--sans); font-weight:500; font-size:8.5px; letter-spacing:0.26em; text-transform:uppercase; color:var(--muted); margin-top:5px; }
.nav-links { display:flex; align-items:center; gap:30px; }
.nav-links a { font-family:var(--sans); font-size:14px; color:var(--ink-soft); position:relative; padding:6px 0; transition:color .25s; }
.nav-links a::after { content:""; position:absolute; left:0; bottom:0; width:0; height:1.5px; background:var(--blush); transition:width .3s; }
.nav-links a:hover, .nav-links a.active { color:var(--ink); }
.nav-links a:hover::after, .nav-links a.active::after { width:100%; }
.nav-cta { display:flex; align-items:center; gap:16px; }
.nav-tel { font-size:13.5px; color:var(--muted); white-space:nowrap; }
.nav-tel b { font-weight:500; color:var(--ink); }
.burger { display:none; background:none; border:0; cursor:pointer; padding:8px; }
.burger span { display:block; width:23px; height:1.6px; background:var(--ink); margin:5px 0; border-radius:2px; }
.mobile-menu { display:none; }

/* ── Fotos ───────────────────────────────────────────────── */
.photo { position:relative; overflow:hidden; border-radius:var(--r-card); background:var(--lav-2); box-shadow:var(--shadow); }
.photo img { width:100%; height:100%; object-fit:cover; display:block; }
.photo.tint::after { content:""; position:absolute; inset:0; background:linear-gradient(150deg, rgba(36,27,61,.12), rgba(197,138,131,.10)); mix-blend-mode:multiply; pointer-events:none; }
.photo .anon { position:absolute; top:13px; right:13px; z-index:3; display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.78); backdrop-filter:blur(4px); color:var(--ink); font-size:10px; font-weight:500; letter-spacing:0.04em; padding:4px 10px; border-radius:999px; }
.photo .cap { position:absolute; left:16px; bottom:14px; z-index:3; font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:#fff; font-weight:500; text-shadow:0 1px 8px rgba(0,0,0,.4); }
.obj-r img{ object-position:right center; } .obj-l img{ object-position:left center; }
.obj-t img{ object-position:center top; } .obj-b img{ object-position:center bottom; }

/* tonale Platzhalter-Panels (Icon-Chips etc.) */
.chip-ph { position:relative; border-radius:14px; overflow:hidden; }
.ph-lav{ background:linear-gradient(145deg,#ded7f0,#a99adb); } .ph-blush{ background:linear-gradient(145deg,#f2ded9,#cf9b92); }
.ph-cool{ background:linear-gradient(145deg,#dfe6ec,#9fabbb); } .ph-sage{ background:linear-gradient(145deg,#dbe6dd,#93af99); }
.ph-ink{ background:linear-gradient(145deg,#6a5f8c,#241b3d); }

/* ── Hero (Startseite) ───────────────────────────────────── */
.hero { padding:clamp(40px,5vw,66px) 0 clamp(26px,3vw,40px); text-align:center; }
.hero .eyebrow { justify-content:center; }
.hero h1 { font-size:clamp(2.5rem,6vw,4.7rem); letter-spacing:-0.03em; line-height:1.0; margin:0 auto 22px; max-width:16ch; }
.hero h1 .soft { color:var(--faint); }
.hero .lead { font-size:clamp(1.02rem,1.4vw,1.18rem); color:var(--ink-soft); max-width:42ch; margin:0 auto 32px; }
.hero-actions { display:flex; align-items:center; justify-content:center; gap:15px; flex-wrap:wrap; }
.hero-trust { display:inline-flex; align-items:center; gap:11px; margin-top:30px; color:var(--muted); font-size:13.5px; }
.hero-trust .verified { display:inline-flex; align-items:center; gap:6px; color:var(--trust); font-weight:500; }
.hero-trust .rate { color:var(--ink); font-weight:600; }
.hero-stage { margin-top:clamp(36px,5vw,58px); }
.hero-stage .photo { aspect-ratio:16/8.4; border-radius:var(--r-tab); box-shadow:var(--shadow-lg); }

/* ── USP ─────────────────────────────────────────────────── */
.usp-wrap { margin-top:clamp(-40px,-4vw,-26px); position:relative; z-index:5; }
.usp-tab { background:var(--paper); border-radius:var(--r-card); box-shadow:var(--shadow); display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden; }
.usp { display:flex; align-items:center; gap:13px; padding:22px clamp(16px,2.2vw,26px); }
.usp + .usp { box-shadow:inset 1px 0 0 var(--line); }
.usp .tick { flex:0 0 auto; width:30px; height:30px; border-radius:50%; background:var(--trust-bg); color:var(--trust); display:grid; place-items:center; }
.usp .t { font-size:13px; line-height:1.35; color:var(--muted); }
.usp .t b { display:block; font-family:var(--display); font-weight:500; font-size:16px; color:var(--ink); letter-spacing:-0.01em; margin-bottom:1px; }

/* ── Buchung: Selektor + Formular ────────────────────────── */
.booking-grid { display:grid; grid-template-columns:1.55fr 1fr; gap:clamp(20px,2.6vw,34px); align-items:start; }
.select-list { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tcard { position:relative; text-align:left; background:var(--paper); border:1.5px solid var(--line); border-radius:var(--r-card); padding:20px 20px 18px; cursor:pointer; transition:border-color .3s, box-shadow .3s, transform .3s; display:flex; flex-direction:column; gap:2px; font:inherit; color:inherit; }
.tcard:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
.tcard .chip-ph { width:38px; height:38px; margin-bottom:12px; display:grid; place-items:center; color:#fff; }
.tcard h3 { font-size:1.16rem; letter-spacing:-0.015em; margin:0 0 5px; }
.tcard p { font-size:13px; color:var(--ink-soft); margin:0 0 14px; line-height:1.5; }
.tcard .foot { margin-top:auto; display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.tcard .meta { font-size:11px; letter-spacing:0.09em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.tcard .price { font-family:var(--display); font-size:1.14rem; font-weight:500; color:var(--ink); letter-spacing:-0.01em; }
.tcard .price span { font-size:0.64em; color:var(--muted); font-family:var(--sans); font-weight:500; margin-right:2px; }
.tcard .check { position:absolute; top:16px; right:16px; width:24px; height:24px; border-radius:50%; border:1.5px solid var(--line-2); display:grid; place-items:center; color:#fff; transition:background .25s, border-color .25s, transform .25s; }
.tcard .check svg { opacity:0; transform:scale(.5); transition:opacity .2s, transform .2s; }
.tcard[aria-pressed="true"] { border-color:var(--ink); box-shadow:0 0 0 1px var(--ink), var(--shadow); }
.tcard[aria-pressed="true"] .check { background:var(--ink); border-color:var(--ink); }
.tcard[aria-pressed="true"] .check svg { opacity:1; transform:scale(1); }

.booking-panel { background:var(--paper); border-radius:var(--r-tab); box-shadow:var(--shadow-lg); padding:clamp(24px,2.6vw,32px); position:sticky; top:calc(var(--nav-h) + 16px); }
.booking-panel h3 { font-size:1.4rem; letter-spacing:-0.02em; margin:0 0 4px; }
.booking-panel .sub { font-size:13px; color:var(--muted); margin:0 0 18px; }
.summary { list-style:none; padding:0; margin:0 0 4px; }
.summary li { display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--ink-soft); }
.summary li b { font-weight:500; color:var(--ink); }
.summary .empty { color:var(--muted); font-size:13.5px; padding:14px 0; text-align:center; }
.summary-total { display:flex; justify-content:space-between; align-items:baseline; padding:14px 0 4px; }
.summary-total .lbl { font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); }
.summary-total .val { font-family:var(--display); font-size:1.5rem; font-weight:500; color:var(--ink); letter-spacing:-0.01em; }
.summary-total .val span { font-size:0.6em; color:var(--muted); font-family:var(--sans); margin-right:3px; }
.field { margin-top:14px; }
.field label { display:block; font-size:12px; font-weight:500; letter-spacing:0.04em; color:var(--muted); margin-bottom:6px; }
.field input, .field textarea { width:100%; font:inherit; font-size:14.5px; color:var(--ink); background:var(--canvas); border:1.5px solid var(--line); border-radius:12px; padding:11px 14px; transition:border-color .25s, background .25s; }
.field input:focus, .field textarea:focus { outline:none; border-color:var(--ink); background:#fff; }
.field textarea { resize:vertical; min-height:64px; }
.slots { display:flex; flex-wrap:wrap; gap:8px; }
.slot { font:inherit; font-size:13px; font-weight:500; color:var(--ink-soft); background:var(--canvas); border:1.5px solid var(--line); border-radius:999px; padding:8px 15px; cursor:pointer; transition:all .2s; }
.slot:hover { border-color:var(--blush); }
.slot[aria-pressed="true"] { background:var(--ink); color:#fff; border-color:var(--ink); }
.booking-panel .btn-ink { width:100%; margin-top:20px; }
.booking-hint { font-size:11.5px; color:var(--muted); text-align:center; margin:12px 0 0; }
.booking-success { text-align:center; padding:14px 4px; }
.booking-success .ok { width:56px; height:56px; border-radius:50%; background:var(--trust-bg); color:var(--trust); display:grid; place-items:center; margin:0 auto 16px; }
.booking-success h3 { margin:0 0 8px; }
.booking-success p { font-size:14px; color:var(--ink-soft); margin:0 0 6px; }
.booking-success .recap { font-size:13px; color:var(--muted); margin-top:10px; }
.hidden { display:none !important; }

/* ── Split (Philosophie / Story) ─────────────────────────── */
.split { display:grid; grid-template-columns:0.92fr 1.08fr; gap:clamp(28px,5vw,64px); align-items:center; }
.split.rev { grid-template-columns:1.08fr 0.92fr; }
.split .photo { aspect-ratio:4/5; border-radius:var(--r-tab); box-shadow:var(--shadow-lg); }
.promise-list { list-style:none; padding:0; margin:22px 0 30px; display:grid; gap:11px; }
.promise-list li { display:flex; gap:15px; align-items:flex-start; background:var(--paper); border-radius:16px; box-shadow:var(--shadow); padding:16px 18px; }
.promise-list .n { font-family:var(--display); font-size:.98rem; font-weight:500; color:#fff; background:var(--ink); width:28px; height:28px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; }
.promise-list .txt b { display:block; font-family:var(--display); font-size:1.08rem; font-weight:500; color:var(--ink); }
.promise-list .txt span { font-size:13.5px; color:var(--ink-soft); }

/* ── Ablauf (Tablet) ─────────────────────────────────────── */
.tablet { background:var(--lav); border-radius:var(--r-tab); padding:clamp(38px,5.5vw,72px) clamp(24px,4vw,58px); }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2.2vw,30px); }
.step .num { font-family:var(--display); font-size:2.2rem; font-weight:400; color:var(--blush); letter-spacing:-0.03em; line-height:1; margin-bottom:12px; }
.step h3 { font-size:1.18rem; letter-spacing:-0.02em; margin:0 0 6px; }
.step p { font-size:13.5px; color:var(--ink-soft); margin:0; }

/* ── Galerie ─────────────────────────────────────────────── */
.gallery { display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:128px; gap:13px; }
.gallery .photo { width:100%; height:100%; border-radius:18px; }
.g1{ grid-column:span 2; grid-row:span 2; } .g2{ grid-column:span 2; } .g3{ grid-column:span 2; grid-row:span 2; }
.g4{ grid-column:span 2; } .g5{ grid-column:span 3; } .g6{ grid-column:span 3; }
.gallery-note { margin-top:18px; text-align:center; font-size:12.5px; color:var(--muted); }

/* ── Stimmen ─────────────────────────────────────────────── */
.rev-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.2vw,24px); }
.rev { background:var(--paper); border-radius:var(--r-card); box-shadow:var(--shadow); padding:26px 24px; display:flex; flex-direction:column; }
.rev .verified { display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:500; color:var(--trust); background:var(--trust-bg); border-radius:999px; padding:4px 11px; align-self:flex-start; margin-bottom:14px; }
.rev .rate { color:var(--ink); letter-spacing:1px; font-size:14px; margin-bottom:12px; }
.rev blockquote { margin:0 0 20px; font-family:var(--display); font-weight:400; font-size:1.2rem; line-height:1.34; letter-spacing:-0.015em; color:var(--ink); }
.rev .who { margin-top:auto; display:flex; align-items:center; gap:12px; }
.rev .av { width:40px; height:40px; border-radius:50%; display:grid; place-items:center; font-family:var(--display); font-weight:500; color:#fff; font-size:.98rem; }
.rev .who b { font-weight:600; font-size:14px; color:var(--ink); }
.rev .who span { display:block; font-size:12.5px; color:var(--muted); }

/* ── Preisliste (Tablet) ─────────────────────────────────── */
.pricebox { max-width:760px; margin:0 auto; background:var(--paper); border-radius:var(--r-tab); box-shadow:var(--shadow); padding:clamp(26px,4vw,46px) clamp(24px,4vw,50px); }
.price-row { display:flex; align-items:baseline; gap:14px; padding:15px 0; }
.price-row + .price-row { border-top:1px solid var(--line); }
.price-row .nm { font-family:var(--display); font-size:1.14rem; font-weight:500; color:var(--ink); letter-spacing:-0.015em; }
.price-row .du { font-family:var(--sans); font-size:11.5px; letter-spacing:0.06em; color:var(--muted); text-transform:uppercase; margin-left:8px; font-weight:500; }
.price-row .dots { flex:1; }
.price-row .pr { font-family:var(--display); font-size:1.14rem; font-weight:500; color:var(--ink); white-space:nowrap; letter-spacing:-0.01em; }
.price-row .pr span { color:var(--muted); font-size:0.7em; font-family:var(--sans); margin-right:3px; }

/* ── Kontakt / Öffnungszeiten ────────────────────────────── */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(22px,4vw,44px); align-items:stretch; }
.info-card { background:var(--paper); border-radius:var(--r-card); box-shadow:var(--shadow); padding:clamp(24px,3vw,38px); }
.info-block + .info-block { margin-top:24px; padding-top:24px; border-top:1px solid var(--line); }
.info-block h3 { font-size:1.28rem; letter-spacing:-0.02em; margin:0 0 14px; }
.hours { list-style:none; padding:0; margin:0; }
.hours li { display:flex; justify-content:space-between; padding:8px 0; font-size:14.5px; color:var(--ink-soft); }
.hours li b { font-weight:500; color:var(--ink); }
.hours .closed { color:var(--muted); }
.contact-lines { list-style:none; padding:0; margin:0; }
.contact-lines li { display:flex; gap:12px; align-items:flex-start; padding:7px 0; font-size:14.5px; color:var(--ink-soft); }
.contact-lines .ic { color:var(--blush-deep); flex:0 0 auto; margin-top:3px; }
.map { position:relative; overflow:hidden; min-height:340px; height:100%; border-radius:var(--r-card); box-shadow:var(--shadow); }
.map .pin { position:absolute; top:50%; left:50%; transform:translate(-50%,-100%); z-index:3; }
.map .maplabel { position:absolute; left:18px; bottom:16px; z-index:3; background:#fff; padding:10px 15px; border-radius:14px; font-size:12.5px; box-shadow:var(--shadow); color:var(--ink); }

/* ── CTA (Ink-Tablet) ────────────────────────────────────── */
.cta-tab { background:var(--ink); color:#e8e3f5; border-radius:var(--r-tab); text-align:center; padding:clamp(48px,6.5vw,88px) clamp(24px,5vw,60px); position:relative; overflow:hidden; }
.cta-tab::after { content:""; position:absolute; inset:0; background:radial-gradient(90% 120% at 82% -10%, rgba(197,138,131,.28), transparent 60%); pointer-events:none; }
.cta-tab > * { position:relative; z-index:1; }
.cta-tab .eyebrow { color:#b3a9d6; justify-content:center; }
.cta-tab h2 { color:#fff; font-size:clamp(2rem,4.4vw,3.2rem); letter-spacing:-0.025em; margin:0 0 16px; }
.cta-tab p { color:rgba(232,227,245,.72); max-width:34em; margin:0 auto 30px; }
.cta-tab .row { display:flex; align-items:center; justify-content:center; gap:22px; flex-wrap:wrap; }
.cta-tab .tel { color:#e8e3f5; font-size:14px; }
.cta-tab .tel b { font-family:var(--display); font-size:1.18rem; font-weight:500; letter-spacing:-0.01em; }

/* ── Subpage-Header ──────────────────────────────────────── */
.page-hero { padding:clamp(40px,5vw,64px) 0 0; }
.page-hero .inner { text-align:center; max-width:44rem; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.4rem,5vw,4rem); letter-spacing:-0.03em; line-height:1.02; margin:0 auto 18px; }
.page-hero p { color:var(--ink-soft); font-size:1.06rem; max-width:36rem; margin:0 auto; }
.page-banner { margin-top:clamp(34px,5vw,54px); }
.page-banner .photo { aspect-ratio:21/8; border-radius:var(--r-tab); box-shadow:var(--shadow-lg); }

/* ── Footer ──────────────────────────────────────────────── */
footer { background:#1b1430; color:#b3acc6; }
.foot-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1.15fr; gap:40px; padding:clamp(50px,7vw,78px) 0 42px; }
.foot .logo { color:#fff; margin-bottom:16px; }
.foot .logo .mark { color:var(--blush); }
.foot .logo .wm .name { color:#fff; } .foot .logo .wm .sub { color:#8a82a4; }
.foot p { color:#948cae; font-size:13.5px; max-width:25em; }
.foot h4 { font-family:var(--sans); font-size:10.5px; letter-spacing:0.18em; text-transform:uppercase; color:var(--blush); margin:2px 0 18px; font-weight:600; }
.foot ul { list-style:none; padding:0; margin:0; }
.foot ul li { margin-bottom:11px; }
.foot ul a, .foot ul li { color:#b3acc6; font-size:13.5px; }
.foot ul a:hover { color:#fff; }
.foot-bottom { border-top:1px solid rgba(255,255,255,.08); padding:22px 0 32px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12px; color:#7c7498; }
.foot-bottom .disc { display:inline-flex; align-items:center; gap:8px; }
.foot-bottom a { color:#948cae; } .foot-bottom a:hover { color:#fff; }
.credit b { color:#cfc8e0; font-weight:600; }

/* ── Ergänzungen: Fotos in Karten, WhatsApp, CTA-Layout ──── */
.tcard .thumb-img { width:52px; height:52px; border-radius:13px; overflow:hidden; margin-bottom:13px; box-shadow:var(--shadow); }
.tcard .thumb-img img { width:100%; height:100%; object-fit:cover; display:block; }

.svc-photo { aspect-ratio:16/10; border-radius:16px; overflow:hidden; margin-bottom:18px; box-shadow:var(--shadow); }
.svc-photo img { width:100%; height:100%; object-fit:cover; display:block; }

.founder-photo { width:100%; max-width:200px; aspect-ratio:4/5; border-radius:22px; overflow:hidden; box-shadow:var(--shadow-lg); margin:0 auto; }
.founder-photo img { width:100%; height:100%; object-fit:cover; object-position:center 22%; display:block; }

.rev .av.photo { overflow:hidden; padding:0; }
.rev .av.photo img { width:100%; height:100%; object-fit:cover; display:block; }
.reviews-all { text-align:center; margin-top:clamp(30px,4vw,44px); }
.field input[type="date"] { cursor:pointer; }

.btn-wa { background:#25d366; color:#fff; }
.btn-wa svg { flex:0 0 auto; }
.btn-wa:hover { background:#1fbb59; transform:translateY(-2px); box-shadow:0 14px 30px -8px rgba(37,211,102,.5); }

.cta-actions { display:flex; flex-direction:column; align-items:center; gap:15px; }
.cta-actions .row { display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }
.cta-call { margin:0; font-size:13.5px; color:rgba(232,227,245,.7); }
.cta-call a { color:#e8e3f5; box-shadow:inset 0 -1px 0 rgba(232,227,245,.3); transition:box-shadow .25s; }
.cta-call a:hover { box-shadow:inset 0 -1.5px 0 #e8e3f5; }
.cta-call b { font-family:var(--display); font-weight:500; letter-spacing:-0.01em; }
@media (max-width:520px){ .cta-actions .row { flex-direction:column; width:100%; } .cta-actions .row .btn { width:100%; } }

/* ── Demo-Hinweis-Popup ──────────────────────────────────── */
.demo-modal { position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:24px; }
.demo-modal.open { display:flex; }
.demo-backdrop { position:absolute; inset:0; background:rgba(27,20,48,.55); backdrop-filter:blur(4px); animation:demoFade .25s ease; }
.demo-card { position:relative; z-index:1; width:100%; max-width:420px; background:var(--paper); border-radius:var(--r-tab); box-shadow:var(--shadow-lg); padding:clamp(28px,4vw,40px); text-align:center; animation:demoPop .35s cubic-bezier(.16,1,.3,1); }
.demo-x { position:absolute; top:16px; right:18px; background:none; border:0; font-size:26px; line-height:1; color:var(--muted); cursor:pointer; transition:color .2s; }
.demo-x:hover { color:var(--ink); }
.demo-ic { width:56px; height:56px; border-radius:50%; background:var(--lav); color:var(--blush-deep); display:grid; place-items:center; margin:0 auto 18px; }
.demo-card h3 { font-size:1.6rem; letter-spacing:-0.02em; margin:0 0 10px; }
.demo-card p { font-size:14.5px; color:var(--ink-soft); margin:0 0 24px; }
.demo-card .btn { width:100%; }
@keyframes demoFade { from{opacity:0} to{opacity:1} }
@keyframes demoPop { from{opacity:0; transform:translateY(12px) scale(.98)} to{opacity:1; transform:none} }
@media (prefers-reduced-motion:reduce){ .demo-backdrop, .demo-card { animation:none; } }

/* ── Reveal ──────────────────────────────────────────────── */
.reveal { opacity:0; transform:translateY(20px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{opacity:1; transform:none; transition:none;} }
[id] { scroll-margin-top:calc(var(--nav-h) + 16px); }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width:1000px){
  .booking-grid { grid-template-columns:1fr; }
  .booking-panel { position:static; }
  .rev-grid, .steps { grid-template-columns:repeat(2,1fr); }
  .usp-tab { grid-template-columns:repeat(2,1fr); }
  .usp + .usp { box-shadow:none; }
  .usp:nth-child(n+2){ box-shadow:inset 0 1px 0 var(--line); }
  .usp:nth-child(2){ box-shadow:inset 1px 0 0 var(--line); }
  .usp:nth-child(4){ box-shadow:inset 1px 0 0 var(--line), inset 0 1px 0 var(--line); }
}
@media (max-width:860px){
  .nav-links, .nav-tel { display:none; }
  .burger { display:block; }
  .split, .split.rev, .contact-grid { grid-template-columns:1fr; }
  .split .photo, .split.rev .photo { aspect-ratio:16/11; order:-1; }
  .mobile-menu.open { display:flex; }
  .mobile-menu { position:fixed; inset:0; z-index:60; background:var(--canvas); padding:24px clamp(20px,6vw,40px); flex-direction:column; }
  .mm-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:32px; }
  .mm-close { background:none; border:0; font-size:30px; cursor:pointer; color:var(--ink); line-height:1; }
  .mobile-menu a.mm-link { display:block; font-family:var(--display); font-weight:400; font-size:1.7rem; letter-spacing:-0.02em; padding:13px 0; border-bottom:1px solid var(--line); color:var(--ink); }
  .mobile-menu .btn { margin-top:22px; width:100%; }
}
@media (max-width:640px){
  .select-list { grid-template-columns:1fr; }
  .rev-grid, .steps, .usp-tab { grid-template-columns:1fr; }
  .usp:nth-child(n+2){ box-shadow:inset 0 1px 0 var(--line); }
  .gallery { grid-template-columns:repeat(2,1fr); grid-auto-rows:120px; }
  .g1,.g2,.g3,.g4,.g5,.g6 { grid-column:span 1; grid-row:span 1; }
  .g1,.g3 { grid-row:span 2; }
  .hero-actions .btn { width:100%; }
  .foot-grid { grid-template-columns:1fr 1fr; gap:28px; }
}