/*
Theme Name: TAOM
Theme URI: https://taom.ai
Author: TRANIVA AG
Author URI: https://traniva.com
Description: TAOM – Adaptive AI Organization Method. Firmen-/Produkt-Theme im TAOM-Look (dunkler Navy-Header mit blauem Marken-Block, „Process Studio · Digital Twin"-Branding, blaue Akzente, klare Karten). 4-sprachig vorbereitet (de/en/fr/es), Polylang-kompatibel.
Version: 1.7.1
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: Proprietär – © 2026 TRANIVA AG
Text Domain: taom
Tags: business, clean, custom-header, custom-menu, footer-widgets, translation-ready, blog
*/

:root{
  --navy:#101827; --rail:#1e3a5f; --rail-bd:#2b4a72;
  --kicker:#63b8e6; --sub-navy:#8fa4bd;
  --blue:#0b6bcb; --blue-d:#0a5aa8; --blue-bg:#eaf2ff; --blue-bd:#cfe0ff;
  --ink:#172b4d; --sub:#5e6c84; --line:#e6e9ee; --bg:#f7f8fa; --card:#fff;
  --ok:#0a7d3e; --danger:#c0392b;
  --shadow:0 1px 3px rgba(9,30,66,.12),0 0 1px rgba(9,30,66,.18);
  --shadow-lg:0 10px 30px rgba(9,30,66,.12);
  --radius:12px; --maxw:1180px;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--taom-kopf,76px) + 14px)}   /* 1.7.0: Sprungmarken landen unter dem stehenden Kopf, nicht dahinter */
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.6;font-size:16px}
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.2;color:var(--ink);margin:0 0 .5em}
.container{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip-link{position:absolute;left:-9999px;top:0;background:#fff;padding:10px 14px;z-index:1000}
.skip-link:focus{left:10px;top:10px;border-radius:8px;box-shadow:var(--shadow)}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;border-radius:10px;padding:11px 18px;border:1px solid transparent;cursor:pointer;transition:.14s;text-decoration:none;line-height:1}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-primary:hover{background:var(--blue-d);border-color:var(--blue-d);color:#fff}
.btn-secondary{background:#fff;color:#42526e;border-color:#c6ccd6}
.btn-secondary:hover{background:#f4f6f9;color:#42526e}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}
.btn-lg{padding:14px 24px;font-size:16px;border-radius:12px}

/* ============ Header ============ */
/* 1.7.0: Kopf mit Hauptmenü (sechs Punkte, Mega-Felder) – Regeln des Menüs im Abschnitt «Hauptmenü» am Ende. */
.site-header{background:var(--navy);color:#fff;position:sticky;top:0;z-index:100;box-shadow:0 6px 20px rgba(16,24,39,.18);
  --tmn-blue:#2f7fed;--tmn-blue-d:#0b6bcb;--tmn-sky:#8fc1ff;--tmn-ink:#172b4d;--tmn-grey:#5e6c84;--tmn-line:#e3e9f2;--tmn-bg:#f5f7fa;--tmn-navy:#0f1727;--tmn-navy2:#16213a}
/* Mit Adminleiste bleibt der Kopf unter der Leiste stehen, statt beim Blättern dahinter zu verschwinden. */
.admin-bar .site-header{top:32px}
@media screen and (max-width:782px){.admin-bar .site-header{top:46px}}
@media screen and (max-width:600px){.admin-bar .site-header{top:0}}
.site-header .container{position:relative;z-index:3;display:flex;align-items:center;gap:20px;min-height:76px;padding-left:calc(22px + 60px)}
.brand-rail{position:absolute;left:0;top:0;bottom:0;width:52px;background:var(--rail);border-right:1px solid var(--rail-bd)}
.brand{display:flex;flex-direction:column;justify-content:center;text-decoration:none;line-height:1.1;flex:none}
.brand:hover{text-decoration:none}
.brand .kicker{color:var(--kicker);font-size:12px;font-weight:800;letter-spacing:.3em;text-transform:uppercase}
.brand .title{color:#fff;font-size:22px;font-weight:800;margin-top:2px}
.brand .sub{color:var(--sub-navy);font-size:12.5px;font-weight:500}
.header-tools{display:flex;align-items:center;gap:10px;margin-left:auto;flex:none}
/* Kontokarte (TAOM Connect): gleicher Abstand wie die übrigen Knöpfe; ein leerer Platzhalter nimmt keinen Platz. */
.header-tools .tck-kopf-platz{margin-right:0!important}
.header-tools .tck-kopf-platz:empty{display:none!important}
/* language switcher */
.lang-switch{position:relative}
/* 1.6.8: wie der Sprachumschalter im Editor (Kopfzeile) */
.lang-switch>button{display:inline-flex;align-items:center;height:36px;box-sizing:border-box;min-width:118px;padding:0 32px 0 14px;background-color:#16305a;color:#dbe6f7;border:1px solid #26456f;border-radius:8px;font:600 14px/1 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23dbe6f7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat:no-repeat;background-position:right 12px center}
.lang-switch>button:hover{border-color:#3b6ea8;color:#fff}
.lang-kurz{display:none}   /* 1.7.0: Kürzel (DE, EN …) statt Sprachname, wenn es im Kopf eng wird */
.lang-menu{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-lg);padding:5px;min-width:150px;display:none;z-index:60}
.lang-switch.open .lang-menu{display:block}
.lang-menu a{display:block;color:#42526e;font-weight:600;font-size:14px;padding:8px 11px;border-radius:7px;text-decoration:none}
.lang-menu a:hover{background:var(--blue-bg);color:var(--blue)}
.lang-menu a.active{color:var(--blue)}
.header-cta{background:var(--blue);color:#fff;border:1px solid var(--blue);border-radius:8px;padding:9px 15px;font-weight:700;font-size:14px}
.header-cta:hover{background:var(--blue-d);color:#fff}

/* status ticker bar (unter dem Header) */
.taom-ticker-bar{background:linear-gradient(90deg,var(--blue),#1583e6);color:#fff;overflow:hidden}
.taom-ticker-bar .container{display:flex;align-items:center;gap:14px;padding-top:9px;padding-bottom:9px}
.taom-ticker-bar .live{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:13px;flex:0 0 auto}
.taom-ticker-bar .dot{width:9px;height:9px;border-radius:50%;background:#8ef0c0;animation:taomPulse 1.7s infinite}
@keyframes taomPulse{0%{box-shadow:0 0 0 0 rgba(142,240,192,.6)}70%{box-shadow:0 0 0 7px rgba(142,240,192,0)}100%{box-shadow:0 0 0 0 rgba(142,240,192,0)}}
.ticker-view{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ticker-track{display:inline-block;white-space:nowrap;font-size:13.5px;animation:taomTicker 34s linear infinite;will-change:transform}
.ticker-view:hover .ticker-track{animation-play-state:paused}
@keyframes taomTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ============ Hero ============ */
.hero{background:radial-gradient(1200px 400px at 15% -10%,#1c3a63 0,transparent 60%),var(--navy);color:#fff;padding:76px 0 84px;position:relative;overflow:hidden}
.hero .kicker{color:var(--kicker);font-weight:800;letter-spacing:.24em;text-transform:uppercase;font-size:13px}
.hero h1{color:#fff;font-size:clamp(30px,5vw,52px);font-weight:800;margin:12px 0 14px;max-width:16ch}
.hero p.lead{color:#c7d4e4;font-size:clamp(16px,2vw,20px);max-width:60ch;margin:0 0 26px}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap}
.hero .badge-row{margin-top:28px;display:flex;gap:10px;flex-wrap:wrap}
.hero .pill{font-size:12.5px;font-weight:700;color:#bfe0f5;background:rgba(99,184,230,.14);border:1px solid rgba(99,184,230,.4);border-radius:20px;padding:5px 13px}

/* ============ Sections ============ */
.section{padding:64px 0}
.section.alt{background:#fff}
.section-head{max-width:720px;margin:0 auto 40px;text-align:center}
.section-head .kicker{color:var(--blue);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:12.5px}
.section-head h2{font-size:clamp(24px,3.4vw,34px);margin:8px 0 10px}
.section-head p{color:var(--sub);font-size:16.5px;margin:0}

.grid{display:grid;gap:22px;grid-template-columns:repeat(3,1fr)}
.grid.two{grid-template-columns:repeat(2,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;transition:.15s}
.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.card .ic{width:44px;height:44px;border-radius:12px;background:var(--blue-bg);color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.card .ic svg{width:22px;height:22px}
.card h3{font-size:18px;margin:0 0 8px}
.card p{color:var(--sub);font-size:15px;margin:0}

/* product showcase */
.showcase{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center}
.showcase .frame{background:var(--navy);border-radius:16px;box-shadow:var(--shadow-lg);overflow:hidden;position:relative;padding-left:44px}
.showcase .frame .rail{position:absolute;left:0;top:0;bottom:0;width:44px;background:var(--rail);border-right:1px solid var(--rail-bd)}
.showcase .frame .barhead{padding:14px 16px}
.showcase .frame .barhead .k{color:var(--kicker);font-size:11px;font-weight:800;letter-spacing:.28em}
.showcase .frame .barhead .t{color:#fff;font-size:19px;font-weight:800}
.showcase .frame .barhead .s{color:var(--sub-navy);font-size:12px}
.showcase .frame .canvas{background:#eef1f5;height:230px;background-image:radial-gradient(#cfd6df 1px,transparent 1px);background-size:18px 18px}
.showcase ul.checks{list-style:none;padding:0;margin:16px 0 22px}
.showcase ul.checks li{position:relative;padding-left:30px;margin:10px 0;color:#33415a;font-size:15.5px}
.showcase ul.checks li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--blue-bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.5 2.5L14 7' fill='none' stroke='%230b6bcb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* CTA band */
.cta-band{background:var(--navy);color:#fff;border-radius:18px;padding:44px;text-align:center;margin:0 auto}
.cta-band h2{color:#fff;font-size:clamp(24px,3vw,32px)}
.cta-band p{color:#c7d4e4;max-width:56ch;margin:8px auto 22px}

/* ============ Blog ============ */
.page-head{background:var(--navy);color:#fff;padding:48px 0}
.page-head h1{color:#fff;margin:0}
.page-head .crumbs{color:var(--sub-navy);font-size:13px;margin-bottom:8px}
.content-wrap{display:grid;grid-template-columns:1fr 320px;gap:44px;padding:56px 0}
.post-list{display:flex;flex-direction:column;gap:26px}
.post-card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;margin:0;display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--blue-bd)}
.post-card .thumb{display:block;overflow:hidden;aspect-ratio:16/7;background:var(--blue-bg)}
.post-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.post-card:hover .thumb img{transform:scale(1.04)}
.post-card .body{padding:24px 26px 26px}
.post-card .cat{display:inline-block;margin-bottom:12px;padding:4px 11px;border-radius:999px;background:var(--blue-bg);color:var(--blue-d);border:1px solid var(--blue-bd);font-size:12px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;text-decoration:none}
.post-card .cat:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.post-card .meta{color:var(--sub);font-size:13px;margin:0 0 8px}
.post-card h2{font-size:23px;line-height:1.25;margin:0 0 10px;letter-spacing:-.01em}
.post-card h2 a{color:var(--ink);text-decoration:none}
.post-card h2 a:hover{color:var(--blue)}
.post-card .excerpt{color:#42526e;font-size:15.5px;line-height:1.65;margin:0 0 16px}
.post-card .readmore{display:inline-flex;align-items:center;gap:7px;font-weight:800;font-size:14.5px;color:var(--blue);text-decoration:none}
.post-card .readmore span{transition:transform .18s ease}
.post-card .readmore:hover span{transform:translateX(4px)}
.entry-content{font-size:16.5px;color:#2a3b52}
.entry-content h2,.entry-content h3{margin-top:1.4em}
.entry-content img{border-radius:10px;margin:1em 0}
.entry-content blockquote{border-left:3px solid var(--blue);margin:1.2em 0;padding:.3em 1em;color:#42526e;background:#f4f8ff;border-radius:0 8px 8px 0}
.widget{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:20px 22px;margin-bottom:22px}
.widget-title{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--sub);margin:0 0 14px;font-weight:800}
.widget ul{list-style:none;padding:0;margin:0}
.widget li{padding:9px 0;border-top:1px solid #eef1f5;line-height:1.4}
.widget li:first-child{border-top:0;padding-top:0}
.widget a{color:var(--ink);text-decoration:none;font-weight:600}
.widget a:hover{color:var(--blue)}
.pagination{display:flex;gap:8px;flex-wrap:wrap;margin-top:30px}
.pagination .page-numbers{display:inline-flex;padding:9px 14px;border:1px solid var(--line);border-radius:9px;background:#fff;color:#42526e;font-weight:700;text-decoration:none;transition:all .15s ease}
.pagination .page-numbers:hover{border-color:var(--blue);color:var(--blue)}
.pagination .current{background:var(--blue);color:#fff;border-color:var(--blue)}

/* forms */
input[type=text],input[type=email],input[type=search],input[type=url],input[type=password],textarea,select{width:100%;padding:11px 13px;border:1px solid #c6ccd6;border-radius:9px;font:inherit;font-size:15px;background:#fff;color:var(--ink)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(11,107,203,.15)}
label{font-weight:600;font-size:14px;display:block;margin:12px 0 5px}

/* 404 */
.err404{text-align:center;padding:90px 0}
.err404 .code{font-size:96px;font-weight:800;color:var(--blue-bg)}
.err404-wege{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:640px;margin:0 auto}
.err404-weg{display:inline-block;padding:9px 16px;border:1px solid var(--line,#dfe5f2);border-radius:999px;font-weight:600;text-decoration:none;background:#fff}
.err404-weg:hover{border-color:var(--blue,#0b6bcb);color:var(--blue,#0b6bcb)}

/* ============ Footer ============ */
.site-footer{background:#0c1420;color:#aeb9c8;margin-top:20px}
/* 1.7.0: Marke und fünf Spalten (Produkt & Methode, Ressourcen, Vertrauen, Rechtliches, Service) */
.site-footer .cols{display:grid;grid-template-columns:1.3fr repeat(5,minmax(0,1fr));gap:30px;padding:56px 0 34px}
.site-footer h4{color:#fff;font-size:14px;text-transform:uppercase;letter-spacing:.05em;margin:0 0 14px}
.site-footer a{color:#aeb9c8}
.site-footer a:hover{color:#fff;text-decoration:none}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{padding:5px 0}
.footer-brand .kicker{color:var(--kicker);font-size:12px;font-weight:800;letter-spacing:.3em}
.footer-brand .title{color:#fff;font-size:20px;font-weight:800}
.footer-brand p{font-size:14px;max-width:34ch;margin:10px 0 0}
.footer-legal{border-top:1px solid #1c2635;padding:18px 0;font-size:12.5px;color:#7f8da0;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
.footer-legal a{color:#9aa7b8}

/* ============ Responsive ============ */
@media(max-width:1180px){
  .site-footer .cols{grid-template-columns:repeat(3,minmax(0,1fr))}
  .site-footer .footer-brand{grid-column:1/-1}
}
@media(max-width:960px){
  .grid{grid-template-columns:1fr 1fr}
  .showcase{grid-template-columns:1fr}
  .content-wrap{grid-template-columns:1fr}
}
@media(max-width:760px){
  .grid,.grid.two{grid-template-columns:1fr}
  .site-footer .cols{grid-template-columns:1fr 1fr}
  .header-cta{display:none}
}
@media(max-width:480px){
  .site-footer .cols{grid-template-columns:1fr}
}

/* ============ Lightbox ============ */
.taom-lb{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;background:rgba(9,18,33,.86);padding:30px}
.taom-lb.open{display:flex}
.taom-lb img{max-width:94vw;max-height:90vh;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.taom-lb-x{position:absolute;top:18px;right:22px;width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:18px;cursor:pointer}
.taom-lb-x:hover{background:rgba(255,255,255,.28)}
/* Editor-Embed (Process Studio via Shortcode) */
.taom-editor-embed{max-width:1400px;margin:0 auto;padding:0 22px 40px}

/* ============ Home: übernommene Landing-Elemente ============ */
.hero .hg{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
@media(max-width:900px){.hero .hg{grid-template-columns:1fr}}
.flowcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:0 6px 24px rgba(16,40,70,.12)}
.flowcard svg{width:100%;height:auto;display:block}
.typemini{height:96px;border-radius:10px;background:#f6f9fc;border:1px solid #e6ebf1;display:grid;place-items:center;overflow:hidden;margin-bottom:12px}
.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.chip{font-size:12.5px;font-weight:700;color:#33475b;background:#eef4fb;border:1px solid #dbe7f5;border-radius:999px;padding:6px 13px}
.ticks{list-style:none;padding:0;margin:.4em 0 0}
.ticks li{position:relative;padding:8px 0 8px 30px;border-bottom:1px dashed var(--line);color:#33415a}
.ticks li:before{content:"✓";position:absolute;left:0;top:8px;color:var(--blue);font-weight:900}
.fw-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:8px}
@media(max-width:860px){.fw-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:520px){.fw-grid{grid-template-columns:repeat(2,1fr)}}
.fwc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;text-align:center;box-shadow:var(--shadow)}
.fwc .k{font-weight:900;color:var(--blue);font-size:13px}.fwc .tt{font-size:12.5px;color:var(--sub);margin-top:4px}
.fwc.on{outline:2px solid var(--blue);outline-offset:-2px}
.faq details{border:1px solid var(--line);border-radius:12px;padding:2px 18px;margin-bottom:10px;background:#fff}
.faq summary{cursor:pointer;font-weight:700;padding:14px 0;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";float:right;color:var(--blue);font-weight:900}
.faq details[open] summary:after{content:"–"}
.faq p{color:var(--sub);margin:0 0 14px}
/* Editor-Seite: volle Breite, Navigation bleibt (Full-Width-Template) */
.page-template-full-width .site-main{padding:0}

/* Editor-Seite über die volle Viewport-Breite (Ausbruch aus dem Container), Navigation bleibt */
.taom-editor-full{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.taom-editor-full > *{max-width:100%}

/* ============ Framework-Übersicht: klickbare Teil-Karten ============ */
.fw-parts a.card{color:inherit;text-decoration:none;display:flex;flex-direction:column;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.fw-parts a.card:hover{border-color:var(--blue);box-shadow:0 12px 28px rgba(11,107,203,.16);transform:translateY(-2px)}
.fw-parts a.card .fw-open{margin-top:auto;padding-top:12px;color:var(--blue);font-weight:800;font-size:13.5px}
.fwc .fw-n{display:block;font-size:30px;font-weight:900;color:var(--blue);line-height:1;margin-bottom:4px}
.fwc small{color:var(--sub);font-size:11px}

/* ============ Framework-Teilseiten: Kapitel-Liste ============ */
.fw-chapters{max-width:920px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.fwrow{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;box-shadow:var(--shadow)}
.fwrow:hover{border-color:var(--blue-bd)}
.fwid{flex:0 0 auto;min-width:92px;text-align:center;font-weight:800;font-size:12.5px;color:var(--blue);background:var(--blue-bg);border:1px solid var(--blue-bd);border-radius:8px;padding:7px 8px}
.fwtx strong{display:block;color:#16223a;font-size:15px;margin-bottom:3px}
.fwtx p{margin:0;color:var(--sub);font-size:14px;line-height:1.6}
@media(max-width:560px){.fwrow{flex-direction:column;gap:8px}.fwid{min-width:0;align-self:flex-start}}

/* ===== TAOM Blog-Listing (v1) - TAOM Blocks =====
   Ergaenzt das Theme-Karten-Design: Bild LINKS, vollstaendig sichtbar;
   Meta/Kategorie/Weiterlesen aus; ganze Karte klickbar; Sidebar aufgeraeumt. */
main.site-main .content-wrap{ padding-top:26px; padding-bottom:30px; }
main.site-main .page-head{ padding-top:30px; padding-bottom:30px; }

main.site-main .post-card{ position:relative; flex-direction:row; align-items:flex-start; }
main.site-main .post-card .thumb{ flex:0 0 42%; width:42%; aspect-ratio:auto; height:auto; position:relative; z-index:2; }
main.site-main .post-card .thumb img{ width:100%; height:auto; object-fit:contain; }
main.site-main .post-card .body{ flex:1 1 auto; min-width:0; }

main.site-main .post-card .meta{ display:none; }
main.site-main .post-card .cat{ display:none; }
main.site-main .post-card .readmore{ display:none; }

main.site-main .post-card h2 a::after{ content:""; position:absolute; inset:0; z-index:1; }
main.site-main .post-card .excerpt a{ position:relative; z-index:2; }

@media (max-width:600px){
  main.site-main .post-card{ flex-direction:column; }
  main.site-main .post-card .thumb{ width:100%; flex-basis:auto; }
}

aside.sidebar .widget{ background:#fff; border:1px solid #e6eaf0; border-radius:14px; padding:20px 22px; margin:0 0 18px; box-shadow:0 8px 24px rgba(16,42,67,.06); }
aside.sidebar .widget h2, aside.sidebar .widget .wp-block-heading{ font-size:13px; text-transform:uppercase; letter-spacing:.07em; font-weight:800; color:#0a6fc0; margin:0 0 14px; padding-bottom:10px; border-bottom:2px solid #eef2f7; }
aside.sidebar .widget ul{ list-style:none; margin:0; padding:0; }
aside.sidebar .widget ul li{ margin:0; padding:9px 0; border-bottom:1px solid #f0f3f7; line-height:1.45; }
aside.sidebar .widget ul li:last-child{ border-bottom:0; padding-bottom:0; }
aside.sidebar .widget a{ color:#33475b; text-decoration:none; font-size:14.5px; }
aside.sidebar .widget a:hover{ color:#0788e2; }
aside.sidebar .wp-block-search__input, aside.sidebar input[type=search]{ border:1px solid #d9e1ea; border-radius:9px; padding:10px 12px; box-shadow:none; }
aside.sidebar .wp-block-search__button{ background:#0788e2; border:0; border-radius:9px; color:#fff; padding:0 16px; font-weight:600; }

/* dezente Bewegung beim Hovern (Bild zoomt) */
main.site-main .post-card .thumb{ overflow:hidden; }
main.site-main .post-card .thumb img{ transition:transform .45s ease; }
main.site-main .post-card:hover .thumb img{ transform:scale(1.06); }

/* Kompakte, gleich grosse Kacheln + Navy-Ellipsis */
main.site-main .post-list{ gap:18px; }
main.site-main .post-card{ height:236px; overflow:hidden; align-items:stretch; }
main.site-main .post-card .thumb{ flex:0 0 36%; width:36%; height:236px; align-self:stretch; }
main.site-main .post-card .thumb img{ width:100%; height:236px; object-fit:contain; background:#eef4ff; }
main.site-main .post-card .body{ height:236px; padding:16px 20px; display:flex; flex-direction:column; overflow:hidden; }
main.site-main .post-card h2{ font-size:18px; line-height:1.2; margin:0 0 8px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
main.site-main .post-card .excerpt{ font-size:14px; line-height:1.55; overflow:hidden; flex:1 1 auto; }
main.site-main .post-card .excerpt .taom-ell{ color:#101827; font-weight:800; }
@media (max-width:600px){ main.site-main .post-card{ height:auto; flex-direction:column; } main.site-main .post-card .thumb, main.site-main .post-card .thumb img, main.site-main .post-card .body{ height:auto; width:100%; } }

/* Karten-Slider (Galerie mit Klasse taom-card) */
main.site-main .post-card .thumb{ position:relative; }
main.site-main .post-card .taom-gal-track{ display:flex; height:100%; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; }
main.site-main .post-card .taom-gal-track::-webkit-scrollbar{ display:none; }
main.site-main .post-card .taom-gal-track .slide{ flex:0 0 100%; scroll-snap-align:start; height:100%; display:block; }
main.site-main .post-card .taom-gal-track .slide img{ width:100%; height:100%; object-fit:contain; background:#eef4ff; display:block; }
main.site-main .post-card .thumb .taom-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:5; width:26px; height:26px; border-radius:50%; background:#101827; color:#fff; display:flex; align-items:center; justify-content:center; font-size:15px; line-height:1; cursor:pointer; opacity:.9; }
main.site-main .post-card .thumb .taom-arrow:hover{ background:#0a6fc0; opacity:1; }
main.site-main .post-card .thumb .taom-arrow.prev{ left:6px; }
main.site-main .post-card .thumb .taom-arrow.next{ right:6px; }
main.site-main .post-card .thumb .taom-dots{ position:absolute; bottom:8px; left:0; right:0; display:flex; gap:6px; justify-content:center; z-index:5; }
main.site-main .post-card .thumb .taom-dots .dot{ width:8px; height:8px; border-radius:50%; background:rgba(16,24,39,.4); cursor:pointer; }
main.site-main .post-card .thumb .taom-dots .dot.is-active{ background:#101827; }
/* ===== Ende TAOM Blog-Listing ===== */

/* ---------------------------------------------------------------------------
 * Ganzflaechige Landingpages: weisser Streifen oben und unten
 *
 * Das Theme polstert den Inhaltsbehaelter mit 52 Pixeln. Bei Seiten, die mit
 * einem dunklen Band beginnen und enden, wird daraus ein heller Balken. Nur
 * diese Polsterung wird aufgehoben - die Randabstaende fuer die volle Breite
 * bleiben unangetastet. Dieselbe Ursache und dieselbe Loesung wie auf
 * /editor-als-team/, hier aber zentral statt je Seite.
 *
 * Die Klasse .taom-fullbleed am aeusseren Behaelter genuegt kuenftig; die
 * Seiten-IDs stehen daneben, weil die bestehenden Seiten sie noch nicht tragen.
 * ------------------------------------------------------------------------- */
body:has(.taom-fullbleed) div:has(> .entry-content),
body.page-id-1272 div:has(> .entry-content),
body.page-id-1287 div:has(> .entry-content),
body.page-id-1297 div:has(> .entry-content),
body.page-id-1309 div:has(> .entry-content),
body.page-id-1316 div:has(> .entry-content),
body.page-id-1318 div:has(> .entry-content),
body.page-id-1320 div:has(> .entry-content),
body.page-id-1324 div:has(> .entry-content),
body.page-id-1339 div:has(> .entry-content),
body.page-id-1341 div:has(> .entry-content),
body.page-id-1343 div:has(> .entry-content),
body.page-id-1347 div:has(> .entry-content){padding-top:0!important;padding-bottom:0!important}

/* ---------------------------------------------------------------------------
 * Diagramme vergroessern (Lupe)
 *
 * Die Schaubilder auf den Landingpages sind breit; auf einem Notebook sind
 * Beschriftungen im Fliesstext kaum lesbar. Ein Klick zeigt sie gross.
 * Erfasst werden ausschliesslich Abbildungen mit der Endung __bild im
 * Klassennamen - das ist die Konvention dieser Seiten, andere Bilder der
 * Website bleiben unberuehrt.
 * ------------------------------------------------------------------------- */
figure[class$="__bild"]{position:relative}
figure[class$="__bild"] img{cursor:zoom-in}
figure[class$="__bild"]::after{content:"Vergrössern";position:absolute;top:14px;right:14px;
 background:rgba(16,24,39,.82);color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.04em;
 padding:6px 12px;border-radius:999px;opacity:0;transition:opacity .18s;pointer-events:none}
figure[class$="__bild"]:hover::after,figure[class$="__bild"]:focus-within::after{opacity:1}
.taom-lupe{position:fixed;inset:0;z-index:99999;background:rgba(16,24,39,.94);
 display:flex;align-items:center;justify-content:center;padding:24px;cursor:zoom-out}
.taom-lupe img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:12px;
 box-shadow:0 24px 60px rgba(0,0,0,.5);cursor:default}
.taom-lupe__zu{position:absolute;top:18px;right:22px;background:none;border:0;color:#fff;
 font-size:34px;line-height:1;cursor:pointer;padding:8px 14px;border-radius:8px}
.taom-lupe__zu:hover{background:rgba(255,255,255,.12)}
.taom-lupe__zu:focus-visible{outline:3px solid #63b8e6;outline-offset:2px}
.taom-lupe__text{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#c3d1e2;font-size:14px}
@media (prefers-reduced-motion:reduce){figure[class$="__bild"]::after{transition:none}}

/* ---------------------------------------------------------------------------
 * KI-Kennzeichnung an Abbildungen
 *
 * Die Schaubilder dieser Seiten sind vollstaendig mit KI erzeugt. Wer auf der
 * eigenen Website Herkunftstransparenz fordert (siehe Qualitaetssiegel), muss
 * sie bei den eigenen Inhalten zeigen. Der Hinweis ist deshalb dauerhaft
 * sichtbar und nicht erst beim Ueberfahren - eine Kennzeichnung, die man
 * suchen muss, ist keine.
 * ------------------------------------------------------------------------- */
figure[class$="__bild"]{position:relative}
figure[class$="__bild"] .taom-ki-hinweis{position:absolute;left:14px;bottom:14px;
 display:inline-flex;align-items:center;gap:7px;background:rgba(16,24,39,.78);color:#dbe9f7;
 font-size:12px;font-weight:600;letter-spacing:.04em;padding:6px 12px;border-radius:999px;
 pointer-events:none;backdrop-filter:blur(2px)}
figure[class$="__bild"] .taom-ki-hinweis::before{content:"";width:7px;height:7px;border-radius:50%;
 background:#63b8e6;flex:0 0 auto}
figure[class$="__bild"] figcaption .taom-ki-hinweis{position:static;background:none;color:var(--sub,#5e6c84);padding:0}
.taom-lupe__ki{position:absolute;bottom:52px;left:0;right:0;text-align:center;color:#8fa4bd;
 font-size:13.5px;letter-spacing:.02em}
.taom-lupe__ki b{color:#63b8e6;font-weight:700;letter-spacing:.06em}
@media (max-width:620px){figure[class$="__bild"] .taom-ki-hinweis{left:10px;bottom:10px;font-size:11px;padding:5px 10px}}

/* ---------------------------------------------------------------------------
 * Beitragsbild auf Seiten nicht anzeigen
 *
 * Das Beitragsbild dient hier nur als Vorschaubild beim Teilen (og:image) und
 * fuer Suchmaschinen. Im Seiteninhalt hat es nichts verloren - es doppelt den
 * Hero und schiebt den Aufbau nach unten. Beitraege und Demos bleiben davon
 * unberuehrt, dort ist das Bild gewollt.
 * ------------------------------------------------------------------------- */
body.page .wp-post-image,
body.page .post-thumbnail,
body.page .entry-thumbnail{display:none!important}
/* Sicherheitsnetz: falls ein anderes Template das Bild doch ausgibt. Die
   eigentliche Abschaltung steht in page.php. */


/* Seitenüberschrift im Inhalt.
   Frueher stand hier ein zweites <h1> - zusammen mit der Titelzeile des Themes
   hatte jede dieser Seiten zwei H1. Die Ueberschrift ist jetzt ein <h2> und
   behaelt ueber diese Klasse ihr bisheriges Aussehen. Seiten mit eigener
   Gestaltungsregel im Inhalt ueberschreiben das hier. */
.taom-seitentitel{
  font-size:clamp(30px,4.4vw,46px);
  line-height:1.12;
  letter-spacing:-.02em;
  font-weight:800;
  margin:0 0 18px;
}

/* 1.6.12 (Nutzer 13.11.2026 «in der Feature-Matrix stimmen die Button-Form nicht – wir haben überall
   rechteckig»): Filterknöpfe und Suchfeld der Feature-Matrix (Inhalt der Seite Lizenzstruktur in
   DE/EN/FR/ES, eigene <style> im Seiteninhalt mit 999px) rechteckig wie alle TAOM-Knöpfe (8px).
   Höhere Spezifität als die Regel im Seiteninhalt, damit der Seiteninhalt unverändert bleibt. */
.fm .fm-reihe button,
.fm .fm-reihe input{border-radius:8px}

/* ---------------------------------------------------------------------------
 * Hauptmenü (1.7.0, Nutzer 14.11.2026 «das neue Menü … genau so umsetzen»)
 *
 * Sechs Punkte im Kopf, je ein Feld über die ganze Breite: links das Wichtigste,
 * daneben die Seiten, die es erklären, dazu eine Karte für Eilige. Rechts Suche
 * und die zwei Wege (Ergebnis ansehen · Erstes Modell anlegen). Unter 921 px
 * Breite wird daraus eine Schublade. Aufbau und Texte: inc/menue.php, Verhalten:
 * assets/js/theme.js. Masse und Farben aus dem abgenommenen Mockup.
 *
 * Alle Klassen tragen die Vorsilbe «tmn-», damit nichts mit den Seiteninhalten
 * zusammenstösst (.grid, .chips, .btn gibt es dort schon).
 * ------------------------------------------------------------------------- */
.site-header a:focus-visible,.site-header button:focus-visible{outline:2px solid var(--tmn-blue);outline-offset:2px}

/* Leiste */
.tmn-menu{display:flex;gap:2px;align-self:stretch;flex:none}
.tmn-menu>button{-webkit-appearance:none;appearance:none;background:none;border:0;margin:0;color:#c9d3e3;font:500 15px/1 var(--sans);padding:0 12px;cursor:pointer;position:relative;display:flex;align-items:center;white-space:nowrap}
.tmn-menu>button::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;background:var(--tmn-blue);transform:scaleX(0);transition:transform .2s}
.tmn-menu>button:hover,.tmn-menu>button[aria-expanded="true"]{color:#fff}
.tmn-menu>button[aria-expanded="true"]::after{transform:scaleX(1)}

/* Rechts: Zeichen-Knöpfe und die zwei Wege */
.tmn-icon{-webkit-appearance:none;appearance:none;box-sizing:border-box;width:36px;height:36px;flex:none;margin:0;padding:0;border-radius:8px;border:1px solid rgba(255,255,255,.16);background:transparent;color:#c9d3e3;display:grid;place-items:center;cursor:pointer;position:relative;text-decoration:none;font:400 15px/1 var(--sans)}
.tmn-icon:hover,.tmn-icon[aria-expanded="true"]{color:#fff;border-color:rgba(255,255,255,.4);text-decoration:none}
.tmn-icon svg{width:17px;height:17px;display:block}
.tmn-burger{display:none}
.tmn-zahl{position:absolute;top:-7px;right:-7px;min-width:18px;height:18px;box-sizing:border-box;padding:0 5px;border-radius:999px;background:var(--tmn-blue);color:#fff;font:700 10.5px/18px var(--sans);text-align:center}
.tmn-btn{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;font:600 14px/1 var(--sans);padding:11px 14px;border-radius:8px;text-decoration:none;border:1px solid transparent;white-space:nowrap;cursor:pointer}
.tmn-btn:hover{text-decoration:none}
.tmn-btn-primary{background:var(--tmn-blue);color:#fff}
.tmn-btn-primary:hover{background:var(--tmn-blue-d);color:#fff}
.tmn-btn-viewer{color:#fff;border-color:rgba(232,121,249,.6);background:rgba(192,38,211,.16)}
.tmn-btn-viewer:hover{color:#fff;border-color:#e879f9}

/* Feld unter dem Kopf */
.tmn-scrim{position:fixed;inset:0;z-index:1;background:rgba(15,23,39,.35)}
.tmn-mega{position:absolute;left:0;right:0;top:100%;z-index:2;background:#fff;color:var(--tmn-ink);border-bottom:1px solid var(--tmn-line);box-shadow:0 30px 60px rgba(15,23,39,.18);font-size:15px;line-height:1.5;text-align:left;overflow-y:auto;overscroll-behavior:contain}
.tmn-scrim[hidden],.tmn-mega[hidden],.tmn-feld[hidden],.tmn-drawer[hidden]{display:none}
.tmn-wrap{box-sizing:border-box;max-width:var(--maxw);margin:0 auto;padding:28px 22px 30px calc(22px + 60px)}
.tmn-wrap>*{max-width:1240px}   /* Breite der Felder wie im Mockup, auch wenn der Kopf breiter ist */
.tmn-grid{display:grid;gap:34px;grid-template-columns:repeat(var(--n,3),minmax(0,1fr))}
.tmn-colh{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tmn-grey);margin:0 0 12px}
.tmn-lst{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.tmn-lst li{margin:0;padding:0}
.tmn-lst a{display:block;padding:7px 10px;margin-left:-10px;border-radius:7px;text-decoration:none;font-size:15px;font-weight:500;color:var(--tmn-ink)}
.tmn-lst a:hover{background:var(--tmn-bg);color:var(--tmn-blue-d);text-decoration:none}
.tmn-lst a small{display:block;font-size:12.5px;font-weight:400;color:var(--tmn-grey);margin-top:1px}
.tmn-lst .tmn-text{color:var(--tmn-grey);font-size:14px;max-width:34em}
.tmn-all{display:inline-block;margin-top:10px;font-size:13.5px;font-weight:600;color:var(--tmn-blue-d);text-decoration:none}
.tmn-all:hover{color:var(--tmn-blue-d);text-decoration:underline}
.tmn-feature{background:var(--tmn-navy);color:#fff;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:8px;text-decoration:none;align-self:start}
.tmn-feature:hover{background:var(--tmn-navy2);color:#fff;text-decoration:none}
.tmn-eyebrow{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tmn-sky)}
.tmn-feature b{font-size:18px;line-height:1.25;letter-spacing:-.01em}
.tmn-go{margin-top:6px;font-size:13.5px;font-weight:600}
.tmn-feature.v{background:linear-gradient(135deg,#3b0f45,var(--tmn-navy) 70%)}
.tmn-feature.v .tmn-eyebrow{color:#f0abfc}
.tmn-chips{display:flex;flex-wrap:wrap;gap:6px}
.tmn-chips a{text-decoration:none;font-size:13.5px;font-weight:500;padding:7px 10px;border:1px solid var(--tmn-line);border-radius:8px;display:inline-flex;gap:6px;align-items:baseline;color:var(--tmn-ink)}
.tmn-chips a:hover{border-color:var(--tmn-blue);color:var(--tmn-blue-d);text-decoration:none}
.tmn-chips code{font:600 10.5px/1 ui-monospace,Menlo,monospace;color:var(--tmn-grey);background:none;padding:0}

/* Feld «Produkte»: Liste links, Erklärung rechts */
.tmn-prod{display:grid;grid-template-columns:270px minmax(0,1fr);gap:34px}
.tmn-plist{display:grid;gap:4px;align-content:start;border-right:1px solid var(--tmn-line);padding-right:22px}
.tmn-plist button{-webkit-appearance:none;appearance:none;text-align:left;background:none;border:1px solid transparent;border-radius:9px;margin:0;padding:10px 12px;cursor:pointer;display:grid;grid-template-columns:12px 1fr;gap:2px 12px;color:var(--tmn-ink);font:inherit}
.tmn-dot{width:10px;height:10px;border-radius:3px;background:var(--c);margin-top:6px;grid-row:span 2}
.tmn-plist button b{font-size:15px;font-weight:600;display:flex;flex-wrap:wrap;align-items:center;column-gap:6px}
.tmn-s{font-size:12.5px;color:var(--tmn-grey)}
.tmn-plist button:hover{background:var(--tmn-bg)}
.tmn-plist button[aria-selected="true"]{background:var(--tmn-bg);border-color:var(--tmn-line)}
.tmn-soon{font-size:10px;font-weight:700;line-height:1.5;padding:2px 6px;border-radius:999px;background:#fff4cc;color:#7a5b00}
/* Alle Erklärungen liegen übereinander in derselben Zelle: Das Feld behält seine Höhe, wenn das Produkt wechselt. */
.tmn-pdets{display:grid;min-width:0}
.tmn-pdet{grid-area:1/1;min-width:0}
.tmn-pdet[hidden]{display:block;visibility:hidden}
.tmn-top2{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-bottom:20px}
.tmn-ptitel{font-size:22px;font-weight:700;line-height:1.2;letter-spacing:-.015em;color:var(--tmn-ink);margin:0}
.tmn-psub{color:var(--tmn-grey);flex-basis:100%;margin:0}
.tmn-acts{display:flex;gap:8px;flex-wrap:wrap}
.tmn-acts a{font-size:13.5px;font-weight:600;text-decoration:none;padding:8px 12px;border-radius:8px;border:1px solid var(--tmn-line);color:var(--tmn-ink)}
.tmn-acts a.p{background:var(--tmn-ink);color:#fff;border-color:var(--tmn-ink)}
.tmn-acts a:hover{border-color:var(--tmn-blue);text-decoration:none}
.tmn-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:22px}
.tmn-platt{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding-top:16px;margin-top:4px;border-top:1px solid var(--tmn-line);font-size:13.5px;color:var(--tmn-grey)}
.tmn-platt b{color:var(--tmn-ink);font-weight:600}
.tmn-platt a{text-decoration:none;font-weight:600;color:var(--tmn-blue-d)}
.tmn-platt a:hover{text-decoration:underline}
.tmn-ganz{margin-left:auto;display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px 14px}

/* Suchzeile */
.tmn-suche form{display:flex;gap:10px;align-items:center;max-width:720px;margin:0}
.tmn-suche input[type=search]{flex:1;min-width:0;height:44px;padding:0 14px;border:1px solid #c6ccd6;border-radius:8px;font:inherit;font-size:16px;color:var(--tmn-ink);background:#fff}
.tmn-suche .tmn-btn{height:44px}

/* Wird es eng: erst kompakt (tmn-k1), dann das Menü in einer zweiten Zeile (tmn-zwei); die Klassen setzt der Kopf selbst
   nach dem Messen (header.php). So bleiben beide Wege rechts sichtbar. */
.site-header.tmn-k1 .container{gap:14px}
.site-header.tmn-k1 .tmn-menu>button{padding:0 9px;font-size:14.5px}
.site-header.tmn-k1 .tmn-menu>button::after{left:9px;right:9px}
.site-header.tmn-k1 .header-tools{gap:8px}
.site-header.tmn-k1 .tmn-btn{padding:10px 11px;font-size:13.5px}
.site-header.tmn-k1 .lang-switch>button{min-width:0;padding:0 28px 0 11px}
.site-header.tmn-k1 .lang-name{display:none}
.site-header.tmn-k1 .lang-kurz{display:inline}
.site-header.tmn-zwei .container{display:grid;grid-template-columns:max-content max-content;grid-template-rows:76px 46px;justify-content:space-between;column-gap:20px;row-gap:0}
.site-header.tmn-zwei .brand{grid-column:1;grid-row:1}
.site-header.tmn-zwei .header-tools{grid-column:2;grid-row:1;margin-left:0}
.site-header.tmn-zwei .tmn-menu{grid-column:1/-1;grid-row:2;margin-left:-12px;border-top:1px solid rgba(255,255,255,.1)}
.site-header.tmn-zwei.tmn-k1 .tmn-menu{margin-left:-9px}
.site-header.tmn-k2 .header-tools>.tmn-btn-viewer{display:none}

@media(max-width:1100px){
  .tmn-wrap{padding-left:22px}
  .tmn-prod{grid-template-columns:240px minmax(0,1fr);gap:26px}
  .tmn-plist{padding-right:14px}
  .tmn-plist button{padding:10px;column-gap:10px}
  .tmn-grid{gap:26px}
}

/* Schublade (bis 920 px Breite) */
.tmn-drawer{position:fixed;inset:0;z-index:50;background:#fff;color:var(--tmn-ink);overflow-y:auto;overscroll-behavior:contain;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));font-size:15px;line-height:1.5;text-align:left}
.tmn-dtop{position:sticky;top:0;z-index:1;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 16px}
.tmn-dtop b{font-size:17px;font-weight:700}
.tmn-dtop .tmn-icon{color:#fff}
.tmn-dsuche{display:flex;gap:8px;margin:0;padding:12px 16px;border-bottom:1px solid var(--tmn-line)}
.tmn-dsuche input[type=search]{flex:1;min-width:0;height:40px;padding:0 12px;border:1px solid #c6ccd6;border-radius:8px;font:inherit;font-size:16px;color:var(--tmn-ink);background:#fff}
.tmn-dsuche .tmn-icon{width:40px;height:40px;border-color:#c6ccd6;color:var(--tmn-ink)}
.tmn-dsuche .tmn-icon:hover{color:var(--tmn-blue-d);border-color:var(--tmn-blue)}
.tmn-drawer details{border-bottom:1px solid var(--tmn-line)}
.tmn-drawer summary{list-style:none;cursor:pointer;padding:16px;font-size:17px;font-weight:600;display:flex;justify-content:space-between}
.tmn-drawer summary::-webkit-details-marker{display:none}
.tmn-drawer summary::after{content:"+";color:var(--tmn-grey);font-weight:400}
.tmn-drawer details[open] summary::after{content:"–"}
.tmn-drawer summary:focus-visible{outline:2px solid var(--tmn-blue);outline-offset:-2px}
.tmn-dbody{padding:0 16px 16px;display:grid;gap:14px}
.tmn-dctas{display:grid;gap:10px;padding:18px 16px}
.tmn-dctas .tmn-btn{justify-content:center}
.tmn-drawer .tmn-btn-viewer,.tmn-drawer .tmn-btn-viewer:hover{color:#c026d3;background:#fbe9fd}
html.tmn-fest{overflow:hidden}

@media(max-width:920px){
  .tmn-menu,.header-tools>.tmn-btn,.tmn-such,.tmn-mega,.tmn-scrim{display:none!important}
  .tmn-burger{display:grid}
  .site-header .container{gap:12px}
  .site-header .brand{flex:0 1 auto;min-width:0}
  .brand .title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .lang-switch>button{min-width:0;padding:0 28px 0 11px}
  .lang-name{display:none}
  .lang-kurz{display:inline}
}
@media(min-width:921px){
  .tmn-drawer{display:none!important}
}
@media(max-width:480px){
  .site-header .container{padding-left:62px;padding-right:14px;gap:8px}
  .brand-rail{width:44px}
  .brand .title{font-size:18px}
  .header-tools{gap:8px}
  .header-tools .tck-k:not(.tck-bild){min-width:44px;padding:0 8px}
}
@media(max-width:380px){
  .brand .title{font-size:16px}
}
@media(prefers-reduced-motion:reduce){
  .tmn-menu>button::after{transition:none}
}
