/* ==========================================================================
   Kunzelmann & Göricke – Haus & Gartenservice
   Gemeinsames Stylesheet für alle Seiten
   ========================================================================== */

*{box-sizing:border-box;}
body{margin:0;}
img{max-width:100%;}

.gk-page{
  font-family:'Hanken Grotesk',sans-serif;
  color:#1c2614;
  background:#f6f7f2;
}

/* ---------- Navigation ---------------------------------------------------- */
.gk-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,0.96);
  backdrop-filter:blur(8px);
  border-bottom:1px solid #e7eadd;
}
.gk-nav-link{
  position:relative;padding:9px 14px;border-radius:9px;
  font-weight:600;font-size:15px;text-decoration:none;
  color:#36412a;background:transparent;
}
.gk-nav-link:hover{background:#f3f8e9;color:#3f6b16;}
.gk-nav-link.active{font-weight:700;color:#3f6b16;background:#eef6df;}

.gk-mlink{
  display:block;padding:13px 8px;border-radius:8px;
  font-weight:600;font-size:17px;text-decoration:none;
  color:#22300f;background:transparent;
}
.gk-mlink.active{font-weight:700;color:#3f6b16;background:#eef6df;}

/* Mobiles Menü – reine CSS-Umschaltung über eine versteckte Checkbox */
.gk-menu-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.gk-burger{
  display:none;width:44px;height:44px;border:1.5px solid #d4dcc4;border-radius:10px;
  background:#fff;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px;
}
.gk-burger span{display:block;width:20px;height:2px;background:#15240c;border-radius:2px;}
.gk-mobile-menu{
  display:none;border-top:1px solid #e7eadd;background:#fff;padding:12px 24px 20px;
}
.gk-menu-toggle:checked ~ .gk-mobile-menu{display:block;}

/* ---------- Hover-Hilfsklassen (ersetzen die alten style-hover-Attribute) - */
.h-call:hover{border-color:#8DC63F;background:#f3f8e9;}
.h-dark:hover{background:#22380f;}
.h-green:hover{background:#9bd34c;}
.h-wa:hover{background:#33df74;}
.h-lift{transition:transform .15s,box-shadow .15s;}
.h-lift:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(21,36,12,0.1);}
.h-soft:hover{background:#f4f9ea;}
.h-outline:hover{border-color:#8DC63F;background:#f3f8e9;}
.h-foot:hover{color:#8DC63F;}

/* ---------- Kontaktformular ---------------------------------------------- */
.gk-input{
  width:100%;padding:13px 15px;border:1.5px solid #d9e0cc;border-radius:11px;
  font-family:'Hanken Grotesk',sans-serif;font-size:15.5px;color:#1c2614;background:#fff;
  outline:none;transition:border-color .15s,box-shadow .15s;
}
.gk-input:focus{border-color:#8DC63F;box-shadow:0 0 0 3px rgba(141,198,63,0.18);}
.gk-input::placeholder{color:#9aa589;}

/* ---------- Rechtstexte (Impressum / Datenschutz) ------------------------ */
.gk-legal h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:24px;color:#15240c;margin:38px 0 12px;letter-spacing:-0.01em;}
.gk-legal h3{font-family:'Archivo',sans-serif;font-weight:700;font-size:17px;color:#2c3d1a;margin:24px 0 6px;}
.gk-legal p{font-size:16px;line-height:1.7;color:#43503a;margin:0 0 12px;}
.gk-legal ul{margin:0 0 12px;padding-left:22px;}
.gk-legal li{font-size:16px;line-height:1.7;color:#43503a;margin-bottom:5px;}
.gk-legal a{color:#5a9217;font-weight:600;}
.gk-ph{background:#f3f6ec;border:1px dashed #b9c79c;border-radius:5px;padding:1px 7px;color:#3f5226;font-weight:600;font-size:0.95em;}

/* Lange Überschriften (z. B. "Gebäudereinigung") dürfen umbrechen und die
   Flex-Zeile schrumpfen, damit auf schmalen Handys nichts überläuft. */
.gk-srow h2{min-width:0;overflow-wrap:break-word;}

/* ==========================================================================
   Responsive – Überschreibungen der Inline-Styles benötigen !important
   ========================================================================== */
/* Navigation: schaltet wegen der 5 Menuepunkte schon frueher aufs Burger-Menue um,
   damit Logo, Links und Buttons nie zusammengequetscht werden. */
@media (max-width:1080px){
  .gk-desktop-nav,.gk-desktop-cta{display:none !important;}
  .gk-burger{display:flex !important;}
}
@media (max-width:900px){
  .gk-hero{grid-template-columns:1fr !important;gap:40px !important;}
  .gk-cards{grid-template-columns:1fr 1fr !important;}
  .gk-why-grid{grid-template-columns:1fr 1fr !important;}
  .gk-steps{grid-template-columns:1fr !important;}
  .gk-cta{grid-template-columns:1fr !important;}
  .gk-why{padding:44px 28px !important;}
  .gk-ba{grid-template-columns:1fr !important;max-width:420px;margin-left:auto;margin-right:auto;}
}
@media (max-width:860px){
  .gk-srow{grid-template-columns:1fr !important;}
  .gk-srow > div{order:0 !important;}
  .gk-srow > div:last-child{padding:30px 26px !important;}
  .gk-srow h2{font-size:23px !important;}
  .gk-about{grid-template-columns:1fr !important;gap:36px !important;}
  .gk-val{grid-template-columns:1fr 1fr !important;}
  .gk-region{grid-template-columns:1fr !important;}
  .gk-contact{grid-template-columns:1fr !important;}
}
@media (max-width:760px){
  .gk-foot-grid{grid-template-columns:1fr 1fr !important;gap:32px !important;}
}
@media (max-width:560px){
  .gk-cards{grid-template-columns:1fr !important;}
  .gk-why-grid{grid-template-columns:1fr !important;}
}
@media (max-width:520px){
  .gk-frow{grid-template-columns:1fr !important;}
}
@media (max-width:480px){
  .gk-val{grid-template-columns:1fr !important;}
}
@media (max-width:460px){
  .gk-foot-grid{grid-template-columns:1fr !important;}
}