/* ============================================================
   STEUERNEST — Sidebar-Ads (Musterschreiben)
   300 × 600 px. STRIKT nur Rot #E4322B und Weiß #FFFFFF.
   Fotos als Duoton Rot/Weiß. Instrument Sans. Keine Überlappungen.
   ============================================================ */
:root{ --red:#E4322B; --white:#fff; --sans:"Instrument Sans",system-ui,-apple-system,sans-serif; }

/* ---------- Karte ---------- */
.ad{ width:300px; height:600px; position:relative; overflow:hidden; border-radius:18px; background:var(--white); color:var(--red);
  font-family:var(--sans); display:block; text-decoration:none; isolation:isolate; flex:none;
  border:1px solid rgba(228,50,43,.25); box-shadow:0 10px 28px rgba(228,50,43,.14); }
.ad *{ box-sizing:border-box; margin:0; padding:0; }
.ad ul{ list-style:none; }
.ad-in{ display:flex; flex-direction:column; height:100%; width:100%; }
.ad-pad{ display:flex; flex-direction:column; gap:10px; padding:20px 18px; flex:none; }
.ad-in > .ad-brand{ padding:20px 18px 14px; }
.ad-in > .ad-pad:last-child{ padding-top:16px; }

/* ---------- Bausteine ---------- */
.ad-brand{ display:flex; align-items:center; gap:8px; }
.ad-brand img{ width:19px; height:19px; object-fit:contain; display:block; }
.ad-brand span{ font-size:14px; font-weight:600; letter-spacing:-.025em; line-height:1; }

.ad-eyebrow{ display:flex; align-items:center; gap:8px; font-size:9px; font-weight:700; letter-spacing:.17em; text-transform:uppercase; }
.ad-eyebrow::before{ content:""; width:15px; height:2px; background:currentColor; flex:none; }

.ad-h{ font-size:25px; line-height:1.06; letter-spacing:-.035em; font-weight:600; text-wrap:pretty; }
.ad-h em{ font-style:normal; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; }
.ad-sub{ font-size:12px; line-height:1.42; opacity:.85; }
.ad-rule{ width:52px; height:3px; background:currentColor; }

/* Foto — Duoton Weiß→Rot, füllt sein Feld immer randlos */
.ad-fig{ position:relative; flex:1 1 auto; min-height:150px; width:100%; overflow:hidden; background:var(--white); }
.ad-fig img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 18%; display:block;
  filter:grayscale(1) brightness(.9) contrast(1.15); }
.ad-fig::after{ content:""; position:absolute; inset:0; background:var(--red); mix-blend-mode:screen; }

.ad-cta{ display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--red); color:var(--white);
  border-radius:999px; padding:12px 12px 12px 18px; font-size:13px; font-weight:600; letter-spacing:-.01em; }
.ad-cta .arw{ width:25px; height:25px; border-radius:50%; background:rgba(255,255,255,.22); display:grid; place-items:center; flex:none; }
.ad-cta svg{ width:13px; height:13px; stroke:currentColor; stroke-width:2.2; fill:none; stroke-linecap:round; stroke-linejoin:round; display:block; }
.ad-cta--white{ background:var(--white); color:var(--red); }
.ad-cta--white .arw{ background:var(--red); color:var(--white); }

.ad-foot{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding-top:11px;
  border-top:1px solid rgba(228,50,43,.28); }
.ad-foot .url{ font-size:12.5px; font-weight:700; letter-spacing:-.015em; }
.ad-foot .tag{ display:flex; align-items:center; gap:6px; font-size:8.6px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; opacity:.8; }
.ad-foot .tag::before{ content:""; width:5px; height:5px; border-radius:50%; background:currentColor; flex:none; }

.ad-checks{ display:flex; flex-direction:column; gap:8px; }
.ad-checks li{ display:flex; align-items:flex-start; gap:9px; font-size:12px; line-height:1.3; font-weight:500; }
.ad-checks .ck{ width:16px; height:16px; border-radius:50%; background:var(--red); display:grid; place-items:center; flex:none; margin-top:1px; }
.ad-checks .ck svg{ width:9px; height:9px; stroke:var(--white); stroke-width:2.6; fill:none; stroke-linecap:round; stroke-linejoin:round; display:block; }

.ad-doc{ border:1px solid rgba(228,50,43,.35); border-radius:8px; padding:13px 12px; background:var(--white); }
.ad-doc i{ display:block; height:3px; border-radius:2px; background:rgba(228,50,43,.3); margin-bottom:7px; }
.ad-doc i.r{ background:var(--red); width:46%; }
.ad-doc i.w90{ width:90% } .ad-doc i.w70{ width:70% } .ad-doc i.w55{ width:55%; margin-bottom:0 }
.ad-doc .stamp{ display:inline-block; margin-top:11px; border:1.4px solid var(--red); border-radius:4px; padding:3px 6px;
  font-size:7.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }

/* ---------- Rote Karten ---------- */
.ad--a, .ad--c, .ad--f{ background:var(--red); color:var(--white); border-color:var(--red); }
.ad--a .ad-foot, .ad--c .ad-foot, .ad--f .ad-foot{ border-top-color:rgba(255,255,255,.38); }

/* A · Rot, Foto unten */
.ad--a .ad-fig{ min-height:230px; }
/* B · Weiß, Foto unten */
.ad--b .ad-fig{ min-height:230px; }
/* C · Rot, Foto oben */
.ad--c .ad-fig{ min-height:250px; }
/* D · Checkliste, Foto unten */
.ad--d .ad-h{ font-size:22px; }
.ad--d .ad-fig{ min-height:150px; }
/* E · Dokument, Foto unten */
.ad--e .ad-h{ font-size:22px; }
.ad--e .ad-fig{ min-height:150px; }
/* F · Großtypo, Foto oben */
.ad--f .ad-fig{ min-height:230px; }
.ad--f .ad-h{ font-size:30px; letter-spacing:-.042em; line-height:1.0; }