/* ============================================================
   DXB Radar - main.css  (v2)
   Bilder dominieren, helle Sand-Abschnitte brechen das Dunkel auf.
   Mobile first. Umbrueche: 640px, 1024px.
   ============================================================ */

:root{
  /* Dunkel, aber angehoben - v1 war fast schwarz und wirkte leer */
  --bg:#0b1017;
  --bg-2:#0f1620;
  --surface:#161e2b;
  --surface-2:#1e2837;
  --line:#2a3547;
  --line-soft:#202a39;

  /* Helle Abschnitte fuer Kontrast */
  --sand:#f4efe4;
  --sand-2:#ebe3d3;
  --sand-line:#ddd2bd;
  --ink:#141a22;
  --ink-muted:#5b6675;

  --gold:#e0b34a;
  --gold-deep:#b98f2c;
  --blue:#5cc9ff;
  --green:#5ec96f;
  --orange:#ffab3d;
  --red:#ff6b6b;

  --text:#f3f6fa;
  --muted:#a2aec0;

  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --wrap:1200px;
  --wrap-mid:960px;
  --wrap-article:760px;
  --r:10px;
  --r-sm:6px;
  --r-btn:4px;
  --ticker-h:34px;
  --header-h:58px;
  --sec:3.25rem;

  color-scheme:dark;
}

html[lang="ar"],html[lang="ur"],html[lang="fa"]{--font-sans:'Noto Sans Arabic','Inter',system-ui,sans-serif;}
html[lang="hi"]{--font-sans:'Noto Sans Devanagari','Inter',system-ui,sans-serif;}
html[lang="zh"]{--font-sans:'Inter','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--ticker-h) + var(--header-h) + 12px);}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--font-sans);font-size:16.5px;line-height:1.68;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--blue);text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3,h4{line-height:1.14;letter-spacing:-.022em;margin:0 0 .55em;font-weight:800;}
p{margin:0 0 1rem;}
ul{margin:0;padding:0;list-style:none;}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:3px;}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 1.15rem;}
.wrap-mid{max-width:var(--wrap-mid);}
.mono{font-family:var(--font-mono);}
.icon{width:1.25em;height:1.25em;flex:none;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.82rem 1.3rem;border-radius:var(--r-btn);border:1px solid transparent;
  font-size:.94rem;font-weight:650;cursor:pointer;white-space:nowrap;
  transition:background .18s,border-color .18s,color .18s,transform .18s,box-shadow .18s;
}
.btn:hover{text-decoration:none;}
.btn .icon{width:1.05rem;height:1.05rem;}
.btn-gold{background:var(--gold);color:#12161c;box-shadow:0 4px 18px rgba(224,179,74,.18);}
.btn-gold:hover{background:#eec25c;transform:translateY(-2px);box-shadow:0 10px 30px rgba(224,179,74,.32);}
.btn-ghost{background:rgba(92,201,255,.06);color:var(--blue);border-color:rgba(92,201,255,.4);}
.btn-ghost:hover{background:rgba(92,201,255,.13);border-color:var(--blue);transform:translateY(-2px);}
.btn-dark{background:#12161c;color:#fff;}
.btn-dark:hover{background:#000;transform:translateY(-2px);}
.btn-ink{background:var(--ink);color:#fff;}
.btn-ink:hover{background:#000;transform:translateY(-2px);}
.btn-sm{padding:.5rem .85rem;font-size:.82rem;}
.btn-lg{padding:1rem 1.75rem;font-size:1.02rem;}
.btn-block{width:100%;}

/* ---------- Ticker ---------- */
.ticker{
  height:var(--ticker-h);background:#080c12;border-bottom:1px solid var(--line-soft);
  overflow:hidden;display:flex;align-items:center;
}
.ticker-track{
  display:flex;align-items:center;gap:2rem;white-space:nowrap;
  font-family:var(--font-mono);font-size:.75rem;color:var(--muted);
  animation:marquee 52s linear infinite;will-change:transform;padding-inline-start:1.15rem;
}
.ticker:hover .ticker-track{animation-play-state:paused;}
.ticker-item{display:inline-flex;align-items:center;gap:.4rem;}
.ticker-item b{color:var(--text);font-weight:500;}
.ticker-item .icon{width:.95rem;height:.95rem;color:var(--gold);}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
[dir="rtl"] .ticker-track{animation-name:marquee-rtl;}
@keyframes marquee-rtl{from{transform:translateX(0)}to{transform:translateX(50%)}}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  background:rgba(11,16,23,.93);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line-soft);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:.85rem;height:var(--header-h);}
.logo{font-weight:800;font-size:1.02rem;letter-spacing:2.5px;color:var(--gold);text-transform:uppercase;flex:none;}
.logo span{color:var(--text);}
.logo:hover{text-decoration:none;}
.main-nav{display:none;gap:1.35rem;font-size:.88rem;}
.main-nav a{color:var(--muted);font-weight:500;padding:.2rem 0;border-bottom:2px solid transparent;}
.main-nav a:hover,.main-nav a[aria-current="page"]{color:var(--gold);border-bottom-color:var(--gold);text-decoration:none;}
.header-right{display:none;align-items:center;gap:.6rem;}
/* Sprachwahl: Globus mit Aufklappmenue.
   Acht Pillen nebeneinander waren auf Mobil unbedienbar und wuchsen mit
   jeder weiteren Sprache. */
.lang-wrap{position:relative;}
.lang-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.42rem .6rem;cursor:pointer;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-btn);color:var(--muted);
  font-family:var(--font-mono);font-size:.72rem;transition:border-color .18s,color .18s,background .18s;}
.lang-btn:hover{color:var(--text);border-color:var(--gold);}
.lang-btn .icon{width:1.05rem;height:1.05rem;color:var(--gold);}
.lang-btn .caret{width:.8rem;height:.8rem;transition:transform .2s;}
.lang-btn[aria-expanded="true"] .caret{transform:rotate(180deg);}
.lang-btn[aria-expanded="true"]{color:var(--text);border-color:var(--gold);}
.lang-menu{position:absolute;top:calc(100% + .45rem);inset-inline-end:0;z-index:80;min-width:190px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:.35rem;
  box-shadow:0 18px 44px rgba(0,0,0,.55);display:grid;gap:1px;animation:popIn .16s ease;}
.lang-menu[hidden]{display:none;}
@keyframes popIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.lang-opt{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.52rem .7rem;border-radius:var(--r-sm);color:var(--text);font-size:.92rem;}
.lang-opt:hover{background:var(--surface-2);text-decoration:none;}
.lang-opt.is-active{background:rgba(224,179,74,.14);color:var(--gold);}
.lang-code{font-size:.68rem;color:var(--muted);}
.lang-opt.is-active .lang-code{color:var(--gold);}
/* Im Mobilmenue volle Breite statt schwebend */
.mobile-nav .lang-wrap{width:100%;}
.mobile-nav .lang-btn{width:100%;justify-content:space-between;padding:.75rem .9rem;font-size:.85rem;}
.mobile-nav .lang-menu{position:static;width:100%;box-shadow:none;margin-top:.4rem;}
.burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;padding:0 9px;
  background:none;border:1px solid var(--line);border-radius:var(--r-btn);cursor:pointer;flex:none;}
.burger span{display:block;height:2px;background:var(--text);transition:transform .25s,opacity .2s;}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-nav{position:fixed;inset:calc(var(--ticker-h) + var(--header-h)) 0 0 0;z-index:59;background:var(--bg);
  padding:1.4rem 1.15rem 2.5rem;display:flex;flex-direction:column;gap:1.1rem;overflow-y:auto;animation:fadeIn .18s ease;}
.mobile-nav[hidden]{display:none;}
.mobile-nav nav{display:flex;flex-direction:column;}
.mobile-nav nav a{color:var(--text);font-size:1.18rem;font-weight:650;padding:.85rem 0;border-bottom:1px solid var(--line-soft);
  display:flex;align-items:center;gap:.7rem;}
.mobile-nav nav a .icon{color:var(--gold);}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;}
.hero-media{position:absolute;inset:0;z-index:-2;}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 40%;}
.hero-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,16,23,.62) 0%,rgba(11,16,23,.74) 45%,rgba(11,16,23,.95) 100%);
}
.hero-inner{padding:3rem 0 3.25rem;}
.live-badge{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:1.1rem;padding:.36rem .8rem;
  border:1px solid rgba(224,179,74,.42);border-radius:999px;background:rgba(224,179,74,.1);
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;color:var(--gold);}
.dot{width:7px;height:7px;border-radius:50%;background:var(--green);flex:none;animation:pulse 2.2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(94,201,111,.55)}50%{opacity:.6;box-shadow:0 0 0 7px rgba(94,201,111,0)}}
.hero h1{font-size:clamp(2.3rem,10vw,4.4rem);margin-bottom:.7rem;color:#fff;text-shadow:0 2px 30px rgba(0,0,0,.5);}
.hero .lead{max-width:38rem;color:#d3dbe6;font-size:clamp(1.02rem,4vw,1.24rem);margin-bottom:1.6rem;}
.cta-row{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.8rem;}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;max-width:34rem;}
.stat{background:rgba(22,30,43,.72);border:1px solid var(--line);border-radius:var(--r-sm);padding:.7rem .6rem;text-align:center;
  backdrop-filter:blur(6px);}
.stat b{display:block;font-family:var(--font-mono);font-size:1.15rem;color:var(--gold);line-height:1.2;}
.stat span{font-size:.68rem;color:var(--muted);letter-spacing:.03em;}
.stat b.stat-word{font-size:.82rem;color:var(--text);font-weight:600;font-family:var(--font-sans);}

/* ---------- Abschnitte ---------- */
.section{padding:var(--sec) 0;}
.section--alt{background:var(--bg-2);border-block:1px solid var(--line-soft);}
.section--sand{background:var(--sand);color:var(--ink);}
.section--sand h2,.section--sand h3{color:var(--ink);}
.section--sand p{color:var(--ink-muted);}
.section--sand a{color:#8a6a12;}
.section-head{margin-bottom:1.6rem;max-width:44rem;}
.eyebrow{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-mono);font-size:.7rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.55rem;}
.section--sand .eyebrow{color:var(--gold-deep);}
.section-head h2{font-size:clamp(1.65rem,6vw,2.3rem);margin-bottom:.4rem;}
.section-head p{font-size:1.02rem;color:var(--muted);margin:0;}
.section--sand .section-head p{color:var(--ink-muted);}

/* ---------- Raster ---------- */
.grid{display:grid;gap:1rem;grid-template-columns:1fr;}

/* Signal-Karten */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.2rem;
  display:flex;flex-direction:column;gap:.55rem;transition:border-color .2s,transform .2s,box-shadow .2s;}
.card:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 14px 38px rgba(0,0,0,.4);}
.card-top{display:flex;align-items:center;justify-content:space-between;gap:.7rem;}
.cat-label{display:inline-flex;align-items:center;gap:.42rem;font-family:var(--font-mono);font-size:.68rem;
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.cat-label .icon{width:1rem;height:1rem;color:var(--gold);}
.badge{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.09em;padding:.22rem .45rem;
  border:1px solid currentColor;border-radius:3px;text-transform:uppercase;}
.badge.high{color:var(--green);} .badge.medium{color:var(--orange);} .badge.low{color:var(--muted);}
.card h3{font-size:1.12rem;margin:0;font-weight:700;}
.card p{margin:0;color:var(--muted);font-size:.93rem;}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-top:auto;
  padding-top:.65rem;border-top:1px solid var(--line-soft);font-family:var(--font-mono);font-size:.72rem;color:var(--muted);}
.price-hint{color:var(--gold);}

/* Bildkarten - das Bild ist der Inhalt, nicht Deko */
.photo-card{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r);
  background:var(--surface);border:1px solid var(--line);transition:transform .22s,border-color .22s,box-shadow .22s;}
.photo-card:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 16px 40px rgba(0,0,0,.45);text-decoration:none;}
.photo-card .shot{position:relative;aspect-ratio:16/10;overflow:hidden;}
.photo-card .shot img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.photo-card:hover .shot img{transform:scale(1.05);}
.photo-card .shot::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,16,23,0) 40%,rgba(11,16,23,.85) 100%);}
.photo-card .badge-float{position:absolute;top:.7rem;inset-inline-start:.7rem;z-index:2;
  background:rgba(11,16,23,.82);backdrop-filter:blur(4px);}
.photo-card .body{padding:1rem 1.1rem 1.15rem;display:flex;flex-direction:column;gap:.4rem;flex:1;}
.photo-card h3{font-size:1.12rem;margin:0;color:var(--text);}
.photo-card p{margin:0;font-size:.92rem;color:var(--muted);}
.photo-card .more{margin-top:auto;padding-top:.7rem;display:inline-flex;align-items:center;gap:.4rem;
  color:var(--blue);font-size:.85rem;font-weight:600;}
.photo-card .more .icon{width:1rem;height:1rem;}

/* Grosse Kategorie-Kachel */
.tile{position:relative;display:flex;align-items:flex-end;min-height:210px;overflow:hidden;border-radius:var(--r);
  border:1px solid var(--line);transition:transform .22s,box-shadow .22s;}
.tile:hover{transform:translateY(-3px);box-shadow:0 16px 42px rgba(0,0,0,.5);text-decoration:none;}
.tile .t-shot{position:absolute;inset:0;overflow:hidden;}
.tile .t-shot img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.tile:hover .t-shot img{transform:scale(1.06);}
.tile::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,16,23,.15) 0%,rgba(11,16,23,.55) 55%,rgba(11,16,23,.93) 100%);}
.tile .t-body{position:relative;z-index:2;padding:1.15rem;width:100%;}
.tile .t-icon{width:2.1rem;height:2.1rem;color:var(--gold);margin-bottom:.5rem;}
.tile h3{font-size:1.2rem;margin:0 0 .25rem;color:#fff;}
.tile p{margin:0;font-size:.9rem;color:#c8d2df;}

/* Ablauf-Schritte */
.steps{display:grid;gap:1rem;grid-template-columns:1fr;}
.step{background:#fff;border:1px solid var(--sand-line);border-radius:var(--r);padding:1.3rem;}
.step-n{display:inline-flex;align-items:center;justify-content:center;width:2.2rem;height:2.2rem;border-radius:50%;
  background:var(--gold);color:#12161c;font-family:var(--font-mono);font-size:.82rem;font-weight:700;margin-bottom:.75rem;}
.step .icon{color:var(--gold-deep);width:1.5rem;height:1.5rem;margin-bottom:.5rem;}
.step h3{font-size:1.08rem;margin-bottom:.3rem;}
.step p{margin:0;font-size:.94rem;}

/* Merkmalliste */
.checks{display:grid;gap:.65rem;}
.checks li{display:flex;gap:.6rem;align-items:flex-start;font-size:.97rem;}
.checks .icon{color:var(--green);width:1.2rem;height:1.2rem;margin-top:.22rem;}

/* Bezirks-Chips */
.chips{display:flex;flex-wrap:wrap;gap:.45rem;}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .75rem;border-radius:999px;
  border:1px solid var(--line);background:var(--surface);font-size:.83rem;color:var(--muted);}
.chip .icon{width:.9rem;height:.9rem;color:var(--gold);}
.section--sand .chip{background:#fff;border-color:var(--sand-line);color:var(--ink-muted);}

/* Preistabelle */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);}
.section--sand .table-wrap{background:#fff;border-color:var(--sand-line);}
table.data{width:100%;border-collapse:collapse;font-size:.92rem;min-width:460px;}
table.data th,table.data td{padding:.72rem .9rem;text-align:start;border-bottom:1px solid var(--line-soft);}
.section--sand table.data th,.section--sand table.data td{border-color:var(--sand-line);}
table.data th{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.section--sand table.data th{color:var(--ink-muted);}
table.data tr:last-child td{border-bottom:0;}
table.data td.num{font-family:var(--font-mono);color:var(--gold);white-space:nowrap;}
.section--sand table.data td.num{color:var(--gold-deep);}

/* FAQ */
.faq{display:grid;gap:.7rem;}
.faq details{background:#fff;border:1px solid var(--sand-line);border-radius:var(--r);padding:0;}
.faq summary{cursor:pointer;padding:1rem 1.15rem;font-weight:650;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:var(--font-mono);color:var(--gold-deep);font-size:1.3rem;line-height:1;}
.faq details[open] summary::after{content:"\2212";}
.faq details > p{padding:0 1.15rem 1.1rem;margin:0;}

/* Telegram-Band */
.tg-band{position:relative;overflow:hidden;background:var(--gold);color:#12161c;}
.tg-band-inner{display:flex;flex-direction:column;gap:1.1rem;padding-block:2.2rem;position:relative;z-index:2;}
.tg-band h2{margin:0 0 .3rem;font-size:clamp(1.3rem,5vw,1.9rem);color:#12161c;}
.tg-band p{margin:0;color:rgba(18,22,28,.78);}
.tg-note{font-family:var(--font-mono);font-size:.76rem;margin-top:.5rem!important;}

/* Footer */
.site-footer{border-top:1px solid var(--line-soft);background:#080c12;}
/* Das Fuss-Logo lief in der geerbten Fussfarbe und sah wie ein anderes
   Zeichen aus - hier explizit dieselben Farben wie im Kopf. */
.site-footer .logo{color:var(--gold);font-size:1.02rem;letter-spacing:2.5px;}
.site-footer .logo span{color:var(--text);}
.footer-grid{display:grid;gap:1.7rem;grid-template-columns:1fr;padding-block:2.4rem;}
.footer-grid h3{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
  font-weight:600;font-family:var(--font-mono);margin-bottom:.7rem;}
.footer-grid ul{display:flex;flex-direction:column;gap:.45rem;}
.footer-grid a{color:var(--muted);font-size:.92rem;}
.footer-grid a:hover{color:var(--gold);text-decoration:none;}
.foot-tag{color:var(--muted);font-size:.93rem;margin:.7rem 0 0;max-width:24rem;}
.foot-langs{flex-direction:row!important;flex-wrap:wrap;gap:.4rem .85rem!important;}
.footer-bottom{display:flex;flex-direction:column;gap:.4rem;padding-block:1.1rem;border-top:1px solid var(--line-soft);
  font-size:.75rem;color:var(--muted);font-family:var(--font-mono);}

/* ---------- Unterseiten ---------- */
.page-hero{position:relative;overflow:hidden;isolation:isolate;}
.page-hero .hero-media::after{background:linear-gradient(180deg,rgba(11,16,23,.55),rgba(11,16,23,.93));}
.page-hero-inner{padding:2.6rem 0 2.4rem;}
.page-hero h1{font-size:clamp(1.9rem,7.5vw,3.1rem);color:#fff;margin-bottom:.55rem;}
.page-hero p{max-width:40rem;color:#cfd8e4;font-size:1.04rem;margin:0;}
.breadcrumb{font-family:var(--font-mono);font-size:.72rem;color:var(--muted);margin-bottom:.9rem;
  display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;}
.breadcrumb a{color:var(--muted);}
.breadcrumb a:hover{color:var(--gold);}

/* Artikel-Liste */
.post-list{display:grid;gap:.75rem;}
.post-row{display:flex;gap:1rem;align-items:center;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:.8rem;transition:border-color .2s,transform .2s;}
.post-row:hover{border-color:var(--gold);transform:translateY(-2px);text-decoration:none;}
.post-row .thumb{width:84px;height:64px;border-radius:var(--r-sm);overflow:hidden;flex:none;}
.post-row .thumb img{width:100%;height:100%;object-fit:cover;}
.post-row .meta{min-width:0;flex:1;}
.post-row h3{font-size:1rem;margin:0 0 .15rem;color:var(--text);}
.post-row .sub{font-family:var(--font-mono);font-size:.7rem;color:var(--muted);display:flex;gap:.5rem;flex-wrap:wrap;}
.empty-note{background:var(--surface);border:1px dashed var(--line);border-radius:var(--r);
  padding:1.6rem;text-align:center;color:var(--muted);}

/* ---------- Artikel ---------- */
.page-wrap{min-height:100vh;display:flex;flex-direction:column;}
.page-wrap > .site-footer{margin-top:auto;}
.article-hero{position:relative;height:min(42vw,300px);overflow:hidden;}
.article-hero img{width:100%;height:100%;object-fit:cover;}
.article-hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,16,23,.3),rgba(11,16,23,.92));}
.signal-article{max-width:var(--wrap-article);margin:0 auto;padding:1.5rem 1.15rem 2.5rem;}
.article-meta{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:1.1rem;}
.meta-date{font-family:var(--font-mono);font-size:.74rem;color:var(--muted);}
.signal-article h1{font-size:clamp(1.75rem,6.5vw,2.5rem);color:#fff;margin-bottom:.8rem;}
.signal-article h2{font-size:1.28rem;margin:2rem 0 .7rem;padding-top:1.2rem;border-top:1px solid var(--line-soft);}
.signal-article h3{font-size:1.06rem;margin:1.5rem 0 .5rem;}
.signal-article p{color:#ccd5e0;}
.signal-article ul,.signal-article ol{margin:0 0 1.2rem;padding-inline-start:1.15rem;list-style:disc;color:#ccd5e0;}
.signal-article ol{list-style:decimal;}
.signal-article li{margin-bottom:.5rem;}
.signal-article strong{color:var(--text);}
.signal-article a{text-decoration:underline;text-underline-offset:3px;}
.signal-article table{width:100%;border-collapse:collapse;margin:0 0 1.2rem;font-size:.92rem;display:block;overflow-x:auto;}
.signal-article th,.signal-article td{border:1px solid var(--line);padding:.55rem .75rem;text-align:start;}
.signal-article th{background:var(--surface);font-family:var(--font-mono);font-size:.76rem;}
.related-signals{max-width:var(--wrap-article);margin:0 auto;padding:0 1.15rem 2rem;}
.related-signals h2{font-size:1.15rem;}
.article-cta{max-width:var(--wrap-article);margin:0 auto 2.5rem;padding:1.6rem 1.15rem;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);text-align:center;}
.article-cta p{margin:0 0 .9rem;color:var(--muted);}

/* Erklaerblock: Text neben Bild */
.explain{display:grid;gap:1.5rem;grid-template-columns:1fr;align-items:center;}
.explain .lead-ink{font-size:1.06rem;color:var(--ink-muted);margin:0;}
.explain-shot{margin:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--sand-line);
  box-shadow:0 16px 40px rgba(20,26,34,.14);}
.explain-shot img{width:100%;aspect-ratio:16/11;object-fit:cover;}

/* Bildkarte: Kopfzeile und Fusszeile im Textteil */
.photo-card .cat-label{margin-bottom:.1rem;}
.photo-card .more{justify-content:space-between;align-items:center;width:100%;
  display:flex;gap:.7rem;font-family:var(--font-mono);font-size:.74rem;}
.photo-card .more > span:last-child{display:inline-flex;align-items:center;gap:.35rem;
  color:var(--blue);font-family:var(--font-sans);font-size:.85rem;font-weight:600;}
.badge-float.high{color:var(--green);} .badge-float.medium{color:var(--orange);}
.badge-float.low{color:#cfd6e2;}

/* Helle Abschnitte: Merkmalliste und Schritte lesbar halten */
.section--sand .checks li{color:var(--ink);}
.section--sand .checks .icon{color:#2f8f45;}
.section--sand .eyebrow .icon{color:var(--gold-deep);}

/* ---------- Motion ---------- */
/* Nur wenn JS laeuft, wird eingeblendet - sonst bliebe die halbe Seite leer,
   falls das Skript nicht laedt. */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease;}
.js .reveal.is-in{opacity:1;transform:none;}

/* ---------- RTL ---------- */
[dir="rtl"] body{text-align:right;}
[dir="rtl"] .logo{letter-spacing:1px;}
[dir="rtl"] .signal-article ul,[dir="rtl"] .signal-article ol{padding-inline-start:1.15rem;}

/* ---------- Umbrueche ---------- */
@media (min-width:520px){
  .cta-row{flex-direction:row;flex-wrap:wrap;}
}
@media (min-width:640px){
  :root{--sec:4rem;}
  .explain{grid-template-columns:1.15fr .85fr;gap:2.5rem;}
  .grid-2{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .steps{grid-template-columns:repeat(3,1fr);}
  .checks{grid-template-columns:repeat(2,1fr);}
  .tg-band-inner{flex-direction:row;align-items:center;justify-content:space-between;}
  .footer-bottom{flex-direction:row;justify-content:space-between;align-items:center;}
  .footer-grid{grid-template-columns:2fr 1fr 1fr;}
  .hero-inner{padding:4.5rem 0 4rem;}
  .post-row .thumb{width:120px;height:80px;}
}
@media (min-width:1024px){
  :root{--sec:5rem;}
  .grid-3{grid-template-columns:repeat(3,1fr);}
  .grid-4{grid-template-columns:repeat(4,1fr);}
  .grid-3{grid-template-columns:repeat(3,1fr);}
  .grid-4{grid-template-columns:repeat(4,1fr);}
  .hero-inner{padding:6rem 0 5.5rem;}
  .hero-stats{grid-template-columns:repeat(3,1fr);}
  .tile{min-height:250px;}
}

/* Neun Navigationspunkte brauchen Platz - darunter bleibt das Burger-Menue. */
@media (min-width:1280px){
  .main-nav,.header-right{display:flex;}
  .main-nav{gap:1.05rem;font-size:.84rem;}
  .burger{display:none;}
  .mobile-nav{display:none!important;}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
  .reveal{opacity:1;transform:none;}
  .ticker-track{animation:none;}
}
@media print{
  .ticker,.site-header,.mobile-nav,.tg-band,.article-cta,.related-signals,.hero-media,.article-hero{display:none!important;}
  body{background:#fff;color:#000;}
  .signal-article{max-width:none;}
  .signal-article p,.signal-article li{color:#000;}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em;}
}