/* =====================================================================
   live.css – Live-Seite (Design-v2.md v3, freigegeben 2026-10-26)
   Nur live.html, nach styles.css geladen. Die Studio-Seite nutzt diese Datei nicht.
   GL-003: Josefin Sans Light, Poppins Light/Regular, Akzent #FFC800, dunkel mit Textur.
   ===================================================================== */

/* ---------- Schriften (lokal, keine externen Ressourcen) ---------- */
@font-face { font-family:'Josefin Sans'; font-weight:300; font-style:normal; font-display:swap; src:url('assets/fonts/gl003/JosefinSans-Light.ttf') format('truetype'); }
@font-face { font-family:'Poppins'; font-weight:300; font-style:normal; font-display:swap; src:url('assets/fonts/gl003/Poppins-Light.ttf') format('truetype'); }
@font-face { font-family:'Poppins'; font-weight:400; font-style:normal; font-display:swap; src:url('assets/fonts/gl003/Poppins-Regular.ttf') format('truetype'); }

body.page-live { --gold:#FFC800; --muted:#C4C4C4; font-family:'Poppins',Arial,sans-serif; font-weight:300; }
.page-live h1, .page-live h2, .page-live h3, .page-live .hero__kicker, .page-live .nav__mode-link, .page-live .nav__links a {
  font-family:'Josefin Sans',Arial,sans-serif; font-weight:300; text-transform:uppercase; }
.page-live .cookie__btn, .page-live .lang { font-family:'Poppins',Arial,sans-serif; font-weight:400; }
.page-live .nav__mode-link { font-family:'Josefin Sans',Arial,sans-serif; }
.page-live {
  --bg:#0B0B0B; --surface-2:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.10); --line-strong:rgba(255,255,255,.18);
  --text:#FFFFFF; --body:#C4C4C4; --dim:#8A8A8A;
  --accent:#FFC800; --accent-soft:rgba(255,200,0,.18); --on-accent:#0B0B0B;
  --error:#FF8A7A;
  --glass-bg:rgba(14,14,14,.72); --glass-line:rgba(255,255,255,.09);
  --font-head:"Josefin Sans", Arial, sans-serif;
  --font-body:"Poppins", Arial, sans-serif;
  --radius:20px; --radius-sm:12px;
  --wrap:1240px; --gutter:clamp(20px,5vw,64px);
  --section:clamp(88px,11vw,160px);
  --ease:cubic-bezier(.22,1,.36,1);
  --gold:#FFC800;
  background:#0B0B0B url('assets/live/live-bg-texture.webp') center/cover no-repeat fixed;   /* Branding-Textur, durchgehend */
  color:var(--body); font-family:var(--font-body); font-weight:300;
}
.page-live .wrap { max-width:var(--wrap); margin:0 auto; padding-inline:var(--gutter); }
.page-live .grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; }
.page-live .sec { padding-block:var(--section); position:relative; }
.page-live main { display:block; }

/* ---------- v3 1b: Glas-Panel ---------- */
.page-live .glass, .page-live .card {
  background:var(--glass-bg);
  -webkit-backdrop-filter:blur(16px) saturate(120%); backdrop-filter:blur(16px) saturate(120%);
  border:1px solid var(--glass-line); border-radius:var(--radius);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 24px 60px -30px rgba(0,0,0,.8); }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .page-live .glass, .page-live .card { background:rgba(14,14,14,.92); } }

/* ---------- Sektions-Kästchen (unterhalb Hero) ---------- */
.page-live .sec {
  width:min(calc(100% - 48px), 1360px); margin:28px auto; border-radius:28px;
  background:rgba(11,11,11,.72); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.06); }
.page-live .sec { padding-block:clamp(56px,7vw,100px); }
.page-live .sec + .sec { margin-top:28px; }
/* inneres Glas leichter, keine doppelt schweren Rahmen */
.page-live .sec .glass, .page-live .sec .card { background:rgba(255,255,255,.03); -webkit-backdrop-filter:none; backdrop-filter:none;
  border-color:rgba(255,255,255,.06); box-shadow:none; }
@media (max-width:699px){
  .page-live .sec { width:calc(100% - 12px); margin:12px auto; border-radius:18px; }
  .page-live .sec { padding-block:48px; }
}

/* ---------- Typo ---------- */
.page-live .eyebrow { font:400 .75rem/1 var(--font-body); letter-spacing:.24em; color:var(--accent); text-transform:uppercase; margin:0 0 16px; }
.page-live .h2 { font-family:var(--font-head); font-weight:300; text-transform:uppercase; color:var(--text);
  font-size:clamp(2.25rem,5.5vw,4.75rem); line-height:1.02; letter-spacing:.05em; margin:0; }
.page-live .sec-head--sticky .h2, .page-live .contact-m .h2 { font-size:clamp(2.25rem,4.2vw,3.75rem); }
.page-live .h3 { font-family:var(--font-head); font-weight:300; text-transform:uppercase; color:var(--text);
  font-size:clamp(1.25rem,1.8vw,1.6rem); line-height:1.15; letter-spacing:.08em; margin:0 0 12px; }
.page-live .lead { font-size:clamp(1.125rem,1.5vw,1.375rem); line-height:1.55; color:var(--text); margin:24px 0 0; max-width:40ch; }
.page-live .lead a, .page-live .m-form__privacy a, .page-live .consent a { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.page-live .body { font-size:1.0625rem; line-height:1.7; color:var(--body); max-width:62ch; margin:24px 0 0; }
.page-live .note { font-size:1rem; line-height:1.7; color:var(--body); margin:0; }
.page-live .sec-head--sticky { position:sticky; top:120px; align-self:start; }
.page-live .h2--refs { display:flex; align-items:flex-start; gap:.35em; flex-wrap:wrap; }
.page-live .h2__aside { font-family:var(--font-head); font-weight:300; letter-spacing:.14em; text-transform:none;
  font-size:max(.3em,.8125rem); color:#FFC800; border:1px solid var(--accent); border-radius:999px; padding:.55em .9em .45em; margin-top:.45em; line-height:1; white-space:nowrap; }

/* ---------- Komponenten ---------- */
.page-live .card { padding:clamp(24px,3vw,40px); transition:border-color .3s, transform .4s var(--ease); }
.page-live .card:hover { border-color:rgba(255,200,0,.45); transform:translateY(-4px); }
.page-live .card p { font-size:1rem; line-height:1.7; color:var(--body); margin:0; }
.page-live .btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; height:56px; padding:0 32px; border-radius:999px; border:0; cursor:pointer;
  background:var(--accent); color:var(--on-accent); font:400 .875rem/1 var(--font-body); letter-spacing:.16em; text-transform:uppercase; white-space:nowrap;
  transition:transform .25s var(--ease), box-shadow .25s; text-decoration:none; }
.page-live .btn:hover { transform:translateY(-2px); box-shadow:0 14px 34px -14px rgba(255,200,0,.7); }
.page-live .btn__arrow { width:16px; height:16px; transition:transform .25s var(--ease); }
.page-live .btn:hover .btn__arrow { transform:translateX(4px); }
.page-live .btn--full { width:100%; }
.page-live :focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.page-live .media { border-radius:var(--radius); overflow:hidden; background:#111; margin:0; }
.page-live .media img { width:100%; height:100%; object-fit:cover; display:block; }
.page-live .chips { display:flex; gap:8px; margin:0 0 16px; }
.page-live .chip { display:inline-flex; align-items:center; height:26px; padding:0 10px; border:1px solid var(--accent); border-radius:999px;
  font:400 .6875rem/1 var(--font-body); letter-spacing:.14em; color:var(--accent); }

/* ---------- Header ---------- */
.page-live .nav { background:linear-gradient(180deg, rgba(11,11,11,.55), rgba(11,11,11,0)); backdrop-filter:none; border-bottom:1px solid transparent;
  transition:background .3s, border-color .3s, backdrop-filter .3s; }
.page-live .nav.scrolled { background:linear-gradient(180deg, rgba(11,11,11,.55), rgba(11,11,11,0)); }
.page-live .nav.is-solid { background:rgba(11,11,11,.8); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom-color:var(--line); }
.page-live .nav__inner { max-width:var(--wrap); padding:0 var(--gutter); }
.page-live .nav__links { gap:32px; }
.page-live .nav__links a { font:400 .75rem/1 var(--font-body); letter-spacing:.2em; color:#e8e8e8; }
.page-live .nav__links a.is-current, .page-live .nav__links a:hover { color:var(--accent); }
.page-live .lang { font:400 .75rem/1 var(--font-body); letter-spacing:.16em; color:var(--dim); padding:6px 4px; }
.page-live .lang.active { color:#fff; }
.page-live .nav__lang { gap:8px; align-items:center; }
.page-live .nav__lang .lang + .lang::before { content:"/"; color:var(--line-strong); margin-right:8px; }

/* ---------- Hero ---------- */
.page-live .hero { background:#0b0b0b; height:100vh; height:100svh; min-height:600px; }
/* Cinemagraph randlos, volle Breite; Fokus auf ClockClock-Schriftzug + Lichtstrahlen */
.hero__video { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; object-position:43% 22%; z-index:0; }
@media (min-aspect-ratio:1/1){ .hero__video { object-position:43% 45%; } } /* Querformat: mehr Buehne statt Lichtdach */
@media (min-aspect-ratio:4/3){ .hero__video { object-position:43% 45%; } } /* Breitbild-Ausschnitt live-hero-wide.webp (aus 4K-Upscale) */
.page-live .hero::before { z-index:1; }
.hero__kicker { position:absolute; left:50%; transform:translateX(-50%); z-index:2; margin:0;
  top:calc(10% + min(468px,80vw) * .806 + 18px);
  font-size:clamp(1rem,1.6vw,1.25rem); letter-spacing:.38em; padding-left:.38em; color:#fff; white-space:nowrap; }
.page-live .hero__kicker { animation:kickerIn .9s var(--ease) .3s both; }
@keyframes kickerIn { from { opacity:0; } to { opacity:1; } }
.hero__dot { display:inline-block; font-size:0; width:7px; height:7px; border-radius:50%; background:var(--gold); vertical-align:middle;
  margin:0 .9rem 0 .45rem; position:relative; top:-1px; box-shadow:0 0 8px rgba(255,200,0,.6); }
.page-live .hero__cta { top:max(62%, calc(10% + min(468px,80vw) * .806 + 90px)); }
.page-live .hero::before { background:linear-gradient(180deg, rgba(11,11,11,.55) 0%, rgba(11,11,11,.25) 45%, rgba(11,11,11,.6) 100%); }
/* v3: kein Kasten im Hero, nur weicher Lichtschatten hinter Markenblock und CTA */
.page-live .hero::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(ellipse 46% 40% at 50% 42%, rgba(11,11,11,.62), rgba(11,11,11,0) 72%),
    radial-gradient(ellipse 46% 40% at 50% 66%, rgba(11,11,11,.45), rgba(11,11,11,0) 72%),
    linear-gradient(180deg, rgba(11,11,11,0) 80%, #0B0B0B 100%); }
.page-live .hero__logo, .page-live .hero__kicker, .page-live .hero__cta, .page-live .chevron { z-index:3; }
.page-live .hero__logo { height:auto; }   /* Original-Logo ohne Claim, statisch */
.page-live .hero__kicker { font-weight:300; text-shadow:0 2px 18px rgba(0,0,0,.7); }
.page-live .hero__dot { animation:none; opacity:1; }           /* Video läuft: keine zweite Endlos-Animation */
.page-live .hero__cta.btn { position:absolute; left:50%; transform:translate(-50%,0); box-shadow:0 12px 30px -12px rgba(255,200,0,.8); }
.page-live .hero__cta.btn:hover { transform:translate(-50%,-2px); }

/* ---------- 01 Leistung (Bento, 3 Kacheln) ---------- */
.page-live .services-m__top { align-items:end; margin-bottom:48px; }
.page-live .services-m__head { grid-column:1 / span 7; }
.page-live .bento { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:24px; }
.page-live .bento > .card { grid-column:span 2; grid-row:auto; }
.page-live .bento__k4 { grid-column:2 / span 2 !important; }
.page-live .bento__k5 { grid-column:4 / span 2 !important; }
.page-live .card__top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:32px; }
.page-live .card__icon { width:40px; height:40px; fill:none; stroke:#fff; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.page-live .card__num { font:400 .75rem/1 var(--font-body); letter-spacing:.16em; color:#A8A8A8; }

/* ---------- 02 Referenzen ---------- */
.page-live .refs-names { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px 0; margin:0 0 48px; padding:0; font-family:var(--font-head); font-weight:300; font-size:clamp(1.5rem,3.6vw,3.5rem); line-height:1.1; letter-spacing:.06em; color:var(--text); }
.page-live .refs-names span { white-space:nowrap; }
.page-live .mq__dot { width:10px; height:10px; border-radius:50%; background:var(--accent); flex:0 0 auto; margin:0 .6em; }
.page-live .gal { --ra:clamp(420px,44vw,620px); display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px;
  grid-template-rows:calc((var(--ra) - 24px) / 2) calc((var(--ra) - 24px) / 2) clamp(280px,28vw,400px); }
.page-live .gal__g1 { grid-column:1 / span 7; grid-row:1 / span 2; }
.page-live .gal__g2 { grid-column:8 / -1; grid-row:1 / span 2; }
.page-live .gal__g2 img { object-position:50% 30%; }
.page-live .gal__g3 { grid-column:1 / span 4; grid-row:3; }
.page-live .gal__g4 { grid-column:5 / span 4; grid-row:3; }
.page-live .gal__g4 img { object-position:60% 40%; }
.page-live .gal__g5 { grid-column:9 / -1; grid-row:3; }
.page-live .gal__g5 img { object-position:50% 60%; }
.page-live .gal__item img { transition:transform .8s var(--ease); }
.page-live .gal__item:hover img { transform:scale(1.03); }
.page-live .refs-m__btn { margin-top:48px; }

/* ---------- 03 Über mich ---------- */
.page-live .about-m__img { grid-column:1 / span 5; aspect-ratio:4/5; position:sticky; top:120px; align-self:start; }
.page-live .about-m__img img { object-position:45% 25%; }
.page-live .about-m__text { grid-column:7 / -1; }
.page-live .about-m__text .sec-head { margin-bottom:24px; }
.page-live .about-m__panel { padding:clamp(28px,3.5vw,48px); }
.page-live .about-m__panel > .lead:first-child { margin-top:0; }
.page-live .quote { margin:40px 0 40px; padding:0; }
.page-live .quote::before { content:""; display:block; width:40px; height:2px; background:var(--accent); margin-bottom:24px; }
.page-live .quote p { font-family:var(--font-head); font-weight:300; font-size:clamp(1.5rem,2.4vw,2.125rem); line-height:1.3; color:#fff; margin:0; }

/* ---------- 05 Booking ---------- */
.page-live .contact-m::before { content:""; position:absolute; inset:0; pointer-events:none;
  background:none; }
.page-live .contact-m > .wrap { position:relative; z-index:1; }
.page-live .contact-m__head { grid-column:1 / span 5; align-self:start; }
.page-live .contact-m .h2 { font-size:clamp(2.25rem,4.6vw,4rem); }
.page-live .contact-m__panel { margin-top:32px; padding:clamp(28px,3.5vw,48px); }
.page-live .contact-m__panel .lead { margin:0; }
.page-live .sender { display:flex; gap:16px; align-items:center; margin-top:28px; padding-top:28px; border-top:1px solid var(--line); }
.page-live .sender__img { width:64px; height:64px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 2px var(--accent); flex:0 0 64px; }
.page-live .sender__name { font-family:var(--font-head); font-weight:300; font-size:1.125rem; color:#fff; margin:0 0 4px; }
.page-live .sender__role { font:400 .875rem/1.3 var(--font-body); color:var(--body); margin:0; }
.page-live .m-form { grid-column:7 / -1; border-radius:24px; padding:clamp(24px,3.5vw,48px); }
.page-live .m-form fieldset { border:0; margin:0; padding:0; min-width:0; }
.page-live .m-form__grid { display:grid; grid-template-columns:1fr 1fr; gap:20px 16px; }
.page-live .fld { display:flex; flex-direction:column; min-width:0; }
.page-live .fld--full { grid-column:1 / -1; }
.page-live .fld label { font:400 .875rem/1.4 var(--font-body); color:var(--body); margin-bottom:8px; text-align:left; }
.page-live .fld label span { color:var(--accent); }
.page-live .m-form input[type=text], .page-live .m-form input[type=email], .page-live .m-form textarea {
  height:52px; width:100%; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.14); border-radius:var(--radius-sm);
  padding:0 16px; color:#fff; font:300 1rem var(--font-body); transition:border-color .2s, box-shadow .2s; opacity:1; -webkit-text-fill-color:#fff; text-overflow:clip; }
.page-live .m-form textarea { height:auto; min-height:140px; padding:14px 16px; resize:vertical; line-height:1.55; }
.page-live .m-form ::placeholder { font-size:.9375rem; color:#9A9A9A; -webkit-text-fill-color:#9A9A9A; opacity:1; }
.page-live .m-form input:hover, .page-live .m-form textarea:hover { border-color:rgba(255,255,255,.28); }
.page-live .m-form input:focus, .page-live .m-form textarea:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.page-live .m-form input:user-invalid, .page-live .m-form textarea:user-invalid { border-color:var(--error); }
.page-live .consent { display:grid; grid-template-columns:20px 1fr; gap:12px; align-items:start; position:relative; cursor:pointer;
  font-size:.875rem; line-height:1.55; color:var(--body); text-align:left; margin-top:4px; }
.page-live .consent input { position:absolute; opacity:0; width:20px; height:20px; margin:0; }
.page-live .consent__box { width:20px; height:20px; border-radius:6px; border:1px solid var(--line-strong); background:rgba(255,255,255,.04); margin-top:2px; position:relative; }
.page-live .consent input:checked + .consent__box { background:var(--accent); border-color:var(--accent); }
.page-live .consent input:checked + .consent__box::after { content:""; position:absolute; left:6px; top:2px; width:5px; height:10px; border:solid var(--on-accent); border-width:0 2px 2px 0; transform:rotate(45deg); }
.page-live .consent input:focus-visible + .consent__box { outline:2px solid var(--accent); outline-offset:3px; }
.page-live .btn-send { margin-top:8px; height:56px; font:400 .875rem/1 var(--font-body); letter-spacing:.16em; }
.page-live .m-form fieldset:disabled .btn-send { opacity:1; cursor:not-allowed; }
.page-live .m-form__privacy { font-size:.8125rem; line-height:1.55; color:#9A9A9A; margin:16px 0 0; }
.page-live .preview-note { color:#9A9A9A; text-align:left; margin-top:16px; font-size:.75rem; }
.page-live .form__honey { position:absolute; left:-9999px; }

/* ---------- Footer ---------- */
.page-live .footer { background:#0B0B0B; border-top:1px solid var(--line); padding:48px var(--gutter);
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; text-align:left; }
.page-live .footer__social, .page-live .footer__links { margin:0; }
.page-live .footer__social { justify-content:flex-start; }
.page-live .footer__links { gap:32px; }
.page-live .footer__links a { color:#9A9A9A; font-size:.8125rem; letter-spacing:.04em; }
.page-live .footer__links a:hover { color:#fff; }
.page-live .footer__copy { justify-self:end; margin:0; color:#9A9A9A; font-size:.8125rem; }

/* ---------- Sticky Booking-Leiste (mobil) ---------- */
.page-live .stickybar { display:none; }

/* ---------- Reveal ---------- */
.page-live .reveal { opacity:0; transform:translateY(16px); transition:opacity .6s var(--ease), transform .6s var(--ease); transition-delay:calc(var(--i, 0) * 80ms); }
.page-live .reveal.visible { opacity:1; transform:none; }
.page-live .card.reveal.visible:hover { transform:translateY(-4px); }

/* ---------- Breakpoints ---------- */
@media (max-width:1099px){
  /* Bento Tablet: 2 Spalten, dritte Kachel ueber volle Breite */
  .page-live .bento { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .page-live .bento > .card, .page-live .bento__k4 { grid-column:span 2 !important; }
  .page-live .bento__k5 { grid-column:2 / span 2 !important; }
      .page-live .services-m__head { grid-column:1 / span 6; }
}
@media (max-width:900px){
  .page-live { background-attachment:scroll; --section:88px; }
  .page-live .grid { grid-template-columns:1fr; gap:24px; }
  .page-live .grid > * { grid-column:1 / -1 !important; }
  .page-live .sec-head--sticky, .page-live .about-m__img { position:static; }
  .page-live .services-m__top { margin-bottom:32px; }
  .page-live .nav__links { gap:0; }
  .page-live .nav__links a { padding:16px 0; }
  .page-live .nav.is-solid .nav__links, .page-live .nav__links { background:rgba(11,11,11,.96); }
  .page-live .about-m__img { max-height:480px; aspect-ratio:auto; height:min(480px,110vw); }
  .page-live .about-m__img img { object-position:50% 30%; }
  .page-live .m-form { margin-top:8px; }
  .page-live .gal { display:flex; flex-direction:column; gap:16px; }
  .page-live .gal__item { flex:none; width:100%; aspect-ratio:4/3; }
  .page-live .gal__g2 { aspect-ratio:2/3; }
  .page-live .footer { grid-template-columns:1fr; justify-items:center; text-align:center; padding-bottom:calc(48px + 80px); }
  .page-live .footer__social { justify-content:center; }
  .page-live .footer__copy { justify-self:center; }
  /* Sticky-Leiste */
  .page-live .stickybar { display:block; position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); z-index:90;
    transform:translateY(120%); opacity:0; transition:transform .4s var(--ease), opacity .4s; pointer-events:none; }
  .page-live .stickybar.is-on { transform:none; opacity:1; pointer-events:auto; }
  .page-live .stickybar .btn { height:56px; box-shadow:0 10px 30px -8px rgba(0,0,0,.8); }
  /* Über mich mobil: H2, Bild, Glas-Panel */
  .page-live .about-m .grid { gap:0; }
  .page-live .about-m__text { display:contents; }
  .page-live .about-m__text .sec-head { order:1; margin-bottom:24px; }
  .page-live .about-m__img { order:2; margin-bottom:16px; }
  .page-live .about-m__panel { order:3; }
}
@media (max-width:699px){
  /* Bento mobil: eine Spalte */
  .page-live .bento { grid-template-columns:1fr; gap:16px; }
  .page-live .bento > * { grid-column:1 / -1 !important; }
  /* Glas-Panels mobil */
  .page-live .glass, .page-live .card { border-radius:16px; }
  .page-live .card, .page-live .about-m__panel, .page-live .contact-m__panel, .page-live .m-form { padding:24px; }
  /* Hero-Scrim mobil höher */
  .page-live .hero::after { background:
    radial-gradient(ellipse 60% 44% at 50% 36%, rgba(11,11,11,.8), rgba(11,11,11,0) 72%),
    radial-gradient(ellipse 46% 40% at 50% 66%, rgba(11,11,11,.45), rgba(11,11,11,0) 72%),
    linear-gradient(180deg, rgba(11,11,11,0) 80%, #0B0B0B 100%); }
}
@media (max-width:560px){
  .page-live .m-form__grid { grid-template-columns:1fr; }
  .page-live .m-form input[type=text], .page-live .m-form input[type=email] { padding:0 12px; }
  .page-live .m-form ::placeholder { font-size:.8125rem; letter-spacing:-.005em; }
  .page-live .h2 { letter-spacing:.03em; }
  .page-live .refs-names { font-size:1.25rem; letter-spacing:.04em; }
  .page-live .mq__dot { width:7px; height:7px; margin:0 .5em; }
  .page-live .footer__links { gap:20px; flex-wrap:wrap; justify-content:center; }
}
@media (max-width:380px){
  .page-live .m-form ::placeholder { font-size:.75rem; }   /* Datums-Platzhalter bleibt auch auf 320–380 px vollständig */
}

/* ---------- Reduced Motion ---------- */
@media (prefers-reduced-motion: reduce){
  .page-live *, .page-live *::before, .page-live *::after { animation:none !important; transition:none !important; }
  .page-live .reveal { opacity:1; transform:none; }
}

/* ---------- v4 Zentrierung (Design-v2.md, 2026-10-26) ---------- */
.page-live .sec-head { text-align:center; margin-inline:auto; max-width:900px; display:flex; flex-direction:column; align-items:center; position:static; }
.page-live .eyebrow { margin:0 0 12px; }
.page-live .sec-head .h2 { text-wrap:balance; }
.page-live .sec-head::after { content:""; display:block; width:56px; height:2px; background:var(--accent); margin:20px auto 0; }
.page-live .h2--refs { justify-content:center; align-items:center; }
.page-live .h2--refs .h2__aside { margin-top:0; }
.page-live .services-m__top { display:block; margin-bottom:48px; }
.page-live .services-m__head { grid-column:auto; }
.page-live .refs-m .sec-head { margin-bottom:48px; }
.page-live .refs-names { margin-top:0; }
.page-live .refs-m .wrap { text-align:center; }
.page-live .about-m .sec-head, .page-live .contact-m .sec-head { margin-bottom:48px; }
/* Kacheln */
.page-live .card { text-align:center; display:flex; flex-direction:column; align-items:center; }
.page-live .card__top { flex-direction:column; align-items:center; justify-content:flex-start; gap:12px; margin-bottom:20px; }
.page-live .card__top .card__num { order:-1; }
.page-live .chips { justify-content:center; }
.page-live .lead { margin-inline:auto; text-align:center; }
/* Über mich: untereinander */
.page-live .about-m .grid { display:flex; flex-direction:column; align-items:center; gap:0; }
.page-live .about-m__text { display:contents; }
.page-live .about-m .sec-head { order:1; }
.page-live .about-m__img { order:2; position:static; width:100%; max-width:360px; aspect-ratio:4/5; max-height:none; height:auto; margin:0 auto 32px; grid-column:auto; }
.page-live .about-m__panel { order:3; width:100%; max-width:680px; margin-inline:auto; text-align:center; }
.page-live .about-m__panel .body { max-width:60ch; margin-inline:auto; text-align:left; }
.page-live .about-m__panel .btn { margin-top:32px; }
@media (min-width:900px){
  .page-live .about-m .grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:48px; align-items:center; }
  .page-live .about-m .sec-head { grid-column:1 / -1; grid-row:1; margin-bottom:0; }
  .page-live .about-m__img { grid-column:1 / span 5; grid-row:2; max-width:none; margin:0; align-self:center; }
  .page-live .about-m__panel { grid-column:7 / -1; grid-row:2; max-width:none; margin:0; padding:clamp(28px,3.5vw,48px); text-align:left; align-self:center; }
  .page-live .about-m__panel .body { max-width:60ch; margin-inline:0; }
}
/* Booking: untereinander */
.page-live .contact-m .grid { display:flex; flex-direction:column; align-items:center; gap:0; }
.page-live .contact-m__head { width:100%; display:flex; flex-direction:column; align-items:center; grid-column:auto; }
.page-live .contact-m__panel { width:100%; max-width:520px; margin:0 0 32px; text-align:center; }
.page-live .sender { justify-content:center; }
.page-live .m-form { width:100%; max-width:720px; margin:0 auto; grid-column:auto; text-align:left; }
.page-live .m-form__privacy { text-align:left; }
/* Footer einspaltig */
.page-live .footer { grid-template-columns:1fr; justify-items:center; text-align:center; }
.page-live .footer__social { justify-content:center; }
.page-live .footer__links { justify-content:center; flex-wrap:wrap; }
.page-live .footer__copy { justify-self:center; }
@media (max-width:900px){
  .page-live .services-m__top { margin-bottom:32px; }
  .page-live .about-m__img { max-width:280px; height:auto; }
  .page-live .about-m__panel { padding:24px; }
}


/* ---------- v5 Feinschliff (Review 2026-10-26) ---------- */
.page-live .btn, .page-live .btn-send { font-weight:600; }
.page-live .m-form__alt { margin:16px 0 0; text-align:center; font-size:.9375rem; line-height:1.5; color:var(--text); }
.page-live .m-form__alt a { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.page-live .fld label { color:#E2E2E2; }
.page-live .m-form input[type=text], .page-live .m-form input[type=email], .page-live .m-form textarea { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.32); }
@media (max-width:900px){
  /* Mobil-Menü */
  .page-live .nav__links, .page-live .nav.is-solid .nav__links { background:rgba(11,11,11,.95); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); padding:14px 0; }
  .page-live .nav__links a { display:flex; align-items:center; justify-content:center; min-height:48px; padding:12px 0; font-size:1.0625rem; letter-spacing:.2em; line-height:1.6; }
  .page-live .nav__links a + a { margin-top:4px; }
  /* Galerie: zweispaltig, Hochformat 4:5 */
  .page-live .gal { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:none; gap:12px; }
  .page-live .gal__item { aspect-ratio:4/3; width:auto; }
  .page-live .gal__g1 { grid-column:1 / -1; grid-row:auto; aspect-ratio:16/9; }
  .page-live .gal__g2 { grid-column:auto; grid-row:auto; aspect-ratio:4/5; }
  .page-live .gal__g3 { grid-column:auto; grid-row:auto; aspect-ratio:4/5; }
  .page-live .gal__g4, .page-live .gal__g5 { grid-column:auto; grid-row:auto; aspect-ratio:1/1; }
}
@media (max-width:699px){
  .page-live .about-m__panel .body { font-size:1rem; }
  .page-live .fld label { font-size:.8125rem; }
  /* Hero mobil */
  .page-live .hero__kicker { font-size:clamp(.8rem,3.9vw,1rem); letter-spacing:.24em; padding-left:.24em; }
  .page-live .hero__dot { margin:0 .6rem 0 .3rem; }
  .page-live .hero__cta { top:calc(10% + min(468px,80vw) * .806 + 72px); }
  .page-live .hero::before { background:linear-gradient(180deg, rgba(11,11,11,.7) 0%, rgba(11,11,11,.5) 45%, rgba(11,11,11,.75) 100%); }
  .page-live .hero::after { background:
    radial-gradient(ellipse 80% 40% at 50% 36%, rgba(11,11,11,.85), rgba(11,11,11,0) 78%),
    radial-gradient(ellipse 70% 30% at 50% 56%, rgba(11,11,11,.7), rgba(11,11,11,0) 78%),
    linear-gradient(180deg, rgba(11,11,11,0) 80%, #0B0B0B 100%); }
  .page-live .hero { height:min(100svh,600px); }
}
.page-live .m-form__alt a { white-space:nowrap; }