/* Glüx Coconut – Ergänzungen zu style.css (aus icedTEA übernommen) */
.hero{background:var(--bg)}
.hero-in.kurz{min-height:0;padding-top:clamp(56px,8vw,112px);padding-bottom:clamp(24px,3vw,40px)}
.hero h1{max-width:9em}
.reihe{display:block;margin:0}
.reihe img{width:100%;height:auto}
.sec.erste{border-top:0}
@media(min-width:1180px){.models.drei{grid-template-columns:repeat(3,1fr)}}
.spt-header__claim{font-family:var(--mono);font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
/* Umschalter für die Gestaltung (Sortiment) und Sprungmarken (Gestaltung) */
.wahl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 24px}
.wahl-lbl{font-family:var(--mono);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-right:8px}
.wahl button,.wahl a{font-family:var(--mono);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--text);background:transparent;border:1px solid var(--border);border-radius:var(--r);padding:0 14px;min-height:44px;display:inline-flex;align-items:center;cursor:pointer;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s}
.wahl button:hover,.wahl a:hover{background:var(--hover)}
.wahl button[aria-pressed="true"]{border-color:var(--gold);color:var(--gold)}
.wahl button:focus-visible,.wahl a:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.sec.linie{padding-bottom:clamp(40px,5vw,72px)}
.sec.linie .reihe{margin-top:8px}
.linie-zu{margin:24px 0 0}