/* ==========================================================================
   Kontoblatt: gemeinsame Designebene für Einzelseiten (Preise, Login,
   Passwort, Bestätigung, rechtliche Texte). Wird NACH dem Seiten-CSS geladen.
   Quelle: Kontoblatt-Styleguide V01. Papier, Tinte, ein Akzent, Linien statt Schatten.
   ========================================================================== */
@import url('../fonts/archivo.css');
:root{
  --paper:#F5F6F2;--paper-deep:#EEF0EA;--surface:#FFFFFF;--rule:#D8DCD2;--rule-soft:#E6E9E1;--rule-strong:#80877A;
  --ink:#141C2E;--ink-2:#3F4757;--ink-muted:#4A5262;--accent:#2F3FB0;--accent-hover:#1F2A80;--accent-soft:#E8EAF8;--on-accent:#FFFFFF;
  --success:#1D6B45;--success-soft:#E3F1E8;--warning:#8A5300;--warning-soft:#FBEFD9;--danger:#A3221B;--danger-soft:#FBE5E2;
  --night:#141C2E;--on-night:#FFFFFF;--on-night-muted:#C9CEDB;
  --radius-sm:4px;--radius-md:6px;--radius-lg:10px;
  --font:Archivo,"Helvetica Neue",Arial,sans-serif;
  /* Aliase der bestehenden Seiten */
  --bg:var(--paper);--text:var(--ink);--muted:var(--ink-muted);--border:var(--rule);--blue:var(--accent);--blue-h:var(--accent-hover);
  --green:var(--success);--red:var(--danger);--radius:10px;--shadow:none;
  --rose:#F4A3BF;--rose-soft:#FCE4EC;--sun:#FFC845;--sun-soft:#FFF1C7;
  --logo-word:#141C2E;--logo-blend:multiply;--logo-word-op:1;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --paper:#151A24;--paper-deep:#181D28;--surface:#1C2230;--rule:#2D3444;--rule-soft:#252B39;--rule-strong:#6B768B;
  --ink:#EEF0EA;--ink-2:#C9CED8;--ink-muted:#A9B0BE;--accent:#8E9BF0;--accent-hover:#B3BCF6;--accent-soft:#252C52;--on-accent:#141C2E;
  --success:#6FCF97;--success-soft:#173326;--warning:#F0B357;--warning-soft:#3A2A10;--danger:#F28B82;--danger-soft:#3D1A18;
  --night:#0F131B;--on-night:#EEF0EA;--on-night-muted:#A9B0BE;
  --rose-soft:#3A2430;--sun-soft:#3A3214;--logo-word:#F5F6F2;--logo-blend:normal;--logo-word-op:.92;color-scheme:dark}}

body{font-family:var(--font)!important;background:var(--paper)!important;color:var(--ink)!important;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
h1,h2,h3{text-wrap:balance}
input,select,button,textarea{font-family:var(--font)}

/* Karten und Blätter */
.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:none}
.logo-wrap h1,.card .logo,.nav-brand{font-weight:750;font-stretch:118%;letter-spacing:-.01em;color:var(--ink)}
.logo-wrap h1::before,.card .logo::before{content:'';display:inline-block;width:28px;height:28px;margin-right:10px;vertical-align:-6px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Crect x='1' y='1' width='26' height='26' rx='5' fill='%232F3FB0'/%3E%3Cpath d='M7 11h14M7 17.5h14M7 20.5h14' stroke='white' stroke-width='2' fill='none'/%3E%3C/svg%3E") center/contain no-repeat}
.logo-wrap p,.subtitle{color:var(--ink-muted)}

/* Buttons: eckig (6px), Höhe 44, Hover wird Tinte */
.btn,.btn-checkout,.cookie-banner-btn,.btn-primary{border-radius:var(--radius-md)!important;font-family:var(--font);font-weight:600;letter-spacing:0;box-shadow:none!important;transition:background-color .15s,border-color .15s,color .15s}
.btn,.btn-checkout{background:var(--accent);color:var(--on-accent);border:1px solid var(--accent)}
.btn:hover,.btn-checkout:hover{background:var(--ink);border-color:var(--ink);color:var(--surface);transform:none}
.btn:active,.btn-checkout:active{transform:none}
.btn:disabled,.btn-checkout:disabled{background:var(--rule);border-color:var(--rule);color:var(--ink-muted);cursor:not-allowed}
.btn-checkout.secondary{background:var(--surface);color:var(--ink);border:1px solid var(--rule-strong)}
.btn-checkout.secondary:hover{border-color:var(--ink);background:var(--surface);color:var(--ink)}
.cookie-banner{background:var(--night)!important;color:var(--on-night)!important}
.cookie-banner-text,.cookie-banner-text a{color:var(--on-night-muted)!important}
.cookie-banner-btn{background:#fff!important;color:#141C2E!important;border:1px solid #fff}

/* Felder */
.field label,label{font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink)}
.field input,input[type="password"],input[type="text"],input[type="email"]{border:1px solid var(--rule-strong)!important;border-radius:var(--radius-md)!important;background:var(--surface)!important;color:var(--ink)!important}
.field input:focus,input:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-soft)!important;outline:none}
.field input.error{border-color:var(--danger)!important}
.pw-eye{color:var(--ink-muted)}

/* Tabs, Meldungen, Hinweise */
.tabs,.lang-bar{background:transparent}
.tabs{background:var(--paper-deep);border-radius:var(--radius-md)}
.tab{border-radius:var(--radius-sm);color:var(--ink-2)}
.tab.active{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 0 0 1px var(--rule)}
.lang-btn{border-radius:var(--radius-md);border-color:var(--rule-strong);color:var(--ink-2);background:var(--surface)}
.lang-btn.active{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.msg{border-radius:var(--radius-lg)}
.msg.error{background:var(--danger-soft);color:var(--ink);border:1px solid var(--danger)}
.msg.success{background:var(--success-soft);color:var(--ink);border:1px solid var(--success)}
.msg.info{background:var(--accent-soft);color:var(--ink);border:1px solid var(--accent)}
.trial-note,.info-note{color:var(--ink-muted)}
.divider{color:var(--ink-muted)}
.check-icon,.icon-badge,.icon,.success-box .icon{border-radius:var(--radius-md)}
.icon.success,.check-icon{background:var(--success-soft)!important}
.icon.error{background:var(--danger-soft)!important}
.icon.loading{background:var(--accent-soft)!important}
.year-badge{background:var(--accent-soft)!important;color:var(--accent)!important;border-radius:var(--radius-sm)!important}
.plan-opt{border:1px solid var(--rule-strong);border-radius:var(--radius-md);background:var(--surface)}
.plan-opt.selected{border:2px solid var(--accent);background:var(--surface)}
.footer-links a,.back{color:var(--ink-2)}

/* Preise */
nav{background:var(--surface)!important;border-bottom:1px solid var(--rule)!important;box-shadow:none!important;backdrop-filter:none!important}
.hero h1{font-weight:800;font-stretch:120%;letter-spacing:-.03em}
.hero p{color:var(--ink-2)}
.banner{border-radius:var(--radius-lg)}
.banner.warning{background:var(--warning-soft);color:var(--ink);border:1px solid var(--warning)}
.banner.expired{background:var(--danger-soft);color:var(--ink);border:1px solid var(--danger)}
.plan-card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:none!important}
.plan-card:hover{transform:none;border-color:var(--rule-strong)}
.plan-card.featured{border:2px solid var(--accent);box-shadow:none}
.featured-badge{background:var(--accent)!important;color:var(--on-accent)!important;border-radius:var(--radius-sm)!important}
.plan-name{font-weight:700;font-stretch:112%;color:var(--ink)}
.plan-price .amount{font-weight:800;font-stretch:112%;letter-spacing:-.02em;font-variant-numeric:tabular-nums lining-nums}
.plan-price .currency,.plan-price .period,.plan-equiv{color:var(--ink-muted)!important}
.features li .icon{color:var(--accent)!important;background:transparent!important}
.toggle-track{background:var(--rule-strong)}
.toggle-track.on{background:var(--accent)}
.badge-save{background:var(--success-soft)!important;color:var(--success)!important;border-radius:var(--radius-sm)!important}
.pay-pill{border-radius:var(--radius-sm);border-color:var(--rule)}
.faq-item{border-color:var(--rule)}

/* Rechtliche Texte */
.doc-page{padding-top:0!important}
.doc-page .container{background:transparent!important;box-shadow:none!important;border-radius:0!important;max-width:760px;padding:2.5rem 0 3rem!important}
.doc-page .container::before{content:'';display:block;height:2px;background:var(--ink);margin-bottom:2rem}
.doc-page h1{font-size:clamp(30px,4vw,44px);line-height:1.05;font-weight:800;font-stretch:120%;letter-spacing:-.03em;color:var(--ink)}
.doc-page h2{font-size:22px;font-weight:750;font-stretch:112%;color:var(--ink);border-top:1px solid var(--rule)!important;letter-spacing:-.01em}
.doc-page h2:first-of-type{border-top:0!important}
.doc-page p,.doc-page li{color:var(--ink-2)!important;line-height:1.65}
.doc-page .subtitle,.doc-page .footer-note{color:var(--ink-muted)!important;border-color:var(--rule)!important}
.doc-page .highlight{background:var(--accent-soft);border-left:3px solid var(--accent);color:var(--ink)!important;border-radius:0 var(--radius-md) var(--radius-md) 0}
.doc-page a{color:var(--accent)}
.doc-page .back{color:var(--ink-2);font-weight:500}
.doc-page table{border-collapse:collapse}
.doc-page th,.doc-page td{border-bottom:1px solid var(--rule-soft)}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Nachträge */
.plan-name{font-size:21px;line-height:28px;text-transform:none!important;letter-spacing:0!important;color:var(--ink)!important}
[style*="text-transform:uppercase"],[style*="text-transform: uppercase"]{text-transform:none!important;letter-spacing:0!important}
.btn-checkout.secondary:hover{background:var(--surface)!important}
.doc-page .container{overflow-wrap:anywhere}
.doc-page{overflow-x:hidden}
.msg.info{background:var(--accent-soft)!important;color:var(--ink)!important}
.icon-badge,.check-icon{color:var(--success)}

/* Tillda-Logo (F2 Plakat klein), inline-SVG, Farben über Variablen */
.logo{height:30px;width:auto;display:block;margin:0 auto 10px}
.logo .lc{fill:var(--rose)}.logo .lb{fill:var(--sun)}.logo .lw{fill:var(--logo-word);mix-blend-mode:var(--logo-blend);opacity:var(--logo-word-op)}
.logo.nav-logo{height:24px;margin:0}