/* Spec 086 · Laserazor Magazin (Outbrain-Landingpages). Gebaut von scripts/magazin-outbrain-bauen.py.
   Zwei Themen: .mob (redaktionell, hell) und .mob.mob-pop (Pop-Collage wie /modellegesucht). Knöpfe 6 px, Flächen ohne harte Kästen. */
@font-face{font-family:"Fig";font-weight:300 900;font-display:swap;src:url(/assets/fonts/figtree-var-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:"Fig";font-weight:300 900;font-display:swap;src:url(/assets/fonts/figtree-var-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:"Fraunces";font-weight:600;font-style:italic;font-display:swap;src:url(/assets/fonts/fraunces-italic-600.woff2) format("woff2")}
@font-face{font-family:"Kalam";font-weight:700;font-display:swap;src:url(/assets/fonts/deal-kalam-700.woff2) format("woff2")}
:root{--ink:#10213f;--text:#2a3140;--muted:#626b7a;--line:#e5e0d8;--paper:#fbf8f4;--soft:#f3ede4;--rose:#fbe9ef;
  --pink:#e6007e;--blau:#0055b3;--rot:#c8102e;--gruen:#00a050;--w:700px;--fig:"Fig",-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body.mob{margin:0;background:var(--paper);color:var(--text);font:400 18.5px/1.66 var(--fig);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.mob img{max-width:100%;height:auto;display:block}
.mob a{color:var(--blau)}
.mob-wrap{max-width:var(--w);margin:0 auto;padding:0 20px}
.mob-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Kopf: Logo, Magazin, Anzeige-Kennzeichnung (UWG § 5a, Outbrain) */
.mob-kopf{max-width:1080px;margin:0 auto;padding:16px 20px 0;display:flex;align-items:center;gap:14px}
.mob-kopf .logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.mob-kopf .logo img{height:22px;width:auto}
.mob-kopf .rubrik{font-weight:700;font-size:15px;color:var(--muted);padding-left:12px;border-left:1px solid var(--line);line-height:1.1}
.mob-anzeige{margin-left:auto;font-size:13px;font-weight:600;color:var(--muted);border:1px solid #cfc8bd;border-radius:4px;padding:3px 8px;line-height:1.2}

/* Artikel */
.mob-artikel{padding:34px 0 10px}
.mob-kicker{margin:0 0 12px;font-size:15px;font-weight:700;color:var(--pink)}
.mob h1{margin:0 0 18px;font-size:clamp(31px,5.2vw,46px);line-height:1.08;font-weight:850;letter-spacing:-.025em;color:var(--ink);text-wrap:balance}
.mob-lead{margin:0 0 22px;font-size:clamp(19px,2.3vw,21px);line-height:1.55;color:var(--ink)}
.mob-byline{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;font-size:14px;color:var(--muted);padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 26px}
.mob-byline b{color:var(--ink);font-weight:700}
.mob-hero{margin:0 0 30px;position:relative}
.mob-hero img{width:100%;border-radius:6px;aspect-ratio:3/2;object-fit:cover}
.mob figcaption{font-size:13.5px;color:var(--muted);margin-top:8px;line-height:1.45}
.mob-artikel h2{margin:44px 0 12px;font-size:clamp(24px,3.2vw,29px);line-height:1.2;font-weight:800;letter-spacing:-.015em;color:var(--ink);text-wrap:balance;scroll-margin-top:16px}
.mob-artikel h3{margin:28px 0 8px;font-size:20px;line-height:1.3;font-weight:800;color:var(--ink)}
.mob-artikel p{margin:0 0 18px}
.mob-artikel ul.mob-liste{margin:0 0 22px;padding:0;list-style:none}
.mob-liste li{position:relative;padding:0 0 0 30px;margin:0 0 12px}
.mob-liste li svg{position:absolute;left:0;top:.28em;width:20px;height:20px;color:var(--pink)}
.mob-zitat{margin:34px 0;padding:0;font-family:"Fraunces",Georgia,serif;font-style:italic;font-weight:600;font-size:clamp(22px,3vw,27px);line-height:1.35;color:var(--ink)}
.mob-zitat small{display:block;margin-top:10px;font:500 14px/1.4 var(--fig);font-style:normal;color:var(--muted)}
.mob-bild{margin:30px 0}
.mob-bild img{border-radius:6px;width:100%}
.mob-marker{background:url(/assets/img/magazin-ob/marker.svg) 0 62%/100% .62em no-repeat;padding:0 .08em}

/* Nummerierte Punkte (Artikel C) */
.mob-punkt{display:grid;grid-template-columns:58px 1fr;gap:4px 14px;margin:36px 0 0}
.mob-punkt .nr{font-weight:900;font-size:50px;line-height:.9;color:var(--pink);letter-spacing:-.04em}
.mob-punkt h2{margin:2px 0 10px!important}
.mob-punkt > div > p:last-child{margin-bottom:0}

/* Mitmach-Bausteine */
.mob-tool{margin:34px -20px;padding:28px 20px 30px;background:var(--soft);border-radius:0}
@media(min-width:740px){.mob-tool{margin:38px -36px;padding:32px 36px;border-radius:8px}}
.mob-tool h2{margin-top:0!important}
.mob-tool .frage{font-weight:750;color:var(--ink);margin:18px 0 10px;font-size:17px}
.mob-chips{display:flex;flex-wrap:wrap;gap:8px}
.mob-chip{appearance:none;border:1.5px solid #d6cdbf;background:#fff;color:var(--ink);font:650 15.5px/1 var(--fig);padding:11px 14px;border-radius:6px;cursor:pointer;min-height:44px}
.mob-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.mob-chip:focus-visible,.mob-btn:focus-visible,.mob-wahl:focus-within{outline:3px solid #ffb3d6;outline-offset:2px}
.mob-regler{display:flex;align-items:center;gap:14px}
.mob-regler input{flex:1;accent-color:var(--pink);height:32px}
.mob-regler output{min-width:92px;text-align:right;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.mob-ergebnis{margin-top:22px;padding-top:18px;border-top:1px solid #d9d0c3}
.mob-zahlen{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 20px}
.mob-zahl b{display:block;font-size:clamp(30px,6vw,40px);line-height:1;font-weight:900;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.mob-zahl span{display:block;margin-top:6px;font-size:14.5px;color:var(--muted);line-height:1.35}
.mob-zahl.pink b{color:var(--pink)}
.mob-fazit{margin:18px 0 0;font-weight:650;color:var(--ink)}
.mob-hinweis{margin:12px 0 0;font-size:14px;color:var(--muted);line-height:1.5}
.mob-zeitleiste{list-style:none;margin:6px 0 0;padding:0}
.mob-zeitleiste li{display:grid;grid-template-columns:96px 1fr auto;gap:10px;align-items:baseline;padding:9px 0;border-bottom:1px solid #e3dacd;font-variant-numeric:tabular-nums}
.mob-zeitleiste li b{color:var(--ink)}
.mob-zeitleiste li em{font-style:normal;font-size:13px;font-weight:700;color:var(--gruen)}
.mob-zeitleiste li.spaeter em{color:var(--muted)}
.mob-haarcheck-text{margin:16px 0 0;font-weight:600;color:var(--ink);min-height:1.6em}

/* Angebot */
.mob-angebot{margin:46px -20px 0;padding:34px 20px 30px;background:var(--rose)}
@media(min-width:740px){.mob-angebot{margin:52px -36px 0;padding:38px 36px 34px;border-radius:8px}}
.mob-angebot h2{margin:0 0 8px!important}
.mob-angebot .unter{margin:0 0 18px;color:var(--ink)}
.mob-zonen{list-style:none;margin:0;padding:0}
.mob-zone{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:center;padding:14px 0;border-bottom:1px solid #edcfda}
.mob-zone:last-child{border-bottom:0}
.mob-zone .zn{font-weight:800;color:var(--ink);font-size:18px;line-height:1.25}
.mob-zone .zm{font-size:14px;color:var(--muted);line-height:1.35}
.mob-zone .zp{grid-row:span 2;display:flex;align-items:center;gap:14px}
.mob-preis{display:flex;flex-direction:column;align-items:flex-end;line-height:1}
.mob-preis s{position:relative;text-decoration:none;color:var(--rot);font-weight:800;font-size:16px;white-space:nowrap}
.mob-preis s::after{content:"";position:absolute;left:-7%;right:-7%;top:30%;height:.5em;background:url(/assets/img/modelle/mk-strich.svg) center/100% 100% no-repeat}
.mob-preis b{font-size:30px;font-weight:900;color:var(--gruen);letter-spacing:-.03em;margin-top:3px;white-space:nowrap}
.mob-btn{appearance:none;border:0;border-radius:6px;background:var(--ink);color:#fff;font:800 16px/1 var(--fig);padding:0 18px;min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;text-decoration:none;white-space:nowrap}
.mob-btn svg{width:18px;height:18px}
.mob-btn.gross{min-height:56px;font-size:18px;padding:0 26px;width:100%;margin-top:20px}
.mob-btn.pink{background:var(--pink)}
.mob-btn.klein{min-height:42px;font-size:15px;padding:0 14px}
.mob-bedingung{margin:16px 0 0;font-size:14px;color:var(--muted);line-height:1.5}
.mob-weiter{margin:22px 0 0;padding-top:16px;border-top:1px solid #edcfda;font-size:15.5px;color:var(--ink)}
.mob-weiter b{font-weight:850}
@media(max-width:520px){
  .mob-zone{grid-template-columns:1fr auto}
  .mob-zone .zp{gap:10px}
  .mob-preis b{font-size:26px}
}

/* Studios, FAQ */
.mob-studios{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0}
@media(min-width:640px){.mob-studios{grid-template-columns:1fr 1fr;column-gap:28px}}
.mob-studios li{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.mob-studios img{width:64px;height:64px;border-radius:6px;object-fit:cover}
.mob-studios b{display:block;color:var(--ink);font-size:16.5px;line-height:1.3}
.mob-studios span{display:block;font-size:14.5px;color:var(--muted);line-height:1.4}
.mob-faq details{border-bottom:1px solid var(--line);padding:2px 0}
.mob-faq summary{cursor:pointer;list-style:none;font-weight:750;color:var(--ink);padding:14px 30px 14px 0;position:relative;line-height:1.4}
.mob-faq summary::-webkit-details-marker{display:none}
.mob-faq summary::after{content:"+";position:absolute;right:4px;top:10px;font-size:24px;font-weight:500;color:var(--pink)}
.mob-faq details[open] summary::after{content:"−"}
.mob-faq details p{margin:0 0 16px;font-size:17px}

/* Fuß mit Pflichtangaben */
.mob-fuss{margin-top:56px;padding:30px 0 120px;border-top:1px solid var(--line);font-size:14px;line-height:1.6;color:var(--muted)}
.mob-fuss p{margin:0 0 12px}
.mob-fuss b{color:var(--text)}
.mob-fuss nav{display:flex;flex-wrap:wrap;gap:6px 18px;margin:14px 0 0}
.mob-fuss nav a{color:var(--text)}

/* Leiste unten (mobil und Desktop, erst nach etwas Lesestrecke) */
.mob-leiste{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(251,248,244,.97);border-top:1px solid var(--line);display:flex;align-items:center;gap:12px;justify-content:center;transform:translateY(110%);transition:transform .45s cubic-bezier(.22,1,.36,1)}
.mob-leiste.zeigen{transform:none}
.mob-leiste p{margin:0;font-size:14.5px;line-height:1.3;color:var(--ink);font-weight:650}
.mob-leiste .mob-btn{flex:none}
@media(max-width:420px){.mob-leiste p{font-size:13.5px}}

/* Buchungs-Auswahl (Für wen > Zone > Studio, danach Kalender in der seitenweiten Lightbox) */
.mob-lb{position:fixed;inset:0;z-index:2147480000;display:flex;align-items:flex-end;justify-content:center;background:rgba(16,33,63,.55);opacity:0;transition:opacity .3s ease}
.mob-lb.offen{opacity:1}
.mob-lb[hidden]{display:none}
@media(min-width:640px){.mob-lb{align-items:center}}
.mob-lb-panel{width:100%;max-width:520px;max-height:92vh;overflow:auto;background:#fff;border-radius:8px 8px 0 0;padding:20px 20px calc(22px + env(safe-area-inset-bottom));transform:translateY(24px);transition:transform .45s cubic-bezier(.22,1,.36,1)}
@media(min-width:640px){.mob-lb-panel{border-radius:8px}}
.mob-lb.offen .mob-lb-panel{transform:none}
.mob-lb-kopf{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.mob-lb-kopf .schritt{font-size:13.5px;font-weight:700;color:var(--muted)}
.mob-lb-zu,.mob-lb-zurueck{appearance:none;border:0;background:none;cursor:pointer;color:var(--ink);font:700 15px/1 var(--fig);padding:10px;min-width:44px;min-height:44px}
.mob-lb-zu{margin-left:auto;font-size:26px;font-weight:400}
.mob-lb h3{margin:4px 0 6px;font-size:23px;line-height:1.2;font-weight:850;color:var(--ink)}
.mob-lb .info{margin:0 0 14px;font-size:15px;color:var(--muted)}
.mob-wahlen{display:grid;gap:8px}
.mob-wahlen.zwei{grid-template-columns:1fr 1fr}
.mob-wahl{display:flex;align-items:center;gap:12px;border:1.5px solid #dcd4c8;border-radius:6px;padding:12px 14px;cursor:pointer;min-height:56px;background:#fff}
.mob-wahl:hover{border-color:var(--ink)}
.mob-wahl input{position:absolute;opacity:0;pointer-events:none}
.mob-wahl b{display:block;color:var(--ink);font-size:16.5px;line-height:1.25}
.mob-wahl span{display:block;font-size:13.5px;color:var(--muted);line-height:1.3}
.mob-wahl img{width:46px;height:46px;border-radius:6px;object-fit:cover;flex:none}
.mob-wahl .wert{margin-left:auto;text-align:right;font-weight:900;color:var(--gruen);font-size:18px;white-space:nowrap}
.mob-lb .hinweis{background:var(--rose);border-radius:6px;padding:12px 14px;font-size:14.5px;color:var(--ink);margin:0 0 12px}
.mob-lb-chips{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 10px;font-size:13.5px;color:var(--muted)}
.mob-lb-chips button{appearance:none;border:0;background:var(--soft);border-radius:4px;padding:5px 9px;font:650 13.5px/1.2 var(--fig);color:var(--ink);cursor:pointer}
html.mob-lb-auf,html.mob-lb-auf body{overflow:hidden}

@media(prefers-reduced-motion:reduce){.mob-lb,.mob-lb-panel,.mob-leiste{transition:none}}

/* ════════ Pop-Thema (wie /modellegesucht) ════════ */
.mob.mob-pop{--ink:#23101e;--text:#2b1a26;--muted:#6b5262;--pink:#FF1E8C;--pinkd:#D70070;background:#FF1E8C;color:var(--text)}
.mob-pop .mob-kopf .logo img{filter:brightness(0) invert(1)}
.mob-pop .mob-kopf .rubrik{color:#fff;border-color:rgba(255,255,255,.45)}
.mob-pop .mob-anzeige{color:#fff;border-color:rgba(255,255,255,.7)}
.mob-pop .korn{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.07;background:url(/assets/img/modellegesucht/pop/korn.webp) 0 0/220px 220px}
.mob-pop .aq{position:absolute;z-index:0;pointer-events:none;background:center/contain no-repeat;-webkit-mask-image:radial-gradient(closest-side,#000 45%,transparent 100%);mask-image:radial-gradient(closest-side,#000 45%,transparent 100%)}
.mpop-hero{--rand:max(20px,calc((100% - 1040px) / 2));position:relative;margin:0;padding:18px var(--rand) 0;min-height:620px;overflow-x:clip;overflow-y:visible}
body.mob-pop{overflow-x:hidden}
@supports (overflow:clip){body.mob-pop{overflow-x:clip}}
.mpop-hero h1{position:relative;z-index:3;color:#fff;font-size:clamp(54px,11vw,104px);line-height:.9;font-weight:900;letter-spacing:-.045em;margin:18px 0 14px;max-width:640px}
.mpop-hero .mpop-streifen{max-width:min(560px,100%)}
@media(max-width:599px){.mpop-hero .mpop-streifen{max-width:calc(100% - 128px)}}
.mpop-streifen{position:relative;z-index:3;display:inline-block;background:url(/assets/img/modellegesucht/pop/p-streifen-2.webp) center/100% 100% no-repeat;padding:.5em .95em .55em;font-weight:750;font-size:clamp(17px,2.4vw,22px);color:var(--ink);transform:rotate(-1.5deg);max-width:560px;line-height:1.25}
.mpop-collage{position:relative;height:560px;margin-top:-10px}
@media(min-width:900px){.mpop-hero{min-height:720px}.mpop-collage{position:absolute;right:calc(var(--rand) + 10px);bottom:0;width:560px;height:660px;margin:0}}
.mpop-collage img{position:absolute;bottom:0;height:auto}
.mpop-collage .g1{left:4%;height:92%;width:auto;z-index:3}
.mpop-collage .g2{left:40%;height:96%;width:auto;z-index:4}
.mpop-collage .l1{left:-2%;bottom:0;height:46%;width:auto;z-index:2;transform:rotate(-4deg)}
.mpop-collage .l2{right:-4%;bottom:0;height:42%;width:auto;z-index:2;transform:rotate(5deg)}
.mpop-collage .m1{left:62%;bottom:62%;height:16%;width:auto;z-index:6}
.mpop-collage .m2{left:22%;bottom:4%;height:15%;width:auto;z-index:6}
.mpop-notiz{position:absolute;z-index:7;right:calc(var(--rand) - 6px);top:78px;width:122px;height:98px;display:grid;place-items:center;text-align:center;background:url(/assets/img/modellegesucht/pop/p-liniert.webp) center 18%/cover;font:700 23px/1 "Kalam",cursive;color:var(--ink);transform:rotate(6deg);padding-top:.4em;filter:drop-shadow(0 10px 14px rgba(90,0,45,.28))}
@media(min-width:600px){.mpop-notiz{width:170px;height:136px;font-size:31px;right:calc(var(--rand) + 20px);top:60px}}
@media(min-width:900px){.mpop-notiz{right:auto;left:calc(var(--rand) + 280px);top:420px}}
.mpop-blatt{position:relative;z-index:2;background:#fff url(/assets/img/modellegesucht/pop/p-blatt.webp) center/100% 100%;border-radius:2px;padding:30px 24px 26px;margin:0 0 30px;filter:drop-shadow(0 14px 22px rgba(90,0,45,.30))}
@media(min-width:740px){.mpop-blatt{padding:40px 46px 36px}}
.mpop-blatt.r1{transform:rotate(-.6deg)}.mpop-blatt.r2{transform:rotate(.5deg)}
.mpop-blatt .tape{position:absolute;top:-18px;left:42%;height:44px;width:auto;transform:rotate(86deg);opacity:.92}
.mob-pop .mob-artikel{position:relative;z-index:2;padding-top:10px}
.mob-pop .mob-artikel h2{color:var(--ink)}
.mob-pop .mob-kicker{color:var(--pinkd)}
.mob-pop .mob-byline{border-color:#efd3e2}
.mob-pop .mob-angebot{margin:0;background:none;padding:0}
.mob-pop .mob-zone{border-color:#f3d7e5}
.mob-pop .mob-btn{background:var(--ink)}
.mob-pop .mob-btn.pink{background:var(--pinkd)}
.mob-pop .mob-tool{background:#fff6c9 url(/assets/img/modellegesucht/pop/p-postit-gelb.webp) center/100% 100%;margin:30px 0;padding:30px 26px;border-radius:0;transform:rotate(-.4deg)}
.mob-pop .mob-fuss{position:relative;z-index:2;color:rgba(255,255,255,.88);border-color:rgba(255,255,255,.35)}
.mob-pop .mob-fuss b,.mob-pop .mob-fuss nav a{color:#fff}
.mob-pop .mob-leiste{background:rgba(255,30,140,.97);border-color:rgba(255,255,255,.4)}
.mob-pop .mob-leiste p{color:#fff}
.mpop-laser{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:10px 0 6px}
.mpop-laser figure{margin:0;text-align:center}
.mpop-laser img{height:230px;width:auto;margin:0 auto}
.mpop-laser figcaption{font-weight:800;color:var(--ink);font-size:15px}
.mpop-schritte{list-style:none;margin:8px 0 0;padding:0;counter-reset:s}
.mpop-schritte li{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:start;margin:0 0 16px}
.mpop-schritte li::before{counter-increment:s;content:counter(s);font:900 42px/1 var(--fig);color:var(--pinkd);letter-spacing:-.04em}
.mpop-schritte b{display:block;color:var(--ink);font-size:18px}