:root{
    --paper:#F7F5F0;
    --paper-deep:#EFEBE2;
    --ink:#1B1A17;
    --stone:#8E887A;
    --accent:#52614C;
    --accent-soft:#DCE3D6;
    --line:#D9D3C6;
    --serif:'Fraunces', serif;
    --sans:'Work Sans', sans-serif;
    --mono:'JetBrains Mono', monospace;
    --editorial:'Cormorant', serif;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--sans);
    font-weight:300;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}

  ::selection{background:var(--accent-soft);}

  :focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

  /* ---------- NAV ---------- */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; justify-content:space-between; align-items:center;
    padding:28px 48px;
    mix-blend-mode:difference;
    color:#fff;
  }
  .logo{
    font-family:var(--serif); font-size:20px; font-weight:500; letter-spacing:0.02em;
  }
  nav{display:flex; gap:36px;}
  nav a{
    font-family:var(--editorial); font-style:italic; font-weight:300; font-size:19px; letter-spacing:0.04em;
    position:relative;
  }
  nav a::after{
    content:''; position:absolute; left:0; bottom:-4px; width:0; height:1px; background:currentColor;
    transition:width .3s ease;
  }
  nav a:hover::after{width:100%;}
  .nav-toggle{display:none;}

  /* ---------- HERO ---------- */
  .hero{
    height:100vh; min-height:640px;
    position:relative;
    display:flex; flex-direction:column; justify-content:flex-end;
    overflow:hidden;
  }
  .hero-slideshow{position:absolute; inset:0; width:100%; height:100%;}
  .hero-img{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    filter:grayscale(8%) contrast(1.03);
    opacity:0;
    transform:scale(1.08);
    transition:opacity 1.6s ease, transform 8s ease;
  }
  .hero-img.active{
    opacity:1;
    transform:scale(1);
  }

  .hero-arrow{
    position:absolute; top:50%; transform:translateY(-50%); z-index:3;
    width:44px; height:44px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:transparent; border:1px solid rgba(255,255,255,.5); color:#fff;
    cursor:pointer; transition:background .3s ease, border-color .3s ease;
  }
  .hero-arrow:hover{background:rgba(255,255,255,.12); border-color:#fff;}
  .hero-arrow-left{left:32px;}
  .hero-arrow-right{right:32px;}

  .hero-dots{
    position:absolute; left:50%; bottom:36px; transform:translateX(-50%); z-index:3;
    display:flex; gap:12px;
  }
  .hero-dot{
    width:7px; height:7px; border-radius:50%; padding:0;
    background:rgba(255,255,255,.4); border:none; cursor:pointer;
    transition:background .3s ease, transform .3s ease;
  }
  .hero-dot:hover{background:rgba(255,255,255,.7);}
  .hero-dot.active{background:#fff; transform:scale(1.3);}
  .hero::after{
    content:''; position:absolute; inset:0;
    background:linear-gradient(to top, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 45%);
  }
  .hero-content{
    position:relative; z-index:2; color:#fff; padding:0 48px 56px;
  }
  .hero-eyebrow{
    font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
    opacity:.85; margin-bottom:18px; display:flex; align-items:center; gap:10px;
  }
  .hero-eyebrow .dot{width:6px; height:6px; border-radius:50%; background:var(--accent-soft);}
  .hero h1{
    font-family:var(--serif); font-weight:400; font-size:clamp(48px,9vw,128px);
    line-height:.95; letter-spacing:-0.01em;
  }
  .hero h1 em{font-style:italic; font-weight:300; color:var(--accent-soft);}
  .hero-sub{
    margin-top:20px; max-width:420px; font-size:16px; font-weight:300; opacity:.9;
  }
  .hero-locations{
    margin-top:28px;
    max-width:560px;
    padding:14px 18px 14px 0;
    border-top:1px solid rgba(255,255,255,.25);
    display:flex; align-items:baseline; gap:14px;
    color:#fff;
  }
  .hero-locations-label{
    font-family:var(--mono); font-size:10px; letter-spacing:.18em;
    text-transform:uppercase; opacity:.75; flex-shrink:0;
  }
  .hero-locations-list{
    font-family:var(--sans); font-size:13px; font-weight:300;
    letter-spacing:.02em; line-height:1.55; opacity:.9;
  }
  @media (max-width:900px){
    .hero-locations{
      flex-direction:column; gap:8px;
      padding:14px 0 0;
      max-width:none;
    }
    .hero-locations-list{ font-size:12px; }
  }
  .scroll-cue{
    position:absolute; bottom:28px; right:48px; z-index:2; color:#fff;
    font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
    writing-mode:vertical-rl; display:flex; align-items:center; gap:10px; opacity:.8;
  }
  .scroll-cue::after{content:''; width:1px; height:36px; background:#fff; opacity:.6;}

  /* ---------- SECTION SHELL ---------- */
  section{padding:140px 48px;}
  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    border-bottom:1px solid var(--line); padding-bottom:28px; margin-bottom:64px;
  }
  .section-head h2{
    font-family:var(--serif); font-weight:400; font-size:clamp(32px,4vw,52px); letter-spacing:-0.01em;
  }
  .section-num{
    font-family:var(--mono); font-size:12px; color:var(--stone); letter-spacing:.08em;
  }

  /* ---------- CONTACT SHEET / GALLERY ---------- */
  .filmstrip{
    display:flex; align-items:center; gap:10px;
    padding:14px 48px; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    font-family:var(--mono); font-size:11px; color:var(--stone); letter-spacing:.06em;
    overflow:hidden; white-space:nowrap;
  }
  .filmstrip span{flex-shrink:0;}
  .filmstrip .sep{color:var(--line);}

  .gallery{
    display:grid;
    grid-template-columns:repeat(12, 1fr);
    gap:18px;
  }
  .frame{
    position:relative; overflow:hidden; background:var(--paper-deep);
    cursor:pointer;
  }
  .frame img{
    width:100%; height:100%; object-fit:cover;
    transition:transform .7s cubic-bezier(.16,1,.3,1), filter .5s ease;
  }
  .frame:hover img{transform:scale(1.045); filter:saturate(1.08);}
  .frame-meta{
    position:absolute; left:0; right:0; bottom:0;
    display:flex; justify-content:space-between;
    padding:14px 16px;
    font-family:var(--mono); font-size:11px; letter-spacing:.04em;
    color:#fff;
    background:linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,0));
    opacity:0; transform:translateY(8px);
    transition:opacity .35s ease, transform .35s ease;
  }
  .frame:hover .frame-meta{opacity:1; transform:translateY(0);}

  .frame.f1{grid-column:span 7; aspect-ratio:4/5;}
  .frame.f2{grid-column:span 5; aspect-ratio:4/5;}
  .frame.f3{grid-column:span 4; aspect-ratio:1/1;}
  .frame.f4{grid-column:span 4; aspect-ratio:1/1;}
  .frame.f5{grid-column:span 4; aspect-ratio:1/1;}
  .frame.f6{grid-column:span 6; aspect-ratio:5/4;}
  .frame.f7{grid-column:span 6; aspect-ratio:5/4;}

  /* ---------- ABOUT ---------- */
  .about{
    display:grid; grid-template-columns:0.8fr 1.2fr; gap:72px; align-items:center;
  }
  .about-video{aspect-ratio:9/16; overflow:hidden; background:var(--paper-deep); border-radius:2px;}
  .about-video video, .about-video img{width:100%; height:100%; object-fit:cover; display:block;}
  .about-text p{
    font-size:18px; font-weight:300; color:#3a382f; max-width:520px; margin-bottom:22px;
  }
  .about-text p:first-of-type{
    font-family:var(--serif); font-size:26px; font-weight:400; color:var(--ink); line-height:1.4;
  }
  .about-text p.about-intro-sub{
    font-family:var(--editorial); font-style:italic; font-weight:300; font-size:22px;
    color:var(--accent); margin-top:26px; margin-bottom:16px;
  }
  .stat-row{
    display:flex; gap:40px; margin-top:40px; padding-top:28px; border-top:1px solid var(--line);
  }
  .stat b{font-family:var(--serif); font-size:26px; font-weight:500; display:block;}
  .stat span{font-family:var(--mono); font-size:11px; color:var(--stone); text-transform:uppercase; letter-spacing:.06em;}

  .about-story{
    display:grid; grid-template-columns:1fr 1.1fr; gap:72px; align-items:center;
    margin-top:96px; padding-top:72px; border-top:1px solid var(--line);
  }
  .about-story-images{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
  .about-story-images img{width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:2px;}
  .about-story-images img:first-child{margin-top:32px;}
  .about-story-text p{font-size:17px; font-weight:300; color:#3a382f; margin-bottom:20px;}
  .about-cta-line{font-family:var(--serif); font-size:20px; color:var(--ink);}
  .about-cta-line a{color:var(--accent); border-bottom:1px solid var(--accent); padding-bottom:1px;}
  .about-cta-line a:hover{color:var(--ink); border-color:var(--ink);}

  /* ---------- BLOG ---------- */
  .blog-list{display:flex; flex-direction:column;}
  .blog-item{
    display:grid; grid-template-columns:120px 1fr auto; gap:32px; align-items:baseline;
    padding:28px 0; border-bottom:1px solid var(--line);
    transition:padding-left .3s ease;
  }
  .blog-item:hover{padding-left:14px;}
  .blog-date{font-family:var(--mono); font-size:12px; color:var(--stone);}
  .blog-title{font-family:var(--serif); font-size:24px; font-weight:400;}
  .blog-tag{
    font-family:var(--mono); font-size:11px; color:var(--accent); text-transform:uppercase; letter-spacing:.06em;
  }

  /* ---------- CONTACT ---------- */
  .contact-wrap{
    display:grid; grid-template-columns:1fr 1fr; gap:72px;
  }
  .contact-intro h2{font-family:var(--serif); font-size:clamp(32px,4vw,52px); font-weight:400; margin-bottom:24px; line-height:1.1;}
  .contact-intro p{max-width:380px; color:#3a382f; margin-bottom:32px;}
  .contact-detail{margin-bottom:18px;}
  .contact-detail span{display:block; font-family:var(--mono); font-size:11px; color:var(--stone); text-transform:uppercase; letter-spacing:.06em; margin-bottom:4px;}
  .contact-detail a, .contact-detail p{font-family:var(--serif); font-size:18px;}

  form{display:flex; flex-direction:column; gap:22px;}
  .field{position:relative;}
  .field label{
    font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--stone);
    display:block; margin-bottom:8px;
  }
  .field input, .field select, .field textarea{
    width:100%; background:transparent; border:none; border-bottom:1px solid var(--line);
    padding:10px 2px; font-family:var(--sans); font-size:16px; color:var(--ink);
    transition:border-color .3s ease;
  }
  .field textarea{resize:vertical; min-height:90px;}
  .field input:focus, .field select:focus, .field textarea:focus{border-color:var(--accent);}
  .field input::placeholder, .field textarea::placeholder{color:#bdb7a8;}

  .submit-btn{
    margin-top:10px; align-self:flex-start;
    background:var(--ink); color:var(--paper);
    font-family:var(--mono); font-size:12px; text-transform:uppercase; letter-spacing:.08em;
    padding:16px 32px; border:none; cursor:pointer;
    transition:background .3s ease, transform .3s ease;
  }
  .submit-btn:hover{background:var(--accent); transform:translateY(-2px);}

  /* ---------- FOOTER ---------- */
  footer{
    padding:48px; border-top:1px solid var(--line);
    display:flex; justify-content:space-between; align-items:center;
    font-family:var(--mono); font-size:11px; color:var(--stone); letter-spacing:.05em;
  }
  footer .foot-links{display:flex; gap:24px;}
  footer a:hover{color:var(--ink);}

  /* ---------- RESPONSIVE ---------- */
  @media (max-width:900px){
    header{padding:20px 24px;}
    nav{display:none;}
    section{padding:90px 24px;}
    .about, .contact-wrap{grid-template-columns:1fr; gap:40px;}
    .about-story{grid-template-columns:1fr; gap:32px; margin-top:56px; padding-top:48px;}
    .about-story-images img:first-child{margin-top:0;}
    .about-video{max-width:340px; margin:0 auto;}
    .gallery{grid-template-columns:repeat(6,1fr);}
    .frame.f1,.frame.f2,.frame.f6,.frame.f7{grid-column:span 6;}
    .frame.f3,.frame.f4,.frame.f5{grid-column:span 3;}
    .blog-item{grid-template-columns:1fr; gap:8px;}
    .filmstrip{padding:14px 24px;}
    .hero-content{padding:0 24px 96px;}
    .scroll-cue{display:none;}
    .hero-arrow{width:36px; height:36px;}
    .hero-arrow-left{left:14px;}
    .hero-arrow-right{right:14px;}
    .hero-dots{bottom:22px;}
  }

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
  }
/* ============================================
   NEU: Burger-Menü, Overlay-Navigation
   ============================================ */
.nav-toggle{
  display:flex;
  flex-direction:column; gap:5px; cursor:pointer;
  background:none; border:none; padding:6px; z-index:120; color:inherit;
}
.nav-toggle span{
  display:block; width:26px; height:2px; background:currentColor;
  transition:transform .3s ease, opacity .3s ease;
}

/* Overlay-Menü (für alle Bildschirmgrößen via Burger oder klassisch) */
.nav-overlay{
  position:fixed; inset:0; z-index:115;
  background:var(--paper);
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  gap:8px;
  opacity:0; visibility:hidden; transform:translateY(-12px);
  transition:opacity .4s ease, transform .4s ease, visibility .4s;
  mix-blend-mode:normal;
}
.nav-overlay.open{opacity:1; visibility:visible; transform:translateY(0);}
.nav-overlay a{
  font-family:var(--serif); font-weight:300; font-size:clamp(28px,5vw,46px);
  color:var(--ink); letter-spacing:-0.01em; padding:6px 0;
  transition:color .25s ease;
}
.nav-overlay a:hover{color:var(--accent);}
.nav-overlay a.active{font-style:italic; color:var(--accent);}
.nav-overlay-close{
  position:absolute; top:28px; right:48px;
  background:none; border:none; cursor:pointer; color:var(--ink);
  font-family:var(--mono); font-size:13px; letter-spacing:.08em; text-transform:uppercase;
}
.nav-overlay-sub{
  margin-top:32px; font-family:var(--mono); font-size:12px; color:var(--stone);
  letter-spacing:.08em; text-transform:uppercase;
}

/* ============================================
   NEU: Vorschau-Kacheln (Shooting-Arten)
   ============================================ */
.categories{padding:140px 48px;}
.cat-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
.cat-card{
  position:relative; overflow:hidden; aspect-ratio:3/4; display:block;
  background:var(--paper-deep); border-radius:2px;
}
.cat-card img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .8s cubic-bezier(.16,1,.3,1), filter .5s ease;
  filter:brightness(.82);
}
.cat-card:hover img{transform:scale(1.05); filter:brightness(.72);}
.cat-card-label{
  position:absolute; inset:0; z-index:2;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:28px; color:#fff;
}
.cat-card-label h3{
  font-family:var(--serif); font-weight:400; font-size:28px; letter-spacing:-0.01em;
  margin-bottom:6px;
}
.cat-card-label span{
  font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  opacity:.9; display:flex; align-items:center; gap:8px;
}
.cat-card-label span::after{
  content:'→'; transition:transform .3s ease;
}
.cat-card:hover .cat-card-label span::after{transform:translateX(5px);}

/* ============================================
   NEU: Rezensionen
   ============================================ */
.reviews{padding:140px 48px;}
.review-grid{
  column-count: 4;
  column-gap: 20px;
  max-width: 1400px; margin: 0 auto;
}
.review-card{
  background:var(--paper); border:1px solid var(--line); border-radius:2px;
  padding:32px 28px; display:flex; flex-direction:column;
  break-inside: avoid;
  margin-bottom: 20px;
  /* Fix fuer Chrome column bug */
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
}
.review-stars{color:var(--accent); font-size:14px; letter-spacing:3px; margin-bottom:18px;}
.review-text{
  font-family:var(--serif); font-size:16px; font-weight:300; line-height:1.55;
  color:var(--ink); margin-bottom:22px; flex-grow:1;
}
.review-divider{
  width:36px; height:1px; background:var(--line);
  margin:0 0 16px;
}
.review-author{
  font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--stone);
}
@media (max-width: 1100px){
  .review-grid{ column-count: 3; }
}
@media (max-width: 780px){
  .reviews{ padding:90px 20px; }
  .review-grid{ column-count: 2; column-gap: 14px; }
  .review-card{ padding:24px 20px; margin-bottom: 14px; }
  .review-text{ font-size:14px; line-height:1.55; margin-bottom:18px; }
  .review-stars{ font-size:12px; margin-bottom:14px; letter-spacing:2px; }
  .review-divider{ width:28px; margin-bottom:12px; }
  .review-author{ font-size:10px; }
}

/* ============================================
   NEU: Unterseiten-Layout
   ============================================ */
.subpage-hero{
  padding:160px 48px 80px;
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:64px; align-items:center;
}
.subpage-hero-text .eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); margin-bottom:20px; display:block;
}
.subpage-hero-text h1{
  font-family:var(--serif); font-weight:400; font-size:clamp(40px,6vw,76px);
  line-height:1; letter-spacing:-0.01em; margin-bottom:28px;
}
.subpage-hero-text h1 em{font-style:italic; font-weight:300; color:var(--accent);}
.subpage-hero-img{aspect-ratio:4/5; overflow:hidden; border-radius:2px; background:var(--paper-deep);}
.subpage-hero-img img{width:100%; height:100%; object-fit:cover;}

.subpage-intro{
  padding:0 48px 100px; max-width:760px; margin:0 auto; text-align:center;
}
.subpage-intro p{
  font-size:19px; font-weight:300; color:#3a382f; line-height:1.7; margin-bottom:24px;
}
.subpage-intro p:first-child{
  font-family:var(--serif); font-size:24px; color:var(--ink); line-height:1.5;
}

.gallery-section{padding:0 48px 100px;}
.gallery-section-head{
  display:flex; align-items:baseline; gap:20px;
  margin-bottom:36px; padding-bottom:20px; border-bottom:1px solid var(--line);
}
.gallery-section-head h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(26px,3vw,38px);
}
.gallery-section-head span{
  font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--stone);
}
.masonry{
  columns:3; column-gap:18px;
}
.masonry img{
  width:100%; margin-bottom:18px; border-radius:2px; break-inside:avoid;
  transition:opacity .4s ease;
}

/* CTA-Bereich mit Buttons */
.subpage-cta{
  padding:100px 48px; background:var(--paper-deep); text-align:center;
}
.subpage-cta h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(28px,4vw,46px);
  margin-bottom:20px; line-height:1.2;
}
.subpage-cta p{
  max-width:560px; margin:0 auto 40px; font-size:17px; color:#3a382f; line-height:1.7;
}
.cta-buttons{display:flex; gap:18px; justify-content:center; flex-wrap:wrap;}
.btn{
  font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  padding:16px 32px; border-radius:2px; cursor:pointer; transition:all .3s ease;
  display:inline-flex; align-items:center; gap:10px; border:1px solid var(--ink);
}
.btn-primary{background:var(--ink); color:var(--paper);}
.btn-primary:hover{background:var(--accent); border-color:var(--accent); transform:translateY(-2px);}
.btn-secondary{background:transparent; color:var(--ink);}
.btn-secondary:hover{background:var(--ink); color:var(--paper); transform:translateY(-2px);}

@media (max-width:900px){
  .categories, .reviews{padding:80px 24px;}
  .cat-grid{grid-template-columns:1fr; gap:16px;}
  .cat-card{aspect-ratio:16/10;}
  .review-grid{column-count: 2; column-gap: 14px;}
  .subpage-hero{grid-template-columns:1fr; gap:32px; padding:120px 24px 60px;}
  .subpage-intro{padding:0 24px 70px;}
  .gallery-section{padding:0 24px 70px;}
  .masonry{columns:2; column-gap:12px;}
  .masonry img{margin-bottom:12px;}
  .subpage-cta{padding:70px 24px;}
  .nav-overlay-close{right:24px;}
}
@media (max-width:560px){
  .masonry{columns:1;}
}

/* ============================================
   NEU: Gleichmäßiges 3-Spalten-Galerieraster
   (für Galerien mit einheitlichem Hochformat)
   ============================================ */
.grid-gallery{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:14px;
}
.grid-gallery img{
  width:100%; aspect-ratio:2/3; object-fit:cover;
  border-radius:2px; display:block;
}
@media (max-width:1100px){
  .grid-gallery{grid-template-columns:repeat(3, 1fr);}
}
@media (max-width:700px){
  .grid-gallery{grid-template-columns:repeat(2, 1fr); gap:10px;}
}

/* ============================================
   NEU: Newborn-Landingpage Komponenten
   ============================================ */
.lp-section{padding:100px 48px;}
.lp-section-tight{padding:70px 48px;}
.lp-wrap{max-width:960px; margin:0 auto;}
.lp-wrap-wide{max-width:1200px; margin:0 auto;}

.lp-eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); margin-bottom:20px; display:block;
}
.lp-h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(30px,4vw,48px);
  line-height:1.15; letter-spacing:-0.01em; margin-bottom:28px;
}
.lp-h2 em{font-style:italic; font-weight:300; color:var(--accent);}
.lp-lead{
  font-family:var(--serif); font-size:22px; font-weight:300; line-height:1.55;
  color:var(--ink); margin-bottom:24px;
}
.lp-p{
  font-size:17px; line-height:1.75; color:#3a382f; margin-bottom:20px; font-weight:300;
}
.lp-p strong{font-weight:500; color:var(--ink);}

/* Zwei-Spalten-Bereich mit Bild + Text */
.lp-split{
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;
}
.lp-split-reverse{direction:rtl;}
.lp-split-reverse > *{direction:ltr;}
.lp-split-img{aspect-ratio:4/5; overflow:hidden; border-radius:2px; background:var(--paper-deep);}
.lp-split-img img{width:100%; height:100%; object-fit:cover;}

/* Drei-Karten für Locations */
.lp-cards{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; margin-top:48px;
}
.lp-card{
  background:var(--paper); border:1px solid var(--line); border-radius:2px;
  padding:36px 32px; display:flex; flex-direction:column;
}
.lp-card-num{
  font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--stone);
  text-transform:uppercase; margin-bottom:16px;
}
.lp-card h3{
  font-family:var(--serif); font-weight:400; font-size:24px; margin-bottom:14px;
  letter-spacing:-0.01em;
}
.lp-card p{font-size:15px; line-height:1.65; color:#3a382f; font-weight:300;}

/* Ablauf-Steps */
.lp-steps{margin-top:48px; display:flex; flex-direction:column; gap:0;}
.lp-step{
  display:grid; grid-template-columns:80px 1fr; gap:36px;
  padding:32px 0; border-top:1px solid var(--line);
}
.lp-step:last-child{border-bottom:1px solid var(--line);}
.lp-step-num{
  font-family:var(--serif); font-size:38px; font-weight:300; font-style:italic;
  color:var(--accent); line-height:1;
}
.lp-step-content h3{
  font-family:var(--serif); font-weight:400; font-size:22px; margin-bottom:10px;
}
.lp-step-content p{font-size:16px; line-height:1.7; color:#3a382f; font-weight:300;}

/* FAQ Akkordeon */
.lp-faq{margin-top:36px;}
.lp-faq-item{
  border-top:1px solid var(--line);
}
.lp-faq-item:last-child{border-bottom:1px solid var(--line);}
.lp-faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  padding:26px 40px 26px 0; font-family:var(--serif); font-size:20px; font-weight:400;
  color:var(--ink); position:relative; letter-spacing:-0.005em;
}
.lp-faq-q::after{
  content:'+'; position:absolute; right:8px; top:50%; transform:translateY(-50%);
  font-family:var(--sans); font-weight:300; font-size:24px; color:var(--accent);
  transition:transform .3s ease;
}
.lp-faq-item.open .lp-faq-q::after{content:'−';}
.lp-faq-a{
  max-height:0; overflow:hidden; transition:max-height .35s ease, padding .35s ease;
}
.lp-faq-item.open .lp-faq-a{max-height:400px; padding-bottom:26px;}
.lp-faq-a p{font-size:16px; line-height:1.75; color:#3a382f; font-weight:300;}

/* Emotionaler Einstieg (Zitat-Stil) */
.lp-quote{
  padding:120px 48px; text-align:center; background:var(--paper-deep);
}
.lp-quote p{
  font-family:var(--editorial); font-style:italic; font-weight:300;
  font-size:clamp(28px,3.6vw,44px); line-height:1.35; color:var(--ink);
  max-width:820px; margin:0 auto;
}

/* Interne Verlinkung */
.lp-internal-link{
  color:var(--accent); border-bottom:1px solid var(--accent-soft);
  transition:border-color .3s ease;
}
.lp-internal-link:hover{border-bottom-color:var(--accent);}

@media (max-width:900px){
  .lp-section{padding:60px 24px;}
  .lp-section-tight{padding:44px 24px;}
  .lp-quote{padding:70px 24px;}
  .lp-split{grid-template-columns:1fr; gap:32px;}
  .lp-cards{grid-template-columns:1fr; gap:16px;}
  .lp-card{padding:28px 24px;}
  .lp-step{grid-template-columns:50px 1fr; gap:20px; padding:24px 0;}
  .lp-step-num{font-size:30px;}
  .lp-faq-q{font-size:17px; padding:20px 36px 20px 0;}
}

/* ============================================
   NEU: Textmenü unter Diashow (Startseite)
   ============================================ */
.hero-nav{
  padding:26px 48px; background:var(--paper);
  display:flex; justify-content:center; align-items:center; gap:36px; flex-wrap:wrap;
  border-bottom:1px solid var(--line);
}
.hero-nav a{
  font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--stone); transition:color .25s ease; padding:4px 0; white-space:nowrap;
}
.hero-nav a:hover{color:var(--accent);}
.hero-nav .sep{color:var(--line); font-size:10px;}

/* Mini-Galerie vor Über-mich */
.mini-gallery{padding:60px 48px 40px; background:var(--paper);}
.mini-gallery-head{
  text-align:center; margin-bottom:32px;
}
.mini-gallery-head .eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); display:block; margin-bottom:12px;
}
.mini-gallery-head h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(22px,2.6vw,32px);
  letter-spacing:-0.01em;
}
.mini-grid{
  display:grid; grid-template-columns:repeat(9, 1fr); gap:6px;
  max-width:1400px; margin:0 auto;
}
.mini-grid img{
  width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:2px;
  transition:opacity .3s ease, transform .5s ease;
}
.mini-grid img:hover{opacity:.85; transform:scale(1.02);}
@media (max-width:900px){
  .hero-nav{gap:18px; padding:20px 20px;}
  .hero-nav a{font-size:11px; letter-spacing:.1em;}
  .hero-nav .sep{display:none;}
  .mini-gallery{padding:40px 20px 30px;}
  .mini-grid{grid-template-columns:repeat(6, 1fr); gap:4px;}
}
@media (max-width:520px){
  .mini-grid{grid-template-columns:repeat(4, 1fr);}
}

/* ============================================
   LEITMOTIV, TYPEWRITER & MARQUEE
   Ergänzungen für die neue Familie-Seite und
   das übergreifende Leitmotiv-System
   ============================================ */

/* Leitmotiv-Kicker über der eyebrow-Zeile in den subpage-heroes */
.leitmotiv{
  font-family: var(--editorial);
  font-style: italic;
  font-weight: 300;
  font-size: 28px;
  color: var(--accent);
  letter-spacing: .01em;
  margin-bottom: 18px;
  display: block;
}

/* Typewriter-Zeile im Hero (nur familie) */
.hero-type{
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-top: 22px;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--stone);
}
.hero-type-label{ opacity: .8; }
.hero-type-word{
  font-family: var(--editorial);
  font-style: italic;
  font-weight: 300;
  font-size: 22px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--accent);
  border-right: 1px solid var(--accent);
  padding-right: 2px;
  min-height: 1.2em;
  animation: caret-blink 1s steps(1) infinite;
}
@keyframes caret-blink{
  50%{ border-right-color: transparent; }
}

/* Endlos-Marquee mit "Zusammenhalt." in Salbeigrün */
.fam-marquee{
  background: var(--accent);
  color: var(--paper);
  padding: 44px 0;
  overflow: hidden;
  border-top: 1px solid rgba(247,245,240,.06);
  border-bottom: 1px solid rgba(247,245,240,.06);
}
.fam-marquee-track{
  display: flex;
  width: max-content;
  animation: marquee-scroll 42s linear infinite;
  will-change: transform;
}
.fam-marquee-item{
  font-family: var(--serif);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(48px, 8vw, 96px);
  line-height: 1;
  padding: 0 clamp(28px, 4vw, 60px);
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: clamp(28px, 4vw, 60px);
}
.fam-marquee-dot{
  display: inline-block;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--paper);
  opacity: .55;
}
@keyframes marquee-scroll{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .fam-marquee-track{ animation: none; }
  .hero-type-word{ animation: none; border-right-color: transparent; }
}

@media (max-width: 720px){
  .leitmotiv{ font-size: 24px; margin-bottom: 14px; }
  .hero-type{ font-size: 11px; gap: 10px; }
  .hero-type-word{ font-size: 18px; }

  /* Mobile: statischer Balken statt Marquee (Performance + Zuverlaessigkeit) */
  .fam-marquee{
    background: #52614C;
    color: #F7F5F0;
    padding: 44px 24px;
    text-align: center;
    overflow: hidden;
  }
  .fam-marquee-track{
    animation: none !important;
    display: block;
    width: 100%;
  }
  .fam-marquee-track > .fam-marquee-item + .fam-marquee-item{ display: none; }
  .fam-marquee-item{
    display: block;
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 44px;
    line-height: 1.1;
    color: #F7F5F0;
    padding: 0;
    gap: 0;
    white-space: normal;
  }
  .fam-marquee-item > span{ display: none; }
  .fam-marquee-item > span:first-child{ display: block; }
  .fam-marquee-item .fam-marquee-dot{ display: none; }
}

/* ============================================
   SIGNATURE-SCHRIFT (Hallo, ich bin Liza.)
   ============================================ */
.signature{
  font-family: 'Caveat', 'Homemade Apple', cursive;
  font-weight: 500;
  font-size: 54px;
  line-height: 1.05;
  color: var(--accent);
  letter-spacing: .005em;
  margin: 8px 0 18px;
  display: block;
}
@media (max-width: 720px){
  .signature{ font-size: 42px; margin: 6px 0 14px; }
}

/* ============================================
   TESTIMONIAL-SLIDER (Unterseiten)
   Bogenbild + ueberlappende Textkarte, Pfeile, Dots, Autoplay
   ============================================ */
.tm-section{
  padding: 120px 48px;
  background: var(--paper);
}
.tm-section-head{
  max-width: 1200px; margin: 0 auto 60px;
  display: flex; justify-content: space-between; align-items: flex-end;
  gap: 24px;
}
.tm-section-head h2{
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(30px, 3.6vw, 44px);
  line-height: 1.1; letter-spacing: -0.01em;
  color: var(--ink); margin: 0;
}
.tm-section-head h2 em{ font-style: italic; color: var(--accent); font-weight: 300; }
.tm-section-head .section-num{
  font-family: var(--mono); font-size: 12px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--stone); white-space: nowrap;
}

.tm-slider{
  max-width: 1200px; margin: 0 auto;
  position: relative;
  padding: 0 60px;
}
.tm-track{
  position: relative;
  min-height: 620px;
}
.tm-slide{
  position: absolute; inset: 0;
  display: grid;
  grid-template-columns: 460px 1fr;
  align-items: center;
  opacity: 0; visibility: hidden;
  transition: opacity .6s ease;
  pointer-events: none;
}
.tm-slide.active{
  opacity: 1; visibility: visible; pointer-events: auto;
}
.tm-img{
  width: 460px; height: 600px;
  background: var(--paper-deep);
  border-radius: 230px 230px 4px 4px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.tm-img img{
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.tm-img::before{
  content: attr(data-placeholder);
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: .2em;
  text-transform: uppercase; color: var(--stone);
  pointer-events: none;
}
.tm-img img[src]:not([src=""]){ position: relative; z-index: 2; }
.tm-card{
  background: var(--paper);
  border: 1px solid var(--line);
  padding: 48px 52px;
  margin-left: -80px;
  z-index: 2;
  max-width: 640px;
}
.tm-quote{
  font-family: var(--serif); font-weight: 300;
  font-size: 16px; line-height: 1.75;
  color: var(--ink);
  margin: 0 0 28px;
  white-space: pre-line;
}
.tm-divider{
  width: 40px; height: 1px; background: var(--stone);
  margin: 0 0 22px; opacity: .5;
}
.tm-author{
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--stone);
}

.tm-arrow{
  position: absolute; top: 50%;
  transform: translateY(-50%);
  width: 44px; height: 44px;
  background: transparent; border: none;
  cursor: pointer;
  color: var(--ink);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif); font-size: 32px; font-weight: 300;
  line-height: 1;
  transition: color .3s;
  z-index: 3;
}
.tm-arrow:hover{ color: var(--accent); }
.tm-arrow-prev{ left: 0; }
.tm-arrow-next{ right: 0; }

.tm-dots{
  display: flex; justify-content: center; gap: 10px;
  margin-top: 40px;
}
.tm-dot{
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--stone); opacity: .35;
  border: none; padding: 0; cursor: pointer;
  transition: opacity .3s, transform .3s;
}
.tm-dot.active{ opacity: 1; transform: scale(1.6); background: var(--ink); }

@media (max-width: 900px){
  .tm-section{ padding: 72px 18px; }
  .tm-section-head{ flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 36px; }
  .tm-slider{ padding: 0 8px; }
  .tm-track{ min-height: 0; }
  .tm-slide{
    position: relative;
    grid-template-columns: 1fr;
    gap: 0;
    display: none;
  }
  .tm-slide.active{ display: block; }
  .tm-img{
    width: 72%;
    max-width: 260px;
    height: auto;
    aspect-ratio: 4 / 5;
    margin: 0 auto 0;
    border-radius: 140px 140px 2px 2px;
  }
  .tm-card{
    margin-left: 0;
    margin-top: -28px;
    padding: 46px 26px 32px;
    max-width: none;
    background: var(--paper);
    border: 1px solid var(--line);
    position: relative;
    z-index: 3;
  }
  .tm-card::before{
    content: "\201C";
    position: absolute;
    top: 4px; left: 22px;
    font-family: var(--serif);
    font-size: 64px; line-height: 1;
    color: var(--accent);
    opacity: .35;
    font-style: italic;
  }
  .tm-quote{ font-size: 15px; line-height: 1.75; margin-bottom: 24px; }
  .tm-divider{ margin: 0 0 16px; }
  .tm-arrow{ width: 30px; height: 30px; font-size: 22px; }
  .tm-arrow-prev{ left: -6px; }
  .tm-arrow-next{ right: -6px; }
  .tm-dots{ margin-top: 24px; gap: 8px; }
  .tm-dot{ width: 5px; height: 5px; }
}

/* ========================================
   CONTACT FORM SECTION
   ======================================== */
.contact-form-section{
  padding: 100px 48px 120px;
  background: var(--paper);
}
.contact-form-intro-wrap{
  max-width: 1200px;
  margin: 0 auto 60px;
  text-align: left;
}
.contact-form-intro-wrap .leitmotiv{
  display: block;
  font-family: var(--serif); font-style: italic; font-weight: 300;
  font-size: 22px; color: var(--accent);
  margin-bottom: 12px;
}
.contact-form-intro-wrap .eyebrow{
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--stone);
  display: block; margin-bottom: 14px;
}
.contact-form-intro-wrap h2{
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(30px, 3.6vw, 44px);
  line-height: 1.15; letter-spacing: -0.01em;
  color: var(--ink); margin: 0 0 18px;
}
.contact-form-intro-wrap h2 em{
  font-style: italic; color: var(--accent);
}
.contact-form-intro-wrap p{
  font-family: var(--sans); font-size: 16px;
  color: var(--stone); line-height: 1.7; margin: 0;
  max-width: 560px;
}

.contact-grid{
  max-width: 680px;
  margin: 0 auto;
}
.contact-form-col{
  min-width: 0;
}
.form-grid-2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px;
}

/* Separater Video-Bereich unter dem Formular */
.contact-video-section{
  padding: 40px 48px 100px;
  background: var(--paper);
}
.contact-video-inner{
  max-width: 1000px;
  margin: 0 auto;
  padding-top: 60px;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 64px;
  align-items: center;
}
.contact-video-text{
  padding-right: 20px;
}
.contact-video-text .eyebrow{
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--stone);
  display: block; margin-bottom: 14px;
}
.contact-video-text h3{
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.2; margin: 0 0 16px;
  color: var(--ink);
}
.contact-video-text h3 em{ font-style: italic; color: var(--accent); }
.contact-video-text p{
  font-family: var(--sans); font-size: 15px;
  color: var(--stone); line-height: 1.7;
  margin: 0 0 26px; max-width: 460px;
}
.contact-video-media{
  width: 100%;
}
.contact-video{
  width: 100%;
  aspect-ratio: 9 / 16;
  background: var(--paper-deep);
  object-fit: cover;
  display: block;
  border-radius: 2px;
}
.contact-form{
  display: flex;
  flex-direction: column;
  gap: 26px;
}
.form-row{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-row label{
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--stone);
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 6px;
}
.form-row label .req{
  color: var(--accent);
  font-size: 12px;
}
.form-row label .opt{
  font-family: var(--sans);
  font-size: 11px;
  color: var(--stone);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
  opacity: .75;
}
.form-row input[type="text"],
.form-row input[type="email"],
.form-row select,
.form-row textarea{
  width: 100%;
  padding: 14px 0;
  border: none;
  border-bottom: 1px solid var(--line);
  background: transparent;
  font-family: var(--sans);
  font-size: 16px;
  color: var(--ink);
  transition: border-color .3s;
  outline: none;
  border-radius: 0;
  -webkit-appearance: none;
  appearance: none;
}
.form-row textarea{
  resize: vertical;
  min-height: 120px;
  line-height: 1.6;
  padding-top: 12px;
}
.form-row select{
  cursor: pointer;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%238E887A' stroke-width='1.5' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 4px center;
  padding-right: 24px;
}
.form-row input::placeholder,
.form-row textarea::placeholder{
  color: var(--stone);
  opacity: .5;
  font-style: italic;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus{
  border-bottom-color: var(--accent);
}

/* Consent checkbox */
.form-consent{
  margin-top: 6px;
}
.consent-label{
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.55;
  color: var(--stone);
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 400 !important;
}
.consent-label input[type="checkbox"]{
  width: 16px; height: 16px;
  margin: 2px 0 0;
  flex-shrink: 0;
  accent-color: var(--accent);
  cursor: pointer;
}
.consent-label a{
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Submit row */
.form-submit-row{
  flex-direction: row !important;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  margin-top: 12px;
}
.form-submit-row .btn{
  cursor: pointer;
  border: none;
  font-family: var(--mono);
}
.form-hint{
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .12em;
  color: var(--stone);
  text-transform: uppercase;
  margin: 0;
}
.form-hint .req{ color: var(--accent); }

/* Mobile: form single column, video section below */
@media (max-width: 900px){
  .contact-form-section{ padding: 60px 20px 60px; }
  .contact-form-intro-wrap{ margin-bottom: 40px; }
  .contact-form-intro-wrap h2{ font-size: 30px; }
  .form-grid-2{
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .contact-form{ gap: 24px; }
  .form-submit-row{ flex-wrap: wrap; }

  .contact-video-section{ padding: 20px 20px 60px; }
  .contact-video-inner{
    grid-template-columns: 1fr;
    gap: 32px;
    padding-top: 40px;
  }
  .contact-video-text{ padding-right: 0; text-align: center; }
  .contact-video-text p{ margin-left: auto; margin-right: auto; }
  .contact-video-media{
    max-width: 260px;
    margin: 0 auto;
  }
}

/* =========================================================
   WEDDING PAGE — Editorial Layout
   ========================================================= */

.page-wedding{
  --w-serif: 'Cormorant Garamond', 'Cormorant', serif;
}
/* Der Header liegt auf dem Hero — dunkles Logo aufhellen */
.page-wedding header{
  position: absolute; top:0; left:0; right:0; z-index:20;
  background: transparent;
}
.page-wedding header .logo{
  color: #fff; mix-blend-mode: normal;
}
.page-wedding header .nav-toggle span{ background:#fff; }

/* ======== HERO ======== */
.w-hero{
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 640px;
  overflow: hidden;
  background: #1B1A17;
}
.w-hero-img{
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: brightness(0.72);
}
.w-hero-inner{
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex; flex-direction: column;
  justify-content: center; align-items: center;
  text-align: center;
  padding: 0 32px;
  color: #fff;
}
.w-hero-kicker{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .32em;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
  margin-bottom: 32px;
}
.w-hero-title{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(72px, 14vw, 200px);
  line-height: 0.95;
  letter-spacing: -0.01em;
  margin: 0;
  color: #fff;
}
.w-hero-title em{
  font-style: italic;
  font-weight: 300;
  color: #fff;
  opacity: 0.95;
}
.w-hero-meta{
  margin-top: 44px;
  display: flex; align-items: center; gap: 14px;
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
  flex-wrap: wrap; justify-content: center;
}
.w-hero-meta .dot{ opacity:.5; }
.w-hero-scroll{
  position: absolute;
  bottom: 40px; left: 50%;
  transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  color: rgba(255,255,255,.7);
  font-family: var(--mono); font-size: 10px;
  letter-spacing: .3em; text-transform: uppercase;
}
.w-hero-scroll .line{
  display: block;
  width: 1px; height: 48px;
  background: rgba(255,255,255,.5);
  animation: wLineDrop 2.4s ease-in-out infinite;
}
@keyframes wLineDrop{
  0%,100%{ transform: scaleY(0.4); transform-origin: top; opacity:.4; }
  50%{ transform: scaleY(1); opacity:.9; }
}

/* ======== STATEMENT ======== */
.w-statement{
  padding: 140px 32px 140px;
  text-align: center;
  background: var(--paper);
}
.w-statement-eyebrow{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--stone);
  margin-bottom: 40px;
}
.w-statement-line{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(42px, 6.5vw, 96px);
  line-height: 1.05;
  letter-spacing: -0.005em;
  color: var(--ink);
  margin: 0 auto;
  max-width: 1000px;
}
.w-statement-line em{
  font-style: italic;
  color: var(--accent);
}
.w-statement-sub{
  margin: 40px auto 0;
  max-width: 480px;
  font-family: var(--sans);
  font-size: 16px; line-height: 1.7;
  color: var(--stone);
}

/* ======== PINNED SCROLL ======== */
.w-pinned{
  padding: 60px 48px 120px;
  background: var(--paper);
}
.w-pinned-inner{
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 5fr 7fr;
  gap: 100px;
  align-items: start;
}
.w-pinned-image{
  position: sticky;
  top: 60px;
  overflow: hidden;
}
.w-pinned-image img{
  width: 100%;
  display: block;
  aspect-ratio: 3 / 4.2;
  object-fit: cover;
}
.w-pinned-blocks{
  display: flex; flex-direction: column;
  gap: 180px;
  padding: 60px 0 60px;
}
.w-pinned-block{
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1s ease, transform 1s ease;
}
.w-pinned-block.is-visible{
  opacity: 1;
  transform: translateY(0);
}
.w-block-num{
  font-family: var(--w-serif);
  font-style: italic;
  font-weight: 300;
  font-size: 56px;
  line-height: 1;
  color: var(--accent);
  margin-bottom: 8px;
}
.w-pinned-block h3{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(28px, 3vw, 42px);
  color: var(--ink);
  margin: 0 0 24px;
  line-height: 1.15;
}
.w-pinned-block h3 em{ font-style: italic; }
.w-pinned-block p{
  font-family: var(--sans);
  font-size: 16px; line-height: 1.8;
  color: var(--ink);
  margin: 0 0 18px;
  max-width: 520px;
}

/* ======== FULL BLEED ======== */
.w-fullbleed{
  position: relative;
  width: 100%;
  height: 90vh;
  min-height: 560px;
  overflow: hidden;
  background: #1B1A17;
}
.w-fullbleed img{
  position: absolute; inset:0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: brightness(0.75);
}
.w-fullbleed-overlay{
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  padding: 0 32px;
  color: #fff;
}
.w-fullbleed-quote{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(40px, 7vw, 108px);
  line-height: 1.05;
  letter-spacing: -0.005em;
  margin: 0;
  color: #fff;
  max-width: 1000px;
}
.w-fullbleed-quote em{ font-style: italic; }
.w-cta-eyebrow{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .3em;
  text-transform: uppercase;
  color: rgba(255,255,255,.75);
  margin-bottom: 32px;
}
.w-cta-link{
  margin-top: 40px;
  display: inline-block;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.5);
  transition: border-color .3s;
}
.w-cta-link:hover{ border-color: #fff; }

/* ======== PAKETE ======== */
.w-packages{
  padding: 140px 48px 120px;
  background: var(--paper);
}
.w-packages-head{
  max-width: 720px;
  margin: 0 auto 100px;
  text-align: center;
}
.w-packages-eyebrow{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--stone);
  margin-bottom: 28px;
}
.w-packages-head h2{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(36px, 5vw, 68px);
  line-height: 1.1;
  color: var(--ink);
  margin: 0 0 32px;
}
.w-packages-head h2 em{ font-style: italic; color: var(--accent); }
.w-packages-head p{
  font-family: var(--sans);
  font-size: 16px; line-height: 1.75;
  color: var(--stone);
  margin: 0;
}
.w-package{
  max-width: 1000px;
  margin: 0 auto;
  padding: 80px 0;
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 60px;
  align-items: start;
  border-top: 1px solid var(--line);
}
.w-package-num{
  font-family: var(--w-serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(80px, 8vw, 140px);
  line-height: 1;
  color: var(--accent);
}
.w-package-label{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--stone);
  margin-bottom: 20px;
}
.w-package-label em{ font-style: italic; text-transform: none; letter-spacing: .06em; color: var(--accent); }
.w-package-content h3{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(32px, 3.6vw, 48px);
  line-height: 1.15;
  color: var(--ink);
  margin: 0 0 28px;
}
.w-package-content h3 em{ font-style: italic; }
.w-package-content p{
  font-family: var(--sans);
  font-size: 16px; line-height: 1.8;
  color: var(--ink);
  margin: 0 0 16px;
  max-width: 620px;
}
.w-package-plus{
  margin-top: 24px !important;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  color: var(--stone) !important;
  font-size: 14px !important;
}
.w-package-plus span{
  font-family: var(--mono);
  font-size: 10px; letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--accent);
  margin-right: 8px;
}
.w-package-trenner{
  display: block;
  width: 100%;
  height: 42vh;
  min-height: 320px;
  object-fit: cover;
  margin: 20px 0;
}
.w-packages-note{
  max-width: 640px;
  margin: 80px auto 0;
  text-align: center;
  padding-top: 60px;
  border-top: 1px solid var(--line);
}
.w-packages-note p{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: 22px;
  line-height: 1.55;
  color: var(--stone);
  margin: 0;
}
.w-packages-note em{ font-style: italic; color: var(--accent); }

/* ======== EDITORIAL GALLERY (asymmetrisch) ======== */
.w-gallery{
  padding: 120px 48px;
  background: var(--paper);
}
.w-gallery-eyebrow{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--stone);
  margin: 0 auto 60px;
  max-width: 1200px;
  text-align: center;
}
.w-gallery-grid{
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.w-gallery-grid img{
  width: 100%;
  display: block;
  object-fit: cover;
}
.w-gallery-grid .gp{
  aspect-ratio: 3 / 4;
}
.w-gallery-grid .gl{
  grid-column: 1 / -1;
  aspect-ratio: 3 / 1.35;
}

/* ======== WHAT'S INCLUDED ======== */
.w-included{
  padding: 140px 48px 120px;
  background: var(--paper-deep);
}
.w-included-head{
  text-align: center;
  max-width: 640px;
  margin: 0 auto 80px;
}
.w-included-eyebrow{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--stone);
  margin-bottom: 28px;
}
.w-included-head h2{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.1;
  color: var(--ink);
  margin: 0;
}
.w-included-head h2 em{ font-style: italic; color: var(--accent); }
.w-included-grid{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px 48px;
}
.w-included-item{
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.w-included-num{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .2em;
  color: var(--accent);
  margin-bottom: 20px;
}
.w-included-item h4{
  font-family: var(--w-serif);
  font-weight: 400;
  font-size: 22px;
  line-height: 1.3;
  color: var(--ink);
  margin: 0 0 14px;
}
.w-included-item p{
  font-family: var(--sans);
  font-size: 14px; line-height: 1.7;
  color: var(--stone);
  margin: 0;
}

/* ======== HONEST ======== */
.w-honest{
  padding: 140px 48px 120px;
  background: var(--paper);
}
.w-honest-inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 6fr 5fr;
  gap: 80px;
  align-items: center;
}
.w-honest-eyebrow{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--stone);
  margin-bottom: 32px;
}
.w-honest-text h2{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: clamp(32px, 4.4vw, 56px);
  line-height: 1.1;
  color: var(--ink);
  margin: 0 0 32px;
}
.w-honest-text h2 em{ font-style: italic; color: var(--accent); }
.w-honest-text p{
  font-family: var(--sans);
  font-size: 16px; line-height: 1.8;
  color: var(--ink);
  margin: 0 0 18px;
}
.w-honest-image img{
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
}

/* ======== WORKFLOW ======== */
.w-workflow{
  padding: 100px 48px 120px;
  background: var(--paper);
  text-align: center;
  border-top: 1px solid var(--line);
}
.w-workflow-eyebrow{
  font-family: var(--mono);
  font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--stone);
  margin-bottom: 28px;
}
.w-workflow h2{
  font-family: var(--w-serif);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.1;
  color: var(--accent);
  margin: 0 auto 80px;
}
.w-workflow-steps{
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px;
  text-align: left;
}
.w-workflow-num{
  font-family: var(--w-serif);
  font-weight: 300;
  font-size: 42px;
  line-height: 1;
  color: var(--stone);
  margin-bottom: 20px;
}
.w-workflow-num em{ font-style: italic; }
.w-workflow-step h4{
  font-family: var(--w-serif);
  font-weight: 400;
  font-size: 22px;
  color: var(--ink);
  margin: 0 0 14px;
}
.w-workflow-step p{
  font-family: var(--sans);
  font-size: 15px; line-height: 1.7;
  color: var(--stone);
  margin: 0;
}

/* Fullbleed CTA — bekommt mehr Aufmerksamkeit als Fullbleed 1 */
.w-fullbleed-cta{ height: 92vh; }
.w-fullbleed-cta .w-fullbleed-quote{
  font-size: clamp(56px, 10vw, 160px);
}

/* ======================================================
   MOBILE
   ====================================================== */
@media (max-width: 900px){
  .w-hero{ height: 100svh; min-height: 560px; }
  .w-hero-title{ font-size: clamp(56px, 22vw, 120px); }
  .w-hero-kicker{ margin-bottom: 20px; }
  .w-hero-meta{ margin-top: 28px; font-size: 10px; gap: 8px; }

  .w-statement{ padding: 90px 24px; }
  .w-statement-line{ font-size: clamp(34px, 10vw, 56px); }
  .w-statement-sub{ margin-top: 28px; font-size: 15px; }

  .w-pinned{ padding: 40px 24px 80px; }
  .w-pinned-inner{
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .w-pinned-image{
    position: static;
    max-width: 320px;
    margin: 0 auto;
  }
  .w-pinned-image img{ aspect-ratio: 3 / 4; }
  .w-pinned-blocks{ gap: 60px; padding: 0; }
  .w-pinned-block{ opacity: 1; transform: none; }
  .w-block-num{ font-size: 40px; }

  .w-fullbleed{ height: 70vh; min-height: 400px; }

  .w-packages{ padding: 80px 24px; }
  .w-packages-head{ margin-bottom: 60px; }
  .w-packages-head h2{ font-size: 34px; }
  .w-package{
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 50px 0;
  }
  .w-package-num{ font-size: 72px; }
  .w-package-content h3{ font-size: 26px; margin-bottom: 18px; }
  .w-package-trenner{ height: 30vh; min-height: 240px; }

  .w-gallery{ padding: 80px 20px; }
  .w-gallery-grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
  .w-gallery-grid .gp{ aspect-ratio: 3 / 4; }
  .w-gallery-grid .gl{ grid-column: 1 / -1; aspect-ratio: 3 / 2; }

  .w-included{ padding: 80px 24px; }
  .w-included-head{ margin-bottom: 50px; }
  .w-included-head h2{ font-size: 32px; }
  .w-included-grid{
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .w-honest{ padding: 80px 24px; }
  .w-honest-inner{
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .w-honest-text h2{ font-size: 30px; }
  .w-honest-image img{ max-width: 320px; margin: 0 auto; aspect-ratio: 3 / 4; }

  .w-workflow{ padding: 60px 24px 80px; }
  .w-workflow h2{ font-size: 30px; margin-bottom: 50px; }
  .w-workflow-steps{
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .w-fullbleed-cta{ height: 80vh; }
  .w-fullbleed-cta .w-fullbleed-quote{ font-size: clamp(48px, 18vw, 96px); }
}

/* =========================================================
   ÜBER MICH - Persönliche Seite mit Q&A auf kariertem Papier
   ========================================================= */

/* Hero */
.um-hero{
  display: grid;
  grid-template-columns: 6fr 5fr;
  gap: 80px;
  align-items: center;
  padding: 120px 48px 80px;
  max-width: 1240px;
  margin: 0 auto;
}
.um-hero-text .eyebrow{
  font-family: var(--mono); font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase; color: var(--stone);
  display: block; margin-bottom: 28px;
}
.um-hero-text h1{
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(48px, 7vw, 96px);
  line-height: 1.05;
  color: var(--ink);
  margin: 0 0 32px;
}
.um-hero-text h1 em{
  font-family: 'Caveat', cursive;
  font-style: normal;
  font-weight: 500;
  color: var(--accent);
  font-size: 1.1em;
}
.um-hero-lead{
  font-family: var(--sans);
  font-size: 17px; line-height: 1.75;
  color: var(--ink);
  max-width: 460px;
  margin: 0;
}
.um-hero-img img{
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
}

/* Intro */
.um-intro{
  max-width: 620px;
  margin: 0 auto;
  padding: 40px 32px 80px;
  text-align: center;
}
.um-intro p{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(22px, 2.4vw, 28px);
  line-height: 1.55;
  color: var(--stone);
  margin: 0;
}

/* Q&A Section — karierte Papier-Bögen */
.qa-section{
  background: var(--paper-deep);
  padding: 100px 32px 120px;
  position: relative;
}
.qa-section::before{
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(ellipse at 20% 30%, rgba(140,130,110,.06), transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(140,130,110,.06), transparent 50%);
  pointer-events: none;
}
.qa-paper{
  position: relative;
  max-width: 640px;
  margin: 0 auto 44px;
  padding: 44px 48px 40px 68px;
  background: #fbfaf3;
  background-image:
    /* Horizontale Linien (Karolinien) */
    repeating-linear-gradient(
      0deg,
      transparent 0px,
      transparent 27px,
      rgba(120,140,175,.20) 27px,
      rgba(120,140,175,.20) 28px
    ),
    /* Vertikale Linien */
    repeating-linear-gradient(
      90deg,
      transparent 0px,
      transparent 27px,
      rgba(120,140,175,.13) 27px,
      rgba(120,140,175,.13) 28px
    );
  box-shadow:
    0 22px 40px -18px rgba(50,40,20,.18),
    0 4px 10px rgba(50,40,20,.06),
    inset 0 0 40px rgba(200,180,140,.08);
  border-radius: 3px;
}
/* Rote Randlinie links (wie in Schulheften) */
.qa-paper::before{
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  left: 48px;
  width: 1px;
  background: rgba(190,50,50,.35);
}
/* Zwei kleine "Löcher" oben rechts, wie an einer Kordel */
.qa-paper::after{
  content: '';
  position: absolute;
  top: 12px;
  right: 20px;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(120,110,90,.12);
  box-shadow: -14px 0 0 rgba(120,110,90,.12);
}
/* leichte Rotationen für Handmade-Look */
.qa-paper:nth-child(1){ transform: rotate(-0.5deg); }
.qa-paper:nth-child(2){ transform: rotate(0.6deg); margin-left: 40px; }
.qa-paper:nth-child(3){ transform: rotate(-0.3deg); margin-right: 30px; }
.qa-paper:nth-child(4){ transform: rotate(0.4deg); }
.qa-paper:nth-child(5){ transform: rotate(-0.6deg); margin-left: 20px; }
.qa-paper:nth-child(6){ transform: rotate(0.3deg); margin-right: 40px; }
.qa-paper:nth-child(7){ transform: rotate(-0.4deg); }
.qa-paper:nth-child(8){ transform: rotate(0.5deg); margin-left: 30px; }
.qa-paper:nth-child(9){ transform: rotate(-0.3deg); margin-right: 20px; }
.qa-paper:nth-child(10){ transform: rotate(0.4deg); }

.qa-q{
  font-family: 'Caveat', cursive;
  font-weight: 700;
  font-size: clamp(30px, 3.6vw, 40px);
  line-height: 1.15;
  color: var(--accent);
  margin: 0 0 22px;
  padding-left: 8px;
}
.qa-a{
  font-family: 'Caveat', cursive;
  font-weight: 500;
  font-size: 22px;
  line-height: 1.45;
  color: var(--ink);
  padding-left: 8px;
}

/* Ausklang */
.um-outro{
  text-align: center;
  padding: 120px 32px 140px;
  background: var(--paper);
}
.um-outro-quote{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(30px, 4.5vw, 52px);
  line-height: 1.2;
  color: var(--ink);
  margin: 0 auto 48px;
  max-width: 680px;
}
.um-outro-quote em{
  font-style: italic;
  color: var(--accent);
}
.um-outro-buttons{
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Instagram Link im Nav-Overlay */
.nav-overlay .nav-instagram{
  font-family: var(--mono) !important;
  font-size: 13px !important;
  letter-spacing: .06em !important;
  text-transform: none !important;
  color: var(--accent) !important;
  margin-top: 20px !important;
}

/* MOBILE */
@media (max-width: 900px){
  .um-hero{
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 80px 24px 40px;
  }
  .um-hero-img{
    max-width: 280px;
    margin: 0 auto;
  }
  .um-intro{ padding: 20px 24px 60px; }

  .qa-section{ padding: 60px 20px 80px; }
  .qa-paper{
    padding: 36px 28px 32px 44px;
    margin-bottom: 32px;
  }
  .qa-paper::before{ left: 26px; }
  .qa-paper:nth-child(n){
    margin-left: auto !important;
    margin-right: auto !important;
    transform: rotate(-0.3deg);
  }
  .qa-paper:nth-child(even){ transform: rotate(0.4deg); }
  .qa-q{ font-size: 28px; margin-bottom: 18px; }
  .qa-a{ font-size: 20px; }

  .um-outro{ padding: 80px 24px 100px; }
  .um-outro-quote{ font-size: 28px; margin-bottom: 32px; }
}

/* =========================================================
   LEGAL PAGES (Datenschutz, Impressum)
   ========================================================= */
.legal-page{
  background: var(--paper);
  padding: 100px 32px 120px;
}
.legal-wrap{
  max-width: 780px;
  margin: 0 auto;
}
.legal-head{
  margin-bottom: 60px;
  padding-bottom: 40px;
  border-bottom: 1px solid var(--line);
}
.legal-head .eyebrow{
  font-family: var(--mono); font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase; color: var(--stone);
  display: block; margin-bottom: 24px;
}
.legal-head h1{
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(38px, 5vw, 60px);
  line-height: 1.1;
  color: var(--ink);
  margin: 0 0 24px;
}
.legal-lead{
  font-family: var(--sans);
  font-size: 17px; line-height: 1.7;
  color: var(--stone);
  margin: 0;
  max-width: 620px;
}
.legal-section{
  margin: 50px 0;
}
.legal-section h2{
  font-family: var(--serif); font-weight: 400;
  font-size: 22px;
  color: var(--ink);
  margin: 0 0 20px;
  letter-spacing: -0.005em;
}
.legal-section p{
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.75;
  color: var(--ink);
  margin: 0 0 16px;
}
.legal-section p a,
.legal-section li a{
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.legal-section p em{
  font-family: var(--mono);
  font-style: normal;
  font-size: 13px;
  color: var(--accent);
}
.legal-list{
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.75;
  color: var(--ink);
  margin: 0 0 16px;
  padding-left: 22px;
}
.legal-list li{
  margin-bottom: 8px;
}
.legal-list li strong{
  font-weight: 500;
  color: var(--ink);
}
.legal-meta{
  font-family: var(--mono) !important;
  font-size: 11px !important;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--stone) !important;
  margin-top: 80px !important;
  padding-top: 30px;
  border-top: 1px solid var(--line);
  text-align: right;
}

@media (max-width: 900px){
  .legal-page{ padding: 60px 20px 80px; }
  .legal-head h1{ font-size: 34px; }
  .legal-head{ margin-bottom: 40px; padding-bottom: 30px; }
  .legal-section{ margin: 40px 0; }
  .legal-section h2{ font-size: 19px; }
}

/* Danke-Seite */
.thanks-page{
  min-height: 80vh;
  display: flex;
  align-items: center;
  padding: 100px 32px;
  background: var(--paper);
}
.thanks-wrap{
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}
.thanks-wrap .eyebrow{
  font-family: var(--mono); font-size: 11px; letter-spacing: .28em;
  text-transform: uppercase; color: var(--stone);
  display: block; margin-bottom: 28px;
}
.thanks-wrap h1{
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(42px, 6vw, 72px);
  line-height: 1.1;
  color: var(--ink);
  margin: 0 0 32px;
}
.thanks-wrap h1 em{
  font-style: italic;
  color: var(--accent);
}
.thanks-lead{
  font-family: var(--sans);
  font-size: 16px; line-height: 1.75;
  color: var(--stone);
  margin: 0 auto 20px;
  max-width: 500px;
}
.thanks-buttons{
  margin: 40px 0 60px;
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}
.thanks-signature{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: 22px;
  color: var(--stone);
  line-height: 1.5;
  margin: 40px 0 0;
}
.thanks-signature span{
  font-family: 'Caveat', cursive;
  font-style: normal;
  font-size: 38px;
  color: var(--accent);
  display: inline-block;
  margin-top: 6px;
}
@media (max-width: 900px){
  .thanks-page{ padding: 60px 24px; }
  .thanks-wrap h1{ font-size: 34px; }
}

/* ==== Bild-Logo im Header (v29) ==== */
.logo img{ height:40px; width:auto; display:block; }
@media (max-width:700px){ .logo img{ height:30px; } }

/* ==== Monogramm-Signets (v30) ==== */
footer{ flex-direction:column; gap:26px; align-items:center; }
.footer-mono{ width:50px; height:auto; opacity:.8; display:block; }
.footer-bar{ width:100%; display:flex; justify-content:space-between; align-items:center; }
.nav-mono{ width:46px; height:auto; opacity:.72; margin-bottom:22px; display:block; }
.w-statement-mono{ width:58px; height:auto; opacity:.82; display:block; margin:0 auto 34px; }
@media (max-width:900px){ .footer-bar{ flex-direction:column; gap:16px; text-align:center; } }

/* ==== Erster Geburtstag – kompakte Galerie (v31) ==== */
.birthday-lead{
  font-family:var(--sans); font-size:15px; color:var(--stone);
  max-width:1100px; margin:0 auto 28px; line-height:1.6;
}
.birthday-grid{
  grid-template-columns:repeat(6,1fr); gap:10px;
  max-width:1100px; margin:0 auto;
}
.birthday-grid img{ aspect-ratio:3/4; }
@media (max-width:900px){ .birthday-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .birthday-grid{ grid-template-columns:repeat(2,1fr); gap:8px; } }

/* ==== Kompakte Bildreihe (Newborn-Einblicke) ==== */
.compact-strip{ grid-template-columns:repeat(6,1fr); gap:10px; max-width:1100px; margin:8px auto 0; }
.compact-strip img{ aspect-ratio:3/4; }
@media (max-width:900px){ .compact-strip{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .compact-strip{ grid-template-columns:repeat(3,1fr); gap:6px; } }