/* Bewusst nur helles Theme (Vorgabe Kadir): auch im Dunkelmodus des Geräts bleibt die Seite hell.
   Layout: helle, warme Pilgerseite in Weiß-Rot-Blau. Große Fotos mit weichen Ecken tragen die Emotion, die Flugbahn aus dem Logo führt durch die Seite. */
:root {
  --surface:#ffffff; --page:#edf3f8; --surface-tint:#e2eef6; --surface-warm:#fcebe4; --line:#d3dee7; --line-strong:#7c8894;
  --ink:#1f2a37; --ink-muted:#5a6675;
  --red:#ed1c24; --red-strong:#d3121a; --red-hover:#b8121a; --red-text:#c8141b; --red-soft:#fdecec; --on-red:#ffffff;
  --blue:#0079a3; --blue-text:#006a8f; --sky:#109bc5; --blue-soft:#e8f5fa;
  --success:#1f7a3e; --success-soft:#e5f4ea; --soldout:#6b7480; --focus:#0079a3;
  --shadow-card:0 2px 6px rgba(31,42,55,.07),0 16px 40px rgba(31,42,55,.12); --shadow-float:0 18px 48px rgba(31,42,55,.16);
  --overlay:rgba(18,24,32,.48); --on-photo:#ffffff;
  --font-display:"Red Hat Display","Helvetica Neue",Arial,sans-serif; --font-sans:"Red Hat Text","Helvetica Neue",Arial,sans-serif; --font-arabic:Amiri,"Traditional Arabic",serif;
  color-scheme:light; --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px; --max:1180px;
}

* { box-sizing:border-box; }
body { background:var(--page); color:var(--ink); font-family:var(--font-sans); font-size:17px; line-height:28px; -webkit-font-smoothing:antialiased; }
body::before { content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:10; background:var(--surface); }
a { color:var(--blue-text); }
img { display:block; max-width:100%; }
.wrap { max-width:var(--max); margin:0 auto; padding-left:max(16px, env(safe-area-inset-left,0px)); padding-right:max(16px, env(safe-area-inset-right,0px)); }
h1,h2,h3,h4 { font-family:var(--font-display); margin:0; text-wrap:balance; letter-spacing:-.02em; }
h1 { font-weight:900; }
h2 { font-weight:800; font-size:clamp(30px,4.2vw,44px); line-height:1.1; }
h3 { font-weight:700; font-size:21px; line-height:27px; }
p { margin:0; }
.eyebrow { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:13px; line-height:18px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--red-text); }
.eyebrow::before { content:""; width:26px; height:3px; border-radius:3px; background:linear-gradient(90deg,var(--sky) 0 50%,var(--red) 50% 100%); }
.lead { font-size:19px; line-height:31px; color:var(--ink-muted); max-width:58ch; }
.muted { color:var(--ink-muted); }
.small { font-size:15px; line-height:24px; }
.tabnum { font-variant-numeric:tabular-nums; }
section.band { padding-block:clamp(64px,8vw,104px); }
.tint { background:var(--surface-tint); }
.white { background:#ffffff; }
.warm { background:var(--surface-warm); }
.sec-head { display:flex; flex-direction:column; gap:14px; margin-bottom:44px; max-width:740px; }
.sec-head.center { margin-inline:auto; text-align:center; align-items:center; }

/* Buttons */
.btn { font:inherit; font-family:var(--font-display); font-size:16px; line-height:20px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; gap:10px; height:52px; padding:0 26px; border-radius:999px; border:2px solid transparent; cursor:pointer; text-decoration:none; transition:background-color .2s ease-out, transform .2s ease-out; white-space:nowrap; }
.btn:hover { transform:translateY(-1px); }
.btn-primary { background:var(--red-strong); color:var(--on-red); }
.btn-primary:hover { background:var(--red-hover); }
.btn-secondary { background:var(--surface); border-color:var(--blue); color:var(--blue-text); }
.btn-secondary:hover { background:var(--blue-soft); }
.btn-light { background:#ffffff; color:#1f2a37; }
.btn-sm { height:42px; padding:0 18px; font-size:15px; }
.btn svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }
.btn:focus-visible,.chip:focus-visible,summary:focus-visible,.nav a:focus-visible,.copy:focus-visible,select:focus-visible { outline:3px solid var(--focus); outline-offset:2px; }

/* Top + header */
.top { background:var(--blue); color:#ffffff; font-size:14px; line-height:20px; font-weight:500; }
.top .wrap { display:flex; justify-content:space-between; gap:16px; padding-block:9px; flex-wrap:wrap; }
header.site { position:sticky; top:env(safe-area-inset-top,0px); z-index:5; background:var(--surface); border-bottom:1px solid var(--line); }
header.site .wrap { display:flex; align-items:center; justify-content:space-between; gap:24px; height:84px; }
.logo { display:block; height:56px; width:auto; }
.logo-chip { display:inline-flex; border-radius:12px; background:#ffffff; }
.nav { display:flex; gap:28px; align-items:center; }
.nav a { color:var(--ink); text-decoration:none; font-family:var(--font-display); font-size:16px; font-weight:700; }
.nav a:not(.btn):hover { color:var(--red-text); }
@media (max-width:960px) { .nav a:not(.btn) { display:none; } .logo { height:46px; } }

/* Hero */
.hero { position:relative; overflow:hidden; background:linear-gradient(180deg,#ffffff 0%,#ffffff 35%,var(--surface-tint) 100%); }
.hero .wrap { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:56px; align-items:center; padding-block:clamp(48px,6vw,88px) clamp(56px,7vw,100px); position:relative; }
.hero h1 { font-size:clamp(42px,5.8vw,70px); line-height:1.02; margin-top:18px; }
.hero h1 em { font-style:normal; color:var(--red); }
.hero .lead { margin-top:22px; }
.hero .cta { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.airports { display:flex; flex-wrap:wrap; gap:8px; margin-top:28px; align-items:center; font-size:15px; color:var(--ink-muted); }
.airports b { font-weight:600; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:4px 12px; font-size:14px; }
.collage { position:relative; display:grid; grid-template-columns:1.25fr 1fr; grid-template-rows:200px 200px; gap:16px; min-width:0; }
.collage .ph { border-radius:var(--r-xl); overflow:hidden; background:var(--blue-soft); min-width:0; }
.collage .ph img { width:100%; height:100%; object-fit:cover; }
.collage .a { grid-row:1 / 3; }
.collage .a img { object-position:62% 50%; }
.next { position:absolute; left:-28px; bottom:-26px; background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--shadow-float); padding:16px 20px; display:flex; gap:14px; align-items:center; max-width:320px; }
.next .ic { width:44px; height:44px; border-radius:50%; background:var(--red-soft); display:grid; place-items:center; flex:none; }
.next .ic svg { width:22px; height:22px; fill:var(--red); }
.next b { font-family:var(--font-display); font-size:17px; display:block; line-height:22px; }
.next span { font-size:14px; line-height:20px; color:var(--ink-muted); }
.swoosh { position:absolute; pointer-events:none; }
.swoosh path { fill:none; stroke-linecap:round; }
.swoosh .s1 { stroke:var(--sky); }
.swoosh .s2 { stroke:var(--red); }
.hero .swoosh { left:-4%; bottom:8px; width:62%; height:120px; opacity:.9; }
@media (max-width:900px) { .hero .wrap { grid-template-columns:minmax(0,1fr); } .collage { grid-template-rows:170px 170px; } .next { left:12px; bottom:-30px; } .hero .swoosh { width:100%; } }
@media (max-width:480px) { .collage { grid-template-columns:minmax(0,1fr); grid-template-rows:220px; } .collage .b,.collage .c { display:none; } .collage .a { grid-row:auto; } }

/* Trust */
.trust { background:var(--blue); color:#ffffff; }
.trust .wrap { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; padding-block:30px; }
.trust .t { display:flex; gap:14px; align-items:center; min-width:0; }
.trust .num { font-family:var(--font-display); font-weight:900; font-size:38px; line-height:40px; color:#ffffff; letter-spacing:-.02em; flex:none; }
.trust span { font-size:15px; line-height:21px; color:#e6f4fa; }
@media (max-width:800px) { .trust .wrap { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 16px; padding-top:44px; } .trust .t { flex-direction:column; align-items:flex-start; gap:4px; } }

/* Badges & chips */
.badge { display:inline-flex; align-items:center; gap:6px; font-size:13px; line-height:18px; font-weight:600; padding:5px 12px; border-radius:999px; background:var(--surface-tint); color:var(--ink); white-space:nowrap; }
.badge.free { background:var(--success-soft); color:var(--success); }
.badge.free::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.badge.soldout { color:var(--soldout); text-decoration:line-through; }
.badge.best { background:var(--red-soft); color:var(--red-text); }
.badge.on-photo { background:rgba(255,255,255,.94); color:#1f2a37; }
.chips { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.chip { font:inherit; font-size:15px; font-weight:600; height:42px; padding:0 18px; border-radius:999px; border:1.5px solid var(--line-strong); background:var(--surface); color:var(--ink); cursor:pointer; }
.chip:hover { border-color:var(--blue); }
.chip[aria-pressed="true"] { background:var(--blue); border-color:var(--blue); color:#ffffff; }

/* Cards */
.toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:32px; }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
@media (max-width:1000px) { .cards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:640px) { .cards { grid-template-columns:minmax(0,1fr); } }
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); display:flex; flex-direction:column; min-width:0; overflow:hidden; transition:transform .25s ease-out, box-shadow .25s ease-out; }
.card:hover { transform:translateY(-3px); box-shadow:var(--shadow-float); }
.card-media { position:relative; aspect-ratio:16/10; max-width:100%; background:var(--blue-soft); overflow:hidden; }
.card-media img { width:100%; height:100%; object-fit:cover; }
.card-media .badge { position:absolute; left:14px; top:14px; }
.card-body { padding:22px 24px 24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.card-title { font-size:25px; line-height:30px; font-weight:800; }
.card .meta { font-size:15px; line-height:23px; color:var(--ink-muted); }
.card .row { display:flex; flex-wrap:wrap; gap:6px; }
.card-foot { margin-top:auto; padding-top:16px; border-top:1px dashed var(--line); display:flex; justify-content:space-between; align-items:flex-end; gap:12px; }
.price { font-family:var(--font-display); font-size:32px; line-height:34px; font-weight:900; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--ink); }
.price small { display:block; font-family:var(--font-sans); font-size:13px; line-height:17px; font-weight:500; letter-spacing:0; color:var(--ink-muted); }


/* Trip card v2 */
.trip { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); display:flex; flex-direction:column; min-width:0; overflow:hidden; transition:transform .25s ease-out, box-shadow .25s ease-out; }
.trip:hover { transform:translateY(-3px); box-shadow:var(--shadow-float); }
.trip-media { position:relative; aspect-ratio:16/10; max-width:100%; overflow:hidden; background:var(--blue-soft); }
.trip-media img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease-out; }
.trip:hover .trip-media img { transform:scale(1.04); }
.trip-media::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(14,20,30,.78) 0%,rgba(14,20,30,.15) 55%,rgba(14,20,30,0) 75%); }
.trip-media .season { position:absolute; left:16px; top:16px; z-index:1; }
.trip-media .seats { position:absolute; right:16px; top:16px; z-index:1; }
.trip-title { position:absolute; left:20px; right:20px; bottom:16px; z-index:1; color:#ffffff; }
.trip-title small { display:block; font-family:var(--font-display); font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; opacity:.9; }
.trip-title b { display:block; font-family:var(--font-display); font-weight:900; font-size:30px; line-height:32px; letter-spacing:-.02em; }
.trip-title span { display:block; margin-top:4px; font-size:14px; line-height:20px; opacity:.92; }
.trip-body { padding:20px 22px 22px; display:flex; flex-direction:column; gap:16px; flex:1; }
.ticket { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; }
.ticket .d { text-align:center; min-width:0; }
.ticket .d b { display:block; font-family:var(--font-display); font-weight:900; font-size:28px; line-height:28px; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.ticket .d span { display:block; margin-top:4px; font-family:var(--font-display); font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-muted); }
.ticket .path { position:relative; height:28px; display:grid; place-items:center; min-width:0; }
.ticket .path::before { content:""; position:absolute; left:0; right:0; top:50%; border-top:2px dashed var(--line-strong); opacity:.5; }
.ticket .path em { position:relative; font-style:normal; background:var(--surface); padding:0 8px; display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--blue-text); white-space:nowrap; }
.ticket .path svg { width:16px; height:16px; fill:var(--red); }
.stay { display:flex; flex-direction:column; gap:6px; }
.stay .bar { display:flex; height:8px; border-radius:8px; overflow:hidden; gap:3px; }
.stay .bar i { display:block; height:100%; border-radius:8px; }
.stay .bar .mk { background:var(--red); }
.stay .bar .md { background:var(--blue); }
.stay .lbl { display:flex; justify-content:space-between; font-size:13px; line-height:18px; color:var(--ink-muted); }
.stay .lbl b { color:var(--ink); font-weight:700; }
.flights { display:flex; flex-direction:column; gap:6px; padding:12px 14px; background:var(--surface-tint); border-radius:var(--r-sm); font-size:13px; line-height:18px; }
.flights .leg { display:grid; grid-template-columns:58px minmax(0,1fr) auto; gap:10px; align-items:center; }
.flights .k { font-family:var(--font-display); font-weight:800; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-muted); }
.flights .r { font-family:var(--font-display); font-weight:800; letter-spacing:.04em; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.flights .r i { font-style:normal; color:var(--red); margin:0 3px; }
.flights .t { color:var(--ink-muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.flights .air { display:flex; justify-content:space-between; gap:8px; color:var(--ink-muted); border-top:1px solid var(--line); padding-top:6px; margin-top:2px; }
.flights .air b { color:var(--blue-text); font-weight:700; }
.trip-foot { margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.trip-foot .price small { font-size:12px; }
.trip.hajj-card .trip-body p { font-size:15px; line-height:23px; color:var(--ink-muted); }

/* Table */
.table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-md); background:var(--surface); margin-top:44px; }
table { width:100%; border-collapse:collapse; font-size:16px; min-width:720px; }
th { text-align:left; font-family:var(--font-display); font-size:13px; letter-spacing:.08em; text-transform:uppercase; font-weight:800; color:#ffffff; padding:14px 18px; border-bottom:1px solid var(--line); background:var(--blue); }
td { padding:15px 18px; border-bottom:1px solid var(--line); vertical-align:middle; font-variant-numeric:tabular-nums; }
tr:last-child td { border-bottom:0; }
td.trip { font-weight:700; }
td .sub { display:block; font-size:14px; color:var(--ink-muted); font-weight:400; }
td.amt { font-weight:700; white-space:nowrap; }
tr.is-soldout td { color:var(--soldout); }
tr.is-best td { background:var(--red-soft); }
.note { margin-top:14px; font-size:15px; line-height:23px; color:var(--ink-muted); }

/* Feeling band */
.feel { position:relative; border-radius:var(--r-xl); overflow:hidden; min-height:440px; display:grid; align-items:end; background:#3a2a12; }
.feel img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.feel::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(18,24,32,.78) 0%,rgba(18,24,32,.25) 55%,rgba(18,24,32,0) 100%); }
.feel .inner { position:relative; z-index:1; padding:44px; color:var(--on-photo); max-width:760px; }
.feel .ar { font-family:var(--font-arabic); font-size:clamp(30px,4vw,46px); line-height:1.5; font-weight:700; }
.feel h2 { color:#ffffff; margin-top:6px; font-size:clamp(26px,3.4vw,38px); }
.feel p.tr { margin-top:12px; font-size:18px; line-height:28px; opacity:.92; max-width:56ch; }
@media (max-width:600px) { .feel .inner { padding:28px 22px; } .feel { min-height:380px; } }

/* Included + prices */
.detail { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:44px; align-items:start; }
@media (max-width:920px) { .detail { grid-template-columns:minmax(0,1fr); } }
.incl { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
@media (max-width:560px) { .incl { grid-template-columns:minmax(0,1fr); } }
.incl li { display:flex; gap:14px; align-items:flex-start; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); padding:16px 18px; min-width:0; }
.incl .ic { width:40px; height:40px; border-radius:12px; background:var(--blue-soft); display:grid; place-items:center; flex:none; }
.incl .ic svg { width:22px; height:22px; fill:none; stroke:var(--blue); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.incl b { font-family:var(--font-display); font-weight:700; font-size:17px; line-height:23px; display:block; }
.incl span { font-size:15px; line-height:22px; color:var(--ink-muted); }
.panel { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-card); position:sticky; top:100px; }
.panel-head { padding:20px 24px 6px; }
.trip-pick { padding:10px 24px 18px; }
.trip-pick label { display:block; font-size:14px; color:var(--ink-muted); margin-bottom:6px; }
.trip-pick select { font:inherit; width:100%; height:48px; padding:0 14px; border-radius:var(--r-sm); border:1.5px solid var(--line-strong); background:var(--surface); color:var(--ink); }
.prices { list-style:none; margin:0; padding:0; }
.prices li { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:12px 24px; border-top:1px solid var(--line); font-size:16px; }
.prices li.base { background:var(--blue-soft); }
.prices li.base .amt { color:var(--blue-text); font-size:20px; }
.prices .amt { font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
.prices .hint { display:block; font-size:14px; color:var(--ink-muted); }
.panel .foot { padding:18px 24px 22px; border-top:1px solid var(--line); }
.panel .foot .btn { width:100%; }

/* Hotels */
.hotels { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
@media (max-width:800px) { .hotels { grid-template-columns:minmax(0,1fr); } }
.hotel { background:var(--surface); border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); min-width:0; }
.hotel .pics { display:grid; grid-template-columns:1.4fr 1fr; gap:6px; height:240px; }
.hotel .pics img { width:100%; height:100%; object-fit:cover; min-width:0; }
.hotel .body { padding:22px 24px 26px; display:flex; flex-direction:column; gap:8px; }
.hotel .city { font-family:var(--font-display); font-size:13px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:var(--blue-text); }
.hotel ul { margin:6px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px; font-size:15px; line-height:22px; color:var(--ink-muted); }
.hotel li { display:flex; gap:10px; }
.hotel li::before { content:""; width:8px; height:8px; margin-top:7px; border-radius:50%; background:var(--red); flex:none; }

/* Days */
.days-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
@media (max-width:820px) { .days-grid { grid-template-columns:minmax(0,1fr); } }
.days-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:26px 26px 12px; min-width:0; }
.days-card .head { display:flex; align-items:center; gap:14px; margin-bottom:10px; }
.days-card .head img { width:64px; height:64px; border-radius:18px; object-fit:cover; flex:none; }
.days { list-style:none; margin:0; padding:0; }
.day { display:grid; grid-template-columns:50px minmax(0,1fr); gap:16px; padding:14px 0; border-top:1px solid var(--line); }
.day .n { width:44px; height:44px; border-radius:50%; background:var(--blue-soft); color:var(--blue-text); display:grid; place-items:center; font-family:var(--font-display); font-weight:900; font-size:18px; }
.day h4 { font-size:17px; line-height:24px; font-weight:700; }
.day p { margin-top:2px; font-size:15px; line-height:23px; color:var(--ink-muted); }

/* Steps */
.steps { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; }
@media (max-width:900px) { .steps { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:480px) { .steps { grid-template-columns:minmax(0,1fr); } }
.step { background:var(--surface); border-radius:var(--r-lg); padding:26px; border:1px solid var(--line); min-width:0; position:relative; }
.step-n { width:54px; height:54px; border-radius:18px; background:var(--red-strong); color:var(--on-red); display:grid; place-items:center; font-family:var(--font-display); font-weight:900; font-size:24px; }
.step:nth-child(even) .step-n { background:var(--blue); color:#ffffff; }
.step h3 { margin-top:16px; font-size:20px; }
.step p { margin-top:6px; font-size:15px; line-height:23px; color:var(--ink-muted); }

/* About */
.about { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; align-items:center; }
@media (max-width:900px) { .about { grid-template-columns:minmax(0,1fr); gap:32px; } }
.about .photo { position:relative; }
.about .photo img { border-radius:var(--r-xl); width:100%; aspect-ratio:4/3.4; object-fit:cover; object-position:30% 30%; }
.about .quote { position:absolute; right:-18px; bottom:-22px; max-width:300px; background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--shadow-float); padding:18px 22px; font-family:var(--font-display); font-weight:700; font-size:18px; line-height:25px; }
.about .quote small { display:block; margin-top:8px; font-family:var(--font-sans); font-weight:500; font-size:14px; color:var(--ink-muted); }
@media (max-width:600px) { .about .quote { position:static; margin-top:-40px; margin-left:16px; margin-right:16px; } }
.timeline { list-style:none; margin:24px 0 0; padding:0; display:flex; flex-direction:column; gap:0; }
.timeline li { display:grid; grid-template-columns:80px minmax(0,1fr); gap:16px; padding:14px 0; border-top:1px solid var(--line); font-size:16px; line-height:25px; }
.timeline b { font-family:var(--font-display); font-weight:900; font-size:22px; color:var(--red-text); font-variant-numeric:tabular-nums; }

/* Hadsch */
.hajj { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); border-radius:var(--r-xl); overflow:hidden; background:var(--red-soft); }
.hajj img { width:100%; height:100%; object-fit:cover; min-height:320px; }
.hajj .body { padding:44px; display:flex; flex-direction:column; gap:14px; justify-content:center; }
@media (max-width:820px) { .hajj { grid-template-columns:minmax(0,1fr); } .hajj img { min-height:220px; max-height:260px; } .hajj .body { padding:28px 22px; } }

/* FAQ */
.faq { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:56px; }
@media (max-width:860px) { .faq { grid-template-columns:minmax(0,1fr); gap:24px; } }
.faq-list { display:flex; flex-direction:column; gap:12px; }
details { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); padding:0 22px; }
details[open] { border-color:var(--blue); }
summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; font-family:var(--font-display); font-weight:700; font-size:18px; line-height:25px; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; width:32px; height:32px; border-radius:50%; background:var(--blue-soft); color:var(--blue-text); display:grid; place-items:center; font-size:22px; flex:none; }
details[open] summary::after { content:"–"; background:var(--blue); color:#ffffff; }
details p { padding:0 0 20px; color:var(--ink-muted); max-width:62ch; }

/* Contact */
.contact { position:relative; overflow:hidden; background:#ffffff; border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:var(--r-xl); padding:56px; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:36px; align-items:center; }
@media (max-width:800px) { .contact { grid-template-columns:minmax(0,1fr); padding:36px 22px; } }
.contact .swoosh { right:-40px; top:18px; width:420px; height:110px; opacity:.55; }
.channels { display:flex; flex-direction:column; gap:12px; min-width:0; position:relative; }
.channel { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 22px; background:var(--surface-tint); border-radius:var(--r-md); min-width:0; box-shadow:var(--shadow-card); }
.channel .k { font-family:var(--font-display); font-size:13px; line-height:16px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--red-text); }
.channel .v { font-size:19px; line-height:27px; font-weight:600; overflow-wrap:anywhere; user-select:all; }
.copy { font:inherit; font-size:14px; font-weight:600; height:36px; padding:0 14px; border-radius:999px; border:1.5px solid var(--line-strong); background:transparent; color:var(--ink); cursor:pointer; flex:none; }

/* Footer */
footer { background:#ffffff; margin-top:clamp(64px,8vw,104px); border-top:4px solid var(--red); }
footer .wrap { padding-block:52px; display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)); gap:32px; font-size:15px; line-height:24px; }
@media (max-width:760px) { footer .wrap { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } footer .wrap > div:first-child { grid-column:1 / -1; } }
footer h5 { margin:0 0 10px; font-family:var(--font-display); font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--blue-text); font-weight:800; }
footer a, footer span { color:var(--ink-muted); text-decoration:none; display:block; }
.legal { border-top:1px solid var(--line); background:var(--surface-tint); }
.legal .wrap { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; padding-block:18px; font-size:14px; color:var(--ink-muted); }

.wa { position:fixed; right:calc(20px + env(safe-area-inset-right,0px)); bottom:calc(20px + env(safe-area-inset-bottom,0px)); z-index:6; box-shadow:var(--shadow-float); background:#1f7a3e; color:#ffffff; }
.wa:hover { background:#18632f; }
@media (prefers-reduced-motion: reduce) { .card,.btn { transition:none; } .card:hover,.btn:hover { transform:none; } }

/* ===== Mehrseitige Webseite: Navigation, Seitenkopf, Inhaltsbausteine, Bibliothek ===== */
/* Amiri als Rückfall für arabische Zeichen wie ﷺ, die Red Hat nicht enthält */
:root { --font-display:"Red Hat Display",Amiri,"Helvetica Neue",Arial,sans-serif; --font-sans:"Red Hat Text",Amiri,"Helvetica Neue",Arial,sans-serif; }
.nav .btn-primary, .nav .btn-primary:hover { color:var(--on-red); }
html { scroll-behavior:smooth; scroll-padding-top:110px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }
body { margin:0; }
.ico { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:none; }

/* Navigation mit Untermenüs */
.nav { gap:4px; }
.nav > a:not(.btn), .dd-t { display:inline-flex; align-items:center; gap:6px; height:44px; padding:0 14px; border-radius:999px; color:var(--ink); text-decoration:none; font-family:var(--font-display); font-size:16px; font-weight:700; background:none; border:0; cursor:pointer; }
.nav > a:not(.btn):hover, .dd:hover .dd-t, .dd:focus-within .dd-t { background:var(--blue-soft); color:var(--blue-text); }
.nav [aria-current="page"], .dd-t[aria-current="true"] { color:var(--red-text); }
.dd-t svg { width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.4; transition:transform .2s ease-out; }
.dd:hover .dd-t svg, .dd:focus-within .dd-t svg { transform:rotate(180deg); }
.nav .btn { margin-left:10px; }
.dd { position:relative; }
.dd-m { position:absolute; top:calc(100% + 12px); left:50%; transform:translateX(-50%); width:340px; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-float); padding:10px; display:none; gap:2px; z-index:20; }
.dd-m::before { content:""; position:absolute; left:0; right:0; top:-14px; height:14px; }
.dd:hover .dd-m, .dd:focus-within .dd-m { display:grid; }
.dd-m a { display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px; align-items:center; padding:10px 12px; border-radius:14px; color:var(--ink); text-decoration:none; }
.dd-m a:hover, .dd-m a:focus-visible { background:var(--page); outline:none; }
.dd-m a[aria-current="page"] b { color:var(--red-text); }
.dd-m .mi { width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:var(--blue-soft); color:var(--blue); }
.dd-m a:nth-child(even) .mi { background:var(--red-soft); color:var(--red-text); }
.dd-m b { display:block; font-family:var(--font-display); font-size:16px; line-height:21px; font-weight:700; }
.dd-m small { display:block; font-size:13px; line-height:18px; color:var(--ink-muted); margin-top:1px; }
.dd-m.mega { width:620px; grid-template-columns:1fr 1fr; gap:4px 14px; padding:16px; }
.dd-m.mega .col { display:flex; flex-direction:column; gap:2px; min-width:0; }
.dd-m.mega h6 { margin:2px 12px 8px; font-family:var(--font-display); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue-text); font-weight:800; }
.dd-m.mega .col a { grid-template-columns:minmax(0,1fr) auto; padding:8px 12px; }
.dd-m.mega .col a span { font-size:13px; color:var(--ink-muted); font-variant-numeric:tabular-nums; }
.dd-m.mega .col a.all { margin-top:6px; background:var(--blue-soft); }
.dd-m.mega .col a.all b { color:var(--blue-text); }
.dd-m.mega .wide { grid-column:1 / -1; border-top:1px solid var(--line); margin-top:8px; padding-top:8px; }
.menu-btn { display:none; width:46px; height:46px; border-radius:50%; border:1.5px solid var(--line-strong); background:#ffffff; color:var(--ink); place-items:center; cursor:pointer; margin-left:8px; }
.menu-btn svg { width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; }
.mnav { display:none; }
@media (max-width:1100px) {
  .nav > a:not(.btn), .nav .dd { display:none; }
  .menu-btn { display:grid; }
  .mnav:not([hidden]) { display:block; position:fixed; left:0; right:0; top:calc(84px + env(safe-area-inset-top,0px)); bottom:0; background:#ffffff; overflow-y:auto; border-top:1px solid var(--line); padding:12px 0 calc(32px + env(safe-area-inset-bottom,0px)); z-index:30; }
  header.site .mnav .wrap { display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:8px; height:auto; }
  .mnav details { border:1px solid var(--line); border-radius:var(--r-md); padding:0 16px; background:#ffffff; }
  .mnav summary { font-size:18px; padding:14px 0; }
  .mnav details a, .mnav > .wrap > a:not(.btn) { display:flex; justify-content:space-between; align-items:center; padding:12px 4px; border-top:1px solid var(--line); color:var(--ink); text-decoration:none; font-weight:600; font-size:17px; }
  .mnav > .wrap > a:not(.btn) { border:1px solid var(--line); border-radius:var(--r-md); padding:14px 16px; font-family:var(--font-display); font-weight:700; font-size:18px; }
  .mnav details a small { color:var(--ink-muted); font-weight:500; font-size:14px; }
  .mnav .btn { margin-top:10px; width:100%; }
  body.menu-open { overflow:hidden; }
}
@media (max-width:480px) { header.site .wrap { height:72px; } .logo { height:42px; } .nav .btn { display:none; } .mnav:not([hidden]) { top:calc(72px + env(safe-area-inset-top,0px)); } }

/* Seitenkopf der Unterseiten */
.phero { position:relative; overflow:hidden; background:linear-gradient(180deg,#ffffff 0%,#ffffff 30%,var(--surface-tint) 100%); }
.phero > .wrap { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:56px; align-items:center; padding-block:clamp(36px,5vw,64px) clamp(48px,6vw,84px); position:relative; z-index:1; }
.phero.solo > .wrap { grid-template-columns:minmax(0,1fr); }
.phero.solo > .wrap > div { max-width:860px; }
.phero h1 { font-size:clamp(38px,5vw,62px); line-height:1.04; margin-top:16px; }
.phero h1 em { font-style:normal; color:var(--red); }
.phero .lead { margin-top:18px; }
.phero .cta { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.phero .pic { position:relative; min-width:0; }
.phero .pic img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r-xl); box-shadow:var(--shadow-card); }
.phero .pic .float { position:absolute; left:-24px; bottom:-22px; background:#ffffff; border-radius:var(--r-lg); box-shadow:var(--shadow-float); padding:14px 18px; display:flex; gap:12px; align-items:center; max-width:300px; }
.phero .pic .float .mi { width:42px; height:42px; border-radius:50%; background:var(--red-soft); color:var(--red); display:grid; place-items:center; flex:none; }
.phero .pic .float b { display:block; font-family:var(--font-display); font-size:16px; line-height:21px; }
.phero .pic .float span { font-size:14px; line-height:19px; color:var(--ink-muted); }
.phero .swoosh { left:-6%; bottom:4px; width:58%; height:110px; opacity:.85; z-index:0; }
@media (max-width:900px) { .phero > .wrap { grid-template-columns:minmax(0,1fr); gap:36px; } .phero .pic .float { left:12px; } .phero .swoosh { width:100%; } }
.crumbs { display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:14px; line-height:20px; color:var(--ink-muted); margin:0; padding:0; list-style:none; }
.crumbs a { color:var(--blue-text); text-decoration:none; font-weight:600; }
.crumbs a:hover { text-decoration:underline; }
.crumbs li + li::before { content:"›"; margin-right:6px; color:var(--line-strong); }
.subnav { background:#ffffff; border-bottom:1px solid var(--line); }
.subnav .wrap { display:flex; gap:8px; overflow-x:auto; padding-block:12px; scrollbar-width:none; }
.subnav .wrap::-webkit-scrollbar { display:none; }
.pill { display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 16px; border-radius:999px; border:1.5px solid var(--line); background:#ffffff; color:var(--ink); text-decoration:none; font-weight:600; font-size:15px; white-space:nowrap; cursor:pointer; font-family:inherit; }
.pill:hover { border-color:var(--blue); color:var(--blue-text); }
.pill[aria-current="page"], .pill[aria-pressed="true"] { background:var(--blue); border-color:var(--blue); color:#ffffff; }
.pill .n { font-size:13px; opacity:.75; font-variant-numeric:tabular-nums; }

/* Fließtext */
.prose { font-size:18px; line-height:31px; color:var(--ink); max-width:72ch; overflow-wrap:break-word; }
.prose > * + * { margin-top:16px; }
.prose h2 { font-size:clamp(26px,3vw,32px); line-height:1.2; margin-top:44px; }
.prose h3 { font-size:22px; line-height:29px; margin-top:34px; }
.prose h4 { font-size:19px; line-height:26px; margin-top:28px; color:var(--blue-text); }
.prose h2:first-child, .prose h3:first-child, .prose h4:first-child { margin-top:0; }
.prose a { color:var(--blue-text); text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:3px; }
.prose a:hover { color:var(--red-text); }
.prose ul, .prose ol { padding-left:0; list-style:none; }
.prose ul li, .prose ol li { position:relative; padding-left:28px; }
.prose li + li { margin-top:8px; }
.prose ul li::before { content:""; position:absolute; left:6px; top:12px; width:8px; height:8px; border-radius:50%; background:var(--red); }
.prose ol { counter-reset:li; }
.prose ol li { counter-increment:li; }
.prose ol li::before { content:counter(li); position:absolute; left:0; top:3px; width:22px; height:22px; border-radius:50%; background:var(--blue-soft); color:var(--blue-text); font-size:13px; line-height:22px; text-align:center; font-weight:700; font-family:var(--font-display); }
.prose img { height:auto; border-radius:var(--r-md); margin-block:8px; background:var(--blue-soft); }
.prose figure { margin:24px 0; }
.prose figcaption { font-size:14px; line-height:21px; color:var(--ink-muted); margin-top:8px; }
.prose blockquote { margin:24px 0; padding:18px 22px; border-left:4px solid var(--red); background:var(--red-soft); border-radius:0 var(--r-md) var(--r-md) 0; }
.prose .lede { font-size:20px; line-height:32px; color:var(--ink-muted); font-weight:500; }
.prose .ar { font-family:var(--font-arabic); font-size:27px; line-height:1.9; text-align:right; color:var(--ink); }
.prose li.ar { padding-left:0; padding-right:28px; }
.prose li.ar::before { left:auto; right:6px; }
.prose .table-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-md); margin:24px 0; background:#ffffff; }
.prose table { min-width:520px; width:100%; font-size:16px; line-height:24px; }
.prose td, .prose th { padding:10px 14px; vertical-align:top; font-variant-numeric:normal; }
.prose tr:nth-child(even) td { background:var(--page); }
.prose td.ar { font-size:22px; }
.prose em { color:inherit; }
.audio-row { margin-top:12px; }
.audio { display:inline-flex; align-items:center; gap:10px; height:44px; padding:0 18px 0 8px; border-radius:999px; background:var(--blue-soft); color:var(--blue-text) !important; text-decoration:none !important; font-family:var(--font-display); font-weight:700; font-size:15px; }
.audio::before { content:""; width:30px; height:30px; border-radius:50%; background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 7l9 5-9 5z' fill='%23fff'/%3E%3C/svg%3E") center/18px no-repeat; }
.audio:hover { background:#d6eef7; }

/* Bausteine */
.split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px; }
@media (max-width:860px) { .split { grid-template-columns:minmax(0,1fr); } }
.panel-card { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); padding:clamp(24px,3vw,40px); min-width:0; }
.panel-card h2 { font-size:clamp(26px,3vw,34px); margin-top:12px; }
.panel-card .prose { margin-top:18px; font-size:17px; line-height:29px; }
.tiles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
@media (max-width:1000px) { .tiles { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:540px) { .tiles { grid-template-columns:minmax(0,1fr); } }
.tile { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); padding:24px; min-width:0; display:flex; flex-direction:column; gap:10px; transition:transform .25s ease-out, box-shadow .25s ease-out; }
.tile:hover { transform:translateY(-3px); box-shadow:var(--shadow-card); }
.tile .mi { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:var(--blue-soft); color:var(--blue); }
.tile:nth-child(4n+2) .mi, .tile:nth-child(4n+3) .mi { background:var(--red-soft); color:var(--red-text); }
.tile .mi .ico { width:26px; height:26px; }
.tile h3 { font-size:19px; line-height:25px; }
.tile p { font-size:15px; line-height:23px; color:var(--ink-muted); }
.tile .k { font-family:var(--font-display); font-weight:900; font-size:14px; color:var(--red-text); letter-spacing:.1em; }
.stats .wrap { grid-template-columns:repeat(5,minmax(0,1fr)); }
@media (max-width:900px) { .stats .wrap { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.lcards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.lcards.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:1000px) { .lcards, .lcards.three { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .lcards, .lcards.three { grid-template-columns:minmax(0,1fr); } }
.lcard { position:relative; display:flex; flex-direction:column; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; text-decoration:none; color:var(--ink); box-shadow:var(--shadow-card); transition:transform .25s ease-out, box-shadow .25s ease-out; min-width:0; }
.lcard:hover { transform:translateY(-3px); box-shadow:var(--shadow-float); }
.lcard .m { aspect-ratio:16/10; overflow:hidden; background:var(--blue-soft); }
.lcard .m img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease-out; }
.lcard:hover .m img { transform:scale(1.04); }
.lcard .b { padding:20px 22px 22px; display:flex; flex-direction:column; gap:8px; flex:1; }
.lcard h3 { font-size:21px; line-height:27px; }
.lcard p { font-size:15px; line-height:23px; color:var(--ink-muted); }
.lcard .go { margin-top:auto; padding-top:8px; display:inline-flex; align-items:center; gap:8px; font-family:var(--font-display); font-weight:700; font-size:15px; color:var(--red-text); }
.lcard .go svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2.2; transition:transform .2s ease-out; }
.lcard:hover .go svg { transform:translateX(4px); }
.callout { display:flex; gap:16px; align-items:flex-start; padding:20px 22px; border-radius:var(--r-md); background:var(--blue-soft); }
.callout.warm { background:var(--red-soft); }
.callout .mi { width:44px; height:44px; border-radius:50%; background:#ffffff; color:var(--blue); display:grid; place-items:center; flex:none; }
.callout.warm .mi { color:var(--red); }
.callout b { font-family:var(--font-display); font-size:18px; line-height:24px; display:block; }
.callout p { font-size:16px; line-height:25px; color:var(--ink); margin-top:4px; }
.big-num { font-family:var(--font-display); font-weight:900; font-size:clamp(44px,6vw,64px); line-height:1; color:var(--red); letter-spacing:-.03em; }

/* Themen mit Seitennavigation (Hinweise, Tipps, FAQ, Rechtliches) */
.topic-layout { display:grid; grid-template-columns:270px minmax(0,1fr); gap:40px; align-items:start; }
@media (max-width:900px) { .topic-layout { grid-template-columns:minmax(0,1fr); gap:20px; } }
.side { position:sticky; top:108px; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); padding:12px; }
.side h6 { margin:8px 12px 10px; font-family:var(--font-display); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue-text); font-weight:800; }
.side a { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:12px; color:var(--ink); text-decoration:none; font-weight:600; font-size:16px; }
.side a:hover { background:var(--page); }
.side a[aria-current="page"], .side a.on { background:var(--blue-soft); color:var(--blue-text); }
.side a .ico { color:var(--blue); width:20px; height:20px; }
.side a .n { margin-left:auto; font-size:13px; color:var(--ink-muted); font-variant-numeric:tabular-nums; }
@media (max-width:900px) { .side { position:static; display:flex; overflow-x:auto; gap:6px; padding:8px; scrollbar-width:none; } .side h6 { display:none; } .side a { white-space:nowrap; flex:none; } .side a .n { display:none; } }
.topics { display:flex; flex-direction:column; gap:24px; min-width:0; }
.topic { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(22px,3vw,36px); min-width:0; }
.topic-head { display:flex; gap:16px; align-items:center; margin-bottom:18px; }
.topic-head .mi { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:var(--blue-soft); color:var(--blue); flex:none; }
.topic:nth-child(even) .topic-head .mi { background:var(--red-soft); color:var(--red-text); }
.topic-head h2 { font-size:clamp(24px,2.6vw,30px); }
.topic-head small { display:block; font-size:14px; color:var(--ink-muted); font-family:var(--font-sans); font-weight:500; letter-spacing:0; margin-top:2px; }
.checks { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.checks li > span { min-width:0; overflow-wrap:break-word; word-break:break-word; }
.checks li { display:grid; grid-template-columns:28px minmax(0,1fr); gap:12px; font-size:17px; line-height:28px; }
.checks li::before { content:""; width:24px; height:24px; margin-top:2px; border-radius:50%; background:var(--blue-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23006a8f' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat; }
.checks.warn li::before { background:var(--red-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 7v6M12 17h.01' fill='none' stroke='%23c8141b' stroke-width='2.8' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat; }
.topic .prose { font-size:17px; line-height:29px; max-width:none; }
.faq-tools { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; margin-bottom:24px; }
.search { position:relative; flex:1 1 320px; max-width:560px; }
.search input { width:100%; height:56px; border-radius:999px; border:1.5px solid var(--line-strong); background:#ffffff; padding:0 22px 0 52px; font:inherit; font-size:17px; color:var(--ink); }
.search input:focus { outline:3px solid var(--focus); outline-offset:2px; border-color:var(--blue); }
.search svg { position:absolute; left:18px; top:50%; transform:translateY(-50%); width:22px; height:22px; stroke:var(--ink-muted); fill:none; stroke-width:2; }
.faq-group + .faq-group { margin-top:8px; }
.faq-group .faq-list { margin-top:4px; }
.faq-group details p { max-width:none; }
.empty { padding:28px; text-align:center; color:var(--ink-muted); background:#ffffff; border:1px dashed var(--line-strong); border-radius:var(--r-md); }

/* Geschichte */
.story { display:grid; grid-template-columns:300px minmax(0,1fr); gap:56px; align-items:start; }
@media (max-width:900px) { .story { grid-template-columns:minmax(0,1fr); gap:28px; } }
.vtl { position:sticky; top:108px; list-style:none; margin:0; padding:22px 22px 8px; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); }
@media (max-width:900px) { .vtl { position:static; } }
.vtl li { position:relative; padding:0 0 22px 34px; }
.vtl li::before { content:""; position:absolute; left:7px; top:10px; bottom:-10px; width:2px; background:var(--line); }
.vtl li:last-child::before { display:none; }
.vtl li::after { content:""; position:absolute; left:0; top:4px; width:16px; height:16px; border-radius:50%; background:#ffffff; border:4px solid var(--red); }
.vtl li:nth-child(even)::after { border-color:var(--blue); }
.vtl b { display:block; font-family:var(--font-display); font-weight:900; font-size:22px; line-height:24px; color:var(--ink); }
.vtl span { display:block; font-size:15px; line-height:22px; color:var(--ink-muted); margin-top:4px; }
.letter { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-xl); padding:clamp(26px,4vw,56px); box-shadow:var(--shadow-card); }
.letter .prose { max-width:none; }
.letter .sig { margin-top:32px; display:flex; gap:16px; align-items:center; padding-top:24px; border-top:1px dashed var(--line); }
.letter .sig img { width:64px; height:64px; border-radius:50%; object-fit:cover; object-position:30% 25%; }
.letter .sig b { font-family:var(--font-display); font-size:18px; display:block; }
.letter .sig span { font-size:15px; color:var(--ink-muted); }
.pull { margin:36px 0; padding:28px 30px; border-radius:var(--r-lg); background:var(--surface-tint); position:relative; }
.pull p { font-family:var(--font-display); font-weight:800; font-size:clamp(22px,2.6vw,28px); line-height:1.3; letter-spacing:-.01em; color:var(--ink); }
.pull small { display:block; margin-top:10px; font-size:15px; color:var(--ink-muted); }

/* Galerie */
.gallery { columns:3 300px; column-gap:20px; }
.gallery button { display:block; width:100%; margin:0 0 20px; padding:0; border:0; background:none; cursor:zoom-in; break-inside:avoid; border-radius:var(--r-lg); overflow:hidden; position:relative; }
.gallery img { width:100%; height:auto; transition:transform .6s ease-out; }
.gallery button:hover img { transform:scale(1.03); }
.gallery button span { position:absolute; left:12px; bottom:12px; right:12px; text-align:left; color:#ffffff; font-size:14px; line-height:19px; font-weight:600; padding:8px 12px; border-radius:12px; background:rgba(18,24,32,.55); opacity:0; transition:opacity .2s; }
.gallery button:hover span, .gallery button:focus-visible span { opacity:1; }
.gallery button:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
dialog.lightbox { border:0; padding:0; background:transparent; max-width:min(1100px,94vw); max-height:92vh; }
dialog.lightbox::backdrop { background:rgba(18,24,32,.82); }
dialog.lightbox img { max-width:100%; max-height:84vh; border-radius:var(--r-lg); margin:0 auto; }
dialog.lightbox p { color:#ffffff; text-align:center; margin-top:10px; font-size:15px; }
dialog.lightbox .x { position:absolute; right:10px; top:10px; width:44px; height:44px; border-radius:50%; border:0; background:#ffffff; color:var(--ink); font-size:24px; cursor:pointer; }

/* Reisen-Übersicht */
.tlist { display:flex; flex-direction:column; gap:20px; }
.trow { display:grid; grid-template-columns:280px minmax(0,1fr) auto; gap:0; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-card); min-width:0; }
.trow .m { position:relative; min-height:200px; background:var(--blue-soft); }
.trow .m img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.trow .m .badge { position:absolute; left:14px; top:14px; }
.trow .b { padding:22px 26px; display:flex; flex-direction:column; gap:10px; min-width:0; }
.trow h3 { font-size:24px; line-height:29px; }
.trow .when { font-family:var(--font-display); font-weight:700; color:var(--blue-text); font-size:16px; }
.trow .aps { display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.ap { display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 12px; border-radius:999px; background:var(--page); font-size:14px; font-weight:600; color:var(--ink); }
.ap::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--success); }
.ap.off { color:var(--soldout); text-decoration:line-through; }
.ap.off::before { background:var(--soldout); }
.trow .p { padding:22px 26px; display:flex; flex-direction:column; justify-content:center; align-items:flex-end; gap:12px; border-left:1px dashed var(--line); min-width:200px; }
.trow.is-off { opacity:.72; }
.trow.is-off .m img { filter:grayscale(.6); }
@media (max-width:900px) { .trow { grid-template-columns:minmax(0,1fr); } .trow .m { min-height:180px; } .trow .p { border-left:0; border-top:1px dashed var(--line); align-items:flex-start; flex-direction:row; justify-content:space-between; flex-wrap:wrap; } }

/* Kontakt */
.cgrid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
@media (max-width:900px) { .cgrid { grid-template-columns:minmax(0,1fr); } }
.ccard { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); padding:26px; display:flex; flex-direction:column; gap:10px; min-width:0; }
.ccard .mi { width:52px; height:52px; border-radius:16px; background:var(--blue-soft); color:var(--blue); display:grid; place-items:center; }
.ccard:nth-child(2) .mi { background:var(--red-soft); color:var(--red-text); }
.ccard h3 { font-size:20px; }
.ccard .v { font-size:19px; line-height:28px; font-weight:600; overflow-wrap:anywhere; }
.ccard .acts { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; padding-top:8px; }
.mapcard { position:relative; border-radius:var(--r-xl); overflow:hidden; min-height:320px; background:linear-gradient(135deg,var(--blue-soft),var(--surface-tint)); display:grid; place-items:center; text-align:center; padding:32px; border:1px solid var(--line); }
.mapcard .pin { width:64px; height:64px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--red); display:grid; place-items:center; margin:0 auto 18px; box-shadow:var(--shadow-float); }
.mapcard .pin i { width:22px; height:22px; border-radius:50%; background:#ffffff; display:block; }
.mapcard svg.grid { position:absolute; inset:0; width:100%; height:100%; opacity:.5; }

/* Rechtliches */
.doc { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(24px,4vw,52px); min-width:0; }
.doc .prose { font-size:17px; line-height:29px; max-width:none; }
.doc .prose h2 { font-size:24px; }
.doc .prose h3 { font-size:19px; }

/* Startseite: Wissens-Teaser */
.know { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
@media (max-width:900px) { .know { grid-template-columns:minmax(0,1fr); } }

/* ===== Bibliothek ===== */
.lib-hero { background:linear-gradient(180deg,#ffffff 0%,#ffffff 30%,var(--surface-tint) 100%); position:relative; overflow:hidden; }
.lib-hero > .wrap { padding-block:clamp(32px,4.5vw,60px) clamp(40px,5vw,68px); position:relative; z-index:1; }
.lib-hero h1 { font-size:clamp(36px,4.8vw,58px); line-height:1.05; margin-top:14px; }
.lib-hero h1 em { font-style:normal; color:var(--red); }
.lib-hero .lead { margin-top:14px; }
.lib-hero .search { margin-top:26px; }
.lib-hero .swoosh { right:-4%; bottom:6px; width:46%; height:100px; opacity:.7; }
.lib-hero .row { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.langs { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:34px; }
@media (max-width:700px) { .langs { grid-template-columns:minmax(0,1fr); } }
.lang-card { position:relative; display:block; border-radius:var(--r-xl); overflow:hidden; min-height:320px; color:#ffffff; text-decoration:none; box-shadow:var(--shadow-card); }
.lang-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s ease-out; }
.lang-card:hover img { transform:scale(1.04); }
.lang-card::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(14,20,30,.82) 0%,rgba(14,20,30,.2) 60%,rgba(14,20,30,0) 80%); }
.lang-card .in { position:absolute; left:28px; right:28px; bottom:26px; z-index:1; }
.lang-card .code { display:inline-grid; place-items:center; width:46px; height:46px; border-radius:50%; background:#ffffff; color:var(--red-text); font-family:var(--font-display); font-weight:900; font-size:15px; }
.lang-card b { display:block; font-family:var(--font-display); font-weight:900; font-size:clamp(30px,3.6vw,40px); line-height:1.05; margin-top:14px; letter-spacing:-.02em; }
.lang-card span { display:block; margin-top:6px; font-size:16px; line-height:23px; opacity:.94; }
.hubs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
@media (max-width:1000px) { .hubs { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .hubs { grid-template-columns:minmax(0,1fr); } }
.hub { display:flex; flex-direction:column; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; text-decoration:none; color:var(--ink); box-shadow:var(--shadow-card); transition:transform .25s ease-out, box-shadow .25s ease-out; min-width:0; }
.hub:hover { transform:translateY(-3px); box-shadow:var(--shadow-float); }
.hub .m { position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--blue-soft); }
.hub .m img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease-out; }
.hub:hover .m img { transform:scale(1.04); }
.hub .m::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(14,20,30,.72) 0%,rgba(14,20,30,0) 60%); }
.hub .m h3 { position:absolute; left:20px; right:20px; bottom:14px; z-index:1; color:#ffffff; font-size:23px; line-height:28px; font-weight:800; }
.hub .m .badge { position:absolute; right:14px; top:14px; z-index:1; }
.hub .b { padding:16px 20px 20px; display:flex; flex-direction:column; gap:10px; flex:1; }
.hub .b p { font-size:15px; line-height:23px; color:var(--ink-muted); }
.hub .tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; }
.hub .tags span { font-size:12px; line-height:16px; font-weight:600; padding:4px 10px; border-radius:999px; background:var(--page); color:var(--ink-muted); }
.hub-head { position:relative; border-radius:var(--r-xl); overflow:hidden; min-height:300px; display:grid; align-items:end; color:#ffffff; margin-top:18px; }
.hub-head img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hub-head::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(14,20,30,.84) 0%,rgba(14,20,30,.3) 60%,rgba(14,20,30,.08) 100%); }
.hub-head .in { position:relative; z-index:1; padding:clamp(24px,4vw,44px); max-width:780px; }
.hub-head h1 { font-size:clamp(32px,4.4vw,52px); line-height:1.05; color:#ffffff; }
.hub-head p { margin-top:10px; font-size:18px; line-height:28px; opacity:.94; }
.hub-head .eyebrow { color:#ffffff; }
.cats { display:flex; gap:8px; overflow-x:auto; padding:4px 2px 8px; margin:24px 0 20px; scrollbar-width:thin; }
.alist { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
@media (max-width:1000px) { .alist { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .alist { grid-template-columns:minmax(0,1fr); } }
.acard { display:flex; flex-direction:column; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; text-decoration:none; color:var(--ink); transition:transform .25s ease-out, box-shadow .25s ease-out; min-width:0; }
.acard:hover { transform:translateY(-3px); box-shadow:var(--shadow-card); }
.acard .m { position:relative; aspect-ratio:16/10; background:linear-gradient(135deg,var(--blue-soft),var(--surface-tint)); overflow:hidden; }
.acard .m img { width:100%; height:100%; object-fit:cover; }
.acard .m .no { position:absolute; left:12px; top:12px; min-width:34px; height:34px; padding:0 10px; border-radius:999px; background:#ffffff; color:var(--red-text); display:grid; place-items:center; font-family:var(--font-display); font-weight:900; font-size:15px; box-shadow:0 2px 8px rgba(31,42,55,.12); }
.acard .m .ph { position:absolute; inset:0; display:grid; place-items:center; color:var(--blue); opacity:.5; }
.acard .m .ph svg { width:44px; height:44px; }
.acard .b { padding:16px 18px 18px; display:flex; flex-direction:column; gap:6px; flex:1; }
.acard .cat { font-family:var(--font-display); font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:var(--blue-text); }
.acard h3 { font-size:19px; line-height:25px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.acard p { font-size:15px; line-height:22px; color:var(--ink-muted); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.acard .meta { margin-top:auto; padding-top:8px; display:flex; gap:12px; align-items:center; font-size:13px; color:var(--ink-muted); }
.acard .meta .au { display:inline-flex; align-items:center; gap:4px; color:var(--blue-text); font-weight:600; }
.acard .meta svg { width:15px; height:15px; }
.lib-more { display:flex; justify-content:center; margin-top:32px; }
.rows { display:flex; flex-direction:column; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.rows a { display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:18px; align-items:center; padding:16px 22px; border-top:1px solid var(--line); text-decoration:none; color:var(--ink); }
.rows a:first-child { border-top:0; }
.rows a:hover { background:var(--page); }
.rows time { font-size:14px; color:var(--ink-muted); font-variant-numeric:tabular-nums; }
.rows b { display:block; font-family:var(--font-display); font-size:17px; line-height:23px; }
.rows small { display:block; font-size:14px; color:var(--ink-muted); margin-top:2px; }
.lg { display:inline-grid; place-items:center; width:34px; height:24px; border-radius:6px; font-size:12px; font-weight:800; font-family:var(--font-display); background:var(--blue-soft); color:var(--blue-text); }
.lg.tr { background:var(--red-soft); color:var(--red-text); }
@media (max-width:600px) { .rows a { grid-template-columns:minmax(0,1fr) auto; } .rows time { grid-column:1 / -1; } }
.reader { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:56px; align-items:start; }
@media (max-width:1000px) { .reader { grid-template-columns:minmax(0,1fr); gap:28px; } }
.rhead { padding-block:28px 6px; }
.rhead h1 { font-size:clamp(32px,4.2vw,50px); line-height:1.08; margin-top:14px; max-width:22ch; }
.rhead .no { color:var(--red); }
.rmeta { display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; margin-top:16px; font-size:15px; color:var(--ink-muted); }
.rmeta span { display:inline-flex; align-items:center; gap:6px; }
.rmeta svg { width:17px; height:17px; }
.rpic { margin-top:28px; border-radius:var(--r-xl); overflow:hidden; background:var(--blue-soft); max-height:520px; }
.rpic img { width:100%; max-height:520px; object-fit:cover; }
.rbody { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-xl); padding:clamp(24px,4vw,56px); margin-top:28px; min-width:0; }
.rbody .prose { max-width:70ch; margin-inline:auto; }
.raside { position:sticky; top:108px; display:flex; flex-direction:column; gap:18px; margin-top:28px; }
@media (max-width:1000px) { .raside { position:static; margin-top:0; } }
.box { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); padding:18px; }
.box h6 { margin:0 0 10px; font-family:var(--font-display); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue-text); font-weight:800; }
.toc { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; max-height:52vh; overflow:auto; }
.toc a { display:block; padding:7px 10px; border-radius:10px; font-size:15px; line-height:21px; color:var(--ink); text-decoration:none; }
.toc a:hover, .toc a.on { background:var(--blue-soft); color:var(--blue-text); }
.side-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.side-list a { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; padding:9px 6px; border-top:1px solid var(--line); text-decoration:none; color:var(--ink); font-size:15px; line-height:21px; }
.side-list li:first-child a { border-top:0; }
.side-list a:hover { color:var(--red-text); }
.side-list a.on { color:var(--red-text); font-weight:700; }
.side-list i { font-style:normal; color:var(--ink-muted); font-variant-numeric:tabular-nums; min-width:22px; }
.pn { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:24px; }
@media (max-width:600px) { .pn { grid-template-columns:minmax(0,1fr); } }
.pn a { display:flex; flex-direction:column; gap:4px; padding:18px 22px; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); text-decoration:none; color:var(--ink); min-width:0; }
.pn a:hover { border-color:var(--blue); }
.pn a.nx { text-align:right; grid-column:2; }
@media (max-width:600px) { .pn a.nx { grid-column:1; } }
.pn small { font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--blue-text); font-family:var(--font-display); }
.pn b { font-family:var(--font-display); font-size:17px; line-height:23px; }
.loading { display:grid; place-items:center; min-height:40vh; color:var(--ink-muted); gap:14px; }
.spin { width:38px; height:38px; border-radius:50%; border:4px solid var(--blue-soft); border-top-color:var(--blue); animation:spin 1s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.hl { background:#fff2b3; border-radius:3px; }
.lib-section { padding-block:clamp(40px,5vw,64px); }
.lib-section + .lib-section { padding-top:0; }
.sec-row { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; margin-bottom:24px; }
.sec-row h2 { font-size:clamp(26px,3vw,34px); }
.sec-row a { font-family:var(--font-display); font-weight:700; color:var(--red-text); text-decoration:none; }

/* ---------- Audio-Player ---------- */
.player { --pl-played: var(--blue); --pl-rest: #cfe0e8; --pl-hover: #8fc3d6; --pl-live: var(--red);
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:16px; margin:14px 0 6px;
  padding:14px 16px 14px 14px; border-radius:var(--r-lg); background:linear-gradient(180deg,#fff, var(--surface-tint)); border:1px solid var(--line); box-shadow:var(--shadow-card); }
.player .pl-btn { width:52px; height:52px; border-radius:50%; border:0; background:var(--blue); color:#fff; display:grid; place-items:center; cursor:pointer; box-shadow:0 6px 16px rgba(0,121,163,.28); transition:transform .15s, background .15s; }
.player .pl-btn:hover { background:#006a8f; transform:scale(1.04); }
.player .pl-btn svg { width:22px; height:22px; fill:currentColor; stroke:none; }
.player .i-pause, .player.on .i-play { display:none; }
.player.on .i-pause { display:block; }
.player.on .pl-btn { background:var(--red); box-shadow:0 6px 16px rgba(237,28,36,.28); }
.pl-main { min-width:0; display:grid; grid-template-columns:minmax(0,1fr); gap:6px; }
.pl-top { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.pl-title { font-family:var(--font-display); font-weight:700; font-size:15px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.pl-time { font-size:13px; color:var(--ink-muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.pl-time b { color:var(--blue-text); font-weight:700; }
.pl-wave { position:relative; height:46px; cursor:pointer; touch-action:none; border-radius:8px; }
.pl-wave canvas { position:absolute; inset:0; width:100%; height:100%; }
.pl-wave:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.pl-side { display:flex; flex-direction:column; gap:6px; align-items:center; }
.pl-speed { min-width:46px; height:28px; padding:0 8px; border-radius:999px; border:1px solid var(--line-strong); background:#fff; color:var(--ink); font:700 12px var(--font-sans); cursor:pointer; font-variant-numeric:tabular-nums; }
.pl-speed:hover { border-color:var(--blue); color:var(--blue-text); }
.pl-open { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:var(--ink-muted); }
.pl-open:hover { color:var(--blue-text); background:var(--blue-soft); }
.pl-open svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.pl-fail { margin:0; font-size:13px; color:var(--red-text); }
.player.err .pl-btn { background:#9fb3bd; box-shadow:none; }
@media (max-width:560px) {
  .player { grid-template-columns:auto minmax(0,1fr); gap:12px; padding:12px; }
  .player .pl-btn { width:44px; height:44px; }
  .pl-side { grid-column:1 / -1; flex-direction:row; justify-content:flex-end; margin-top:-4px; }
  .pl-top { flex-wrap:wrap; row-gap:2px; }
}

/* ---------- Listen, Zitate, Merksätze im Lesetext ---------- */
.prose ul li, .prose ol li { padding-left:22px; }
.prose ul li::before { left:2px; top:13px; width:7px; height:7px; }
.prose ul.blist { display:grid; gap:10px; padding:18px 22px; background:var(--surface-tint); border-radius:var(--r-md); }
.prose ul.blist li + li { margin-top:0; }
.prose li.ar { padding-left:0; padding-right:22px; }
.prose li.ar::before { right:2px; }
.prose .quote { position:relative; margin:34px 0; padding:62px 30px 26px; border-radius:var(--r-lg);
  background:linear-gradient(160deg, var(--blue-soft) 0%, #ffffff 70%); border:1px solid var(--line);
  font-family:var(--font-display); font-size:21px; line-height:1.55; font-weight:500; color:var(--ink); }
.prose .quote::before { content:""; position:absolute; top:20px; left:28px; width:34px; height:26px; background:var(--red);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 26'%3E%3Cpath d='M0 26V15.6C0 6.9 4.6 1.7 13.2 0l1.6 3.6C10 5.1 7.7 8 7.5 12H14v14zm19.2 0V15.6C19.2 6.9 23.8 1.7 32.4 0L34 3.6c-4.8 1.5-7.1 4.4-7.3 8.4h6.5v14z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 26'%3E%3Cpath d='M0 26V15.6C0 6.9 4.6 1.7 13.2 0l1.6 3.6C10 5.1 7.7 8 7.5 12H14v14zm19.2 0V15.6C19.2 6.9 23.8 1.7 32.4 0L34 3.6c-4.8 1.5-7.1 4.4-7.3 8.4h6.5v14z'/%3E%3C/svg%3E") center/contain no-repeat; }
.prose .quote.quran { background:linear-gradient(160deg, #eef7fb 0%, #ffffff 70%); }
.prose .quote.quran::before { background:var(--blue); }
.prose .quote strong { color:var(--blue-text); }
.prose .note { position:relative; padding-top:18px; font-family:var(--font-display); font-size:21px; line-height:1.5; font-weight:600; color:var(--blue-text); }
.prose .note::before { content:""; position:absolute; top:0; left:0; width:44px; height:4px; border-radius:2px; background:var(--red); }
@media (max-width:560px) { .prose .quote { padding:50px 20px 20px; font-size:19px; } .prose .quote::before { left:20px; top:18px; } }
.side-list a { gap:12px; align-items:baseline; }
.side-list i { min-width:0; font-size:13px; }
.side-list i.d { width:6px; height:6px; border-radius:50%; background:var(--line-strong); align-self:center; }
.side-list a.on i.d { background:var(--red); }
.side-list .caps { font-size:13.5px; letter-spacing:.02em; }
.pl-title.caps { font-size:13.5px; letter-spacing:.03em; }

/* ---------- Suchergebnisse ---------- */
.lib-hero .langs { margin-top:26px; }
.s-status { margin-top:16px; font-variant-numeric:tabular-nums; }
.s-status b { color:var(--ink); }
.s-tip { margin-top:4px; }
mark { background:#fff1b8; color:inherit; border-radius:3px; padding:0 2px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.slist { display:flex; flex-direction:column; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.slist:empty { display:none; }
.sres { display:grid; gap:6px; padding:20px 24px; border-top:1px solid var(--line); text-decoration:none; color:var(--ink); min-width:0; }
.sres:first-child { border-top:0; }
.sres:hover { background:var(--page); }
.sres:hover b { color:var(--red-text); }
.sres .cat { font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--blue-text); }
.sres b { font-family:var(--font-display); font-size:19px; line-height:25px; }
.sres p { margin:0; font-size:15.5px; line-height:25px; color:var(--ink-muted); overflow-wrap:break-word; }
.sres .meta { display:flex; gap:14px; font-size:13px; color:var(--ink-muted); }
.sres .meta .au { display:inline-flex; align-items:center; gap:5px; color:var(--blue-text); }
.sres .meta .ico { width:15px; height:15px; }
#sfilter { margin-bottom:18px; }
#sfilter button { font:inherit; cursor:pointer; }
.spages { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; margin-bottom:28px; }
.spages h2 { grid-column:1 / -1; margin:0; }
.spages a { display:grid; gap:6px; padding:16px 18px; background:var(--red-soft); border-radius:var(--r-md); text-decoration:none; color:var(--ink); min-width:0; }
.spages a b { font-family:var(--font-display); font-size:17px; }
.spages a span { font-size:14px; line-height:21px; color:var(--ink-muted); overflow-wrap:break-word; }
.spages a:hover b { color:var(--red-text); }
@media (max-width:560px) { .sres { padding:16px 16px; } }
[hidden] { display:none !important; }

/* ---------- Sprachen ---------- */
.langsw { display:inline-flex; gap:2px; align-items:center; padding:2px; border-radius:999px; background:rgba(255,255,255,.14); }
.langsw a { display:inline-grid; place-items:center; min-width:34px; height:24px; padding:0 8px; border-radius:999px; color:#fff; text-decoration:none; font:700 12px/1 var(--font-sans); letter-spacing:.04em; }
.langsw a[lang="ur"] { font-family:"Noto Nastaliq Urdu", var(--font-arabic); font-size:13px; letter-spacing:0; line-height:1; padding-bottom:3px; }
.langsw a:hover { background:rgba(255,255,255,.22); }
.langsw a[aria-current] { background:#fff; color:var(--blue-text); }
.top .wrap { flex-wrap:wrap; row-gap:6px; }
.top .langsw { margin-inline-start:16px; }
.langsw-m { align-self:flex-start; background:var(--blue-soft); margin-bottom:8px; }
.langsw-m a { color:var(--blue-text); height:32px; min-width:44px; font-size:13px; }
.langsw-m a[aria-current] { background:var(--blue); color:#fff; }
.lang-note { margin:0 0 22px; padding:14px 18px; border-radius:var(--r-md); background:var(--blue-soft); color:var(--blue-text); font-weight:600; }
html[lang="ur"] .lang-note { font-family:"Noto Nastaliq Urdu", serif; line-height:2.2; }

/* ---------- Urdu: Nastaliq-Schrift und Leserichtung von rechts ---------- */
html[lang="ur"] { --font-display:"Red Hat Display", "Noto Nastaliq Urdu", Amiri, serif; --font-sans:"Red Hat Text", "Noto Nastaliq Urdu", Amiri, serif; }
html[lang="ur"] .saw { font-family:Amiri, serif; font-size:1.1em; line-height:1; }
html[lang="ur"] h1 { font-size:clamp(30px, 3.4vw, 46px) !important; line-height:1.75 !important; }
html[lang="ur"] h2 { font-size:clamp(24px, 2.5vw, 32px) !important; line-height:1.8 !important; }
html[lang="ur"] h3 { font-size:clamp(19px, 1.7vw, 22px); line-height:1.85; }
html[lang="ur"] body { line-height:2.05; }
html[lang="ur"] h1, html[lang="ur"] h2, html[lang="ur"] h3, html[lang="ur"] h4, html[lang="ur"] h5, html[lang="ur"] h6 { line-height:1.85; letter-spacing:0; font-weight:700; }
html[lang="ur"] .eyebrow, html[lang="ur"] h5, html[lang="ur"] h6 { letter-spacing:0; text-transform:none; }
html[lang="ur"] .prose { line-height:2.25; }
html[lang="ur"] input, html[lang="ur"] button { font-family:var(--font-sans); }
html[lang="ur"] .tabnum, html[lang="ur"] .amt, html[lang="ur"] time, html[lang="ur"] .price { font-family:"Red Hat Text", sans-serif; }
[dir="rtl"] .search svg { left:auto; right:18px; }
[dir="rtl"] .search input { padding:0 52px 0 22px; }
[dir="rtl"] .prose ul li, [dir="rtl"] .prose ol li { padding-left:0; padding-right:22px; }
[dir="rtl"] .prose ul li::before { left:auto; right:2px; }
[dir="rtl"] .prose ol li::before { left:auto; right:0; }
[dir="rtl"] .prose .quote::before { left:auto; right:28px; transform:scaleX(-1); }
[dir="rtl"] .prose .note::before { left:auto; right:0; }
[dir="rtl"] .swoosh { transform:scaleX(-1); }
[dir="rtl"] .crumbs li + li::before { content:"‹"; margin-right:0; margin-left:6px; }
[dir="rtl"] .btn svg, html[dir="rtl"] a > svg[viewBox="0 0 24 24"]:last-child { transform:scaleX(-1); }
[dir="rtl"] .dd-t svg { transform:none; }
[dir="rtl"] .wa { right:auto; left:calc(20px + env(safe-area-inset-left,0px)); }
[dir="rtl"] .doc[dir="ltr"] { text-align:left; }

/* Deutsch/Türkisch innerhalb einer Urdu-Seite (Bibliothek) wieder links-nach-rechts */
[dir="ltr"] .search svg { left:18px; right:auto; }
[dir="ltr"] .search input { padding:0 22px 0 52px; }
[dir="ltr"] .prose ul li, [dir="ltr"] .prose ol li { padding-right:0; padding-left:22px; }
[dir="ltr"] .prose ul li::before { right:auto; left:2px; }
[dir="ltr"] .prose ol li::before { right:auto; left:0; }
[dir="ltr"] .prose .quote::before { right:auto; left:28px; transform:none; }
[dir="ltr"] .prose .note::before { right:auto; left:0; }
[dir="ltr"] .swoosh { transform:none; }
[dir="ltr"] .crumbs li + li::before { content:"›"; margin-left:0; margin-right:6px; }
[dir="ltr"] .btn svg, [dir="ltr"] a > svg[viewBox="0 0 24 24"]:last-child { transform:none; }
html[lang="ur"] [lang="de"], html[lang="ur"] [lang="tr"] { --font-display:"Red Hat Display", Amiri, "Helvetica Neue", Arial, sans-serif; --font-sans:"Red Hat Text", Amiri, "Helvetica Neue", Arial, sans-serif; line-height:normal; }
html[lang="ur"] [lang="de"] h1, html[lang="ur"] [lang="tr"] h1, html[lang="ur"] [lang="de"] h2, html[lang="ur"] [lang="tr"] h2 { line-height:1.15 !important; }
html[lang="ur"] .phero .swoosh, html[lang="ur"] .lib-hero .swoosh { opacity:.35; }
[dir="rtl"] .flights .t, [dir="rtl"] .amt { direction:ltr; unicode-bidi:isolate; }
[dir="rtl"] .flights .t { text-align:right; }

/* ---------- Reise-Detailseite ---------- */
.thero .tbadges { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.thero .badge:not(.free):not(.best) { background:var(--blue-soft); color:var(--blue-text); }
.thero .pic .float b { font-size:20px; line-height:24px; color:var(--red-text); }
.tfacts-wrap { position:relative; z-index:2; margin-top:-34px; }
.tfacts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); }
.tf { display:flex; gap:14px; align-items:center; padding:20px 22px; min-width:0; }
.tf + .tf { border-left:1px solid var(--line); }
.tf .mi { width:44px; height:44px; border-radius:14px; display:grid; place-items:center; background:var(--blue-soft); color:var(--blue); flex:none; }
.tf:nth-child(even) .mi { background:var(--red-soft); color:var(--red-text); }
.tf .mi .ico { width:22px; height:22px; }
.tf small { display:block; font-size:13px; line-height:18px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-muted); }
.tf b { display:block; font-family:var(--font-display); font-size:17px; line-height:23px; }
@media (max-width:900px) { .tfacts { grid-template-columns:repeat(2,minmax(0,1fr)); } .tf:nth-child(3) { border-left:0; } .tf:nth-child(n+3) { border-top:1px solid var(--line); } }
@media (max-width:520px) { .tfacts { grid-template-columns:minmax(0,1fr); } .tf + .tf { border-left:0; border-top:1px solid var(--line); } .tfacts-wrap { margin-top:-20px; } }
.tflight { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; align-items:start; }
@media (max-width:900px) { .tflight { grid-template-columns:minmax(0,1fr); } }
.tcard { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); padding:26px; display:flex; flex-direction:column; gap:20px; min-width:0; }
.troute { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0; position:relative; }
.troute li { display:flex; gap:18px; position:relative; padding-bottom:26px; }
.troute li:last-child { padding-bottom:0; }
.troute li::before { content:""; position:absolute; left:23px; top:48px; bottom:0; width:2px; background:repeating-linear-gradient(180deg,var(--sky) 0 6px,transparent 6px 12px); }
.troute li:last-child::before { display:none; }
.troute .n { width:48px; height:48px; border-radius:50%; display:grid; place-items:center; background:#ffffff; border:2px solid var(--blue); color:var(--blue); flex:none; position:relative; z-index:1; }
.troute li:nth-child(2) .n, .troute li:nth-child(3) .n { background:var(--red-strong); border-color:var(--red-strong); color:#ffffff; }
.troute .n .ico { width:22px; height:22px; }
.troute small { font-size:14px; line-height:20px; font-weight:700; color:var(--red-text); }
.troute h4 { font-size:20px; line-height:26px; margin-top:2px; }
.troute p { font-size:16px; line-height:25px; color:var(--ink-muted); margin-top:4px; }
.zgrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
@media (max-width:820px) { .zgrid { grid-template-columns:minmax(0,1fr); } }
.zcard { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-card); min-width:0; }
.zcard .head { position:relative; height:180px; }
.zcard .head img { width:100%; height:100%; object-fit:cover; }
.zcard .head::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(18,24,32,0) 30%,rgba(18,24,32,.62)); }
.zcard .head > div { position:absolute; left:24px; bottom:18px; z-index:1; color:#ffffff; }
.zcard .head .eyebrow { color:#ffffff; }
.zcard .head h3 { color:#ffffff; font-size:24px; line-height:30px; }
.zlist { list-style:none; margin:0; padding:22px 24px 24px; display:flex; flex-wrap:wrap; gap:10px; }
.zlist li { padding:8px 14px; border-radius:999px; background:var(--surface-tint); font-size:15px; line-height:20px; font-weight:600; }
.zlist li::before { display:none; }
.zcard:nth-child(2) .zlist li { background:var(--red-soft); }
.ocards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
@media (max-width:1000px) { .ocards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px) { .ocards { grid-template-columns:minmax(0,1fr); } }
.ocard { display:flex; flex-direction:column; background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; text-decoration:none; color:var(--ink); box-shadow:var(--shadow-card); transition:transform .25s ease-out, box-shadow .25s ease-out; min-width:0; }
.ocard:hover { transform:translateY(-3px); box-shadow:var(--shadow-float); }
.ocard .m { position:relative; aspect-ratio:16/10; overflow:hidden; }
.ocard .m img { width:100%; height:100%; object-fit:cover; }
.ocard .m .badge { position:absolute; left:14px; top:14px; }
.ocard .b { padding:18px 20px 20px; display:flex; flex-direction:column; gap:6px; flex:1; }
.ocard .price { margin-top:auto; padding-top:8px; }
.tbar { position:fixed; left:0; right:0; bottom:0; z-index:6; background:#ffffff; border-top:1px solid var(--line); box-shadow:0 -10px 30px rgba(31,42,55,.10); padding-bottom:env(safe-area-inset-bottom,0px); }
.tbar .wrap { display:flex; justify-content:space-between; align-items:center; gap:16px; padding-block:12px; }
.tbar b { display:block; font-family:var(--font-display); font-size:17px; line-height:22px; }
.tbar span { font-size:14px; line-height:20px; color:var(--ink-muted); }
body.has-tbar .wa { bottom:calc(88px + env(safe-area-inset-bottom,0px)); }
@media (max-width:520px) { .tbar b { font-size:15px; } .tbar span { font-size:13px; } }
/* Startseite/Reisen: ganze Karte klickbar */
.trip-media a.cover { position:absolute; inset:0; z-index:2; }
td.trip a { color:inherit; text-decoration:none; } td.trip a:hover { color:var(--blue-text); text-decoration:underline; }

/* ---------- Anmeldung (Field aus dem Designsystem) ---------- */
:root { --danger:#c8141b; }
.sr { position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.booking { scroll-margin-top:110px; }
.bk-steps { list-style:none; margin:0 0 28px; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; counter-reset:s; }
.bk-steps li { display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:var(--r-md); background:var(--surface-tint); color:var(--ink-muted); min-width:0; position:relative; }
.bk-steps li::before { display:none; }
.bk-steps .n { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:#ffffff; border:2px solid var(--line-strong); font-family:var(--font-display); font-weight:800; flex:none; }
.bk-steps .l { font-family:var(--font-display); font-weight:700; font-size:16px; line-height:20px; }
.bk-steps li.cur { background:var(--red-soft); color:var(--ink); }
.bk-steps li.cur .n { background:var(--red-strong); border-color:var(--red-strong); color:#ffffff; }
.bk-steps li.done { background:var(--blue-soft); color:var(--blue-text); }
.bk-steps li.done .n { background:var(--blue); border-color:var(--blue); color:#ffffff; }
@media (max-width:640px) { .bk-steps li { flex-direction:column; align-items:flex-start; gap:6px; padding:12px; } .bk-steps .l { font-size:14px; line-height:18px; } }
.bk-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:36px; align-items:start; }
@media (max-width:980px) { .bk-layout { grid-template-columns:minmax(0,1fr); } .bk-aside { order:-1; } }
.bk-form { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); padding:clamp(20px,3vw,34px); display:flex; flex-direction:column; gap:26px; min-width:0; }
.bk-h { font-size:22px; line-height:28px; outline:none; }
.bk-form fieldset { border:0; margin:0; padding:0; min-width:0; }
.bk-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 20px; }
.bk-wide { grid-column:1 / -1; }
.bk-sp { display:block; }
@media (max-width:600px) { .bk-grid { grid-template-columns:minmax(0,1fr); } .bk-sp { display:none; } }
.nt-field { display:flex; flex-direction:column; gap:8px; min-width:0; }
.nt-field label { font-size:15px; line-height:20px; font-weight:600; }
.nt-field input, .nt-field select, .nt-field textarea { font:inherit; font-size:17px; height:50px; padding:0 16px; border-radius:var(--r-sm); border:1.5px solid var(--line-strong); background:var(--surface); color:var(--ink); width:100%; min-width:0; }
.nt-field textarea { height:auto; padding:12px 16px; line-height:26px; resize:vertical; }
.nt-field input:focus-visible, .nt-field select:focus-visible, .nt-field textarea:focus-visible, .bk-room input:focus-visible + .box, .bk-meal input:focus-visible + .box, .bk-check input:focus-visible, .cb:focus-visible, .drop:focus-within { outline:3px solid var(--focus); outline-offset:2px; }
.nt-field .help { font-size:14px; line-height:20px; color:var(--ink-muted); }
.nt-field.is-error input, .nt-field.is-error select { border:2px solid var(--danger); }
.nt-field.is-error .help, .bk-check.is-error .help, .bk-up.is-error .help { color:var(--danger); font-weight:600; }
.req { color:var(--red-text); }
.opt { font-weight:400; color:var(--ink-muted); }
.bk-block { display:flex; flex-direction:column; gap:14px; }
.bk-block h4 { font-size:18px; line-height:24px; }
.bk-rooms { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
@media (max-width:1100px) { .bk-rooms { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.bk-room, .bk-meal { position:relative; cursor:pointer; display:block; min-width:0; }
.bk-room input, .bk-meal input { position:absolute; opacity:0; inset:0; }
.bk-room .box { display:flex; flex-direction:column; gap:4px; height:100%; padding:16px; border-radius:var(--r-md); border:1.5px solid var(--line); background:#ffffff; transition:border-color .2s, background-color .2s; }
.bk-room b { font-family:var(--font-display); font-size:16px; line-height:21px; }
.bk-room small { font-size:13px; line-height:18px; color:var(--ink-muted); }
.bk-room em { font-style:normal; font-weight:700; font-size:15px; color:var(--blue-text); margin-top:auto; padding-top:6px; }
.bk-room input:checked + .box { border:2px solid var(--red-strong); background:var(--red-soft); }
.bk-room input:checked + .box em { color:var(--red-text); }
.bk-counts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
@media (max-width:600px) { .bk-counts { grid-template-columns:minmax(0,1fr); } }
.bk-count { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px 12px 16px; border-radius:var(--r-md); background:var(--surface-tint); min-width:0; }
.bk-count .t b { display:block; font-size:16px; line-height:21px; }
.bk-count .t small { font-size:13px; line-height:18px; color:var(--ink-muted); }
.bk-count .ctl { display:flex; align-items:center; gap:6px; flex:none; }
.bk-count output { min-width:28px; text-align:center; font-family:var(--font-display); font-weight:800; font-size:20px; font-variant-numeric:tabular-nums; }
.cb { width:40px; height:40px; border-radius:50%; border:1.5px solid var(--blue); background:#ffffff; color:var(--blue-text); font-size:22px; line-height:1; cursor:pointer; display:grid; place-items:center; }
.cb:hover:not(:disabled) { background:var(--blue-soft); }
.cb:disabled { opacity:.35; cursor:default; }
.bk-meal .box { display:flex; flex-direction:column; gap:4px; padding:16px 18px 16px 56px; border-radius:var(--r-md); border:1.5px solid var(--line); background:#ffffff; position:relative; }
.bk-meal .box::before { content:""; position:absolute; left:18px; top:18px; width:24px; height:24px; border-radius:7px; border:2px solid var(--line-strong); background:#ffffff; }
.bk-meal input:checked + .box { border:2px solid var(--blue); background:var(--blue-soft); }
.bk-meal input:checked + .box::before { background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/16px no-repeat; border-color:var(--blue); }
.bk-meal b { font-family:var(--font-display); font-size:16px; line-height:22px; }
.bk-meal b em { font-style:normal; color:var(--blue-text); margin-left:6px; }
.bk-meal small { font-size:14px; line-height:20px; color:var(--ink-muted); }
.bk-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.bk-checks { display:flex; flex-direction:column; gap:12px; }
.bk-check { display:grid; grid-template-columns:24px minmax(0,1fr); gap:4px 12px; align-items:start; font-size:16px; line-height:24px; cursor:pointer; }
.bk-check input { width:22px; height:22px; margin:1px 0 0; accent-color:var(--blue); }
.bk-check .help { grid-column:2; font-size:14px; line-height:20px; }
.bk-check .help:empty { display:none; }
.bk-nav { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; padding-top:6px; border-top:1px solid var(--line); padding-top:22px; }
.bk-nav .btn svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }
@media (max-width:520px) { .bk-nav .btn { flex:1 1 100%; white-space:normal; height:auto; min-height:52px; padding-block:12px; } .bk-nav > span { display:none; } }
.bk-err { background:var(--red-soft); color:var(--danger); border-radius:var(--r-sm); padding:12px 16px; font-weight:600; }
.bk-aside { position:sticky; top:104px; min-width:0; }
.bk-aside-in { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); padding:22px 22px 20px; display:flex; flex-direction:column; gap:10px; border-top:5px solid var(--red-strong); }
.bk-aside h4 { font-size:20px; line-height:26px; }
.bk-aside ul { list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.bk-aside li { display:flex; justify-content:space-between; gap:12px; font-size:15px; line-height:21px; padding:0; }
.bk-aside li::before { display:none; }
.bk-aside li b { white-space:nowrap; font-variant-numeric:tabular-nums; }
.bk-aside .tot, .bk-aside .dep { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; padding-top:12px; border-top:1px solid var(--line); }
.bk-aside .tot b { font-family:var(--font-display); font-size:28px; line-height:32px; color:var(--red-text); white-space:nowrap; }
.bk-aside .dep b { font-size:18px; white-space:nowrap; color:var(--blue-text); }
.bk-aside small { display:block; font-size:13px; line-height:18px; color:var(--ink-muted); font-weight:400; }
.bk-aside .tot span, .bk-aside .dep span { font-weight:700; }
@media (max-width:980px) { .bk-aside { position:static; } }
.bk-sums { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
@media (max-width:640px) { .bk-sums { grid-template-columns:minmax(0,1fr); } }
.bk-sum { border-radius:var(--r-md); background:var(--surface-tint); padding:16px 18px; min-width:0; }
.bk-sum .h { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:8px; }
.bk-sum h4 { font-size:16px; line-height:22px; }
.lnk { border:0; background:none; padding:0; font:inherit; font-size:14px; font-weight:700; color:var(--blue-text); text-decoration:underline; cursor:pointer; }
.bk-sum dl { margin:0; display:flex; flex-direction:column; gap:6px; }
.bk-sum dl > div { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:10px; font-size:15px; line-height:21px; }
.bk-sum dt { color:var(--ink-muted); }
.bk-sum dd { margin:0; font-weight:600; overflow-wrap:anywhere; }
.bk-ups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
@media (max-width:640px) { .bk-ups { grid-template-columns:minmax(0,1fr); } }
.bk-up { display:flex; flex-direction:column; gap:8px; min-width:0; }
.bk-up .lab { font-size:15px; line-height:20px; font-weight:600; }
.bk-up .drop { display:flex; align-items:center; gap:14px; min-height:96px; padding:14px 16px; border-radius:var(--r-md); border:2px dashed var(--line-strong); background:#ffffff; cursor:pointer; transition:background-color .2s, border-color .2s; }
.bk-up .drop:hover, .bk-up .drop.over { background:var(--blue-soft); border-color:var(--blue); }
.bk-up.has .drop { border-style:solid; border-color:var(--blue); background:var(--blue-soft); }
.bk-up.is-error .drop { border-color:var(--danger); }
.bk-up .ico { width:48px; height:48px; border-radius:14px; background:var(--blue-soft); color:var(--blue); display:grid; place-items:center; flex:none; }
.bk-up .ico svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.bk-up .drop img { width:64px; height:64px; object-fit:cover; border-radius:10px; flex:none; }
.bk-up .txt { min-width:0; }
.bk-up .txt b { display:block; font-size:15px; line-height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--blue-text); }
.bk-up .txt small { font-size:13px; color:var(--ink-muted); }
.bk-up .help { font-size:13px; line-height:19px; color:var(--ink-muted); }
.bk-total { border-radius:var(--r-md); border:1.5px solid var(--line); overflow:hidden; }
.bk-total table { width:100%; border-collapse:collapse; }
.bk-total td, .bk-total th { padding:11px 16px; border-bottom:1px solid var(--line); font-size:15px; line-height:21px; text-align:start; vertical-align:top; }
.bk-total .q { color:var(--ink-muted); white-space:nowrap; }
.bk-total .a { text-align:end; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums; }
.bk-total tfoot th, .bk-total tfoot td { background:var(--red-soft); border-bottom:0; }
.bk-total tfoot th small { display:block; font-weight:400; font-size:13px; color:var(--ink-muted); }
.bk-total tfoot tr:first-child .a { font-family:var(--font-display); font-size:24px; color:var(--red-text); }
.bk-total tfoot tr.dep th, .bk-total tfoot tr.dep td { background:var(--blue-soft); }
.bk-total tfoot tr.dep .a { color:var(--blue-text); font-size:18px; }
@media (max-width:520px) { .bk-total .q { display:none; } }
.bk-bind { font-size:15px; line-height:23px; color:var(--ink-muted); background:var(--surface-warm); border-radius:var(--r-sm); padding:14px 16px; }
.bk-done { background:#ffffff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-card); padding:clamp(28px,5vw,56px); text-align:center; display:flex; flex-direction:column; align-items:center; gap:14px; max-width:760px; margin:0 auto; }
.bk-done .ic { width:72px; height:72px; border-radius:50%; background:var(--success-soft); color:var(--success); display:grid; place-items:center; font-size:34px; font-weight:800; }
.bk-done.fail .ic { background:var(--red-soft); color:var(--danger); }
.bk-done .ic svg { width:36px; height:36px; fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.bk-done h3 { font-size:26px; line-height:32px; }
.bk-done p { color:var(--ink-muted); max-width:56ch; }
.bk-done .bk-nav { border-top:0; width:100%; }
/* RTL */
[dir="rtl"] .tf + .tf { border-left:0; border-right:1px solid var(--line); }
@media (max-width:900px) { [dir="rtl"] .tf:nth-child(3) { border-right:0; } }
@media (max-width:520px) { [dir="rtl"] .tf + .tf { border-right:0; } }
[dir="rtl"] .troute li::before { left:auto; right:23px; }
[dir="rtl"] .bk-meal .box { padding:16px 56px 16px 18px; }
[dir="rtl"] .bk-meal .box::before { left:auto; right:18px; }
[dir="rtl"] .bk-meal b em { margin-left:0; margin-right:6px; }
[dir="rtl"] .bk-nav .btn svg { transform:scaleX(-1); }
[dir="rtl"] .zcard .head > div { left:auto; right:24px; }
[dir="rtl"] .ocard .m .badge { left:auto; right:14px; }
html[lang=ur] .bk-h { line-height:1.9; }
html[lang=ur] .nt-field input, html[lang=ur] .nt-field select { height:56px; }
.bk-total th { text-transform:none; letter-spacing:0; color:var(--ink); font-family:var(--font-display); font-weight:700; font-size:16px; background:none; }