/* ============ Suite feature pages (/features/) — documentary ledger aesthetic ============
   Same line as branchen/, cases/, playbooks/ and the Trust Center: flat, hairlines,
   small radii, no glass, no glow. Ink ground; ledger cards are cream surfaces with ink
   text (site.css remaps the tokens inside .ledger-card). Only existing CSS variables.
   One shared stylesheet instead of a <style> block per page: 22 pages, one cache entry.
   Screenshots are allowed here, one or two per page, in the ink frame of the homepage. */

body.ft{background:var(--bg)}
.ft-wrap{max-width:940px;margin:0 auto;padding:0 24px}
.ft main section{padding:46px 0;border-bottom:1px solid var(--hairline)}
.ft main section:last-of-type{border-bottom:none}
.ft h1{font-size:clamp(1.9rem,4vw,2.6rem);margin:6px 0 12px}
.ft h2{font-size:1.45rem;font-family:var(--font-serif);margin:0 0 12px}
.ft h3{font-size:1rem;margin:0 0 6px}
.ft .kicker{margin-bottom:8px}
.ft .lead{max-width:680px;font-size:1.06rem;margin-top:16px}
.ft p{max-width:70ch}
.ft main a:not(.btn){color:var(--tx);text-decoration-color:var(--bd-accent);text-underline-offset:3px}
.ft main a:not(.btn):hover{color:var(--link-hover)}

/* breadcrumb + meta line */
.ft-crumbs{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin:0 0 14px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.ft-crumbs li+li::before{content:"\203A";margin-right:6px;color:var(--mut)}
.ft-crumbs a{color:var(--mut);text-decoration:none}
.ft-crumbs a:hover{color:var(--tx)}
.doc-meta{font-family:var(--font-mono);font-size:.7rem;color:var(--mut);letter-spacing:.06em;max-width:none}
.mono{font-family:var(--font-mono)}

/* German-language hint: empty in EN (hidden), filled by site.js when DE is chosen */
.lang-note{border-left:3px solid var(--accent-bar);padding:9px 14px;margin:14px 0 0;background:rgba(255,255,255,.05);color:var(--tx);font-size:.9rem;max-width:70ch}
.lang-note:empty{display:none}

/* ledger cards and key-value tables (same values as the sector pages) */
.ledger-card{border:1px solid rgba(21,19,15,.16);border-radius:6px;background:var(--surface);padding:20px;box-shadow:none;margin-top:16px}
.ledger-card+.ledger-card{margin-top:14px}
.ledger-card h3{margin-top:0}
.ledger-card p{margin:0;max-width:70ch}
.ledger-card p+p{margin-top:10px}
.ledger-card ul{margin:8px 0 0;padding-left:18px}
.ledger-card li{margin:4px 0}
.kv{width:100%;border-collapse:collapse;font-size:.95rem}
.kv th,.kv td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--hairline);vertical-align:top}
.kv thead th{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);font-weight:600}
.kv tbody th{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;color:var(--mut);font-weight:700;width:22%}
.kv tr:last-child th,.kv tr:last-child td{border-bottom:none}
.kv code,.ft code{font-family:var(--font-mono);font-size:.86em}

/* chips */
.status-chip{display:inline-block;font-family:var(--font-mono);font-size:.7rem;font-weight:700;letter-spacing:.06em;border:1px solid var(--bd-accent);color:var(--bd-accent);border-radius:4px;padding:1px 8px}
.status-chip.off{border-style:dashed;border-color:var(--mut);color:var(--mut)}
.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none}

/* callouts */
.note-box{border-left:3px solid var(--accent-bar);padding:11px 16px;margin:18px 0 0;background:rgba(255,255,255,.05);color:var(--tx);font-size:.95rem;max-width:74ch}
.disclaimer{border-left:3px solid var(--accent-bar);padding:14px 18px;margin:6px 0 0;background:rgba(255,255,255,.05);color:var(--tx);font-weight:600;max-width:74ch}

/* the direct link into the suite, shown as a copyable-looking address */
.deeplink{display:inline-block;font-family:var(--font-mono);font-size:.8rem;letter-spacing:.02em;border:1px solid var(--hairline);border-radius:6px;padding:3px 9px;color:var(--tx);background:rgba(255,255,255,.04);word-break:break-all}

/* bullet list with accent bar and mono label (as .tw on the sector pages) */
.tw{list-style:none;padding:0;margin:16px 0 0}
.tw li{border-left:3px solid var(--bd-accent);padding:2px 0 2px 16px;margin:16px 0 0;color:var(--tx-body);max-width:72ch}
.tw .tw-t{display:block;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin-bottom:3px}

/* numbered steps: mono numerals, hairline rail */
.ft-steps{list-style:none;counter-reset:ftstep;padding:0;margin:18px 0 0}
.ft-steps>li{counter-increment:ftstep;position:relative;padding:0 0 18px 52px;margin:0;max-width:72ch;color:var(--tx-body)}
.ft-steps>li::before{content:counter(ftstep,decimal-leading-zero);position:absolute;left:0;top:1px;font-family:var(--font-mono);font-size:.78rem;font-weight:700;letter-spacing:.06em;color:var(--bd-accent);border:1px solid var(--bd-accent);border-radius:4px;padding:1px 6px}
.ft-steps>li::after{content:"";position:absolute;left:17px;top:26px;bottom:4px;border-left:1px solid var(--hairline)}
.ft-steps>li:last-child::after{display:none}
.ft-steps>li strong{color:var(--tx)}

/* limits: what the module does not do */
.ft-limits{list-style:none;padding:0;margin:16px 0 0}
.ft-limits li{position:relative;padding:0 0 0 26px;margin:10px 0 0;max-width:72ch;color:var(--tx-body)}
.ft-limits li::before{content:"\2717";position:absolute;left:2px;top:0;font-family:var(--font-mono);color:var(--mut)}

/* two-column card grid */
.ft-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}
.ft-grid>.ledger-card{margin-top:0}

/* screenshot figure in the ink frame of the homepage */
.ft-figure{margin:26px 0 0}
.ft-figure .shot-frame{padding:8px;border-radius:14px;background:#1B1826;border:1px solid rgba(255,255,255,.12)}
.ft-figure img{display:block;width:100%;height:auto;border-radius:9px}
.ft-figure figcaption{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin-top:10px;max-width:none}

/* FAQ: flat, serif questions (as on the service pages) */
.ft-faq{margin-top:10px}
.ft-faq details{border-bottom:1px solid var(--hairline);padding:4px 0}
.ft-faq summary{cursor:pointer;font-family:var(--font-serif);font-size:1.1rem;color:var(--tx);padding:14px 30px 14px 0;list-style:none;position:relative}
.ft-faq summary::-webkit-details-marker{display:none}
.ft-faq summary::after{content:"+";position:absolute;right:4px;top:13px;font-family:var(--font-mono);color:var(--mut);transition:transform .25s ease}
.ft-faq details[open] summary::after{transform:rotate(45deg)}
.ft-faq .faq-a{padding:0 0 16px;color:var(--tx-body)}
.ft-faq .faq-a p{margin:0 0 10px}

/* related modules */
.ft-related{list-style:none;padding:0;margin:16px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.ft-related li{border-top:1px solid var(--hairline);padding:10px 0 0}
.ft-related .rel-k{display:block;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.ft-related a{font-weight:600}

/* hub: module list */
.ft-mods{list-style:none;padding:0;margin:0}
.ft-mods>li{margin-top:14px}
.ft-mods h3 a{text-decoration:none;border-bottom:2px solid #2A63BF;color:var(--ink)}
.ft-mods .link-arrow{display:inline-block;margin-top:10px;color:var(--ink);border-bottom-color:#2A63BF}

.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.cta-row .btn{min-height:44px;display:inline-flex;align-items:center}
.related-links{font-size:.95rem;color:var(--tx-body)}

@media(max-width:820px){
  .ledger-card[data-scroll]{overflow-x:auto}
  .ledger-card[data-scroll] .kv{min-width:620px}
}
@media(max-width:640px){
  .topbar{position:static}
  .ft-wrap{padding:0 16px}
  .ft main section{padding:36px 0}
  .kv{font-size:.9rem}
  .kv tbody th{width:auto}
  .ft-grid,.ft-related{grid-template-columns:1fr}
  .ft-steps>li{padding-left:46px}
  .ledger-card[data-scroll] .kv{min-width:540px}
  .cta-row .btn{width:100%;justify-content:center}
}
@media print{
  .topbar,.site-footer,.contact-fab,.cta-row,.lang-note{display:none!important}
  body.ft{background:#fff;color:#111}
}
