
/* --- BASE (subset from reset) + gallery/lightbox additions --- */
@font-face { font-family:'Clicker Script'; src:url('../fonts/ClickerScript-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'EB Garamond'; src:url('../fonts/EBGaramond-VariableFont_wght.woff2') format('woff2'); font-weight:400 800; font-style:normal; font-display:swap; }
@font-face { font-family:'Montserrat'; src:url('../fonts/Montserrat-VariableFont_wght.woff2') format('woff2'); font-weight:100 900; font-style:normal; font-display:swap; }
:root{ --bg:#efedf6; --text:#1a1a1a; --muted:#6b6b6b; --accent:#e6b0c4; --accent2:#867dab; --container:1100px; --radius:12px; --shadow:0 6px 24px rgba(0,0,0,.08); }
*{ box-sizing:border-box } html,body{ margin:0; padding:0 }
body{ font-family:'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--text); background:var(--bg); line-height:1.6; }
h1,h2,h3{ margin:0 0 .75rem; line-height:1.25 }
.section-title{ font-family:'EB Garamond', Georgia, serif; font-weight:600; font-size:clamp(28px,3vw,40px); color:var(--text) }
.script{ font-family:'Clicker Script', cursive; font-weight:400; font-style:normal; letter-spacing:.02em; font-size:clamp(36px,6vw,64px); color:var(--accent2) }
.lead{ font-size:clamp(16px,2.2vw,22px); color:#f0eef7 }
.container{ max-width:var(--container); margin:0 auto; padding:0 18px } .section{ padding:72px 0 }
.grid{ display:grid; gap:14px } .cards{ grid-template-columns:repeat(auto-fill, minmax(260px,1fr)) }
.site-header{ position:sticky; top:0; z-index:50; backdrop-filter:saturate(150%) blur(6px); background:rgba(255,255,255,.6); border-bottom:1px solid rgba(0,0,0,.06) }
.header-inner{ display:flex; align-items:center; justify-content:space-between; height:64px }
.logo{ font-family:'EB Garamond', Georgia, serif; font-weight:600; color:var(--text); text-decoration:none; font-size:20px }
.hamburger{ width:42px; height:36px; border:0; background:transparent; display:grid; gap:6px; cursor:pointer } .hamburger span{ display:block; height:3px; background:var(--text); border-radius:2px }
.overlay{ position:fixed; inset:0; background:rgba(15,15,20,.75); backdrop-filter:blur(8px); display:none; align-items:center; justify-content:center; z-index:100 }
.overlay.open{ display:flex; animation:fadeIn .18s ease-out } @keyframes fadeIn{ from{opacity:0} to{opacity:1} }
.overlay-menu{ list-style:none; padding:0; margin:0; text-align:center } .overlay-menu a{ display:inline-block; color:#fff; text-decoration:none; font-size:clamp(22px,3vw,32px); padding:10px 18px }
.overlay-close{ position:absolute; top:16px; right:16px; width:44px; height:44px; font-size:32px; color:#fff; background:transparent; border:0; cursor:pointer }
.card{ background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); text-decoration:none; color:inherit; display:flex; flex-direction:column }
.card img{ width:100%; height:220px; object-fit:cover; display:block } .card-meta{ padding:12px 14px; display:flex; align-items:center; justify-content:space-between }
.tag{ font-size:12px; padding:3px 8px; background:var(--accent2); color:#fff; border-radius:999px }
.button{ display:inline-block; background:var(--accent); color:#fff; text-decoration:none; font-weight:600; padding:10px 16px; border-radius:8px } .button:hover{ background:var(--accent2) }
.filters{ display:flex; gap:8px; margin-bottom:16px; flex-wrap:wrap } .chip{ border:1px solid rgba(0,0,0,.1); background:#fff; border-radius:999px; padding:6px 12px; cursor:pointer } .chip.is-active,.chip:hover{ background:var(--accent); color:#fff; border-color:transparent }
.about{ display:grid; grid-template-columns:1fr 1.2fr; gap:24px; align-items:start } .about-photo{ width:100%; height:auto; border-radius:var(--radius); box-shadow:var(--shadow) } .about-text p{ margin:0 0 1rem }
.contact-form{ display:grid; gap:12px; max-width:720px } .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px } .contact-form input,.contact-form textarea{ width:100%; padding:10px 12px; border:1px solid #ddd; border-radius:8px; font:inherit } .hp{ position:absolute; left:-9999px; top:-9999px }
.site-footer{ border-top:1px solid rgba(0,0,0,.06); padding:24px 0; margin-top:40px } .footer-inner{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px } .footer-nav a{ color:var(--muted); text-decoration:none; margin-left:12px } .footer-nav a:hover{ color:var(--text) }
/* GALLERY */
.gallery{ display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:10px; margin-top:16px }
.gallery .thumb{ display:block; border-radius:12px; overflow:hidden; box-shadow:var(--shadow) }
.gallery img{ width:100%; height:220px; object-fit:cover; display:block; transition: transform .2s ease }
.gallery .thumb:hover img{ transform: scale(1.02) }
.backlink{ color:var(--muted); text-decoration:none } .backlink:hover{ color:var(--text); text-decoration:underline }
.muted{ color:var(--muted) } .summary{ max-width:70ch }
/* LIGHTBOX */
.lightbox{ position:fixed; inset:0; background:rgba(10,10,14,.9); display:none; place-items:center; z-index:200 }
.lightbox.open{ display:grid } .lightbox img{ max-width:92vw; max-height:88vh; border-radius:12px; box-shadow:0 20px 60px rgba(0,0,0,.4) }
.lb-close,.lb-prev,.lb-next{ position:absolute; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); color:#fff; font-size:28px; width:44px; height:44px; border-radius:999px; display:grid; place-items:center; cursor:pointer }
.lb-close{ top:16px; right:16px; font-size:30px } .lb-prev{ left:16px; top:50%; transform:translateY(-50%) } .lb-next{ right:16px; top:50%; transform:translateY(-50%) }

/* === merged: alerts === */
/* Alerts for contact feedback */
.alert{border-radius:10px;padding:12px 14px;margin:12px 0;font-weight:600}
.alert.success{background:#e7f6ed;color:#215e36;border:1px solid #ccead7}
.alert.error{background:#fdecea;color:#611a15;border:1px solid #f5c6cb}

/* === merged: hero === */
/* ===== Hero Slideshow (clean final) ===== */

.hero {
  position: relative;
  width: 100%;
  background: transparent;          /* erbt Body-Hintergrund */
}

.hero-slideshow {
  position: relative;
  width: 100%;
  min-height: 56vh;
  height: 56vh;
  background: transparent;          /* kein extra Schwarz */
  overflow: hidden;
}

/* Slides übereinander, full-bleed */
.hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity var(--hero-transition, 1500ms) ease-in-out; /* Fallback 1.5s */
}
.hero-slide.is-active { opacity: 1; }

/* Overlay mittig mit Randabstand */
.hero-overlay{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;              /* vertikal mittig */
  justify-content: center;          /* horizontal mittig */
  pointer-events: none;
  padding: 0 20px;                  /* Randabstand links/rechts */
}

/* Panel mit besserem Kontrast */
.hero-panel{
  background: rgba(0,0,0,0.55);     /* stärker als zuvor */
  color: #fff;                      /* Grundschrift */
  padding: 18px 22px;
  border-radius: 12px;
  margin: 24px auto;
  max-width: 900px;
  width: 100%;
  text-align: center;
}
.hero-panel h1{ color:#e6b0c4; }    /* Akzent für Headline */
.hero-panel p { color:#fff; }
.hero-panel h1, .hero-panel p{ text-shadow:0 2px 4px rgba(0,0,0,.45); }

/* Optional leichte Hover-Intensivierung (Desktop) */
@media (hover:hover){
  .hero-slideshow:hover .hero-panel{ background: rgba(0,0,0,0.62); }
}

/* Responsiv etwas flacher */
@media (max-width:640px){
  .hero-slideshow{ min-height:46vh; height:46vh; }
  .hero-panel{ margin:14px auto; padding:12px 14px; }
}

/* Bewegungen reduzieren – trotzdem weich überblenden (gleiche Dauer) */
@media (prefers-reduced-motion: reduce){
  .hero-slide{ transition: opacity var(--hero-transition, 800ms) ease-in-out; }
}


/* === merged: air patch for container paddings === */
.container { width:100%; max-width:1200px; margin:0 auto; padding-inline:16px; }
@media (min-width:768px){ .container{ padding-inline:24px; } }
@media (min-width:1024px){ .container{ padding-inline:60px; } }

/* === merged: air patch for section vertical spacing === */
.section { padding-block:32px 56px; }
@media (min-width:1024px){ .section{ padding-block:48px 80px; } }

/* Brand im Header */
.brand{ display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit; }
.brand-logo{ display:block; height:40px; width:auto; }   /* Höhe änderst du bei Bedarf */
.brand-text{
/*	font-family:"Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	font-size:22px;
	font-weight: 500;
	line-height:1;
*/
	font-family:"Clicker Script", cursive;
	font-size:32px;
	font-weight: 500;
	line-height:1;
	}

@media (min-width:1024px){
  .brand-logo{ height:40px; }
  .brand-text{ font-size:36px; }
}

.header-inner {
  display: flex;
  justify-content: space-between; /* Logo links, Menü-Button rechts */
  align-items: center;
}


