@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;600;700&display=swap');
:root{
  --sand:#efe7dc;
  --sage:#7a8f7a;
  --sage-dark:#5f7660;
  --text:#1f2a1f;
  --muted:#5b645b;
  --white:#ffffff;
  --border:rgba(31,42,31,.12);
  --shadow:0 10px 30px rgba(0,0,0,.08);
  --radius:18px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--sand);line-height:1.6}
a{color:var(--sage-dark);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:0 18px}
header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(150%) blur(8px);background:rgba(239,231,220,.88);border-bottom:1px solid var(--border)}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.brand img{width:44px;height:44px;object-fit:cover;border-radius:12px;border:1px solid var(--border);background:var(--white)}
.brand .title{display:flex;flex-direction:column;line-height:1.15}
.brand .title span{font-size:12px;color:var(--muted)}
.brand .title strong{font-size:16px;letter-spacing:.1px}
.brand-name{display:inline-flex;gap:0}
.brand-denk{font-family:Georgia,"Times New Roman",serif;font-weight:800}
.brand-leichter{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:800}
nav{display:flex;gap:14px;flex-wrap:wrap;justify-content:flex-end}
nav a{padding:8px 10px;border-radius:12px;font-size:14px;color:var(--text);border:1px solid transparent}
nav a:hover{border-color:var(--border);text-decoration:none}
nav a.active{background:rgba(122,143,122,.14);border-color:rgba(122,143,122,.25)}
.section{padding:32px 0}
.section h1,.section h2{margin:0 0 12px}
.section h1{font-size:32px;line-height:1.15}
.section h2{font-size:22px;line-height:1.25}
.lead{font-size:17px;color:var(--muted);margin:8px 0 0;max-width:72ch}
.panel{background:rgba(255,255,255,.55);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.two-col{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;align-items:start}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 14px;border-radius:14px;border:1px solid var(--border);font-weight:600;font-size:14px;text-decoration:none;cursor:pointer}
.btn:hover{text-decoration:none;filter:brightness(.98)}
.btn-primary{background:var(--sage);color:var(--white);border-color:rgba(0,0,0,.06)}
.btn-primary:hover{background:var(--sage-dark)}
.btn-ghost{background:rgba(255,255,255,.55);color:var(--text)}
.btn-ghost:hover{background:rgba(255,255,255,.75)}
.card{background:rgba(122,143,122,.16);border:1px solid rgba(122,143,122,.25);border-radius:var(--radius);padding:16px}
.card h3{margin:0 0 8px;font-size:17px}
.card p{margin:0 0 10px;color:var(--muted)}
.card a{font-weight:700}
.notice{background:rgba(255,255,255,.55);border:1px dashed rgba(122,143,122,.35);border-radius:var(--radius);padding:14px;color:var(--muted)}
.quote{background:rgba(255,255,255,.6);border-left:6px solid rgba(122,143,122,.55);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.small{font-size:12px;color:var(--muted)}
ul,ol{padding-left:20px;margin:10px 0}
li{margin:6px 0}
img{max-width:100%}
form label{display:block;margin:10px 0 6px;font-weight:600}
input,textarea{width:100%;padding:12px 12px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,.75);font:inherit}
textarea{resize:vertical}
button.btn{background:var(--sage);color:var(--white);border:none}
button.btn:hover{background:var(--sage-dark)}
.cta-band{margin-top:18px;background:rgba(122,143,122,.16);border:1px solid rgba(122,143,122,.25);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.cta-band h2{margin:0 0 8px}
.cta-band p{margin:0;color:var(--muted);max-width:80ch}
.offers-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.offer-featured{grid-column:1/-1;display:grid;grid-template-columns:1.2fr .8fr;gap:14px;align-items:stretch;background:rgba(122,143,122,.16);border:1px solid rgba(122,143,122,.25);border-radius:var(--radius);padding:16px}
.offer-featured .media img{width:100%;height:100%;max-height:260px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--border)}
.offer-featured h3{margin:0 0 8px;font-size:20px}
.offer-featured p{margin:0 0 12px;color:var(--muted)}
.offer-featured .btn-row{margin-top:0}
.footer{padding:22px 0;border-top:1px solid var(--border);background:rgba(239,231,220,.92);color:var(--muted);font-size:14px}
.footer .footer-grid{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.footer .footer-brand{display:flex;align-items:center;gap:10px}
.footer .footer-brand img{width:34px;height:34px;border-radius:12px;object-fit:cover;border:1px solid var(--border);background:var(--white)}
.footer .footer-links{display:flex;flex-direction:column;gap:6px;min-width:220px}
.footer .social-grid{display:flex;gap:10px;flex-wrap:wrap}
.social-tile{display:inline-flex;align-items:center;justify-content:center;padding:10px 12px;border-radius:14px;border:1px solid rgba(122,143,122,.25);background:rgba(122,143,122,.14);font-weight:700;text-decoration:none;color:var(--text)}
.social-tile:hover{filter:brightness(.98);text-decoration:none}
@media (max-width:900px){.two-col{grid-template-columns:1fr}.offers-grid{grid-template-columns:1fr 1fr}.offer-featured{grid-template-columns:1fr}}
@media (max-width:560px){.section{padding:26px 0}.section h1{font-size:28px}nav{gap:8px}nav a{padding:7px 9px}.offers-grid{grid-template-columns:1fr}}

/* Feinschliff: Brand einheitlich + größer */
.brand-denk, .brand-leichter{
  font-family: inherit !important;
  font-weight: 800 !important;
}
.brand-name{ gap: 0 !important; }
.brand .title strong{
  font-size: 22px !important;
  letter-spacing: .2px !important;
}
@media (max-width: 560px){
  .brand .title strong{ font-size: 20px !important; }
}

/* Feinschliff: Footer-Logo größer */
.footer .footer-brand img{
  width: 72px !important;
  height: 72px !important;
  border-radius: 20px !important;
}


/* Header wordmark: Denkleichter (custom typography) */
.brand .brand-wordmark{
  font-size: 34px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.5px;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.brand .brand-denk{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #4B4F55;
  font-weight: 800;
}
.brand .brand-leichter{
  font-family: "Dancing Script", cursive;
  color: #6F8F73;
  font-weight: 700;
}
.brand .brand-sub{
  display:block;
  margin-top: 4px;
  font-size: 13px;
  color: rgba(0,0,0,0.55);
  letter-spacing: 0.2px;
}
@media (max-width: 640px){
  .brand .brand-wordmark{font-size: 28px;}
  .brand .brand-sub{font-size: 12px;}
}
/* Header logo (rectangular) – keep original aspect ratio, do not crop */
.brand-logo-img{
  height:72px !important;
  width:auto !important;
  max-width:none !important;
  object-fit:contain !important;
  border-radius:0 !important;
  border:none !important;
  background:transparent !important;
}
@media (max-width: 640px){
  .brand-logo-img{
    height:54px !important;
  }
}


/* =========================
   Konsistenzrunde 3
   - Abstände Inhalt -> Kontakt -> Footer
   - Einheitliche Secondary Button Styles
   ========================= */
.section + .section{padding-top:0;} /* avoids double vertical gaps between stacked sections */
.section{padding:34px 0;}
.section:last-of-type{padding-bottom:54px;}

h2{margin-top:0; margin-bottom:14px;}
.panel h2{margin-top:0;}

.btn-row{gap:12px; margin-top:16px;}
.btn{min-height:48px;}
.btn-secondary{
  background: transparent;
  border: 1px solid var(--sage);
  color: var(--sage);
}
.btn-secondary:hover{
  background: rgba(111,143,115,0.12);
}

.footer{margin-top:12px;}

/* =========================
   Mobile-Feinschliff
   ========================= */
@media (max-width: 700px){
  .container{padding:0 16px;}

  /* Header / Navigation */
  .navbar{flex-direction:column;align-items:flex-start;gap:12px;}
  .brand{margin-right:0;}
  .nav{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .nav ul{flex-wrap:nowrap;gap:8px;padding-bottom:4px;}
  .nav a{white-space:nowrap;padding:10px 12px;font-size:15px;}

  /* Hero / Headings */
  h1{font-size:34px;line-height:1.15;}
  h2{font-size:24px;}

  /* Panels & Grids */
  .panel{padding:18px;}
  .two-col{grid-template-columns:1fr;}
  .hero-grid{grid-template-columns:1fr;}
  .offer-featured{grid-template-columns:1fr;}
  .offers-grid{grid-template-columns:1fr;}

  /* Buttons */
  .btn-row{flex-direction:column;align-items:stretch;}
  .btn-row .btn{width:100%;text-align:center;}
  .btn{padding:12px 16px;}

  /* Footer */
  .footer-grid{grid-template-columns:1fr;gap:18px;}
  .footer-actions{flex-direction:column;align-items:stretch;}
  .footer-actions .pill{width:100%;text-align:center;}

  /* Embedded map */
  .panel iframe{height:320px;}
}

@media (max-width: 420px){
  h1{font-size:30px;}
  .nav a{font-size:14px;padding:9px 10px;}
  .panel{padding:16px;}
  .panel iframe{height:280px;}
}
.required { color:#8b2f2f; font-weight:700; }
.required-hint { color:#555; }
