/* ──────────────────────────────────────────────────────────────
   GastroSafe App · eigene Gestaltung
   Echte Bildschirme der App in einem schlichten Rahmen. Jede
   Funktion steht neben ihrem Bildschirm, abwechselnd links und rechts.
   ────────────────────────────────────────────────────────────── */

.a-hero{padding-top:clamp(2.2rem,5vw,4.5rem)}
.a-hero__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(2.5rem,6vw,5rem);align-items:center}
@media(min-width:900px){.a-hero__grid{grid-template-columns:1.3fr 1fr}}
.a-hero h1{font-size:clamp(2.3rem,5vw,3.9rem);line-height:1;letter-spacing:-.045em}
.a-hero h1 span{color:var(--green)}
.a-hero__lede{margin-top:1.3rem;font-size:clamp(1.0625rem,1.7vw,1.25rem);line-height:1.55;max-width:31rem}
.a-price{margin-top:1.6rem;padding-top:1rem;border-top:2px solid var(--ink);max-width:31rem;color:var(--ink-2)}
.a-price b{font-size:1.4rem;letter-spacing:-.03em;color:var(--ink);margin-right:.35rem}
.a-hero .hero__actions{margin-top:1.4rem}
.a-stores{margin-top:1.2rem;font-size:.9375rem;color:var(--muted)}
.a-stores a{color:var(--ink);font-weight:600;text-underline-offset:.25em;text-decoration-color:var(--green)}

/* Handyrahmen */
.phone{margin:0 auto;width:min(100%,280px);padding:10px;background:#15191d;border-radius:34px;
  box-shadow:0 30px 60px -30px rgba(20,25,30,.45)}
.phone img{width:100%;border-radius:25px;display:block}
.phone--cut{padding-bottom:0;border-radius:34px 34px 0 0}
.phone--cut img{border-radius:25px 25px 0 0}

/* Funktionen */
.feat{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem;align-items:center;padding-block:clamp(2rem,4vw,3rem);border-top:1px solid var(--line)}
.feat:first-of-type{border-top:2px solid var(--ink)}
@media(min-width:860px){
  .feat{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4rem}
  .feat:nth-of-type(even) .feat__img{order:-1}
}
.feat h3{font-size:clamp(1.4rem,2.4vw,1.85rem);letter-spacing:-.03em;line-height:1.15}
.feat p{margin-top:.7rem;color:var(--ink-2);max-width:30rem}
.feat ul{list-style:none;margin:1rem 0 0;padding:0;border-top:1px solid var(--line);max-width:30rem}
.feat li{padding:.55rem 0;border-bottom:1px solid var(--line);font-weight:500;color:var(--ink)}
.feat__img{background:var(--paper-2);padding-top:2rem;overflow:hidden;max-height:420px}

/* Weitere Punkte */
.more3{display:grid;gap:1.4rem}
@media(min-width:860px){.more3{grid-template-columns:repeat(3,1fr);gap:2.6rem}}
.more3 div{border-top:3px solid var(--green);padding-top:.9rem}
.more3 b{display:block;font-size:1.125rem;color:var(--ink)}
.more3 p{margin-top:.35rem;font-size:.9688rem;color:var(--ink-2)}

/* Dashboard und App */
.duo{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
@media(min-width:860px){.duo{grid-template-columns:1fr 1fr}}
.duo article{padding:clamp(1.4rem,3vw,2rem);background:var(--paper-2);display:flex;flex-direction:column;align-items:flex-start}
.duo small{font-size:.875rem;font-weight:600;color:var(--green)}
.duo h3{margin-top:.3rem;font-size:1.5rem;letter-spacing:-.03em}
.duo p{margin:.5rem 0 1.3rem;color:var(--ink-2);max-width:30rem}
.duo .btn{margin-top:auto}
.duo__login{margin-top:1.2rem;color:var(--ink-2)}

/* Preis */
.a-plan{display:grid;border:2px solid var(--ink)}
@media(min-width:860px){.a-plan{grid-template-columns:1fr 1.2fr}}
.a-plan__main{padding:clamp(1.5rem,3.5vw,2.4rem);border-bottom:1px solid var(--line)}
@media(min-width:860px){.a-plan__main{border-bottom:0;border-right:1px solid var(--line)}}
.a-plan__big{font-size:clamp(2.6rem,5vw,3.8rem);font-weight:700;letter-spacing:-.05em;line-height:1;color:var(--ink)}
.a-plan__per{margin-top:.5rem;color:var(--ink-2)}
.a-plan__main .btn{margin-top:1.4rem}
.a-plan ul{list-style:none;margin:0;padding:clamp(1rem,2.5vw,1.6rem) clamp(1.5rem,3.5vw,2.4rem)}
.a-plan li{padding:.8rem 0;border-bottom:1px solid var(--line);color:var(--ink)}
.a-plan li:last-child{border-bottom:0;color:var(--muted)}

@media(max-width:600px){
  .a-hero{padding-top:1.6rem}
  .a-hero h1{font-size:2.2rem}
  .phone{width:min(100%,240px)}
  .feat__img{max-height:340px}
  .a-plan__main .btn{display:block;text-align:center}
}
