/* homepage hover states */
.hh1:hover{filter:brightness(1.05);}
.hh2:hover{transform:translateY(-3px); box-shadow:0 13px 0 #b01259, 0 22px 40px rgba(236,30,121,0.6);}
.hh2:active{transform:translateY(6px); box-shadow:0 4px 0 #b01259, 0 8px 18px rgba(236,30,121,0.45);}
.hh3:hover{opacity:0.85;}

/* ============================================================
   Homepage — Responsive
   Inline-Styles der Startseite werden hier per !important
   für kleinere Viewports überschrieben.
   ============================================================ */

/* ---------- Tablet & darunter ---------- */
@media (max-width:1024px){
  /* HERO: einspaltig */
  .home-hero{grid-template-columns:1fr !important;padding-bottom:40px !important;}
  .home-hero__title span{font-size:52px !important;}
  .home-hero__right{min-height:auto !important;margin-top:26px;}
  .home-hero__right img{position:static !important;width:100% !important;top:auto !important;right:auto !important;}

  /* Gegenüberstellung: gestapelt, Diagonale weg, rechte Spalte gelb + zentriert */
  .home-vs__diag{display:none !important;}
  .home-vs__grid{grid-template-columns:1fr !important;padding:28px 22px 30px !important;}
  .home-vs__col{padding-right:0 !important;}
  .home-vs__col--right{margin:24px auto 0 !important;width:calc(100% - 16px);padding:24px 20px !important;background:#ECE81A;border-radius:12px;}
  .home-vs__col h2{font-size:27px !important;text-wrap:balance;}

  /* Ablauf: 5 Schritte untereinander, Pfeile mittig nach unten */
  .home-steps{flex-direction:column !important;gap:14px !important;align-items:center !important;}
  .home-steps__item{max-width:560px;margin:0 auto;width:100%;}
  .home-steps__arrow{height:auto !important;align-self:center !important;transform:rotate(90deg);}

  /* Garantie-Kasten tiefer, damit Faust/Mund frei bleiben */
  .home-guarantee{bottom:6px !important;right:10px !important;}

  /* Paket + Preis: gestapelt */
  .home-pricing__grid{grid-template-columns:1fr !important;}
  .home-price-num{font-size:96px !important;}

  /* Trigger-Link darf umbrechen */
  .home-trigger-link{font-size:19px !important;white-space:normal !important;gap:14px !important;flex-wrap:wrap;}

  /* pinke Balken: schräg wie Desktop, eng &amp; rough gestapelt, näher am Titel */
  .home-hero__bars{gap:0 !important;align-items:flex-start;margin-top:16px !important;}
  .home-hero__bars span{font-size:20px !important;}
  .home-hero__bars span:nth-child(1){transform:rotate(-1.8deg) !important;}
  .home-hero__bars span:nth-child(2){transform:rotate(-1deg) !important;margin-left:16px !important;margin-top:-3px;}
}

/* ---------- Handy ---------- */
@media (max-width:640px){
  /* einheitlicher Seitenrand */
  main > section{padding-left:20px !important;padding-right:20px !important;}

  .home-hero__title span{font-size:38px !important;}
  .home-intro-h2{font-size:30px !important;}

  /* Vorteile/Features einspaltig */
  .home-feats{grid-template-columns:1fr !important;}
  .home-pricing__left{padding:32px 22px !important;}
  .home-pricing__right{padding:22px 16px 30px !important;}
  .home-price-num{font-size:74px !important;}

  /* Sektions-Überschriften kompakter */
  .home-trigger p:first-child{font-size:26px !important;}
  /* pinke Balken so klein, dass jede Zeile in EINE Zeile passt */
  .home-hero__bars span{font-size:14px !important;white-space:nowrap;}

  /* Hero-Button: kleiner + zentriert (Text mittig) */
  .home-hero__cta{display:block !important;text-align:center;}
  .hh1{width:auto !important;max-width:88vw;font-size:20px !important;padding:15px 22px 21px !important;}
  .hh1 svg{width:100% !important;height:100% !important;inset:-5px -6px !important;}

  /* Garantie-Kasten noch etwas kleiner */
  .home-guarantee{width:210px !important;bottom:6px !important;}

  /* Gegenüberstellung: Text lesbar */
  .home-vs__col span{font-size:16px !important;}

  /* Bonus-Box umbrechbar */
  .home-bonus{padding:18px 18px !important;gap:16px !important;}
  .home-bonus svg{width:40px !important;height:40px !important;}
  .home-bonus__title{white-space:normal !important;font-size:20px !important;}

  /* "Das ist alles dabei" Überschrift + Absatz zentriert */
  .home-pricing__left > h2{display:block !important;text-align:center !important;}
  .home-feats-intro{text-align:center !important;}

  /* Preisblock: gestapelt & lesbar */
  .home-price-row{flex-direction:column !important;align-items:flex-start !important;gap:12px !important;}
  .home-price-alt{font-size:26px !important;}

  /* Checkout-Button kompakter */
  .hh2{font-size:18px !important;padding:16px 16px !important;}

  /* Trigger-Link: Pfeile weg, zentriert, kein durchgehender Strich */
  .home-trigger-link{font-size:18px !important;justify-content:center !important;text-align:center;}
  .home-trigger-link svg{display:none !important;}
  .home-trigger-underline{border-bottom:none !important;}
}

/* sehr schmale Geräte */
@media (max-width:400px){
  .home-hero__title span{font-size:32px !important;}
  .home-price-num{font-size:62px !important;}
  .home-hero__bars span{font-size:12.5px !important;}
}
