/* Entdecken-Seite: „die Mail ist die Tür, die Seite ist der Raum" (Marco, 11.08.2026).
   Trägt die Sektionen des visuellen Newsletters als Website — dieselben Bilder aus
   /assets/img/email/newsletter/, dieselbe Reizlast-Regel: eine Fläche pro Bereich,
   ein Akzent, Text immer auf ruhigem Grund. */

.bn-entdecken{background:#faf7f2}
.bn-entdecken .bn-container{max-width:720px;margin:0 auto;padding:0 20px}

/* Hero */
.bn-ent-hero{padding:56px 0 28px;text-align:center}
.bn-ent-hero h1{font-family:"Lexend",system-ui,sans-serif;font-size:clamp(28px,5vw,40px);font-weight:700;letter-spacing:-.5px;color:#1f2328;margin:0 0 12px;text-wrap:balance}
.bn-ent-hero p{font-size:17px;line-height:1.6;color:#3a4047;margin:0 auto;max-width:34em}

/* Store-Zeile, oben und unten identisch */
.bn-ent-stores{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;padding:22px 0 8px}
.bn-ent-store{display:inline-block;background:#7d0845;color:#fff;font-family:"Lexend",system-ui,sans-serif;font-size:15px;font-weight:600;padding:13px 26px;border-radius:999px;text-decoration:none;transition:background .15s,transform .15s}
.bn-ent-store:hover{background:#5e2240;transform:translateY(-1px)}
.bn-ent-storehint{width:100%;text-align:center;font-size:13px;line-height:1.5;color:#8a8f96;margin:6px 0 0}

/* Sprungnavigation */
.bn-ent-jump{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:18px 0 8px}
.bn-ent-jump a{font-family:"Lexend",system-ui,sans-serif;font-size:14px;font-weight:500;color:#7d0845;background:#fff;border:1px solid #ece7df;border-radius:999px;padding:8px 16px;text-decoration:none;transition:background .15s,border-color .15s}
.bn-ent-jump a:hover{background:#f9eef4;border-color:#7d0845}

/* Sektionen */
.bn-ent-section{padding:26px 0 0;scroll-margin-top:84px}
.bn-ent-section h2{font-family:"Lexend",system-ui,sans-serif;font-size:24px;font-weight:700;letter-spacing:-.3px;color:#1f2328;margin:0 0 8px;text-wrap:balance}
.bn-ent-section>.bn-container>p{font-size:15px;line-height:1.65;color:#3a4047;margin:0 0 18px;max-width:44em}

/* Eine Fläche pro Bereich: Bild als Grund, Inhalt darauf */
.bn-ent-band{border-radius:20px;overflow:hidden;padding:24px;background-size:cover;background-position:center}
.bn-ent-band--moment{background-color:#fbf0d8;background-image:url("../img/email/newsletter/moment-bg.jpg")}
.bn-ent-band--klang{background-color:#f9eee9;background-image:url("../img/email/newsletter/klangraum-bg.jpg")}
.bn-ent-band--wand{background-color:#efe9e4;background-image:url("../img/email/newsletter/community-hero.jpg");background-position:center top}
.bn-ent-band--wachsen{background-color:#f3eaef;background-image:url("../img/email/newsletter/wachsen-bg.jpg")}

/* Karte auf einer Fläche (Gmail-Dark-Mode-Regel gilt hier sinngemäß: Text nie
   direkt auf dem Bild) */
.bn-ent-card{background:rgba(255,255,255,.78);border-radius:14px;padding:18px 20px}
.bn-ent-card+.bn-ent-card{margin-top:14px}
.bn-ent-card h3{font-family:"Lexend",system-ui,sans-serif;font-size:18px;font-weight:700;color:#1f2328;margin:0 0 6px}
.bn-ent-card p{font-size:14px;line-height:1.6;color:#3a4047;margin:0}

/* Ruhige Box ohne Fläche (Routinen, Woche planen, bloomie) */
.bn-ent-box{background:#fff;border:1px solid #ece7df;border-radius:20px;padding:22px 24px}
.bn-ent-box h2{margin-top:0}

/* Zweispalter: Bild neben Inhalt, bricht mobil um */
.bn-ent-split{display:flex;gap:20px;align-items:center}
.bn-ent-split>.bn-ent-splitart{flex:0 0 auto}
.bn-ent-split>.bn-ent-splitbody{flex:1 1 240px;min-width:0}
@media (max-width:560px){.bn-ent-split{flex-wrap:wrap;justify-content:center}}

/* Geräte-Screenshots (fertig gerundet + umrandet aus dem Bauskript) */
.bn-ent-screen{display:block;width:200px;max-width:100%;height:auto}
.bn-ent-screen--sm{width:170px}

/* Kachelraster „Im Moment" */
.bn-ent-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:rgba(255,255,255,.55);border-radius:14px;padding:14px}
.bn-ent-tile{text-align:center;font-family:"Lexend",system-ui,sans-serif;font-size:12px;line-height:1.35;color:#4a3a2c}
.bn-ent-tile img{display:block;width:74px;height:74px;margin:0 auto 6px}
@media (max-width:560px){.bn-ent-tiles{grid-template-columns:repeat(2,1fr)}}

/* Klang-Zwecke */
.bn-ent-sounds{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:rgba(255,255,255,.78);border-radius:14px;padding:16px 12px;text-align:center}
.bn-ent-sound{font-family:"Lexend",system-ui,sans-serif;font-size:12px;font-weight:600;color:#1f2328;line-height:1.35}
.bn-ent-sound img{display:block;width:66px;height:66px;border-radius:50%;margin:0 auto 8px}
@media (max-width:560px){.bn-ent-sounds{grid-template-columns:repeat(2,1fr)}}

/* Screenshot-Paar auf der Avatar-Wand */
.bn-ent-screens{display:flex;justify-content:center;gap:16px;margin-top:14px;flex-wrap:wrap}

/* bloomie-Liste */
.bn-ent-bullets{list-style:none;margin:10px 0 0;padding:0}
.bn-ent-bullets li{position:relative;padding:0 0 8px 18px;font-size:14px;line-height:1.6;color:#3a4047}
.bn-ent-bullets li::before{content:"•";position:absolute;left:0;color:#7d0845;font-weight:700}
.bn-ent-note{font-size:13px;line-height:1.5;color:#9aa0a6;margin:14px 0 0}

.bn-ent-bottom{padding:34px 0 46px}