:root{
  /* neutrale Basis */
  --bg:#F5F4F1;
  --ink:#262523;
  --text:#3e3e3e;
  --muted:#6f6a64;
  --line:#E1E1E1;
  --soft:#EFEEEA;
  /* Markenfarben alte Website */
  --petrol:#3A5A66;
  --petrol-dark:#2C4750;
  --sage:#7FA3A7;
  --accent:#611634;      /* Bordeaux dunkel – primärer Akzent */
  --accent-dark:#A02754; /* helleres Bordeaux – Hover */
  --accent-soft:#F1DDE5;
  --pad: clamp(24px, 6vw, 120px);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:"Open Sans",-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.65;
  font-size:clamp(16px,1.1vw,18px);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:"Merriweather",Georgia,serif;
  font-weight:900;
  color:var(--ink);
  line-height:1.08;
  letter-spacing:-.01em;
}
a{color:inherit;text-decoration:none;}
.kicker{
  font-family:"Open Sans";font-weight:600;font-size:12.5px;
  text-transform:uppercase;letter-spacing:.2em;color:var(--petrol);
}

/* ---------- Header ---------- */
header{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:16px var(--pad);
  background:rgba(251,248,242,.85);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
header .logo img{height:50px;display:block;}
nav{display:flex;gap:34px;align-items:center;}
nav a{font-weight:500;font-size:15px;color:var(--ink);opacity:.78;transition:opacity .2s,color .2s;}
nav a:hover{opacity:1;color:var(--accent);}
nav a.active{opacity:1;color:var(--accent);}
.btn{
  display:inline-block;background:#1a1a1a;color:#fff;
  padding:13px 26px;border-radius:100px;font-weight:600;font-size:15px;
  border:1px solid #1a1a1a;transition:.2s;cursor:pointer;
}
.btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;}
.btn.ghost{background:transparent;color:var(--ink);}
.btn.ghost:hover{background:var(--ink);color:#fff;}
.nav-cta.btn{opacity:1;}
.menu-toggle{display:none;background:none;border:0;font-size:26px;cursor:pointer;color:var(--ink);}

/* ---------- Hero ---------- */
.hero{padding:clamp(64px,11vw,140px) var(--pad) clamp(40px,6vw,80px);}
.hero .kicker{margin-bottom:26px;}
.hero h1{font-size:clamp(3.5rem,10.2vw,8.4rem);max-width:15ch;}
.hero h1 .accent{font-style:normal;}
.hero .sub{
  max-width:620px;margin-top:30px;font-size:clamp(18px,1.5vw,22px);
  color:var(--text);line-height:1.55;
}
.hero .sub em{font-style:normal;color:var(--accent);font-weight:600;}
.hero .actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:40px;}

/* ---------- Split-Hero (Text + Bild) ---------- */
.hero.hero-split{padding:0;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;height:calc(100vh - 82px);height:calc(100svh - 82px);min-height:480px;overflow:hidden;}
.hero-split .hero-text{padding:clamp(32px,4vw,72px) clamp(28px,4vw,72px) clamp(32px,4vw,72px) var(--pad);display:flex;flex-direction:column;justify-content:center;}
.hero-split .hero-media{overflow:hidden;}
.hero-split .hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;}
/* Titel im schmaleren Split-Text: an Spaltenbreite statt Viewport koppeln */
.hero-split h1{font-size:clamp(2.5rem,4.8vw,5rem);}
/* Grafik-Panel rechts (ohne Hintergrund) */
.hero-split .hero-graphic{background:transparent;display:flex;align-items:center;justify-content:center;padding:clamp(24px,3vw,56px) clamp(24px,4vw,64px) clamp(24px,3vw,56px) 0;}
.hero-split .hero-graphic svg{width:100%;height:auto;max-width:560px;}

/* ---------- Full-Bleed-Hero (Bild hinter Text) ---------- */
.hero.hero-full{position:relative;padding:0;min-height:clamp(560px,84vh,800px);display:flex;align-items:center;overflow:hidden;}
.hero-full .hero-media{position:absolute;inset:0;z-index:0;}
.hero-full .hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 42%;display:block;}
.hero-full::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(18,26,30,.86),rgba(18,26,30,.5) 44%,rgba(18,26,30,.08) 80%);}
.hero-full .hero-text{position:relative;z-index:2;padding:clamp(48px,7vw,120px) var(--pad);max-width:840px;}
.hero-full h1{color:#fff;font-size:clamp(2.7rem,6vw,5.8rem);}
.hero-full .sub{color:#eef2f2;}
.hero-full .sub em{color:#fff;}
.hero-full .btn.ghost{color:#fff;border-color:rgba(255,255,255,.55);}
.hero-full .btn.ghost:hover{background:#fff;color:var(--ink);border-color:#fff;}

/* ---------- Page-Hero (Subseiten, hell) ---------- */
.page-hero{padding:clamp(56px,9vw,120px) var(--pad) clamp(36px,5vw,68px);border-bottom:1px solid var(--line);}
.page-hero .kicker{display:block;margin-bottom:22px;}
.page-hero h1{font-size:clamp(2.6rem,7.5vw,6rem);max-width:16ch;}
.page-hero .sub{max-width:640px;margin-top:26px;font-size:clamp(18px,1.5vw,22px);color:var(--text);line-height:1.55;}
.page-hero .sub em{font-style:normal;color:var(--accent);font-weight:600;}
.page-hero .actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:36px;}

/* ---------- Foto-Hero (Subseiten, Bild) ---------- */
.hero-photo{position:relative;min-height:clamp(420px,62vh,680px);display:flex;align-items:flex-end;overflow:hidden;}
.hero-photo img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(33,28,23,.82),rgba(33,28,23,.12));z-index:1;}
.hero-photo .inner{position:relative;z-index:2;padding:clamp(40px,6vw,88px) var(--pad);color:#fff;max-width:900px;}
.hero-photo .kicker{color:#e7e2db;display:block;margin-bottom:18px;}
.hero-photo h1{color:#fff;font-size:clamp(2.6rem,7vw,6rem);}
.hero-photo .sub{color:#f0ece6;margin-top:20px;font-size:clamp(18px,1.5vw,22px);max-width:42ch;}

/* ---------- Photo band ---------- */
.band{position:relative;height:clamp(320px,46vw,560px);overflow:hidden;}
.band img{width:100%;height:100%;object-fit:cover;display:block;}
.band .cap{
  position:absolute;left:0;bottom:0;right:0;
  padding:clamp(28px,5vw,64px) var(--pad);
  background:linear-gradient(to top,rgba(33,28,23,.72),rgba(33,28,23,0));
  color:#fff;
}
.band .cap p{font-family:"Merriweather",serif;font-weight:700;font-size:clamp(1.3rem,2.6vw,2.2rem);max-width:20ch;line-height:1.2;}

/* ---------- Sections ---------- */
section{padding:clamp(64px,9vw,140px) var(--pad);}
section.soft{background:var(--soft);}
.section-head{max-width:760px;margin-bottom:clamp(38px,5vw,68px);}
.section-head .kicker{display:block;margin-bottom:18px;}
.section-head h2{font-size:clamp(2rem,5vw,4rem);}
.section-head p{margin-top:20px;font-size:clamp(17px,1.35vw,20px);color:var(--muted);}

/* Leistungen – große Zeilen */
.services{border-top:1px solid var(--line);}
.srow{
  display:grid;grid-template-columns:70px 1fr minmax(0,420px);
  gap:32px;align-items:start;
  padding:clamp(30px,3.8vw,48px) 0;border-bottom:1px solid var(--line);
  transition:padding-left .3s;
}
.srow:hover{padding-left:12px;}
.srow:hover .num{color:var(--accent);}
.srow .num{font-family:"Merriweather",serif;font-weight:700;color:var(--line);font-size:1.3rem;padding-top:8px;transition:color .3s;}
.srow h3{font-size:clamp(1.7rem,4vw,3rem);}
.srow p{color:var(--muted);padding-top:12px;}

/* ---------- 3-Spalten Feature-Karten ---------- */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.fcard{border:1px solid var(--line);background:#fff;padding:clamp(28px,3vw,42px);display:flex;flex-direction:column;}
.fcard .idx{font-family:"Merriweather",serif;font-weight:700;color:var(--sage);font-size:1.5rem;margin-bottom:18px;}
.fcard h3{font-size:clamp(1.35rem,2.4vw,1.9rem);margin-bottom:12px;}
.fcard p{color:var(--muted);}

/* ---------- Business Partner: 3 Bereiche ---------- */
.areas{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.acard{border:1px solid var(--line);background:#fff;padding:clamp(30px,3.4vw,46px);display:flex;flex-direction:column;}
.acard .lvl{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:var(--petrol);margin-bottom:14px;}
.acard h3{font-size:clamp(1.5rem,2.6vw,2.1rem);margin-bottom:12px;}
.acard p{color:var(--muted);}
.acard.kapital{grid-column:1 / -1;background:var(--soft);border-style:dashed;display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,4vw,50px);align-items:start;}
.acard.kapital .ktext h3{margin-bottom:8px;}

/* ---------- Anastelle Case ---------- */
.case{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center;}
.case-media{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.case-media img{width:100%;height:100%;aspect-ratio:3/4;object-fit:cover;display:block;}
.case-body .clogo{height:46px;width:auto;display:block;margin-bottom:22px;}
.case-body .kicker{display:block;margin-bottom:14px;}
.case-body h2{font-size:clamp(1.8rem,3.6vw,2.8rem);margin-bottom:16px;}
.case-body>p{color:var(--muted);margin-bottom:20px;}
.svc-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px;}
.svc-tags span{font-size:13px;font-weight:600;color:var(--petrol);background:#fff;border:1px solid #cdd7d9;border-radius:100px;padding:8px 16px;display:inline-flex;align-items:center;gap:8px;box-shadow:0 1px 2px rgba(58,90,102,.06);}
.svc-tags span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--petrol);flex:0 0 auto;}
.case-link{font-weight:600;color:var(--accent);display:inline-flex;align-items:center;gap:8px;border-bottom:1.5px solid var(--accent-soft);padding-bottom:2px;width:fit-content;}
.case-link:hover{border-color:var(--accent);}
.case-link .arw{transition:transform .2s;}
.case-link:hover .arw{transform:translateX(5px);}

/* ---------- Text + Bild ---------- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,72px);align-items:center;}
.duo .media img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:4/3;}
.duo h2{font-size:clamp(1.8rem,4vw,3rem);margin-bottom:18px;}
.duo p{color:var(--muted);margin-bottom:14px;}
.duo .kicker{display:block;margin-bottom:16px;}

/* ---------- Pricing ---------- */
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.pcard{border:1px solid var(--line);background:#fff;padding:clamp(28px,3vw,42px);display:flex;flex-direction:column;}
.pcard.featured{background:var(--petrol);color:#e7edee;border-color:var(--petrol);}
.pcard .plabel{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.2em;color:var(--petrol);margin-bottom:16px;}
.pcard.featured .plabel{color:#bcd2d3;}
.pcard h3{font-size:clamp(1.4rem,2.6vw,2rem);margin-bottom:6px;}
.pcard.featured h3{color:#fff;}
.pcard .dur{color:var(--muted);margin-bottom:24px;}
.pcard.featured .dur{color:#bcd2d3;}
.pcard .price{font-family:"Merriweather",serif;font-weight:900;font-size:clamp(2rem,3.4vw,2.7rem);color:var(--ink);margin-top:auto;}
.pcard.featured .price{color:#fff;}
.pcard .price small{font-family:"Open Sans";font-size:14px;font-weight:400;color:var(--muted);display:block;margin-top:6px;}
.pcard.featured .price small{color:#bcd2d3;}

/* ---------- Erlebnis: Titel links, Icon-Grid rechts ---------- */
.feat{display:grid;grid-template-columns:0.8fr 1.2fr;gap:clamp(32px,5vw,72px);align-items:center;}
.feat-head .kicker{display:block;margin-bottom:16px;}
.feat-head h2{font-size:clamp(1.9rem,4vw,3.2rem);}
.feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.fbox{border:1px solid var(--line);background:#fff;padding:clamp(22px,2.4vw,34px);}
.fbox .ico{width:30px;height:30px;color:var(--petrol);margin-bottom:14px;display:block;}
.fbox h3{font-size:clamp(1.15rem,1.7vw,1.4rem);margin-bottom:8px;}
.fbox p{color:var(--muted);font-size:15px;}

/* ---------- Inklusive-Liste ---------- */
.inclusive{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 44px;max-width:840px;}
.inclusive li{list-style:none;padding-left:30px;position:relative;color:var(--text);}
.inclusive li::before{content:"→";position:absolute;left:0;color:var(--accent);font-weight:700;}

/* ---------- Galerie ---------- */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.gallery img{width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;display:block;}
.gallery .feat{grid-column:1 / 3;grid-row:1 / 3;aspect-ratio:auto;}

/* ---------- Prose (Legal) ---------- */
.prose{max-width:760px;}
.prose h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin:38px 0 12px;}
.prose h2:first-child{margin-top:0;}
.prose p{margin-bottom:14px;color:var(--text);}
.prose a{color:var(--accent);border-bottom:1px solid var(--accent-soft);}
.prose strong{color:var(--ink);}

/* Statement – dunkel, mit Porträt */
.statement{background:var(--petrol);color:#e7edee;padding:0;}
.statement .inner{display:grid;grid-template-columns:0.9fr 1.1fr;gap:0;align-items:stretch;min-height:clamp(440px,58vh,660px);}
.statement .portrait{overflow:hidden;}
.statement .portrait img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;}
.statement .stext{padding:clamp(48px,6vw,104px) var(--pad) clamp(48px,6vw,104px) clamp(32px,4vw,68px);display:flex;flex-direction:column;justify-content:center;}
.statement .kicker{color:#bcd2d3;}
.statement .quote{font-family:"Merriweather",serif;font-weight:900;font-size:clamp(1.6rem,3.2vw,2.7rem);color:#fff;line-height:1.2;margin:20px 0 0;}
.statement p.body{color:#cdd9da;max-width:560px;margin-top:24px;}
.statement .sig{margin-top:30px;font-weight:600;color:#fff;}
.statement .sig small{display:block;color:#a9bcbd;font-weight:400;margin-top:2px;}

/* Split-Tiles */
.split{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.tile{
  overflow:hidden;position:relative;
  padding:clamp(32px,3.8vw,54px);min-height:400px;
  display:flex;flex-direction:column;border:1px solid var(--line);
}
.tile.solid{background:var(--sage);}
.tile.solid .kicker{color:var(--accent);}
.tile.solid h3{color:#1f2e30;}
.tile.solid p{color:#31474a;}
.tile.solid .more{color:var(--accent);}
.tile.photo{color:#fff;border:0;}
.tile.photo::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(33,28,23,.82),rgba(33,28,23,.28));
  z-index:1;
}
.tile.photo img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.tile .content{position:relative;z-index:2;display:flex;flex-direction:column;height:100%;}
.tile.photo .kicker{color:#e7e2db;}
.tile h3{font-size:clamp(1.6rem,3vw,2.6rem);margin:14px 0 14px;}
.tile.photo .content{justify-content:flex-end;}
.tile.photo h3{color:#fff;font-size:clamp(2.2rem,4.2vw,3.6rem);margin:0 0 2px;}
.tile p{color:var(--muted);margin-bottom:auto;}
.tile.photo p{color:#e4dcd2;}
.tile .more{margin-top:28px;font-weight:600;color:var(--accent);display:inline-flex;align-items:center;gap:10px;}
.tile.photo .more{color:#fff;margin-top:12px;}
.tile .more .arw{transition:transform .2s;}
.tile:hover .more .arw{transform:translateX(6px);}

/* ---------- CTA-Band ---------- */
.ctaband{background:var(--petrol);color:#fff;text-align:center;}
.ctaband h2{color:#fff;font-size:clamp(2rem,5vw,3.6rem);max-width:22ch;margin:0 auto 24px;}
.ctaband p{color:#cdd9da;max-width:52ch;margin:0 auto 34px;}
.ctaband .btn{background:#fff;color:var(--petrol);border-color:#fff;}
.ctaband .btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;}

/* Kontakt */
#kontakt{border-top:1px solid var(--line);}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px);align-items:start;}
.contact-grid h2{font-size:clamp(2.2rem,5.5vw,4.4rem);}
.contact-grid .lead{margin-top:22px;color:var(--muted);max-width:44ch;}
.contact-meta{margin-top:38px;display:flex;flex-direction:column;gap:14px;}
.contact-meta a{font-weight:500;color:var(--ink);border-bottom:1.5px solid var(--accent-soft);padding-bottom:2px;width:fit-content;transition:border-color .2s;}
.contact-meta a:hover{border-color:var(--accent);}
form{display:flex;flex-direction:column;gap:18px;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
label{font-size:12px;font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.09em;display:block;margin-bottom:8px;}
input,textarea,select{
  width:100%;border:0;border-bottom:1.5px solid var(--line);
  padding:12px 2px;font-family:inherit;font-size:16px;color:var(--ink);
  background:transparent;transition:border-color .2s;
}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);}
textarea{resize:vertical;min-height:110px;}
form .btn{margin-top:10px;align-self:flex-start;}

/* Footer */
footer.site{background:var(--petrol-dark);color:#c2d0d2;padding:clamp(56px,7vw,96px) var(--pad) 42px;}
.foot-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;padding-bottom:48px;border-bottom:1px solid #3e5a63;}
footer.site .logo img{height:50px;filter:invert(1);}
.foot-nav{display:flex;gap:60px;flex-wrap:wrap;}
.foot-col h4{font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:#8aa3a6;margin-bottom:16px;}
.foot-col a{display:block;color:#d3dedf;font-size:15px;margin-bottom:10px;opacity:.85;}
.foot-col a:hover{opacity:1;color:#fff;}
.foot-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:32px;font-size:13px;color:#8aa3a6;}

/* ---------- Referenzen / Kundenstimmen ---------- */
.refs{border-top:1px solid var(--line);}
.refs-head{text-align:center;margin-left:auto;margin-right:auto;}
.tcard{border:1px solid var(--line);background:#fff;padding:clamp(28px,3vw,40px);display:flex;flex-direction:column;margin:0;}
.tcard .reflogo{height:24px;width:auto;filter:grayscale(1);opacity:.6;margin-bottom:24px;align-self:flex-start;transition:filter .3s,opacity .3s;}
.tcard:hover .reflogo{filter:grayscale(0);opacity:1;}
.tcard .q{font-family:"Merriweather",serif;font-weight:400;font-size:clamp(1.02rem,1.4vw,1.15rem);line-height:1.55;color:var(--ink);margin-bottom:22px;}
.tcard cite{margin-top:auto;font-style:normal;font-size:14px;font-weight:600;color:var(--ink);line-height:1.35;}
.tcard cite small{display:block;font-weight:400;color:var(--muted);margin-top:2px;}

/* Reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:none;}

/* Responsive */
@media(max-width:860px){
  nav{position:fixed;inset:60px 0 auto 0;flex-direction:column;gap:0;background:var(--bg);border-bottom:1px solid var(--line);padding:8px var(--pad) 22px;transform:translateY(-140%);transition:transform .3s;box-shadow:0 20px 40px rgba(0,0,0,.06);}
  nav.open{transform:none;}
  nav a{padding:14px 0;width:100%;border-bottom:1px solid var(--line);font-size:17px;}
  .nav-cta{margin-top:14px;}
  .menu-toggle{display:block;}
  .hero.hero-split{grid-template-columns:1fr;height:auto;min-height:0;overflow:visible;}
  .hero-split .hero-media{height:78vw;max-height:460px;order:2;}
  .hero-split .hero-graphic{order:2;}
  .hero-split .hero-text{order:1;padding:clamp(56px,12vw,80px) var(--pad) clamp(36px,8vw,56px);}
  .srow{grid-template-columns:1fr;gap:8px;}
  .srow .num{display:none;}
  .statement .inner{grid-template-columns:1fr;min-height:0;}
  .statement .portrait{height:64vw;max-height:420px;}
  .statement .stext{padding:clamp(40px,9vw,60px) var(--pad);}
  .split{grid-template-columns:1fr;}
  .grid3{grid-template-columns:1fr;}
  .areas{grid-template-columns:1fr;}
  .acard.kapital{grid-template-columns:1fr;}
  .case{grid-template-columns:1fr;}
  .duo{grid-template-columns:1fr;}
  .pricing{grid-template-columns:1fr;}
  .feat{grid-template-columns:1fr;gap:26px;}
  .feat-grid{grid-template-columns:1fr;}
  .inclusive{grid-template-columns:1fr;}
  .gallery{grid-template-columns:1fr 1fr;}
  .gallery .feat{grid-column:1 / -1;grid-row:auto;aspect-ratio:1/1;}
  .contact-grid{grid-template-columns:1fr;}
  .frow{grid-template-columns:1fr;}
}
