/* ============================================================
   GUT GEMACHT! Hundetraining
   Designsystem, 1:1 aus den freigegebenen Vorlagen
   (neue-webseite-gutgemacht / *.dc.html)
   Werte nicht raten - sie stammen exakt aus den Prototypen.
   ============================================================ */

:root{
  --gg-creme:#F7F2E9;      /* Grundfläche */
  --gg-sand:#EBDFC9;       /* Sektionen, Karten */
  --gg-orange:#FF6633;     /* Primär / CTA */
  --gg-orange-d:#E94F1A;   /* Hover, Textlinks */
  --gg-braun:#A67C52;      /* Labels */
  --gg-braun-d:#6B4F35;    /* hervorgehobener Fließtext */
  --gg-dunkel:#3B3835;     /* CTA-Sektion, Footer, Text */
  --gg-gold:#D9BE96;       /* Labels auf dunkel */
  --gg-linie:#DAD6D0;      /* Rahmen, Trennlinien */
  --gg-grau:#7A736B;       /* Sekundärtext */
  --gg-text-2:#4b4744;     /* Fließtext in Listen */
  --gg-footer-linie:#4c4845;
}

/* ---------- Basis ---------- */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body.gg{
  margin:0;
  background:var(--gg-creme);
  color:var(--gg-dunkel);
  font-family:'Open Sans',sans-serif;
  font-size:17px;
  line-height:1.7;
}
:where(body.gg) :where(a){color:inherit;text-decoration:none;}
:where(body.gg) :where(a:hover){color:var(--gg-orange-d);}
body.gg img{max-width:100%;}

.gg-wrap{max-width:1200px;margin:0 auto;padding:0 32px;}
.gg-wrap-wide{max-width:1320px;margin:0 auto;}

/* ---------- Scroll-Reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease;}
[data-reveal][data-in="1"]{opacity:1 !important;transform:none !important;}
[data-reveal][data-delay="1"]{transition-delay:.12s;}
[data-reveal][data-delay="2"]{transition-delay:.24s;}

/* ---------- Buttons ---------- */
.gg-btn{
  display:inline-block;background:var(--gg-orange);color:#fff;
  font-family:'Baloo 2',sans-serif;font-weight:700;
  border-radius:999px;transition:background .25s,transform .25s;
  font-size:17px;padding:14px 32px;
}
.gg-btn:hover{background:var(--gg-orange-d);transform:translateY(-2px);color:#fff;}
.gg-btn--nav{font-size:15px;padding:10px 22px;flex:none;}
.gg-btn--preis{font-size:16px;padding:13px 30px;flex:none;}
.gg-btn--gross{font-size:18px;padding:16px 40px;}

.gg-btn-outline{
  display:inline-block;background:transparent;color:var(--gg-dunkel);
  font-family:'Baloo 2',sans-serif;font-weight:700;font-size:17px;padding:14px 32px;
  border-radius:999px;box-shadow:inset 0 0 0 2px var(--gg-dunkel);
  transition:background .25s,color .25s,transform .25s;
}
.gg-btn-outline:hover{background:var(--gg-dunkel);color:var(--gg-creme);transform:translateY(-2px);}

.gg-btn-outline-hell{
  display:inline-block;background:transparent;color:#fff;
  font-family:'Baloo 2',sans-serif;font-weight:700;font-size:17px;padding:14px 32px;
  border-radius:999px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.85);
  transition:background .25s,color .25s,transform .25s;
}
.gg-btn-outline-hell:hover{background:#fff;color:var(--gg-dunkel);transform:translateY(-2px);}

/* ---------- Header ---------- */
.gg-header{
  position:sticky;top:0;z-index:50;
  background:rgba(247,242,233,.92);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--gg-linie);
}
.gg-nav{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:14px 32px;max-width:1320px;margin:0 auto;
}
.gg-logo{display:block;flex:none;}
.gg-logo img{display:block;height:84px;width:auto;background:transparent;}

.gg-nav-links{
  display:flex;gap:26px;list-style:none;margin:0;padding:0;
  font-weight:500;font-size:16px;flex-wrap:wrap;
}
.gg-nav-links > li{position:relative;}
.gg-nav-links > li > a{padding-bottom:4px;border-bottom:2px solid transparent;}
.gg-nav-links > li > a:hover{border-bottom-color:var(--gg-orange);color:var(--gg-dunkel);}
.gg-nav-links > li.current-menu-item > a,
.gg-nav-links > li.current-menu-ancestor > a,
.gg-nav-links > li.gg-aktiv > a{border-bottom:2px solid var(--gg-orange);}

/* Mega-Dropdown */
.gg-hat-sub > .gg-dropdown{display:none;position:absolute;top:100%;left:-14px;padding-top:16px;min-width:290px;z-index:60;}
.gg-hat-sub:hover > .gg-dropdown,
.gg-hat-sub:focus-within > .gg-dropdown{display:block;}
.gg-dropdown-inner{
  background:var(--gg-creme);border:1px solid var(--gg-linie);border-radius:16px;
  box-shadow:0 20px 44px rgba(43,40,38,.18);padding:10px;
}
.gg-dropdown-inner :where(a){display:block;padding:9px 18px;border-radius:10px;color:var(--gg-dunkel);}
.gg-dropdown-inner :where(a:hover){background:var(--gg-sand);color:var(--gg-dunkel);}
.gg-dd-kicker{
  display:block;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-dd-titel{display:block;font-size:15px;}
.gg-dropdown-alle{
  display:block;margin-top:6px;padding:9px 18px;font-size:15px;font-weight:700;
  color:var(--gg-orange-d);border-top:1px solid var(--gg-linie);border-radius:0 0 10px 10px;
}

@media(max-width:1000px){ .gg-nav-links{display:none !important;} }

/* ---------- Hero: Angebotsseiten ---------- */
.gg-hero{position:relative;min-height:62vh;display:flex;align-items:flex-end;overflow:hidden;}
.gg-hero__bild{position:absolute;inset:0;}
.gg-hero__bild img{display:block;width:100%;height:100%;object-fit:cover;}
.gg-hero__scrim{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(43,40,38,.42) 0%,rgba(43,40,38,.34) 22%,rgba(43,40,38,.56) 62%,rgba(43,40,38,.82) 100%);
}
.gg-hero__inhalt{
  position:relative;pointer-events:none;width:100%;max-width:1320px;margin:0 auto;
  padding:60px 48px 56px;
}
.gg-hero__label{
  margin:0 0 12px;font-size:14px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gg-gold);font-weight:700;text-shadow:0 1px 14px rgba(43,40,38,.6);
}
.gg-hero__inhalt h1{
  margin:0 0 18px;font-family:'Baloo 2',sans-serif;font-weight:700;line-height:1.15;
  font-size:clamp(34px,4.2vw,54px);color:#fff;max-width:16em;
  text-shadow:0 2px 24px rgba(43,40,38,.45);text-wrap:pretty;
}
.gg-hero__subline{
  margin:0;max-width:34em;font-size:19px;color:rgba(247,242,233,.94);
  text-shadow:0 1px 14px rgba(43,40,38,.5);text-wrap:pretty;
}

/* ---------- Hero: Startseite ---------- */
.gg-hero-start{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;}
.gg-hero-start .gg-hero__bild img{object-position:0% 100%;}
.gg-hero-start__scrim{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(43,40,38,0) 0%,rgba(43,40,38,.30) 34%,rgba(43,40,38,.62) 66%,rgba(43,40,38,.80) 100%);
}
.gg-hero-start__inhalt{
  position:relative;pointer-events:none;width:100%;max-width:1320px;margin:0 auto;
  padding:90px 48px 150px;display:flex;justify-content:flex-end;
}
.gg-hero-start__box{max-width:600px;color:var(--gg-creme);}
.gg-hero-start__label{
  margin:0 0 14px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gg-gold);font-weight:700;font-size:17px;
}
.gg-hero-start__box h1{
  margin:0 0 24px;font-family:'Baloo 2',sans-serif;font-weight:700;line-height:1.15;
  font-size:clamp(38px,4.4vw,58px);color:#fff;
  text-shadow:0 2px 24px rgba(43,40,38,.45);text-wrap:pretty;
}
.gg-hero-start__box h1 em{font-style:normal;color:var(--gg-orange);}
.gg-hero-start__text{
  margin:0 0 36px;font-size:19px;color:rgba(247,242,233,.92);max-width:30em;
  text-shadow:0 1px 14px rgba(43,40,38,.5);text-wrap:pretty;
}
.gg-hero-start__btns{display:flex;gap:18px;flex-wrap:wrap;align-items:center;pointer-events:auto;}
@media(max-width:1150px){
  /* Schmale Bildschirme: Es bleibt nur ein Viertel der Bildbreite übrig.
     14% rückt den Ausschnitt so weit nach links, dass Corinna und Luke
     vollständig drin sind - bei 22% wurde Luke links angeschnitten. */
  .gg-hero-start .gg-hero__bild img{object-position:14% 50% !important;}
  .gg-hero-start__scrim{
    background:linear-gradient(180deg,rgba(43,40,38,.30) 0%,rgba(43,40,38,.62) 55%,rgba(43,40,38,.82) 100%) !important;
  }
}

/* ---------- Intro-Sektion (zentriert) ---------- */
.gg-intro{background:var(--gg-creme);padding:100px 0 70px;}
.gg-intro__kopf{max-width:1200px;margin:0 auto;padding:0 32px;text-align:center;}
.gg-label{
  margin:0 0 16px;font-size:13px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gg-braun);font-weight:700;
}
.gg-intro__kopf h2{
  margin:0 auto 22px;max-width:22em;font-weight:700;line-height:1.22;letter-spacing:-.01em;
  font-size:clamp(26px,2.9vw,38px);text-wrap:pretty;
}
.gg-intro__lead{margin:0;font-size:clamp(19px,1.9vw,23px);color:var(--gg-braun-d);text-wrap:pretty;}
.gg-trenner{width:64px;height:3px;background:var(--gg-orange);border-radius:2px;margin:38px auto 0;}

/* ---------- Karten (Sand) ---------- */
.gg-karten{
  max-width:1200px;margin:70px auto 0;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:26px;
}
.gg-karte{background:var(--gg-sand);border-radius:22px;padding:36px 32px 38px;}
.gg-karte__label{
  margin:0 0 10px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-karte h3{margin:0 0 14px;font-weight:700;line-height:1.25;font-size:22px;text-wrap:pretty;}
.gg-karte p{margin:0 0 16px;font-size:16px;color:var(--gg-braun-d);text-wrap:pretty;}
.gg-karte p:last-child{margin-bottom:0;}
.gg-karte strong{color:var(--gg-dunkel);}

/* ---------- Hinweiskasten unter den Karten ----------
   Ein wichtiger Hinweis gehoert nicht in eine vierte Karte: die Karten
   stehen zu dritt nebeneinander, eine vierte rutscht allein in die erste
   Spalte und sieht aus wie ein Fehler. Der Hinweis bekommt deshalb einen
   eigenen Kasten ueber die volle Breite - weiss, mit orangem Balken links,
   damit er sich klar von den Karten absetzt. */
.gg-hinweis-flaeche{max-width:1200px;margin:26px auto 0;padding:0 32px;}
.gg-hinweis{
  background:#fff;border:1px solid var(--gg-linie);border-left:5px solid var(--gg-orange);
  border-radius:22px;padding:34px 34px 36px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:32px;align-items:start;
}
.gg-hinweis__label{
  margin:0 0 10px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-orange-d);
}
.gg-hinweis h3{margin:0;font-weight:700;line-height:1.25;font-size:22px;text-wrap:pretty;}
.gg-hinweis__text p{margin:0 0 16px;font-size:16px;color:var(--gg-text-2);text-wrap:pretty;}
.gg-hinweis__text p:last-child{margin-bottom:0;}
.gg-hinweis__text strong{color:var(--gg-dunkel);}

/* ---------- FAQ-Karten (weiss) ---------- */
.gg-faq{background:var(--gg-creme);padding:0 0 100px;}
.gg-faq__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px;
}
.gg-faq__karte{background:#fff;border:1px solid var(--gg-linie);border-radius:22px;padding:32px 30px 34px;}
.gg-faq__karte h3{margin:0 0 12px;font-weight:700;line-height:1.3;font-size:20px;}
.gg-faq__karte p{margin:0;font-size:15.5px;color:var(--gg-grau);text-wrap:pretty;}

/* ---------- Lern-Sektion (Sand, oben gerundet) ---------- */
.gg-lernen{background:var(--gg-sand);padding:100px 0 110px;border-radius:60px 60px 0 0;}
.gg-lernen h2{
  margin:0 0 46px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);max-width:16em;text-wrap:pretty;
}
.gg-lernen__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:26px;}
.gg-lernen__block{background:var(--gg-creme);border-radius:22px;padding:38px 34px 40px;}
.gg-nummer{margin:0 0 12px;font-family:'Baloo 2',sans-serif;font-size:30px;font-weight:700;color:var(--gg-orange);line-height:1;}
.gg-lernen__block h3{margin:0 0 8px;font-weight:700;line-height:1.2;font-size:22px;}
.gg-lernen__vor{margin:0 0 22px;font-size:15.5px;color:var(--gg-grau);text-wrap:pretty;}

.gg-liste{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px;color:var(--gg-text-2);font-size:16px;}
.gg-liste li{display:flex;gap:12px;}
.gg-liste li::before{content:"\2014";color:var(--gg-orange);font-weight:700;flex:none;}

/* ---------- Auf einen Blick + Vorteilsbox ---------- */
.gg-blick{background:var(--gg-creme);padding:100px 0;}
.gg-blick__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:60px;align-items:start;
}
.gg-blick h2{margin:0 0 30px;font-weight:700;line-height:1.2;letter-spacing:-.01em;font-size:clamp(26px,2.6vw,34px);}
.gg-blick__tabelle{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1px;
  background:var(--gg-linie);border-top:1px solid var(--gg-linie);border-bottom:1px solid var(--gg-linie);
}
.gg-blick__zelle{background:var(--gg-creme);padding:24px 22px 26px;display:flex;flex-direction:column;gap:10px;}
.gg-blick__label{margin:0;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--gg-braun);}
.gg-blick__wert{margin:0;font-size:16px;color:var(--gg-text-2);text-wrap:pretty;line-height:1.55;}

.gg-vorteile{background:var(--gg-dunkel);color:var(--gg-creme);border-radius:22px;padding:38px 34px 40px;}
.gg-vorteile__label{margin:0 0 12px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--gg-gold);}
.gg-vorteile h3{margin:0 0 22px;font-weight:700;line-height:1.2;font-size:22px;color:var(--gg-creme);}
.gg-vorteile .gg-liste{color:var(--gg-linie);}

/* ---------- Preise ---------- */
.gg-preise{background:var(--gg-creme);padding:0 0 100px;}
.gg-preise__box{background:var(--gg-sand);border-radius:26px;padding:48px 44px 44px;}
.gg-preise__label{margin:0 0 12px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--gg-braun);}
.gg-preise__box h2{margin:0 0 34px;font-weight:700;line-height:1.2;letter-spacing:-.01em;font-size:clamp(26px,2.8vw,36px);max-width:16em;text-wrap:pretty;}
.gg-preise__tabelle{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;
  background:var(--gg-gold);border-top:1px solid var(--gg-gold);border-bottom:1px solid var(--gg-gold);
}
.gg-preise__zelle{background:var(--gg-sand);padding:26px 24px 28px;display:flex;flex-direction:column;gap:8px;min-height:100%;}
.gg-preise__leistung{margin:0;font-weight:700;font-size:18px;color:var(--gg-dunkel);text-wrap:pretty;}
.gg-preise__dauer{margin:0;font-size:15px;color:var(--gg-braun-d);}
.gg-preise__preis{margin:14px 0 0;margin-top:auto;padding-top:8px;font-family:'Baloo 2',sans-serif;font-weight:700;font-size:30px;line-height:1;color:var(--gg-orange);}
.gg-preise__fuss{margin-top:26px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center;}
.gg-preise__fuss p{margin:0;font-size:14.5px;color:var(--gg-braun-d);max-width:44em;text-wrap:pretty;}

/* ---------- Bildleiste über den Preisen ----------
   Vier Fotos in einer Reihe. Den Abstand nach oben liefert der Abschnitt
   davor; nach unten braucht der Preisblock einen eigenen, weil er selbst
   keinen mitbringt. */
.gg-leiste{background:var(--gg-creme);padding:0;}
.gg-leiste__titel{
  margin:0 0 12px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(26px,2.8vw,36px);text-wrap:pretty;
}
.gg-leiste__lead{margin:0 0 34px;max-width:34em;color:var(--gg-braun-d);text-wrap:pretty;}
.gg-leiste__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.gg-leiste__bild{border-radius:18px;overflow:hidden;aspect-ratio:4/3;background:var(--gg-sand);}
.gg-leiste__bild img{display:block;width:100%;height:100%;object-fit:cover;}
.gg-leiste + .gg-preise{padding-top:100px;}

/* ---------- Profile in sozialen Netzwerken ----------
   Ein Baustein, zwei Auftritte: in der Fusszeile Symbol plus Name,
   auf der Kontaktseite runde Knoepfe nur mit Symbol. Die Symbole sind
   direkt im HTML und uebernehmen deshalb die Textfarbe der Umgebung. */
.gg-profile{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px 18px;}
.gg-profile a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;}
.gg-profile__icon{display:inline-flex;flex:none;}
.gg-profile__svg{display:block;}

/* Nur fuer Screenreader - sichtbar ist dort das Symbol. */
.gg-profile .screen-reader-text{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
}

/* Fusszeile */
.gg-profile--fuss{margin-top:8px;gap:10px 16px;}
.gg-profile--fuss a{transition:color .25s ease;}

/* Kontaktseite */
.gg-kontakt__profile-label{
  margin:22px 0 12px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-profile--rund{gap:12px;}
.gg-profile--rund a{
  width:46px;height:46px;border-radius:50%;justify-content:center;gap:0;
  border:1px solid var(--gg-gold);color:var(--gg-braun-d);background:transparent;
  transition:background-color .25s ease,border-color .25s ease,color .25s ease,transform .25s ease;
}
.gg-profile--rund a:hover{
  background:var(--gg-orange);border-color:var(--gg-orange);color:#fff;transform:translateY(-2px);
}

/* ---------- CTA-Sektion (dunkel) ---------- */
.gg-cta{background:var(--gg-dunkel);color:var(--gg-creme);padding:110px 0;text-align:center;}
.gg-cta__label{margin:0 0 14px;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--gg-gold);font-weight:700;}
.gg-cta h2{color:var(--gg-creme);font-weight:700;line-height:1.2;letter-spacing:-.01em;font-size:clamp(30px,3.4vw,46px);max-width:18em;margin:0 auto 18px;text-wrap:pretty;}
.gg-cta__text{color:var(--gg-linie);max-width:36em;margin:0 auto 38px;text-wrap:pretty;}
.gg-cta__zusatz{margin:18px 0 0;font-size:14px;color:var(--gg-grau);}

/* ---------- Footer ---------- */
.gg-footer{background:var(--gg-dunkel);color:var(--gg-grau);border-top:1px solid var(--gg-footer-linie);padding:44px 0;}
.gg-footer__inner{max-width:1200px;margin:0 auto;padding:0 32px;display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;font-size:14.5px;}
.gg-footer strong{color:var(--gg-creme);font-weight:700;font-size:16px;display:block;margin-bottom:6px;}
.gg-footer a{color:var(--gg-grau);}
.gg-footer a:hover{color:var(--gg-creme);}

/* ---------- Angebots-Kacheln (Startseite, Übersicht) ---------- */
.gg-kachel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px;}
.gg-kachel{
  background:var(--gg-creme);border-radius:22px;overflow:hidden;position:relative;
  transition:opacity .8s ease,transform .8s ease,box-shadow .3s ease;
}
.gg-kachel:hover{box-shadow:0 24px 44px rgba(107,79,53,.22);}
.gg-kachel__bild{aspect-ratio:4/3;position:relative;background:linear-gradient(150deg,var(--gg-gold),var(--gg-braun));}
.gg-kachel__bild img{display:block;width:100%;height:100%;object-fit:cover;}
.gg-kachel__badge{
  position:absolute;bottom:16px;left:16px;background:var(--gg-orange);color:#fff;
  font-family:'Baloo 2',sans-serif;font-size:13px;font-weight:700;padding:6px 14px;
  border-radius:999px;box-shadow:0 6px 16px rgba(233,79,26,.35);pointer-events:none;
}
.gg-kachel__text{padding:26px 26px 30px;}
.gg-kachel__label{margin:0 0 8px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--gg-braun);}
.gg-kachel h3{margin:0 0 10px;font-weight:700;line-height:1.2;letter-spacing:-.01em;font-size:22px;}
.gg-kachel__kurz{margin:0 0 18px;font-size:15.5px;color:var(--gg-grau);text-wrap:pretty;}
.gg-kachel__link{font-weight:700;color:var(--gg-orange-d);font-size:15.5px;}

/* Kopfzeile einer Sektion: Titel links, Button rechts */
.gg-sektionskopf{display:flex;justify-content:space-between;align-items:end;margin-bottom:50px;gap:30px;flex-wrap:wrap;}
.gg-sektionskopf h2{margin:0;font-weight:700;line-height:1.2;letter-spacing:-.01em;font-size:clamp(28px,3vw,40px);max-width:14em;text-wrap:pretty;}

/* ============================================================
   Mobile Navigation
   Formensprache der Vorlage: Cremeflaeche, Sandton beim Antippen,
   zweizeilige Einträge mit Label darüber, Pill-Button.
   ============================================================ */
.gg-burger{
  display:none;flex:none;width:44px;height:44px;padding:10px;
  background:transparent;border:0;cursor:pointer;
  flex-direction:column;justify-content:center;gap:6px;
  -webkit-tap-highlight-color:transparent;
}
.gg-burger__balken{
  display:block;width:24px;height:2px;background:var(--gg-dunkel);border-radius:2px;
  transition:transform .25s ease,opacity .2s ease;
}
.gg-burger[aria-expanded="true"] .gg-burger__balken:nth-child(1){transform:translateY(8px) rotate(45deg);}
.gg-burger[aria-expanded="true"] .gg-burger__balken:nth-child(2){opacity:0;}
.gg-burger[aria-expanded="true"] .gg-burger__balken:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

/* Menü-Knopf: keine Fremdfarben.
   Das Eltern-Theme färbt Buttons in den Zuständen :hover, :focus und
   :active ein - auf dem iPhone blieb nach dem Antippen ein farbiger
   Kasten hinter dem X stehen. Hier für alle Zustände festgenagelt.
   Der Tastatur-Fokus bleibt sichtbar, aber in unserer Farbe. */
.gg-burger,
.gg-burger:hover,
.gg-burger:focus,
.gg-burger:active,
.gg-burger[aria-expanded="true"]{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:inherit !important;
}
.gg-burger:focus{outline:none;}
.gg-burger:focus-visible{
  outline:2px solid var(--gg-dunkel);outline-offset:2px;border-radius:8px;
}

.gg-mnav{
  display:none;background:var(--gg-creme);border-top:1px solid var(--gg-linie);
  box-shadow:0 20px 44px rgba(43,40,38,.18);
  padding:8px 20px 24px;
  max-height:calc(100vh - 112px);overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.gg-mnav[hidden]{display:none;}
.gg-mnav.gg-offen{display:block;}

.gg-mnav__liste{list-style:none;margin:0;padding:0;}
.gg-mnav__item{border-bottom:1px solid var(--gg-linie);}
.gg-mnav__item:last-child{border-bottom:0;}
.gg-mnav__item--aktiv > .gg-mnav__link,
.gg-mnav__item--aktiv > details > summary{color:var(--gg-orange-d);}

.gg-mnav__link,
.gg-mnav__item > details > summary{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 4px;font-size:17px;font-weight:600;color:var(--gg-dunkel);
  cursor:pointer;list-style:none;
}
.gg-mnav__item > details > summary::-webkit-details-marker{display:none;}
.gg-mnav__item > details > summary::after{
  content:"";width:9px;height:9px;flex:none;margin-left:12px;
  border-right:2px solid var(--gg-braun);border-bottom:2px solid var(--gg-braun);
  transform:rotate(45deg);transition:transform .25s ease;
}
.gg-mnav__item > details[open] > summary::after{transform:rotate(-135deg);}

.gg-mnav__eltern-link{
  display:block;padding:12px 4px 14px;font-size:15px;font-weight:700;color:var(--gg-orange-d);
}
.gg-mnav__sub{
  padding:2px 0 14px;display:flex;flex-direction:column;gap:2px;
}
.gg-mnav__sublink{
  display:block;padding:10px 14px;border-radius:10px;color:var(--gg-dunkel);
  background:transparent;transition:background .2s ease;
}
.gg-mnav__sublink:active,
.gg-mnav__sublink:hover{background:var(--gg-sand);color:var(--gg-dunkel);}
.gg-mnav__alle{
  display:block;margin-top:6px;padding:12px 14px;font-size:15px;font-weight:700;
  color:var(--gg-orange-d);border-top:1px solid var(--gg-linie);
}
.gg-mnav__cta{display:block;margin-top:20px;text-align:center;}

@media(max-width:1000px){
  .gg-burger{display:flex;}
  .gg-nav > .gg-btn--nav{display:none;}   /* wandert in die mobile Navigation */
}
body.gg-nav-offen{overflow:hidden;}

/* ============================================================
   Mobile Feinabstimmung
   Nur Abstände und Größen der vorgegebenen Gestaltung -
   keine zusätzlichen Elemente, keine anderen Farben.
   ============================================================ */
@media(max-width:900px){
  .gg-nav{padding:12px 20px;}
  .gg-logo img{height:64px;}

  .gg-hero{min-height:56vh;}
  .gg-hero__inhalt{padding:44px 20px 40px;}
  .gg-hero__subline{font-size:17px;}

  .gg-hero-start{min-height:auto;}
  .gg-hero-start__inhalt{padding:64px 20px 72px;justify-content:flex-start;}
  .gg-hero-start__box{max-width:none;}
  .gg-hero-start__label{font-size:15px;}
  .gg-hero-start__text{font-size:17px;margin-bottom:28px;}
  .gg-hero-start__btns{gap:12px;}
  .gg-hero-start__btns > a{width:100%;text-align:center;}

  .gg-wrap{padding:0 20px;}
  .gg-intro{padding:64px 0 48px;}
  .gg-karten{margin-top:44px;padding:0 20px;gap:20px;}
  .gg-karte{padding:28px 24px 30px;}
  .gg-hinweis-flaeche{margin-top:20px;padding:0 20px;}
  .gg-hinweis{padding:26px 24px 28px;gap:20px;}
  .gg-faq{padding:0 0 64px;}
  .gg-faq__grid{padding:0 20px;gap:20px;}
  .gg-faq__karte{padding:26px 24px 28px;}

  .gg-lernen{padding:64px 0 72px;border-radius:36px 36px 0 0;}
  .gg-lernen h2{margin-bottom:32px;}
  .gg-lernen__grid{gap:20px;}
  .gg-lernen__block{padding:30px 26px 32px;}

  .gg-blick{padding:64px 0;}
  .gg-blick__grid{padding:0 20px;gap:36px;}
  .gg-vorteile{padding:30px 26px 32px;}

  .gg-leiste__grid{grid-template-columns:repeat(2,1fr);gap:14px;}
  .gg-leiste__lead{margin-bottom:24px;}
  .gg-leiste + .gg-preise{padding-top:64px;}

  .gg-preise{padding:0 0 64px;}
  .gg-preise__box{padding:32px 24px 30px;border-radius:22px;}
  .gg-preise__fuss{gap:18px;}
  .gg-preise__fuss .gg-btn{width:100%;text-align:center;}

  .gg-cta{padding:72px 0;}

  .gg-sektionskopf{margin-bottom:32px;gap:20px;}
  .gg-sektionskopf .gg-btn-outline{width:100%;text-align:center;}

  .gg-footer{padding:36px 0;}
  .gg-footer__inner{padding:0 20px;gap:24px;flex-direction:column;}
  .gg-profile--rund a{width:42px;height:42px;}
}

/* ---------- Startseiten-Hero auf dem Handy ----------------------
   Auf schmalen Bildschirmen bleibt vom Querformat-Foto nur ein
   Ausschnitt übrig - Überschrift und Text lägen dann quer über
   Corinna und Luke. Deshalb wird der Kopfbereich hier gestapelt:
   oben das Bild, darunter der Text auf hellem Grund.

   Der Block muss NACH dem 900px-Block stehen, sonst gewinnen dessen
   Innenabstände. Er ging beim Umbau einmal verloren - falls das
   Handy-Layout wieder überlappt, fehlt vermutlich genau er.
   ----------------------------------------------------------------- */
@media(max-width:700px){

  /* Angebotsseiten: gleiche Logik wie bei der Startseite.
     Das Querformat-Foto steht oben, Überschrift und Satz darunter
     auf Creme - sonst liegt der Text quer über dem Hund. */
  .gg-hero{display:block;min-height:0;background:var(--gg-creme);}
  .gg-hero .gg-hero__bild{position:relative;inset:auto;height:46vh;min-height:280px;}
  .gg-hero__scrim{
    inset:0 0 auto;height:46vh;min-height:280px;
    background:linear-gradient(180deg,rgba(43,40,38,0) 74%,rgba(247,242,233,.9) 98%,var(--gg-creme) 100%) !important;
  }
  .gg-hero__inhalt{padding:26px 20px 44px;}
  .gg-hero__label{color:var(--gg-braun);text-shadow:none;}
  .gg-hero__inhalt h1{color:var(--gg-dunkel);text-shadow:none;max-width:none;font-size:clamp(30px,8vw,38px);}
  .gg-hero__subline{color:var(--gg-braun-d);text-shadow:none;}

  /* Startseite */
  .gg-hero-start{display:block;min-height:0;}
  .gg-hero-start .gg-hero__bild{position:relative;inset:auto;height:60vh;min-height:360px;}
  .gg-hero-start__scrim{
    inset:0 0 auto;height:60vh;min-height:360px;
    background:linear-gradient(180deg,rgba(43,40,38,0) 78%,rgba(247,242,233,.9) 99%,var(--gg-creme) 100%) !important;
  }
  .gg-hero-start__inhalt{padding:26px 20px 48px;}
  .gg-hero-start__label{color:var(--gg-braun);}
  .gg-hero-start__box{color:var(--gg-dunkel);}
  .gg-hero-start__box h1{color:var(--gg-dunkel);text-shadow:none;font-size:clamp(32px,9vw,40px);}
  .gg-hero-start__text{color:var(--gg-braun-d);text-shadow:none;}
  body.gg .gg-hero-start__btns .gg-btn-outline-hell{
    color:var(--gg-dunkel) !important;box-shadow:inset 0 0 0 2px var(--gg-dunkel);
  }
  body.gg .gg-hero-start__btns .gg-btn-outline-hell:hover{
    background:var(--gg-dunkel);color:var(--gg-creme) !important;
  }
}


@media(max-width:520px){
  .gg-logo img{height:56px;}
  .gg-blick__tabelle{grid-template-columns:1fr;}
  .gg-preise__tabelle{grid-template-columns:1fr;}
  .gg-preise__zelle{flex-direction:row;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;}
  .gg-preise__preis{margin:0;padding-top:0;}
}

/* Wer Bewegung reduziert haben möchte, bekommt keine Einblendung. */
@media(prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important;}
  .gg-btn,.gg-btn-outline,.gg-btn-outline-hell,.gg-kachel{transition:none !important;}
}

/* ============================================================
   Startseite
   Werte 1:1 aus "Gutgemacht Startseite.dc.html"
   ============================================================ */

/* ---------- Mein Ansatz ---------- */
.gg-ansatz{background:var(--gg-creme);padding:110px 0 90px;}
.gg-ansatz__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:70px;align-items:start;
}
.gg-ansatz h2{
  margin:0;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);text-wrap:pretty;
}
.gg-ansatz__text p{margin:0 0 20px;color:var(--gg-text-2);text-wrap:pretty;}
.gg-ansatz__text p:last-child{margin-bottom:0;}
.gg-ansatz__text strong{color:var(--gg-dunkel);}
.gg-ansatz__text em{font-style:normal;color:var(--gg-orange-d);font-weight:700;}

/* ---------- Angebote ---------- */
.gg-angebote{background:var(--gg-sand);padding:100px 0 110px;border-radius:60px 60px 0 0;}

/* ---------- Zitat ---------- */
.gg-zitat{background:var(--gg-sand);padding:0 0 90px;}
.gg-zitat blockquote{
  max-width:820px;margin:0 auto;text-align:center;font-style:italic;
  font-size:clamp(22px,2.6vw,30px);font-weight:500;line-height:1.4;
  color:var(--gg-braun-d);text-wrap:pretty;
}
.gg-zitat cite{
  display:block;margin-top:14px;font-style:normal;font-size:15px;color:var(--gg-grau);
}

/* ---------- Kundenstimmen ---------- */
.gg-stimmen{background:var(--gg-creme);padding:110px 0;}
.gg-stimmen__titel{
  margin:0 0 56px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);text-align:center;
}
.gg-stimmen__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px;}
.gg-stimmen__mehr{display:flex;justify-content:center;margin-top:46px;}

.gg-stimme{
  background:#fff;border:1px solid var(--gg-linie);border-radius:22px;
  padding:30px 28px 32px;
}
.gg-stimme__zeichen{
  display:block;height:34px;font-weight:700;font-size:52px;line-height:.2;color:var(--gg-gold);
}
.gg-stimme__text{font-size:15.5px;color:var(--gg-text-2);margin:14px 0 22px;text-wrap:pretty;}
.gg-stimme__person{display:flex;align-items:center;gap:12px;}
.gg-stimme__bild{width:56px;height:56px;flex:none;border-radius:50%;overflow:hidden;}
.gg-stimme__bild img{display:block;width:100%;height:100%;object-fit:cover;}
.gg-stimme__person strong{font-size:15px;display:block;line-height:1.2;}
.gg-stimme__person span{font-size:13px;color:var(--gg-grau);}

/* ---------- Über mich ---------- */
.gg-ueber{background:var(--gg-sand);padding:110px 0;border-radius:60px 60px 0 0;}
.gg-ueber__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:70px;align-items:center;
}
.gg-ueber__bild{
  aspect-ratio:3/3.6;border-radius:26px;overflow:hidden;
  background:linear-gradient(150deg,var(--gg-gold),var(--gg-braun));
  transform:rotate(-2deg);box-shadow:0 30px 60px rgba(107,79,53,.25);
}
.gg-ueber__bild img{display:block;width:100%;height:100%;object-fit:cover;}
.gg-ueber__titel{
  margin:0 0 22px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);
}
.gg-ueber__text p{margin:0 0 18px;color:var(--gg-text-2);text-wrap:pretty;}
.gg-ueber__text p:last-child{margin-bottom:28px;}

/* ---------- Feinabstimmung mobil ---------- */
@media(max-width:900px){
  .gg-ansatz{padding:72px 0 60px;}
  .gg-ansatz__grid{gap:36px;padding:0 20px;}
  .gg-angebote{padding:70px 0 76px;border-radius:40px 40px 0 0;}
  .gg-zitat{padding:0 0 64px;}
  .gg-stimmen{padding:72px 0;}
  .gg-stimmen__titel{margin-bottom:36px;}
  .gg-stimmen__mehr{margin-top:32px;}
  .gg-stimmen__mehr .gg-btn-outline{width:100%;text-align:center;}
  .gg-ueber{padding:72px 0;border-radius:40px 40px 0 0;}
  .gg-ueber__grid{gap:36px;padding:0 20px;}
  .gg-ueber__bild{transform:none;box-shadow:0 18px 36px rgba(107,79,53,.2);}
}
@media(max-width:520px){
  .gg-stimme{padding:24px 22px 26px;}
}

/* ============================================================
   Übersichtsseite Training
   Werte 1:1 aus "Training.dc.html"
   ============================================================ */

/* ---------- Schlichter Seitenkopf (ohne großes Bild) ---------- */
.gg-seitenkopf{background:var(--gg-sand);padding:90px 0 100px;}
.gg-seitenkopf__label{
  margin:0 0 14px;font-size:17px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gg-braun);font-weight:700;
}
.gg-seitenkopf h1{
  margin:0 0 22px;font-family:'Baloo 2',sans-serif;font-weight:700;line-height:1.15;
  font-size:clamp(34px,4vw,52px);max-width:16em;text-wrap:pretty;
}
.gg-seitenkopf__lead{
  margin:0;max-width:34em;font-size:19px;color:var(--gg-text-2);text-wrap:pretty;
}

/* ---------- Angebots-Übersicht ---------- */
.gg-uebersicht{background:var(--gg-creme);padding:100px 0 60px;}
.gg-uebersicht__titel{
  margin:0 0 40px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(26px,2.6vw,34px);
}
.gg-kachel-grid--weit{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}

/* ---------- Betreuung für Stammkunden ---------- */
.gg-betreuung{background:var(--gg-creme);padding:60px 0 110px;}
.gg-betreuung__titel{
  margin:0 0 12px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(26px,2.6vw,34px);
}
.gg-betreuung__lead{margin:0 0 40px;max-width:36em;color:var(--gg-grau);text-wrap:pretty;}
.gg-betreuung__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:26px;}
.gg-betreuung__karte{
  background:var(--gg-sand);border-radius:22px;padding:32px 30px 34px;
  display:flex;flex-direction:column;
}
.gg-betreuung__label{
  margin:0 0 8px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-betreuung__karte h3{margin:0 0 10px;font-weight:700;line-height:1.2;font-size:22px;}
.gg-betreuung__text{
  margin:0 0 18px;font-size:15.5px;color:var(--gg-braun-d);text-wrap:pretty;flex:1;
}
.gg-textlink{font-weight:700;color:var(--gg-orange-d);font-size:15.5px;}

@media(max-width:900px){
  .gg-seitenkopf{padding:64px 0 70px;}
  .gg-uebersicht{padding:64px 0 40px;}
  .gg-uebersicht__titel{margin-bottom:28px;}
  .gg-betreuung{padding:40px 0 72px;}
  .gg-betreuung__lead{margin-bottom:28px;}
  .gg-betreuung__karte{padding:26px 24px 28px;}
}

/* ============================================================
   Seite Über mich
   Werte 1:1 aus "Ueber-mich.dc.html"
   ============================================================ */

/* ---------- Kopfbereich mit Porträt ---------- */
.gg-ueberkopf{background:var(--gg-sand);padding:90px 0 100px;}
.gg-ueberkopf__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:70px;align-items:center;
}
.gg-ueberkopf h1{
  margin:0 0 22px;font-family:'Baloo 2',sans-serif;font-weight:700;line-height:1.15;
  font-size:clamp(34px,4vw,52px);text-wrap:pretty;
}
.gg-ueberkopf__lead{margin:0;max-width:34em;font-size:19px;color:var(--gg-text-2);text-wrap:pretty;}

/* ---------- Mein Weg ---------- */
.gg-weg{background:var(--gg-creme);padding:110px 0 90px;}
.gg-weg__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:70px;align-items:start;
}
.gg-weg__titel{
  margin:0 0 34px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);text-wrap:pretty;
}
.gg-weg__text p{margin:0 0 20px;color:var(--gg-text-2);text-wrap:pretty;}
.gg-weg__text p:last-child{margin-bottom:0;}
.gg-weg__text strong{color:var(--gg-dunkel);}

/* ---------- Bildergalerie ---------- */
.gg-galerie{
  position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/3;
  background:var(--gg-sand);box-shadow:0 22px 46px rgba(107,79,53,.2);
}
.gg-galerie__bild{position:absolute;inset:0;}
.gg-galerie__bild img{display:block;width:100%;height:100%;object-fit:cover;}
.gg-galerie__pfeil{
  position:absolute;top:50%;transform:translateY(-50%);
  width:44px;height:44px;border:0;cursor:pointer;border-radius:999px;
  background:rgba(247,242,233,.9);color:var(--gg-dunkel);font-size:20px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 16px rgba(43,40,38,.22);
}
.gg-galerie__pfeil:hover{background:var(--gg-creme);}
.gg-galerie__pfeil--zurueck{left:14px;}
.gg-galerie__pfeil--vor{right:14px;}
.gg-galerie__punkte{
  position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:8px;
}
.gg-galerie__punkt{
  width:9px;height:9px;padding:0;border:0;cursor:pointer;border-radius:999px;
  background:rgba(247,242,233,.55);transition:background .25s;
}
.gg-galerie__punkt[aria-current="true"]{background:var(--gg-creme);}
.gg-galerie__unterschrift{margin:14px 0 0;font-size:14px;color:var(--gg-grau);}

/* ---------- Qualifikation ---------- */
.gg-qualifikation{margin-top:38px;padding-top:32px;border-top:1px solid var(--gg-linie);}
.gg-qualifikation__label{
  margin:0 0 18px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
/* Variante der Standardliste: etwas enger, Fließtextgröße */
.gg-liste--strich{gap:12px;font-size:17px;}

/* ---------- Worauf du dich verlassen kannst ---------- */
.gg-versprechen{background:var(--gg-sand);padding:100px 0 110px;border-radius:60px 60px 0 0;}
.gg-versprechen__titel{
  margin:0 0 46px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);max-width:16em;text-wrap:pretty;
}
.gg-versprechen__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:26px;}
.gg-versprechen__karte{background:var(--gg-creme);border-radius:22px;padding:32px 30px 34px;}
.gg-versprechen__label{
  margin:0 0 10px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-versprechen__karte h3{margin:0 0 10px;font-weight:700;line-height:1.2;font-size:21px;}
.gg-versprechen__text{margin:0;font-size:15.5px;color:var(--gg-grau);text-wrap:pretty;}

/* Zitat auf Sandfläche (Über mich) */
.gg-zitat--sand{background:var(--gg-sand);padding:0 0 100px;}

/* ---------- Partner ---------- */
.gg-partner{background:var(--gg-creme);padding:100px 0 110px;}
.gg-partner__kopf{margin-bottom:46px;}
.gg-partner__kopf h2{
  margin:0 0 16px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);max-width:16em;text-wrap:pretty;
}
.gg-partner__lead{margin:0;max-width:34em;color:var(--gg-text-2);text-wrap:pretty;}
.gg-partner__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:22px;}
.gg-partner__karte{
  background:#fff;border:1px solid var(--gg-linie);border-radius:22px;
  padding:26px 24px 24px;display:flex;flex-direction:column;gap:16px;
  transition:box-shadow .3s ease,border-color .3s ease;
}
.gg-partner__karte:hover{
  box-shadow:0 20px 40px rgba(107,79,53,.18);border-color:var(--gg-gold);color:var(--gg-dunkel);
}
.gg-partner__logo{height:110px;display:flex;align-items:center;justify-content:center;}
.gg-partner__logo img{display:block;max-width:100%;max-height:110px;width:auto;height:auto;}
.gg-partner__karte strong{display:block;font-size:16.5px;line-height:1.3;}
.gg-partner__rolle{display:block;font-size:14.5px;color:var(--gg-grau);margin-bottom:8px;}
.gg-partner__link{font-size:14.5px;font-weight:700;color:var(--gg-orange-d);}

@media(max-width:900px){
  .gg-ueberkopf{padding:64px 0 72px;}
  .gg-ueberkopf__grid{gap:36px;padding:0 20px;}
  .gg-weg{padding:72px 0 60px;}
  .gg-weg__grid{gap:44px;padding:0 20px;}
  .gg-weg__titel{margin-bottom:24px;}
  .gg-versprechen{padding:72px 0;border-radius:40px 40px 0 0;}
  .gg-versprechen__titel{margin-bottom:32px;}
  .gg-versprechen__karte{padding:26px 24px 28px;}
  .gg-zitat--sand{padding:0 0 72px;}
  .gg-partner{padding:72px 0;}
  .gg-partner__kopf{margin-bottom:32px;}
}

/* ============================================================
   Seite Kundenstimmen
   Werte 1:1 aus "Kundenstimmen.dc.html"
   ============================================================ */
.gg-stimmenliste{background:var(--gg-creme);padding:100px 0 40px;}
.gg-stimmenliste__inner{
  max-width:1240px;margin:0 auto;padding:0 32px;
  display:flex;flex-direction:column;gap:90px;
}
.gg-grossstimme{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:56px;align-items:center;
}
.gg-grossstimme__bild{
  border-radius:26px;overflow:hidden;aspect-ratio:1/1;background:var(--gg-sand);
  box-shadow:0 26px 54px rgba(107,79,53,.2);
}
.gg-grossstimme__bild img{display:block;width:100%;height:100%;object-fit:cover;}
.gg-grossstimme--bild-rechts .gg-grossstimme__bild{order:2;}
.gg-grossstimme h3{
  margin:20px 0 0;font-family:'Baloo 2',sans-serif;font-weight:700;
  font-size:clamp(21px,2.1vw,26px);line-height:1.25;color:var(--gg-dunkel);text-wrap:pretty;
}
.gg-grossstimme__inhalt p{margin:14px 0 16px;font-size:17px;color:var(--gg-text-2);text-wrap:pretty;}
.gg-grossstimme__inhalt p:last-child{margin-bottom:24px;}
.gg-grossstimme__name{
  margin:0;font-family:'Baloo 2',sans-serif;font-weight:700;font-size:21px;color:var(--gg-dunkel);
}
/* Der Abschluss-Block steht auf dieser Seite etwas tiefer */
.gg-stimmenliste + .gg-cta{margin-top:60px;}

@media(max-width:900px){
  .gg-stimmenliste{padding:64px 0 24px;}
  .gg-stimmenliste__inner{gap:56px;padding:0 20px;}
  .gg-grossstimme{gap:28px;}
  /* Auf schmalen Bildschirmen steht das Bild immer oben */
  .gg-grossstimme--bild-rechts .gg-grossstimme__bild{order:0;}
  .gg-stimmenliste + .gg-cta{margin-top:40px;}
}

/* ============================================================
   Seite Kontakt
   Werte 1:1 aus "Kontakt.dc.html"
   ============================================================ */
.gg-kontakt{background:var(--gg-creme);padding:100px 0 110px;}
.gg-kontakt__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:60px;align-items:start;
}

/* ---------- Formularkasten ---------- */
.gg-formular{
  background:#fff;border:1px solid var(--gg-linie);border-radius:22px;
  padding:38px 36px 40px;
}
.gg-formular h2{margin:0 0 20px;font-weight:700;line-height:1.2;letter-spacing:-.01em;font-size:26px;}
.gg-hinweis{margin:0;color:var(--gg-grau);font-size:15.5px;}

/* WPForms an die Vorlage angleichen */
.gg-formular .wpforms-container,
.gg-formular .wpforms-form{margin:0;}
.gg-formular .wpforms-field{padding:0 0 20px;}
.gg-formular .wpforms-field-label{
  font-size:14.5px !important;font-weight:600 !important;color:var(--gg-braun-d) !important;
  margin-bottom:7px !important;
}
.gg-formular .wpforms-field-sublabel,
.gg-formular .wpforms-field-description{font-size:13px !important;color:var(--gg-grau) !important;}
.gg-formular input[type=text],
.gg-formular input[type=email],
.gg-formular input[type=tel],
.gg-formular input[type=url],
.gg-formular input[type=number],
.gg-formular select,
.gg-formular textarea{
  width:100% !important;max-width:none !important;
  font-family:'Open Sans',sans-serif;font-size:16px;font-weight:400;color:var(--gg-dunkel);
  padding:13px 16px;border:1px solid var(--gg-linie);border-radius:12px;
  background:var(--gg-creme);outline:none;box-shadow:none;
}
.gg-formular textarea{resize:vertical;}
.gg-formular input:focus,
.gg-formular select:focus,
.gg-formular textarea:focus{border-color:var(--gg-orange);}
.gg-formular button[type=submit],
.gg-formular .wpforms-submit{
  align-self:flex-start;border:0;cursor:pointer;
  background:var(--gg-orange);color:#fff;
  font-family:'Baloo 2',sans-serif;font-weight:700;font-size:17px;
  padding:14px 32px;border-radius:999px;
  transition:background .25s,transform .25s;
}
.gg-formular button[type=submit]:hover,
.gg-formular .wpforms-submit:hover{background:var(--gg-orange-d);transform:translateY(-2px);}

/* ---------- Rechte Spalte ---------- */
.gg-kontakt__spalte{display:flex;flex-direction:column;gap:26px;}
.gg-kontakt__box{border-radius:22px;padding:34px 32px 36px;}
.gg-kontakt__box--sand{background:var(--gg-sand);}
.gg-kontakt__box--weiss{background:#fff;border:1px solid var(--gg-linie);}
.gg-kontakt__label{
  margin:0 0 10px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-kontakt__box h3{margin:0 0 14px;font-weight:700;line-height:1.2;font-size:22px;}
.gg-kontakt__links{display:flex;flex-direction:column;gap:8px;font-size:16.5px;}
.gg-kontakt__links a{font-weight:700;color:var(--gg-orange-d);}
.gg-kontakt__adresse{margin:0 0 6px;color:var(--gg-text-2);}
.gg-kontakt__zusatz{margin:0;font-size:15.5px;color:var(--gg-grau);text-wrap:pretty;}
.gg-kontakt__bild{
  border-radius:22px;overflow:hidden;aspect-ratio:16/10;
  background:linear-gradient(150deg,var(--gg-gold),var(--gg-braun));
}
.gg-kontakt__bild img{display:block;width:100%;height:100%;object-fit:cover;}

/* ---------- Dunkler Hinweis unten ---------- */
.gg-hinweisblock{background:var(--gg-dunkel);color:var(--gg-creme);padding:90px 0;text-align:center;}
.gg-hinweisblock h2{
  color:var(--gg-creme);font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(26px,3vw,38px);max-width:20em;margin:0 auto 18px;text-wrap:pretty;
}

@media(max-width:900px){
  .gg-kontakt{padding:64px 0 72px;}
  .gg-kontakt__grid{gap:32px;padding:0 20px;}
  .gg-formular{padding:28px 24px 30px;}
  .gg-kontakt__box{padding:26px 24px 28px;}
  .gg-hinweisblock{padding:64px 0;}
}

/* ============================================================
   Seite Veranstaltungen / Impulse
   Werte 1:1 aus "Angebot-Veranstaltungen.dc.html"
   ============================================================ */
.gg-seitenkopf--schmal{padding:80px 0 70px;}

/* ---------- Übersichtskarten ---------- */
.gg-termine{background:var(--gg-creme);padding:70px 0 100px;}
.gg-termine__grid{
  max-width:1200px;margin:0 auto;padding:0 32px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:26px;
}
.gg-termin{
  background:#fff;border:1px solid var(--gg-linie);border-radius:22px;
  padding:32px 30px 30px;display:flex;flex-direction:column;
  transition:box-shadow .3s ease;
}
.gg-termin:hover{box-shadow:0 24px 44px rgba(107,79,53,.18);}
.gg-termin__art{
  margin:0 0 10px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-termin h3{
  margin:0 0 4px;font-family:'Baloo 2',sans-serif;font-weight:700;
  line-height:1.15;font-size:26px;
}
.gg-termin__unter{margin:0 0 20px;font-size:16px;color:var(--gg-braun-d);text-wrap:pretty;}
.gg-termin__liste{
  margin:0 0 22px;padding:0;list-style:none;display:flex;flex-direction:column;
  gap:9px;font-size:15px;color:var(--gg-grau);flex:1;
}
.gg-termin__liste li{display:flex;gap:10px;}
.gg-termin__liste li::before{content:"\2014";color:var(--gg-orange);font-weight:700;flex:none;}
.gg-termin__zeile{
  display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:14px 0;border-top:1px solid var(--gg-linie);border-bottom:1px solid var(--gg-linie);
  margin-bottom:20px;
}
.gg-termin__wann{font-size:14px;font-weight:600;color:var(--gg-braun);text-wrap:pretty;}
.gg-termin__preis{
  font-family:'Baloo 2',sans-serif;font-weight:700;font-size:22px;
  color:var(--gg-dunkel);white-space:nowrap;
}
.gg-termin__aktionen{display:flex;gap:14px;flex-wrap:wrap;align-items:center;}
.gg-btn--klein{font-size:16px;padding:12px 26px;}

/* ---------- Detailabschnitte ---------- */
.gg-detail{padding:100px 0;}
.gg-detail--sand{background:var(--gg-sand);border-radius:60px 60px 0 0;}
.gg-detail--creme{background:var(--gg-creme);}
/* Zwei cremefarbene Abschnitte hintereinander brauchen oben keinen Abstand */
.gg-detail--creme + .gg-detail--creme{padding-top:0;}
.gg-detail__kopf{max-width:44em;}
.gg-detail__kopf h2{
  margin:0 0 22px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);text-wrap:pretty;
}
.gg-detail__text p{margin:0 0 18px;color:var(--gg-text-2);text-wrap:pretty;}
.gg-detail__text p:last-child{margin-bottom:0;}
.gg-detail__text strong{color:var(--gg-dunkel);}

/* Bauform "reich": Einleitung über der ganzen Breite, darunter zwei
   Kartenspalten - links die Liste, rechts Eckdaten und dunkle Box. */
.gg-detail__grid{
  margin-top:52px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:26px;align-items:start;
}
.gg-detail__spalte{display:flex;flex-direction:column;gap:26px;}

/* Bauform "schlank": Einleitung links, eine Karte rechts. */
.gg-detail__paar{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:60px;align-items:start;
}
.gg-detail__paar .gg-detail__kopf{max-width:none;}

/* Die Karten nehmen immer den Gegenton des Abschnitts, damit sie sich
   vom Hintergrund abheben - creme auf Sand, Sand auf Creme. */
.gg-detail__karte,
.gg-eckdaten{border-radius:22px;}
.gg-detail__karte{padding:38px 34px 40px;}
.gg-eckdaten{padding:32px 30px 34px;}
.gg-detail--sand .gg-detail__karte,
.gg-detail--sand .gg-eckdaten{background:var(--gg-creme);}
.gg-detail--creme .gg-detail__karte,
.gg-detail--creme .gg-eckdaten{background:var(--gg-sand);}
.gg-detail--creme .gg-detail__karte .gg-liste{color:var(--gg-braun-d);}

.gg-detail__karte h3{margin:0 0 8px;font-weight:700;line-height:1.2;font-size:22px;}
.gg-detail__karte .gg-label{margin:0 0 16px;}
.gg-detail__lead{margin:0 0 22px;font-size:15.5px;color:var(--gg-grau);text-wrap:pretty;}

.gg-eckdaten__label{
  margin:0 0 16px;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-eckdaten__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:20px;}
.gg-eckdaten__feld{
  margin:0 0 4px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--gg-braun);
}
.gg-eckdaten__wert{margin:0;font-size:15.5px;line-height:1.5;color:var(--gg-text-2);text-wrap:pretty;}
.gg-vorteile__nachsatz{margin:20px 0 0;font-size:15px;color:var(--gg-gold);text-wrap:pretty;}

/* ---------- Galerie aus den letzten Kursen ---------- */
.gg-kursgalerie{background:var(--gg-sand);padding:100px 0 70px;border-radius:60px 60px 0 0;}
.gg-kursgalerie__titel{
  margin:0 0 12px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(28px,3vw,40px);
}
.gg-kursgalerie__lead{margin:0 0 46px;max-width:34em;color:var(--gg-braun-d);text-wrap:pretty;}
.gg-kursgalerie__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;}
.gg-kursgalerie__bild{
  border-radius:18px;overflow:hidden;aspect-ratio:3/4;background:var(--gg-gold);
}
.gg-kursgalerie__bild img{display:block;width:100%;height:100%;object-fit:cover;}

/* Auf der Veranstaltungsseite folgt der Preisblock direkt auf die Galerie.
   Der Preiskasten steht selbst auf Sand - und der Preisblock bringt sonst
   keinen eigenen Abstand nach oben mit, weil auf den Angebotsseiten die
   Sektion davor (Creme) den Abstand liefert. Hier lief deshalb die Sandflaeche
   der Galerie fast bis an den Sandkasten heran: darunter blieb ein breiter,
   leerer Sandstreifen und der Kasten klebte an der Farbkante.
   Also: Die Galerie schliesst enger unter den Bildern ab, der Preisblock
   bekommt seinen gewohnten Abstand in Creme selbst. */
.gg-kursgalerie + .gg-preise{padding-top:100px;}

@media(max-width:900px){
  .gg-seitenkopf--schmal{padding:60px 0 50px;}
  .gg-termine{padding:48px 0 64px;}
  .gg-termine__grid{padding:0 20px;}
  .gg-termin{padding:26px 24px 26px;}
  .gg-detail{padding:64px 0;}
  .gg-detail--sand{border-radius:40px 40px 0 0;}
  .gg-detail__grid{margin-top:36px;gap:20px;}
  .gg-detail__spalte{gap:20px;}
  .gg-detail__paar{gap:36px;}
  .gg-detail__karte{padding:28px 24px 30px;}
  .gg-eckdaten{padding:26px 24px 28px;}
  .gg-kursgalerie{padding:64px 0 48px;border-radius:40px 40px 0 0;}
  .gg-kursgalerie__lead{margin-bottom:30px;}
  .gg-kursgalerie + .gg-preise{padding-top:64px;}
}
@media(max-width:520px){
  .gg-termin__aktionen .gg-btn{width:100%;text-align:center;}
}

/* ============================================================
   Textseiten (Impressum, Datenschutz und alles ohne eigene Vorlage)
   ============================================================ */
.gg-textseite{background:var(--gg-creme);padding:70px 0 100px;}
.gg-textseite__inhalt{max-width:760px;margin:0 auto;padding:0 32px;}
.gg-textseite__inhalt > *{max-width:100%;}
.gg-textseite__inhalt p{margin:0 0 20px;color:var(--gg-text-2);text-wrap:pretty;}
.gg-textseite__inhalt h2{
  margin:44px 0 14px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  font-size:clamp(24px,2.4vw,30px);color:var(--gg-dunkel);
}
.gg-textseite__inhalt h3{margin:32px 0 10px;font-weight:700;line-height:1.2;font-size:21px;}
.gg-textseite__inhalt h4{margin:26px 0 8px;font-weight:700;font-size:18px;}
.gg-textseite__inhalt ul,
.gg-textseite__inhalt ol{margin:0 0 20px;padding-left:22px;color:var(--gg-text-2);}
.gg-textseite__inhalt li{margin-bottom:8px;}
.gg-textseite__inhalt a{color:var(--gg-orange-d);font-weight:600;}
.gg-textseite__inhalt a:hover{text-decoration:underline;}
.gg-textseite__inhalt strong{color:var(--gg-dunkel);}
.gg-textseite__inhalt img{border-radius:18px;height:auto;}
.gg-textseite__inhalt table{
  width:100%;border-collapse:collapse;margin:0 0 24px;font-size:16px;
}
.gg-textseite__inhalt th,
.gg-textseite__inhalt td{
  text-align:left;padding:10px 12px;border-bottom:1px solid var(--gg-linie);
  vertical-align:top;
}
.gg-textseite__inhalt blockquote{
  margin:0 0 24px;padding:18px 24px;background:var(--gg-sand);border-radius:18px;
  color:var(--gg-braun-d);
}
/* Vorspann: der einleitende Satz über dem ersten Abschnitt */
.gg-textseite__inhalt .gg-vorspann{
  font-size:19px;line-height:1.6;color:var(--gg-braun-d);margin-bottom:8px;
}
/* Quellenhinweis am Ende einer Rechtsseite */
.gg-textseite__inhalt .gg-quelle{
  margin-top:44px;padding-top:20px;border-top:1px solid var(--gg-linie);
  font-size:15px;color:var(--gg-grau);
}

@media(max-width:900px){
  .gg-textseite{padding:48px 0 64px;}
  .gg-textseite__inhalt{padding:0 20px;}
}

/* ============================================================
   Vorrang vor Elementor

   Elementor setzt global ".elementor-kit-6 a { color: … }" und gewinnt
   damit gegen unsere Grundregeln. Solange Elementor aktiv bleibt
   (Impressum, Datenschutz), werden die Linkfarben hier verbindlich
   gesetzt. Das !important gilt bewusst nur fuer color - Layout und
   Abstaende bleiben normal ueberschreibbar.
   ============================================================ */
body.gg a{color:inherit !important;text-decoration:none;}
body.gg a:hover{color:var(--gg-orange-d) !important;}

/* Buttons */
body.gg .gg-btn{color:#fff !important;}
body.gg .gg-btn:hover{background:var(--gg-orange-d);color:#fff !important;}
body.gg .gg-btn-outline{color:var(--gg-dunkel) !important;}
body.gg .gg-btn-outline:hover{color:var(--gg-creme) !important;}
body.gg .gg-btn-outline-hell{color:#fff !important;}
body.gg .gg-btn-outline-hell:hover{color:var(--gg-dunkel) !important;}

/* Navigation */
body.gg .gg-nav-links > li > a,
body.gg .gg-nav-links > li > a:hover{color:var(--gg-dunkel) !important;}
body.gg .gg-dropdown-inner a,
body.gg .gg-dropdown-inner a:hover{color:var(--gg-dunkel) !important;}
body.gg .gg-dropdown-alle{color:var(--gg-orange-d) !important;}
body.gg .gg-mnav__eltern-link,
body.gg .gg-mnav__sublink,
body.gg .gg-mnav__item > details > summary{color:var(--gg-dunkel) !important;}

/* Textlinks */
body.gg .gg-kachel__link,
body.gg .gg-textlink,
body.gg .gg-partner__link,
body.gg .gg-kontakt__links a,
body.gg .gg-textseite__inhalt a{color:var(--gg-orange-d) !important;}
body.gg .gg-partner__karte,
body.gg .gg-partner__karte:hover,
body.gg .gg-kachel,
body.gg .gg-kachel:hover{color:var(--gg-dunkel) !important;}

/* Fusszeile */
body.gg .gg-footer a{color:var(--gg-creme) !important;}

/* ------------------------------------------------------------------
   Links mitten im Fließtext

   Die Regel weiter oben setzt alle Links auf die Textfarbe zurück -
   für Kacheln, Knöpfe und Navigation ist das richtig, für einen Link
   in einem Satz nicht: er muss als Link erkennbar sein, sonst klickt
   ihn niemand. Deshalb hier gezielt für die Textbereiche zurückgeholt.
   ------------------------------------------------------------------ */
body.gg .gg-karte a,
body.gg .gg-hinweis__text a,
body.gg .gg-ansatz__text a,
body.gg .gg-ueber__text a,
body.gg .gg-weg__text a,
body.gg .gg-detail__text a,
body.gg .gg-fragen__antwort a{
  color:var(--gg-orange-d) !important;
  font-weight:600;
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:1px;
  text-decoration-color:rgba(233,79,26,.45);
  transition:text-decoration-color .2s ease;
}
body.gg .gg-karte a:hover,
body.gg .gg-hinweis__text a:hover,
body.gg .gg-ansatz__text a:hover,
body.gg .gg-ueber__text a:hover,
body.gg .gg-weg__text a:hover,
body.gg .gg-detail__text a:hover,
body.gg .gg-fragen__antwort a:hover{
  text-decoration-color:var(--gg-orange-d);
}
body.gg .gg-footer a:hover{color:#fff !important;}

/* ============================================================
   Häufige Fragen
   ============================================================ */
.gg-fragen{background:var(--gg-creme);padding:88px 0;}
.gg-fragen__kopf{max-width:680px;margin:0 auto 40px;text-align:center;}
.gg-fragen__kopf h2{
  margin:6px 0 0;font-weight:700;line-height:1.12;letter-spacing:-.015em;
  font-size:clamp(28px,3.2vw,40px);color:var(--gg-dunkel);
}
.gg-fragen__lead{margin:14px 0 0;color:var(--gg-text-2);font-size:17px;}

.gg-fragen__liste{max-width:760px;margin:0 auto;}
.gg-fragen__eintrag{
  border-bottom:1px solid var(--gg-linie);
  padding:0;
}
.gg-fragen__eintrag:first-child{border-top:1px solid var(--gg-linie);}

.gg-fragen__frage{
  display:flex;align-items:flex-start;gap:16px;
  padding:22px 0;cursor:pointer;list-style:none;
  font-family:'Baloo 2',sans-serif;
  font-weight:700;font-size:19px;line-height:1.35;color:var(--gg-dunkel);
}
.gg-fragen__frage::-webkit-details-marker{display:none;}
.gg-fragen__frage::after{
  content:"";flex:0 0 auto;margin-left:auto;margin-top:6px;
  width:11px;height:11px;border-right:2px solid var(--gg-orange);
  border-bottom:2px solid var(--gg-orange);
  transform:rotate(45deg);transition:transform .22s ease;
}
.gg-fragen__eintrag[open] .gg-fragen__frage::after{transform:rotate(-135deg);margin-top:10px;}
.gg-fragen__frage:hover{color:var(--gg-orange-d);}
.gg-fragen__frage:focus-visible{outline:2px solid var(--gg-orange);outline-offset:3px;border-radius:6px;}

.gg-fragen__antwort{padding:0 40px 24px 0;color:var(--gg-text-2);}
.gg-fragen__antwort p{margin:0 0 14px;line-height:1.65;}
.gg-fragen__antwort p:last-child{margin-bottom:0;}
.gg-fragen__antwort a{color:var(--gg-orange-d);font-weight:600;}

@media(max-width:900px){
  .gg-fragen{padding:56px 0;}
  .gg-fragen__frage{font-size:17px;padding:18px 0;}
  .gg-fragen__antwort{padding-right:0;}
}
