/* Unterseiten im Stil von Vorschlag 3 (Auftrag #243, 17.10.2026): Case Study, Vergleich, Branchen.
   Wird von pages/<name>.html per <link> geladen; nutzt die Tokens aus site.css. */

/* Interner Entwurfshinweis — vor dem Veröffentlichen samt Inhalt entfernen */
.entwurf{margin:0 0 22px;padding:12px 16px;border:1px dashed #c58b00;border-radius:10px;background:#fff8e1;color:#5c4400;font-size:14px;line-height:1.5}
.entwurf b{font-family:'Montserrat',sans-serif}
mark.pruefen{background:#ffe9a8;color:inherit;padding:0 3px;border-radius:3px;box-shadow:inset 0 -2px 0 #e0a800}
mark.pruefen::after{content:" ⚑";font-size:.8em;color:#9a6b00}

/* Abschnitte untereinander, Kopf über den Karten (statt des zweispaltigen .tech-Rasters) */
section.blk{padding:clamp(44px,6vw,80px) 0}
section.blk.soft{background:var(--soft)}
.blk .sec-head{max-width:760px;margin-bottom:clamp(24px,3vw,36px)}
.blk .sec-head p{color:var(--ink-2)}
.blk .sec-cards.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.blk .sec-cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.blk .card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px 26px;display:grid;gap:10px;align-content:start}
.blk .card h3{font-size:19px;font-weight:800}
.blk .card p,.blk .card li{color:var(--ink-2);font-size:15.5px}
.blk .card ul{list-style:disc;padding-left:18px;display:grid;gap:6px}
.blk .ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}

/* Vergleich: Übersichtstabelle */
.vgl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r);background:#fff}
table.vgl{width:100%;border-collapse:collapse;min-width:760px;font-size:15px}
table.vgl th,table.vgl td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
table.vgl thead th{font-family:'Montserrat',sans-serif;font-size:13.5px;color:var(--gray);background:var(--soft)}
table.vgl tbody th{font-family:'Montserrat',sans-serif;font-weight:700;color:var(--forest);white-space:nowrap}
table.vgl tr:last-child th,table.vgl tr:last-child td{border-bottom:0}
table.vgl td.pp{background:var(--green-ll);color:var(--ink)}
.vgl-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.vgl-nav a{font-family:'Montserrat',sans-serif;font-weight:700;font-size:13.5px;padding:9px 14px;border-radius:999px;background:var(--green-l);color:var(--green-dd);text-decoration:none}
.vgl-nav a:hover{background:#d7ebc8}

/* Case Study */
.cs-top{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:start}
.cs-quote{margin:0;font-size:clamp(20px,2vw,26px);line-height:1.45;color:var(--green-dd);font-family:'Montserrat',sans-serif;font-weight:700}
.cs-quote + p{margin-top:12px;color:var(--gray);font-size:15px}
.cs-facts{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;display:grid;gap:12px;font-size:15px}
.cs-facts img{height:120px;width:auto;max-width:220px;margin:-30px 0 -26px -18px;object-fit:contain;object-position:left center;justify-self:start}
.cs-facts dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}
.cs-facts dt{font-family:'Montserrat',sans-serif;font-weight:700;color:var(--forest)}
.cs-facts dd{margin:0;color:var(--ink-2)}
.cs-facts ul{padding-left:18px;margin:0;list-style:disc}
.prose{max-width:72ch}
.prose h2{font-size:clamp(24px,2.4vw,30px);font-weight:800;margin:0 0 12px}
.prose p{color:var(--ink-2);margin:0 0 14px}
.prose ul{list-style:disc}.prose ol{list-style:decimal}
.prose ul,.prose ol{padding-left:20px;color:var(--ink-2);display:grid;gap:6px;margin:0 0 14px}
.cs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px)}

/* Branchen: Querverweis */
.xref{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:20px 24px;border:1px solid #c9dbbd;border-radius:var(--r);background:var(--green-ll)}
.xref p{margin:0;color:var(--ink-2)}

@media (max-width:900px){
  .blk .sec-cards.three,.blk .sec-cards.two,.cs-top,.cs-grid{grid-template-columns:1fr}
}