:root{
  --navy:#0d1b2a; --navy2:#132a40; --ink:#14202e; --bg:#f4f6f8; --card:#ffffff;
  --line:#e2e7ec; --mut:#5f6b78; --mut2:#8a95a1; --gold:#c8942b; --gold2:#e0ad3f;
  --up:#137a3f; --upbg:#e6f4ec; --down:#c0392b; --downbg:#fbeceb; --acc:#1f6feb;
  --anz:#b26b00; --anzbg:#fff8ec; --anzline:#e7c98a;
  /* Fondos sutiles. Existen como variable para que el tema oscuro los redefina:
     escritos a mano en el <style> de cada página eran 59 manchas blancas que no
     se enteraban del cambio de tema. */
  --soft:#fafbfc; --warm:#faf8f2;
  --text-primary:#14202e;
  /* Marca secundaria: verde petróleo. NO usar --up/--down para marca. */
  --gr:#0e6b57; --gr2:#17a184; --gr3:#3fd0ab;
  --gr-deep:#082a2b;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

/* ---------- Aviso de staging (solo entorno de preview) ---------- */
.staging-bar{background:repeating-linear-gradient(45deg,#b26b00,#b26b00 12px,#8f5600 12px,#8f5600 24px);
  color:#fff;font-size:12.5px;padding:7px 20px;text-align:center;letter-spacing:.01em}
.staging-bar strong{background:#fff;color:#8f5600;padding:2px 8px;border-radius:4px;
  font-size:11px;font-weight:800;letter-spacing:.08em;margin-right:8px}

/* ---------- Sektor-Ticker ---------- */
.ticker{background:var(--navy);color:#dfe6ee;border-bottom:1px solid #05101c;overflow:hidden}
.ticker .row{display:flex;gap:28px;align-items:center;white-space:nowrap;padding:8px 20px;
  animation:scroll 34s linear infinite;font-size:13px}
.ticker:hover .row{animation-play-state:paused}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk{display:inline-flex;gap:8px;align-items:center}
.tk b{font-weight:600;color:#fff;letter-spacing:.02em}
.tk .px{color:#cbd5e0}
.up{color:#57d98a} .down{color:#ff7a6b}

/* ---------- Header ---------- */
header.top{background:var(--navy);color:#fff;position:sticky;top:0;z-index:20;box-shadow:0 1px 0 #05101c}
.top .wrap{display:flex;align-items:center;gap:20px;height:64px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.02em;color:#fff}
.logo .mark{width:30px;height:30px;border-radius:7px;background:linear-gradient(135deg,var(--gold2),var(--gold));
  display:grid;place-items:center;color:#1a1206;font-weight:900;font-size:16px}
.logo span{color:var(--gold2)}
nav.main{display:flex;gap:22px;margin-left:8px;font-size:14.5px;font-weight:500}
nav.main a{color:#cdd6e0;padding:6px 0;border-bottom:2px solid transparent}
nav.main a:hover,nav.main a.active{color:#fff;border-color:var(--gold2)}
.top .right{margin-left:auto;display:flex;align-items:center;gap:14px}
.search{display:flex;align-items:center;gap:8px;background:#0b1622;border:1px solid #22384f;border-radius:8px;
  padding:7px 10px;color:var(--mut2);font-size:13px;min-width:180px}
.search input{border:0;background:transparent;color:#dfe6ee;outline:none;width:100%;font-size:13px}
.lang{font-size:13px;color:#9fb0c0} .lang b{color:#fff}
.btn{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#1a1206;font-weight:700;border:0;
  border-radius:8px;padding:9px 15px;font-size:13.5px;cursor:pointer;display:inline-block}
@media(max-width:900px){nav.main,.search{display:none}}

/* ---------- Layout general ---------- */
.grid{display:grid;grid-template-columns:1fr 320px;gap:26px;padding:26px 0 40px}
@media(max-width:980px){.grid{grid-template-columns:1fr}}
section.blk{margin-bottom:30px}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 14px}
.sec-head h2{margin:0;font-size:17px;letter-spacing:-.01em;display:flex;align-items:center;gap:9px}
.sec-head h2::before{content:"";width:4px;height:17px;background:var(--gold);border-radius:2px}
.sec-head a{font-size:13px;color:var(--acc);font-weight:600}

/* ---------- Hero ---------- */
.hero{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  display:grid;grid-template-columns:1.4fr 1fr}
@media(max-width:640px){.hero{grid-template-columns:1fr}}
.hero .lead{padding:26px}
.tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--gold);background:#fbf3e2;padding:4px 9px;border-radius:5px}
.hero h1{font-size:27px;line-height:1.2;letter-spacing:-.02em;margin:12px 0 10px}
.hero p{color:var(--mut);margin:0 0 16px}
.meta{font-size:12.5px;color:var(--mut2);display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.hero .side{background:var(--navy2);color:#dbe4ee;padding:22px;border-left:1px solid var(--line)}
.hero .side h3{margin:0 0 14px;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--gold2)}
.mini{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid #23384d}
.mini:last-child{border:0}
.mini .k{font:600 12px/1 ui-monospace,Menlo,monospace;color:var(--gold2);min-width:70px;padding-top:2px}
.mini a{font-size:13.5px;color:#e7edf3;line-height:1.35}

/* ---------- Movers / paneles ---------- */
.movers{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:640px){.movers{grid-template-columns:1fr}}
.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.panel .ph{padding:12px 15px;font-size:13px;font-weight:700;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}
.ph .g{color:var(--up)} .ph .l{color:var(--down)}
table.mv{width:100%;border-collapse:collapse;font-size:13.5px}
table.mv td{padding:9px 15px;text-align:right}
table.mv td:first-child{text-align:left}
table.mv tbody tr{border-top:1px solid var(--line)}
table.mv tbody tr:hover{background:#fafbfc}
.co{display:flex;align-items:center;gap:9px}
.lg{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff;flex:0 0 auto}
.co small{display:block;color:var(--mut2);font:500 11px/1.2 ui-monospace,Menlo,monospace}
.pill{display:inline-block;padding:2px 7px;border-radius:5px;font-weight:700;font-size:12.5px}
.pill.u{color:var(--up);background:var(--upbg)} .pill.d{color:var(--down);background:var(--downbg)}

/* ---------- Featured / Anzeige ---------- */
.featured{background:var(--anzbg);border:1px solid var(--anzline);border-radius:14px;padding:18px 18px 8px}
.anz-bar{display:flex;align-items:center;gap:10px;margin-bottom:4px;flex-wrap:wrap}
.anz-badge{background:var(--anz);color:#fff;font-weight:800;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;padding:4px 10px;border-radius:5px}
.anz-note{font-size:11.5px;color:#8a6a2a}
.featured h2{margin:12px 0 14px;font-size:16px;color:#5c4410}
.fcards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:640px){.fcards{grid-template-columns:1fr}}
.fc{background:var(--card);border:1px solid var(--anzline);border-radius:11px;padding:15px;display:flex;gap:13px}
.fc .lg{width:44px;height:44px;border-radius:9px;font-size:16px}
.fc h3{margin:0 0 3px;font-size:15px}
.fc .ids{font:600 11.5px/1.3 ui-monospace,Menlo,monospace;color:var(--mut2);margin-bottom:7px}
.fc p{margin:0 0 10px;font-size:12.5px;color:var(--mut);line-height:1.45}
.fc .cta{font-size:12.5px;font-weight:700;color:var(--anz)}
.disc{font-size:11px;color:#977535;padding:12px 2px 6px;line-height:1.5;border-top:1px dashed var(--anzline);margin-top:6px}

/* ---------- News list ---------- */
.newslist .item{display:flex;gap:15px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:15px;margin-bottom:12px}
.newslist .thumb{width:110px;height:76px;border-radius:9px;flex:0 0 auto;position:relative;overflow:hidden;background:linear-gradient(135deg,#1b3450,#0d1b2a)}
.newslist .thumb .lg{position:absolute;inset:0;margin:auto;width:36px;height:36px}
.cat{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gold)}
.newslist h3{margin:5px 0 6px;font-size:16px;line-height:1.3;letter-spacing:-.01em}
.newslist p{margin:0;font-size:13px;color:var(--mut);line-height:1.45}
.newslist .m{margin-top:8px;font-size:12px;color:var(--mut2);display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:520px){.newslist .thumb{display:none}}

/* ---------- Sidebar ---------- */
aside .box{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:17px;margin-bottom:20px}
aside h4{margin:0 0 13px;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink);display:flex;align-items:center;gap:8px}
aside h4::before{content:"";width:4px;height:14px;background:var(--gold);border-radius:2px}
.nl{background:var(--navy2);color:#e6edf4}
.nl h4{color:#fff} .nl h4::before{background:var(--gold2)}
.nl p{font-size:12.5px;color:#b9c6d3;margin:0 0 12px}
.nl input{width:100%;border:1px solid #2a4257;background:#0d1b2a;color:#fff;border-radius:8px;padding:10px;font-size:13px;margin-bottom:9px;outline:none}
.nl .btn{width:100%}
.rank{display:flex;gap:11px;padding:9px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.rank:last-child{border:0} .rank:first-child{padding-top:0}
.rank .n{font-weight:800;color:var(--gold);font-size:15px;min-width:18px}
.rank a{font-size:13.5px;line-height:1.35}

/* ---------- Content pages (unternehmen / news / begriffe) ---------- */
main.content{background:var(--card);border:1px solid var(--line);border-radius:14px;margin:26px auto 40px;max-width:900px;padding:8px 0 20px}
.breadcrumb{font-size:12.5px;color:var(--mut2);padding:18px 30px 0}
.breadcrumb a{color:var(--acc)}
.section-header{padding:16px 30px 6px}
.eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gold)}
.section-title{font-size:28px;line-height:1.15;letter-spacing:-.02em;margin:8px 0 10px}
.head-tags{display:flex;gap:8px;flex-wrap:wrap}
.badge{display:inline-block;font:700 12px/1 ui-monospace,Menlo,monospace;background:#eef1f4;color:#3a4756;padding:5px 9px;border-radius:5px}
.badge-muted{background:#f4f6f8;color:var(--mut2)}
.tldr{background:#faf8f2;border-left:3px solid var(--gold);border-radius:6px;padding:14px 16px;font-size:15px}
.tldr .lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);font-weight:700;margin-bottom:5px}
.content-block{padding:20px 30px;border-top:1px solid var(--line)}
.content-block h2{font-size:20px;margin:0 0 10px;padding-bottom:8px;border-bottom:2px solid var(--gold);display:inline-block}
.content-block p{margin:0 0 10px;color:#2a3542}
.stammdaten{width:100%;border-collapse:collapse;font-size:14px}
.stammdaten th{text-align:left;width:38%;padding:9px 12px;color:#555;font-weight:600;background:var(--warm);border-bottom:1px solid var(--line);vertical-align:top}
.stammdaten td{padding:9px 12px;border-bottom:1px solid var(--line)}
.faq-item{border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:6px;padding:0 14px;margin:0 0 10px;background:var(--card)}
.faq-item summary{cursor:pointer;font-weight:600;padding:12px 0}
.faq-answer{color:#333;padding:0 0 12px}
.source-list{font-size:13px;color:var(--mut)}
.disclaimer{font-size:12px;color:var(--mut2);font-style:italic}
.usedin{color:var(--acc);font-weight:600}

/* ---------- Cabecera visual por sector (SVG inline) ---------- */
.sektor-hero{position:relative;margin:0 0 4px;border-radius:0;overflow:hidden;height:180px;background:var(--sb,#132a40)}
.sektor-hero__bg{position:absolute;inset:0;width:100%;height:100%;display:block}
/* Foto de sector. `object-fit:cover` porque la franja es 4:1 y la imagen puede
   llegar con otra proporción; el degradado inferior evita que el rótulo del
   sector caiga sobre una zona clara de la foto y se vuelva ilegible. */
.sektor-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sektor-hero::after{content:"";position:absolute;inset:auto 0 0 0;height:62%;
  background:linear-gradient(to top,rgba(0,0,0,.72),transparent);pointer-events:none}
/* Pie obligatorio: la imagen no documenta al emisor y está generada por IA.
   Discreto pero legible — si no se lee, no cumple. */
.sektor-hero__ki{position:absolute;right:12px;top:10px;z-index:2;
  background:rgba(0,0,0,.55);color:rgba(255,255,255,.82);backdrop-filter:blur(3px);
  font:600 10.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing:.04em;padding:5px 8px;border-radius:5px}
.sektor-hero__meta{position:absolute;z-index:2;left:30px;bottom:16px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sektor-hero__tag{background:rgba(255,255,255,.14);backdrop-filter:blur(3px);color:var(--sink,#fff);
  border:1px solid rgba(255,255,255,.28);font-size:11.5px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;padding:6px 12px;border-radius:6px}
.sektor-hero__ticker{background:var(--sink,#fff);color:var(--sb,#132a40);font:800 12px/1 ui-monospace,Menlo,monospace;
  padding:7px 11px;border-radius:6px;letter-spacing:.04em}
@media(max-width:640px){.sektor-hero{height:140px}.sektor-hero__meta{left:18px}}

/* Figura de datos dentro del cuerpo (Kennzahlen visuales) */
.datafig{border:1px solid var(--line);border-radius:11px;padding:16px 18px;margin:18px 0;background:#fbfcfd}
.datafig h4{margin:0 0 12px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}
.datafig .bars{display:flex;flex-direction:column;gap:9px}
.datafig .bar{display:grid;grid-template-columns:132px 1fr auto;gap:10px;align-items:center;font-size:13px}
.datafig .bar .lbl{color:var(--mut)}
.datafig .bar .track{display:block;height:9px;background:#eef1f4;border-radius:5px;overflow:hidden}
/* .fill es un <span> dentro de .track: sin display:block, width/height NO aplican (inline) */
.datafig .bar .fill{display:block;height:100%;min-width:3px;border-radius:5px;
  background:linear-gradient(90deg,var(--gold2),var(--gold))}
.datafig .bar .fill.pos{background:linear-gradient(90deg,#4fbf85,var(--up))}
.datafig .bar .fill.neg{background:linear-gradient(90deg,#e07a6d,var(--down))}
.datafig .bar .val{font:700 12.5px/1 ui-monospace,Menlo,monospace;color:var(--ink)}
.datafig .bar .val.pos{color:var(--up)} .datafig .bar .val.neg{color:var(--down)}
.datafig figcaption{margin-top:11px;font-size:11.5px;color:var(--mut2);font-style:italic}

/* ---------- Anzeige partial ---------- */
.anz-wrap{border:1px solid var(--anzline);background:var(--anzbg);border-radius:12px;padding:14px 16px;margin:16px 30px 0}
.anz-disc{font-size:12px;color:#7a5f28;line-height:1.55;margin:10px 0 0}

/* ---------- Footer ---------- */
footer{background:var(--navy);color:#aeb9c4;font-size:13px;padding:34px 0 26px;margin-top:10px}
.fcols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:26px;padding-bottom:22px;border-bottom:1px solid #1d3145}
@media(max-width:760px){.fcols{grid-template-columns:1fr 1fr}}
footer h5{color:#fff;font-size:13px;margin:0 0 11px;text-transform:uppercase;letter-spacing:.04em}
footer a{display:block;color:#9fb0c0;padding:4px 0}
footer a:hover{color:var(--gold2)}
.risk{font-size:11.5px;color:#7d8a97;line-height:1.6;padding-top:18px;max-width:900px}
.risk b{color:#b9c6d3}
.fbar{display:flex;justify-content:space-between;gap:12px;padding-top:16px;color:#7d8a97;flex-wrap:wrap}


/* ---------- Anlageempfehlung (Art. 20 MAR) ----------
   Estilos del componente `_includes/empfehlung.njk`. Viven aquí y no en el partial
   para que una página sin recomendación no arrastre CSS muerto. */
.emp{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}
  .emp--alt{opacity:.72}
  .emp__label{display:flex;gap:9px;align-items:center;flex-wrap:wrap;padding:11px 16px;
    background:#faf8f2;border-bottom:1px solid var(--line)}
  .emp__badge{background:var(--navy);color:#fff;font-size:11px;font-weight:800;
    text-transform:uppercase;letter-spacing:.06em;padding:4px 10px;border-radius:5px}
  .emp__labeltxt{font-size:12px;color:var(--mut)}
  .emp__stale{margin:0;padding:11px 16px;background:#fdf6f5;border-bottom:1px solid #f0d9d6;
    font-size:13px;color:#7a3b33}
  .emp__head{display:flex;gap:26px;align-items:center;flex-wrap:wrap;padding:16px}
  .emp__rating{font-size:19px;font-weight:800;padding:8px 18px;border-radius:8px;letter-spacing:-.01em}
  .emp__rating--kaufen{background:var(--upbg);color:var(--up)}
  .emp__rating--halten{background:#f4f6f8;color:var(--mut)}
  .emp__rating--verkaufen{background:var(--downbg);color:var(--down)}
  .emp__kz,.emp__hz{display:flex;flex-direction:column;gap:2px}
  .emp__kzk{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut2);font-weight:600}
  .emp__kz strong{font-size:17px} .emp__hz strong{font-size:14px}
  .emp__txt{padding:0 16px 14px;margin:0;color:#2a3542;line-height:1.6}
  .emp__disc{border-top:1px solid var(--line);background:#fafbfc;padding:15px 16px}
  .emp__disc h3{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);
    margin:0 0 9px;font-weight:700}
  .emp__disc h3:not(:first-child){margin-top:18px}
  .emp__tbl{width:100%;border-collapse:collapse;font-size:12.5px}
  .emp__tbl th{text-align:left;width:26%;padding:7px 10px 7px 0;color:var(--mut);font-weight:600;
    vertical-align:top;border-bottom:1px solid var(--line)}
  .emp__tbl td{padding:7px 0;color:#3a4756;line-height:1.5;border-bottom:1px solid var(--line)}
  .emp__hist th{width:auto;border-bottom:2px solid var(--line)}
  .emp__none{font-size:12.5px;color:var(--mut2);font-style:italic;margin:0}
  .emp__risk{font-size:12px;color:#7a3b33;line-height:1.55;margin:16px 0 0;padding:11px 13px;
    background:#fdf6f5;border:1px solid #f0d9d6;border-radius:8px}


/* ---------- Zwei-Klick-Lösung del gráfico de TradingView ----------
   Marcador que sustituye al widget hasta que el visitante lo pide. */
.tv-consent{border:1px dashed var(--line);border-radius:11px;background:#fbfcfd;
  padding:22px 20px;text-align:center;min-height:220px;display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:6px}
.tv-consent__t{margin:0;font-weight:700;font-size:14.5px;color:var(--ink)}
.tv-consent__d{margin:0;max-width:520px;font-size:12.5px;line-height:1.55;color:var(--mut)}
.tv-consent__btn{margin-top:8px;background:linear-gradient(135deg,var(--gold2),var(--gold));
  color:#1a1206;font-weight:700;border:0;border-radius:8px;padding:9px 18px;
  font-size:13.5px;cursor:pointer}
.tv-consent__btn:hover{filter:brightness(1.05)}
.tv-consent__l{margin:2px 0 0;font-size:11.5px}
.tv-consent__l a{color:var(--acc);text-decoration:underline}

.k-hint{margin:4px 0 0;font-size:12px;color:var(--mut2)}

/* ================= Buscador de empresas (home) ================= */
.aa-s{position:relative;max-width:640px;margin:0 auto;width:100%}
.aa-s__input{width:100%;padding:16px 18px;font-size:16.5px;border:2px solid var(--line);
  border-radius:11px;outline:none;background:var(--card);color:var(--ink);
  box-shadow:0 1px 2px rgba(13,27,42,.04)}
.aa-s__input:focus{border-color:var(--gr2);box-shadow:0 0 0 4px rgba(23,161,132,.16)}
.aa-s__input::placeholder{color:var(--mut2)}
.aa-s__out{position:absolute;left:0;right:0;top:calc(100% + 7px);z-index:30;background:var(--card);
  border:1px solid var(--line);border-radius:11px;overflow:hidden;text-align:left;
  box-shadow:0 12px 30px rgba(13,27,42,.13)}
.aa-s__hit{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;
  padding:11px 14px;border-bottom:1px solid var(--line)}
.aa-s__hit:last-child{border-bottom:0}
.aa-s__hit:hover,.aa-s__hit.is-sel{background:#fbf7ef}
.aa-s__tk{font:700 12.5px/1 ui-monospace,Menlo,monospace;color:var(--gold);
  background:#fbf3e2;padding:5px 7px;border-radius:5px;text-align:center}
.aa-s__nm{font-size:14px;font-weight:600;color:var(--ink)}
.aa-s__meta{font-size:11.5px;color:var(--mut2);white-space:nowrap}
.aa-s__none{padding:15px;font-size:13px;color:var(--mut)}
.aa-s__none a{color:var(--acc);text-decoration:underline}
@media(max-width:600px){.aa-s__meta{display:none}.aa-s__hit{grid-template-columns:56px 1fr}}

/* ================= Mockup A · estilo stockanalysis.com ================= */
.mkA__strip{background:var(--navy);color:#cfdae6;font-size:12.5px}
.mkA__strip .wrap{display:flex;gap:26px;flex-wrap:wrap;padding:9px 20px}
.mkA__strip b{color:#fff}
.mkA__hero{text-align:center;padding:64px 20px 46px}
.mkA__hero h1{font-size:29px;letter-spacing:-.02em;margin:0 0 22px;color:var(--ink)}
.mkA__chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.mkA__chip{font-size:12.5px;padding:6px 12px;border:1px solid var(--line);border-radius:99px;
  background:#fff;color:var(--mut)}
.mkA__chip:hover{border-color:var(--gold);color:var(--ink)}
.mkA__cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:34px 0}
@media(max-width:820px){.mkA__cards{grid-template-columns:repeat(2,1fr)}}
.mkA__card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px}
.mkA__card:hover{border-color:var(--gold)}
.mkA__card b{display:block;font-size:14.5px;margin-bottom:4px}
.mkA__card span{font-size:12.5px;color:var(--mut);line-height:1.45}
.mkA__two{display:grid;grid-template-columns:1.25fr 1fr;gap:24px;padding-bottom:44px}
@media(max-width:900px){.mkA__two{grid-template-columns:1fr}}

/* ================= Mockup B · combinación ================= */
.mkB__hero{background:linear-gradient(180deg,var(--navy) 0%,var(--navy2) 100%);color:#fff;
  padding:60px 20px 52px;text-align:center}
.mkB__hero h1{font-size:32px;letter-spacing:-.025em;margin:0 0 10px;line-height:1.18}
.mkB__hero h1 span{color:var(--gold2)}
.mkB__sub{margin:0 auto 26px;max-width:620px;color:#a9c8bf;font-size:15px;line-height:1.55}
.mkB__counts{display:flex;gap:34px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.mkB__c b{display:block;font-size:25px;font-weight:800;color:#fff;letter-spacing:-.02em}
.mkB__c span{font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--gr3);opacity:.8}
.mkB__trust{margin:22px auto 0;max-width:660px;font-size:12px;color:#7ba899;line-height:1.55}
.mkB__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
@media(max-width:860px){.mkB__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.mkB__grid{grid-template-columns:1fr}}
.mkB__sec{background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px;
  display:block;border-left:3px solid var(--gr)}
.mkB__sec:hover{box-shadow:0 4px 14px rgba(13,27,42,.07)}
.mkB__sec b{display:block;font-size:15px;margin-bottom:5px}
.mkB__sec p{margin:0 0 9px;font-size:12.5px;color:var(--mut);line-height:1.5}
.mkB__n{font:700 11.5px/1 ui-monospace,Menlo,monospace;color:var(--gr)}
.mkB__boersen{display:flex;gap:9px;flex-wrap:wrap}
.mkB__b{border:1px solid var(--line);background:#fff;border-radius:9px;padding:10px 14px;font-size:13px}
.mkB__b:hover{border-color:var(--gr);color:var(--gr)}
.mkB__b b{font:700 12px/1 ui-monospace,Menlo,monospace;color:var(--mut2);margin-left:7px}
.mk__note{font-size:12px;color:var(--mut2);line-height:1.55}

/* ================= Hero «Atlas de bolsas» =================
   Movimiento a partir de datos, no de vídeo: SVG en línea, sin peticiones externas.
   Todo lo que se mueve está bajo `prefers-reduced-motion` al final del bloque. */
/* El hero crece para que el mapa tenga aire y el texto caiga sobre el Atlántico,
   que es la zona vacía del encuadre. Sin esto las etiquetas de Europa y Nueva York
   se cruzan con el titular. */
.mkB__hero{position:relative;overflow:hidden;padding:96px 20px 74px;
  background:linear-gradient(158deg,#0a2f31 0%,#0d4a3c 48%,#072f2b 100%)}
.mkB__hero > *:not(.atlas){position:relative;z-index:2}
/* Velo central: garantiza contraste del titular pase lo que pase detrás. El mapa es
   fondo; si compite con el texto, deja de ser fondo. */
.mkB__hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(60% 54% at 50% 56%,rgba(6,38,34,.92) 0%,rgba(6,38,34,.74) 45%,rgba(6,38,34,0) 100%)}
.atlas{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.85}
.atlas svg{width:100%;height:100%;display:block}

.atlas__grid line{stroke:var(--gr3);stroke-width:.6;opacity:.13}
.atlas__grid .atlas__eq{stroke:var(--gr3);opacity:.26;stroke-width:.9}

.atlas__arcs path{fill:none;stroke:url(#atArc);stroke-width:1.5;
  stroke-dasharray:1400;stroke-dashoffset:1400;
  animation:atDraw 2.6s cubic-bezier(.4,0,.2,1) forwards;
  animation-delay:calc(var(--d) * .45s)}
@keyframes atDraw{to{stroke-dashoffset:0}}

.atlas__pt{opacity:0;animation:atIn .8s ease forwards;animation-delay:var(--d)}
@keyframes atIn{to{opacity:1}}
.atlas__dot{fill:#d9b055}
.atlas__ring{fill:none;stroke:#e0ad3f;stroke-width:1;opacity:.45;
  transform-box:fill-box;transform-origin:center;
  animation:atPulse 3.4s ease-in-out infinite}
@keyframes atPulse{
  0%,100%{transform:scale(.72);opacity:.5}
  50%    {transform:scale(1.12);opacity:.14}
}

.atlas__labels{position:absolute;inset:0}
.atlas__lb{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;
  font-size:10px;letter-spacing:.04em;color:#8fc4b4;opacity:0;
  animation:atIn .7s ease forwards;animation-delay:var(--d)}
.atlas__lb b{font-weight:700;color:#d6e9e1}
.atlas__lb i{font-style:normal;font-family:ui-monospace,Menlo,monospace;
  color:var(--gold2);margin-left:6px}
/* Separación del punto según la dirección declarada en boersen.js */
.atlas__lb--arriba{transform:translate(-50%,-230%)}
.atlas__lb--abajo{transform:translate(-50%,130%)}
.atlas__lb--izquierda{transform:translate(-108%,-50%)}
.atlas__lb--derecha{transform:translate(8%,-50%)}
@media(max-width:760px){.atlas__labels{display:none}}

@media(prefers-reduced-motion:reduce){
  .atlas__arcs path{animation:none;stroke-dashoffset:0}
  .atlas__pt,.atlas__lb{animation:none;opacity:1}
  .atlas__ring{animation:none;opacity:.4}
}

/* ================= Mockup C · estructura tipo TapRefer =================
   Dos columnas: discurso a la izquierda, producto en cristal a la derecha.
   Donde el original pone prueba social («Used by 3.386 creators» + avatares),
   aquí va prueba de DATO: no tenemos usuarios y no se inventan. */
.mkC{position:relative;overflow:hidden;padding:74px 20px 78px;
  background:linear-gradient(158deg,#0a2f31 0%,#0d4a3c 48%,#072f2b 100%)}
.mkC::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(76% 74% at 26% 50%,rgba(6,38,34,.97) 0%,rgba(6,38,34,.88) 38%,rgba(6,38,34,.45) 68%,rgba(6,38,34,0) 100%)}
.mkC > .wrap{position:relative;z-index:2}
.mkC__grid{display:grid;grid-template-columns:1.02fr .98fr;gap:46px;align-items:center}
@media(max-width:940px){.mkC__grid{grid-template-columns:1fr;gap:38px}}

.mkC__pill{display:inline-flex;align-items:center;gap:9px;background:rgba(63,208,171,.10);
  border:1px solid rgba(63,208,171,.30);color:#8fe3c8;border-radius:99px;
  padding:6px 13px 6px 8px;font-size:12px;letter-spacing:.01em;margin-bottom:20px}
.mkC__pill b{background:var(--gr2);color:#04201a;font-weight:800;font-size:10.5px;
  padding:3px 8px;border-radius:99px;letter-spacing:.04em}
.mkC h1{font-size:41px;line-height:1.1;letter-spacing:-.03em;color:#fff;margin:0 0 16px}
.mkC h1 em{font-style:normal;color:var(--gr3)}
.mkC__sub{color:#a9c8bf;font-size:15.5px;line-height:1.6;margin:0 0 26px;max-width:520px}
.mkC .aa-s{margin:0 0 18px}
.mkC__bul{list-style:none;margin:0 0 26px;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px}
.mkC__bul li{font-size:13px;color:#bcd6cd;display:flex;align-items:center;gap:7px}
.mkC__bul li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gr3);flex:0 0 auto}

/* Prueba de dato — el reemplazo honesto de la fila de avatares */
.mkC__proof{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.09);padding-top:20px}
.mkC__pv b{display:block;font-size:20px;font-weight:800;color:#fff;letter-spacing:-.02em;line-height:1.1}
.mkC__pv span{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--gr3);opacity:.85}
.mkC__pt{font-size:11.5px;color:#7ba899;line-height:1.5;max-width:250px}

/* Producto en cristal: una ficha REAL, no un mockup inventado */
.mkC__stack{position:relative;perspective:1200px}
.mkC__card{background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.15);
  border-radius:16px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  box-shadow:0 26px 60px rgba(2,18,16,.45);padding:20px;color:#eaf4f0}
.mkC__card--back{position:absolute;top:-42px;left:52px;right:-24px;z-index:1;opacity:.62;
  transform:rotate(-1.6deg);padding:14px 18px}
.mkC__card--front{position:relative;z-index:2}
.mkC__ch{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.mkC__lg{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--gold2),var(--gold));color:#1a1206;font-weight:900;font-size:15px}
.mkC__ch h3{margin:0;font-size:16px;color:#fff;letter-spacing:-.01em}
.mkC__ch small{display:block;font:600 11.5px/1.4 ui-monospace,Menlo,monospace;color:#8fc4b4}
.mkC__fs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.10);border-radius:10px;overflow:hidden}
.mkC__f{background:rgba(6,38,34,.55);padding:10px 12px}
.mkC__f span{display:block;font-size:9.5px;text-transform:uppercase;letter-spacing:.07em;color:#7ba899;margin-bottom:3px}
.mkC__f b{font:600 13px/1.3 ui-monospace,Menlo,monospace;color:#eaf4f0}
.mkC__cap{margin:14px 0 0;font-size:11px;color:#7ba899;line-height:1.5}
.mkC__peers{margin:0;padding:0;list-style:none}
.mkC__peers li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;
  border-bottom:1px solid rgba(255,255,255,.08);font-size:12.5px}
.mkC__peers li:last-child{border:0}
.mkC__peers i{font-style:normal;font-family:ui-monospace,Menlo,monospace;color:#8fc4b4}
@media(max-width:940px){.mkC__card--back{display:none}}

/* ================= Mockup D · sistema visual de TapRefer =================
   Valores extraídos del propio sitio (WordPress/Elementor expone sus variables):
     tipografía  Inter — 48/54 w600 · 17/27 w500 · 22/28 w700 · 24/32 w700 · 12/14 w500
     color       fondo #090909 · acento LIMA #C9F300 · olivas #2B3110 / #171A09
                 grises #989899 #626263 #3E3E40

   La familia NO se carga de Google Fonts: sería reintroducir la petición externa que
   acabamos de eliminar (y el caso Google Fonts del LG München va de eso). Se usa la
   pila del sistema con las MÉTRICAS de Inter. Para la Inter literal hay que
   autoalojar los ficheros. */
.mkD{--lima:#C9F300; --lima-d:#9DBB12; --oliva:#2B3110; --oliva-d:#171A09;
  --g1:#989899; --g2:#626263; --g3:#3E3E40;
  position:relative;background:#090909;color:#fff;padding:76px 20px 84px;overflow:hidden;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
/* Halo lima muy tenue: es el único adorno del original */
.mkD::before{content:"";position:absolute;top:-220px;right:-160px;width:620px;height:620px;
  border-radius:50%;background:radial-gradient(circle,rgba(201,243,0,.13) 0%,rgba(201,243,0,0) 66%);
  pointer-events:none}
.mkD > .wrap{position:relative;z-index:2}
.mkD__grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
@media(max-width:940px){.mkD__grid{grid-template-columns:1fr;gap:40px}}

.mkD__pill{display:inline-flex;align-items:center;gap:9px;background:var(--oliva-d);
  border:1px solid var(--oliva);border-radius:99px;padding:6px 14px 6px 7px;
  font-size:12px;line-height:14px;font-weight:500;color:var(--g1);margin-bottom:22px}
.mkD__pill b{background:var(--lima);color:#141413;font-weight:700;font-size:11px;line-height:14px;
  padding:4px 9px;border-radius:99px}
.mkD h1{font-size:48px;line-height:54px;font-weight:600;letter-spacing:-.02em;color:#fff;margin:0 0 18px}
.mkD h1 em{font-style:normal;color:var(--lima)}
.mkD__sub{font-size:17px;line-height:27px;font-weight:500;color:var(--g1);margin:0 0 28px;max-width:520px}
.mkD .aa-s{margin:0 0 20px}
.mkD .aa-s__input{background:#141413;border:1px solid var(--g3);color:#fff;
  font-size:16px;font-weight:500;border-radius:12px}
.mkD .aa-s__input::placeholder{color:var(--g2)}
.mkD .aa-s__input:focus{border-color:var(--lima);box-shadow:0 0 0 4px rgba(201,243,0,.14)}
.mkD__bul{list-style:none;margin:0 0 30px;padding:0;display:flex;flex-wrap:wrap;gap:9px 20px}
.mkD__bul li{font-size:14px;line-height:20px;font-weight:500;color:var(--g1);
  display:flex;align-items:center;gap:8px}
.mkD__bul li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lima);flex:0 0 auto}

.mkD__proof{display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  border-top:1px solid var(--g3);padding-top:22px}
.mkD__pv b{display:block;font-size:22px;line-height:28px;font-weight:700;color:#fff}
.mkD__pv span{font-size:12px;line-height:14px;font-weight:500;color:var(--g2);
  text-transform:uppercase;letter-spacing:.06em}
.mkD__pt{margin:16px 0 0;font-size:12px;line-height:19px;font-weight:500;color:var(--g2);max-width:520px}

/* Tarjeta de producto: negra con filo lima, no cristal */
.mkD__stack{position:relative}
.mkD__card{background:#141413;border:1px solid var(--g3);border-radius:18px;padding:22px;
  box-shadow:0 30px 70px rgba(0,0,0,.55)}
.mkD__card--back{position:absolute;top:-40px;left:56px;right:-22px;z-index:1;opacity:.55;
  transform:rotate(-1.4deg);padding:15px 20px;background:var(--oliva-d);border-color:var(--oliva)}
.mkD__card--front{position:relative;z-index:2}
.mkD__ch{display:flex;align-items:center;gap:13px;margin-bottom:18px}
.mkD__lg{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
  background:var(--lima);color:#141413;font-weight:700;font-size:16px}
.mkD__ch h3{margin:0;font-size:22px;line-height:28px;font-weight:700;color:#fff;letter-spacing:-.01em}
.mkD__ch small{display:block;font-size:12px;line-height:18px;font-weight:500;color:var(--g2)}
.mkD__fs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--g3);
  border:1px solid var(--g3);border-radius:12px;overflow:hidden}
.mkD__f{background:#0A0A0A;padding:12px 14px}
.mkD__f span{display:block;font-size:12px;line-height:14px;font-weight:500;color:var(--g2);
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:5px}
.mkD__f b{font-size:14px;line-height:20px;font-weight:700;color:#fff;
  font-family:ui-monospace,Menlo,monospace}
.mkD__cap{margin:16px 0 0;font-size:12px;line-height:18px;font-weight:500;color:var(--g2)}
.mkD__cap a{color:var(--lima)}
.mkD__peers{margin:0;padding:0;list-style:none}
.mkD__peers li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,.07);font-size:13px;line-height:18px;
  font-weight:500;color:var(--g1)}
.mkD__peers li:last-child{border:0}
.mkD__peers i{font-style:normal;font-family:ui-monospace,Menlo,monospace;color:var(--lima-d)}
@media(max-width:940px){.mkD__card--back{display:none}}
@media(max-width:640px){.mkD h1{font-size:36px;line-height:42px}}


/* Cuerpo de la maqueta D: mismo sistema que su hero, para que se pueda juzgar
   como un diseño y no como tres sistemas cosidos. */
.mkD-body{--lima:#C9F300; --oliva:#2B3110; --g2:#626263; --g3:#3E3E40;
  background:#090909;color:#fff;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.mkD-body .sec-head h2{color:#fff;font-size:24px;line-height:32px;font-weight:700}
.mkD-body .sec-head h2::before{background:var(--lima)}
.mkD-body .sec-head a{color:var(--lima);font-size:14px;font-weight:500}
.mkD-body .mkB__sec{background:#141413;border:1px solid var(--g3);border-left:3px solid var(--lima)}
.mkD-body .mkB__sec:hover{background:#171A09;box-shadow:none}
.mkD-body .mkB__sec b{color:#fff;font-size:18px;line-height:24px;font-weight:700}
.mkD-body .mkB__sec p{color:#989899;font-size:14px;line-height:22px;font-weight:500}
.mkD-body .mkB__n{color:var(--lima);font-size:12px;font-weight:700}
.mkD-body .mkB__b{background:#141413;border:1px solid var(--g3);color:#989899;
  font-size:14px;font-weight:500}
.mkD-body .mkB__b:hover{border-color:var(--lima);color:#fff}
.mkD-body .mkB__b b{color:var(--lima)}


/* Cabecera, franja y pie en el sistema de la maqueta D. Se activa con
   `theme: "d"` en el front-matter; sin esa marca, el sitio queda intacto. */
.ticker--d{background:#0A0A0A;color:#626263;border-bottom:1px solid #1D1D1C}
.ticker--d .tk b{color:#C9F300}
.ticker--d .px{color:#626263}
.top--d{background:#090909;box-shadow:0 1px 0 #1D1D1C;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.top--d .logo{color:#fff;font-size:19px}
.top--d .logo .mark{background:#C9F300;color:#141413;border-radius:9px}
.top--d .logo span{color:#C9F300}
.top--d nav.main a{color:#989899;font-size:14px;font-weight:500;border-bottom-color:transparent}
.top--d nav.main a:hover,.top--d nav.main a.active{color:#fff;border-color:#C9F300}
.top--d .search{background:#141413;border:1px solid #3E3E40;color:#626263}
.top--d .search input{color:#fff}
.top--d .search input::placeholder{color:#626263}
.top--d .lang{color:#626263;font-size:13px}
.top--d .lang b{color:#fff}
.top--d .btn{background:#C9F300;color:#141413;font-weight:700;border-radius:10px}
.top--d .btn:hover{background:#d8ff1a}
.footer--d{background:#0A0A0A;border-top:1px solid #1D1D1C;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.footer--d a:hover{color:#C9F300}
.footer--d .logo .mark{background:#C9F300;color:#141413}
.footer--d .logo span{color:#C9F300}

/* Bloques del cuerpo de la maqueta D */
.mkD__cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:38px}
@media(max-width:860px){.mkD__cards{grid-template-columns:repeat(2,1fr)}}
.mkD__qc{display:block;background:#141413;border:1px solid #3E3E40;border-radius:14px;padding:18px}
.mkD__qc:hover{border-color:#C9F300;background:#171A09}
.mkD__qc b{display:block;font-size:16px;line-height:22px;font-weight:700;color:#fff;margin-bottom:5px}
.mkD__qc span{font-size:13px;line-height:19px;font-weight:500;color:#989899}

.mkD__two{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;margin-bottom:38px}
@media(max-width:900px){.mkD__two{grid-template-columns:1fr}}

.mkD__tbl{width:100%;border-collapse:collapse;background:#141413;
  border:1px solid #3E3E40;border-radius:14px;overflow:hidden;font-size:14px}
.mkD__tbl th{text-align:left;padding:11px 15px;font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;color:#626263;border-bottom:1px solid #3E3E40}
.mkD__tbl td{padding:11px 15px;border-bottom:1px solid rgba(255,255,255,.06);color:#989899}
.mkD__tbl tbody tr:last-child td{border-bottom:0}
.mkD__tbl tbody tr:hover{background:#171A09}
.mkD__tbl td a b{display:block;font-size:14px;font-weight:600;color:#fff}
.mkD__tbl td a i{font-style:normal;font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:#C9F300}
.ta-r{text-align:right}
.mkD__note{margin:11px 0 0;font-size:12px;line-height:18px;font-weight:500;color:#626263}
.mkD__note strong{color:#989899}

.mkD__na{display:block;background:#141413;border:1px solid #3E3E40;border-radius:12px;
  padding:14px;margin-bottom:10px}
.mkD__na:hover{border-color:#C9F300}
.mkD__na b{display:block;font-size:14.5px;line-height:20px;font-weight:600;color:#fff;margin-top:5px}
.mkD__cat{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#C9F300}

.mkD__nl{background:#171A09;border:1px solid #2B3110;border-radius:14px;padding:18px}
.mkD__nl b{display:block;font-size:16px;font-weight:700;color:#fff;margin-bottom:6px}
.mkD__nl p{margin:0 0 13px;font-size:13px;line-height:19px;font-weight:500;color:#989899}
.mkD__btn{display:inline-block;background:#C9F300;color:#141413;font-weight:700;font-size:14px;
  padding:10px 18px;border-radius:10px}
.mkD__btn:hover{background:#d8ff1a}

.mkD__brs{display:flex;gap:10px;flex-wrap:wrap}
.mkD__br{display:inline-flex;align-items:baseline;gap:9px;background:#141413;
  border:1px solid #3E3E40;border-radius:11px;padding:11px 15px}
.mkD__br b{font-size:14px;font-weight:700;color:#fff}
.mkD__br i{font-style:normal;font-size:12px;color:#626263}
.mkD__br em{font-style:normal;font-family:ui-monospace,Menlo,monospace;font-size:12.5px;
  font-weight:700;color:#C9F300}

.mkD__wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:860px){.mkD__wgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.mkD__wgrid{grid-template-columns:1fr}}
.mkD__w{display:block;background:#141413;border:1px solid #3E3E40;border-radius:12px;padding:15px}
.mkD__w:hover{border-color:#C9F300;background:#171A09}
.mkD__w b{display:block;font-size:14.5px;line-height:20px;font-weight:600;color:#fff;margin-top:5px}

.mkD__ir{display:flex;gap:26px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  background:#171A09;border:1px solid #2B3110;border-radius:16px;padding:24px}
.mkD__ir b{display:block;font-size:18px;font-weight:700;color:#fff;margin-bottom:7px}
.mkD__ir p{margin:0;max-width:640px;font-size:13.5px;line-height:21px;font-weight:500;color:#989899}
.mkD__ir strong{color:#C9F300}


/* Hero de la maqueta D sin la tarjeta de producto: una sola columna y el buscador
   a todo el ancho. La acción primaria es buscar, así que ocupa el espacio. */
.mkD__grid{grid-template-columns:1fr}
.mkD__grid > div{max-width:860px}
.mkD .mkD__sub{max-width:700px}
.mkD .aa-s{max-width:860px;margin-left:0;margin-right:0}
.mkD .aa-s__input{padding:19px 22px;font-size:17px;border-radius:14px}
.mkD .aa-s__out{border-radius:14px}


/* Hero de la maqueta D centrado y a todo el ancho (petición del cliente).
   Sustituye al bloque anterior de una columna alineada a la izquierda. */
.mkD{padding:92px 20px 84px}
.mkD__grid > div{max-width:none;text-align:center}
.mkD h1{font-size:56px;line-height:64px;letter-spacing:-.03em}
@media(max-width:760px){.mkD h1{font-size:38px;line-height:44px}}
.mkD .mkD__sub{max-width:660px;margin-left:auto;margin-right:auto}
.mkD .aa-s{max-width:760px;margin:0 auto 20px}
.mkD__bul{justify-content:center}
.mkD__proof{justify-content:center;border-top:1px solid #1D1D1C;margin-top:6px}
.mkD__pt{margin-left:auto;margin-right:auto;text-align:center}
.mkD::after{background:radial-gradient(62% 58% at 50% 46%,rgba(9,9,9,.0) 0%,rgba(9,9,9,.0) 100%)}


/* Aviso de empresa deslistada — deliberadamente prominente. */
.p-delisted{background:#fdf6f5;border:1px solid #f0d9d6;border-left:4px solid var(--down);
  border-radius:10px;padding:14px 16px;margin:0 0 22px;font-size:13.5px;line-height:1.6;color:#7a3b33}
.p-delisted strong{color:#8f2e22}

.fact__stand{display:block;font-size:11px;font-weight:500;color:var(--mut2);margin-top:2px}

/* ═══════════════════════════════════════════════════════════════════════════
   TEMA OSCURO — se activa con `theme: "d"` y cuelga de <body class="th-d">.
   Cubre TODA la página, no solo la portada: si al pulsar «Sektoren» el sitio
   saltara de negro a blanco, no parecería un rediseño sino dos sitios cosidos.
   ═══════════════════════════════════════════════════════════════════════════ */
.th-d{--lima:#C9F300; --oliva:#2B3110; --oliva2:#171A09;
  --g1:#989899; --g2:#626263; --g3:#3E3E40; --panel:#141413;

  /* Se REDEFINEN las variables del sitio claro. Cada sección trae su propio
     bloque <style> —hasta 156 reglas en la ficha de empresa— y esos estilos ganan
     al tema por orden de cascada. Pero usan variables (--line 54 veces, --mut 40,
     --gold 27), así que redefinirlas aquí adapta TODO de golpe en vez de tener que
     duplicar cada regla.

     --anz NO se toca: es el ámbar del marcado «Anzeige», una señal legal (§5a UWG)
     que debe seguir distinguiéndose del resto pase lo que pase con el diseño. */
  --bg:#090909; --card:#141413; --line:#3E3E40; --ink:#ffffff;
  --mut:#989899; --mut2:#626263;
  --gold:#C9F300; --gold2:#d8ff1a; --acc:#C9F300;
  --navy:#0A0A0A; --navy2:#141413; --text-primary:#ffffff;
  --up:#7ee081; --upbg:#16240f; --down:#ff8a7a; --downbg:#2a1512;
  --soft:#1b1b1a; --warm:#1b1b19;
  background:#090909;color:#fff;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.th-d a{color:inherit}

/* Bloques y encabezados genéricos */
.th-d .content-block{background:var(--panel);border:1px solid var(--g3);border-radius:14px;
  padding:22px;margin-bottom:16px}
.th-d .content-block h2,.th-d .content-block h3{color:#fff}
.th-d .content-block p,.th-d .content-block li{color:var(--g1)}
.th-d .content-block strong{color:#fff}
/* Solo los enlaces DENTRO DE PROSA se pintan y subrayan. La regla anterior
   apuntaba a todo `a` del bloque y teñía de lima las tarjetas de noticia
   enteras, que son enlaces envolventes. */
.th-d .content-block p > a,
.th-d .content-block li > a,
.th-d .content-block td > a{color:var(--lima);text-decoration:underline}
.th-d .section-header{border-bottom:1px solid var(--g3)}
.th-d .section-title,.th-d h1,.th-d h2{color:#fff;letter-spacing:-.02em}
.th-d .eyebrow,.th-d .lbl{color:var(--lima);text-transform:uppercase;letter-spacing:.07em}
.th-d .tldr{background:var(--oliva2);border:1px solid var(--oliva);border-left:3px solid var(--lima);
  border-radius:10px;color:var(--g1)}
.th-d .disclaimer{color:var(--g2)}
.th-d .breadcrumb,.th-d .breadcrumb a{color:var(--g2)}
.th-d .breadcrumb a:hover{color:var(--lima)}
.th-d .chip{background:var(--panel);border:1px solid var(--g3);color:var(--g1)}
.th-d .chip:hover,.th-d .chip.is-on{border-color:var(--lima);color:var(--lima);background:var(--oliva2)}
.th-d .mono{color:var(--g1)}

.th-d .sec-head h2{color:#fff}
.th-d .sec-head h2::before{background:var(--lima)}
.th-d .sec-head a{color:var(--lima)}
.th-d .panel,.th-d .box{background:var(--panel);border:1px solid var(--g3);border-radius:14px}
.th-d .panel .ph{border-bottom:1px solid var(--g3);color:#fff}
.th-d .box h4{color:#fff}
.th-d .box p{color:var(--g1)}

/* Tablas — directorio y listados */
.th-d table.dir-table,.th-d table.mv,.th-d table.p-table{background:var(--panel);
  border:1px solid var(--g3);border-radius:14px;overflow:hidden}
.th-d .dir-table th,.th-d table.mv th,.th-d .p-table th{color:var(--g2);
  border-bottom:1px solid var(--g3);text-transform:uppercase;letter-spacing:.06em;font-size:11px}
.th-d .dir-table td,.th-d table.mv td,.th-d .p-table td{color:var(--g1);
  border-bottom:1px solid rgba(255,255,255,.06)}
.th-d .dir-table tbody tr:hover,.th-d table.mv tbody tr:hover,
.th-d .p-table tbody tr:hover{background:var(--oliva2)}
.th-d .dir-name,.th-d .p-table td strong{color:#fff;font-weight:600}
.th-d .dir-ex{color:var(--g2)}
.th-d .dir-input{background:var(--panel);border:1px solid var(--g3);color:#fff}
.th-d .dir-input:focus{border-color:var(--lima);box-shadow:0 0 0 3px rgba(201,243,0,.14)}
.th-d .dir-input::placeholder{color:var(--g2)}
.th-d .is-self{background:var(--oliva2)}

/* Noticias */
.th-d .n-item,.th-d .newslist .item{background:var(--panel);border:1px solid var(--g3);border-radius:14px}
.th-d .n-item:hover,.th-d .newslist .item:hover{border-color:var(--lima)}
.th-d .n-cat,.th-d .cat{color:var(--lima)}
.th-d .n-body h3 a,.th-d .newslist h3 a{color:#fff}
.th-d .n-meta,.th-d .newslist p,.th-d .newslist .m{color:var(--g1)}
.th-d .n-bar{border-bottom:1px solid var(--g3)}

/* Wissen */
.th-d .w-card{background:var(--panel);border:1px solid var(--g3);border-radius:12px}
.th-d .w-card:hover{border-color:var(--lima);background:var(--oliva2)}
.th-d .w-card b,.th-d .w-card h3{color:#fff}
.th-d .w-more,.th-d .term-tags{color:var(--g2)}

/* Sektoren */
.th-d .sek-card{background:var(--panel);border:1px solid var(--g3);border-left:3px solid var(--lima)}
.th-d .sek-card:hover{background:var(--oliva2)}
.th-d .sek-card h3{color:#fff}
.th-d .sek-card__txt,.th-d .sek-stats{color:var(--g1)}

/* Anzeige — la caja de contenido pagado mantiene su color ámbar a propósito:
   es una señal legal (§5a UWG) y debe distinguirse del resto pase lo que pase. */
.th-d .featured{background:#1a1408;border-color:#4a3a15}
.th-d .featured h2{color:#e0ad3f}
.th-d .fc{background:var(--panel);border-color:#4a3a15}
.th-d .fc h3{color:#fff}
.th-d .fc p,.th-d .disc,.th-d .anz-note{color:#a3893f}
.th-d .anz-mini{background:var(--panel);border:1px solid var(--g3)}

/* Fichas de empresa */
.th-d .p-sec h2{color:#fff}
.th-d .fact-grid{background:var(--g3);border:1px solid var(--g3)}
.th-d .fact{background:var(--panel)}
.th-d .fact__k{color:var(--g2)}
.th-d .fact__v{color:#fff}
.th-d .p-note,.th-d .p-empty{color:var(--g2)}
.th-d .p-empty{background:var(--panel);border:1px solid var(--g3)}
.th-d .p-lead{color:var(--g1)}
.th-d .badge{background:var(--oliva2);border:1px solid var(--oliva);color:var(--lima)}
.th-d .badge-muted{background:var(--panel);border-color:var(--g3);color:var(--g1)}
.th-d .p-jump{border-bottom:1px solid var(--g3)}
.th-d .p-jump a{color:var(--g1)}
.th-d .p-jump a:hover{color:var(--lima)}
.th-d .tv-consent{background:var(--panel);border-color:var(--g3)}
.th-d .tv-consent__t{color:#fff}
.th-d .tv-consent__d{color:var(--g1)}
.th-d .tv-consent__btn{background:var(--lima);color:#141413}

/* Botones y listas */
.th-d .btn{background:var(--lima);color:#141413;font-weight:700}
.th-d .btn:hover{background:#d8ff1a}
.th-d .flag-list li{color:var(--g1);border-bottom-color:var(--g3)}
.th-d .flag-list li::before{color:var(--lima)}
.th-d input,.th-d textarea{background:var(--panel);border:1px solid var(--g3);color:#fff}
/* …excepto el buscador de la cabecera: ya vive DENTRO de una caja con borde, así
   que la regla genérica de arriba le dibujaba un segundo recuadro dentro del
   primero. El campo debe ser invisible y dejar que la caja haga de marco. */
.th-d .search input{background:transparent;border:0}
.th-d input::placeholder{color:var(--g2)}


/* Contenedores de página que seguían en blanco bajo el tema oscuro. */
.th-d main,.th-d main.content,.th-d .content,.th-d .profil,.th-d .wrap-p{background:transparent}
.th-d main.content{background:#090909}
.th-d .n-item,.th-d .w-card,.th-d .sek-card,.th-d .newslist .item{color:var(--g1)}
.th-d .n-item h3,.th-d .n-item b{color:#fff}


/* Fondos `#fff` escritos a mano en los <style> de página: las variables no
   llegan ahí, así que se cubren por selector. */
.th-d .w-card,.th-d .sek-card,.th-d .n-item,.th-d .anz-mini,.th-d .dir-table,
.th-d .fc,.th-d .panel,.th-d .box,.th-d .content-block,.th-d .stammdaten,
.th-d .p-empty,.th-d table{background-color:var(--panel)}
.th-d .tldr,.th-d .featured{background-color:var(--oliva2)}
.th-d .featured{background-color:#1a1408}

.lang a{color:inherit;opacity:.75}
.lang a:hover{opacity:1;text-decoration:underline}
.th-d .lang a:hover{color:var(--lima)}
