/* Wolny Finanz-Checks – „Private Office"-Designsystem.
   Editoriale Privatbank-Ästhetik: warmes Papier, Tinte, Petrol, Gold-Akzent.
   Fonts kommen aus ../assets/fonts.css (Cormorant Garamond + Outfit, lokal).
   Klassen-Gerüst unverändert – alle Funnel-Checks laufen ohne HTML-Änderung. */

:root{
  --paper:#f6f5f1;
  --paper-deep:#efece5;
  --paper-warm:#faf8f3;
  --ink:#182430;            /* tiefes Tintenblau, autoritär */
  --ink-soft:#4c5865;
  --pine:#1f5c54;           /* dunkles Petrol – Markenanker */
  --pine-deep:#164740;
  --bronze:#a98e5f;         /* nur Hairlines & dekorative Linien */
  --bronze-deep:#7a6234;    /* Bronze für Text/Ziffern (AA-Kontrast auf Papier) */
  --gold:#c9a55c;           /* leuchtender Akzent (Statement) */
  --gold-hi:#e7cd93;
  --night:#141f28;          /* Statement-Bühne */
  --night-2:#0f1922;
  --hairline:rgba(24,36,48,.16);
  --hairline-soft:rgba(24,36,48,.085);
  --ivory:#f2ebdc;
  --shadow-lift:0 18px 40px -22px rgba(24,36,48,.28);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{font-size:16px}
body{
  font-family:'Outfit',sans-serif;font-weight:300;
  color:var(--ink);
  background:
    radial-gradient(130% 90% at 50% -12%, var(--paper-warm) 0%, var(--paper) 46%, var(--paper-deep) 100%);
  background-attachment:fixed;
  min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;letter-spacing:.01em;
}
/* Feine Papier-Textur (whisper-faint), gibt der Fläche Haptik */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.04;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
.wrap{width:100%;max-width:648px;margin:0 auto;padding:0 26px;flex:1;display:flex;flex-direction:column;position:relative;z-index:1}

/* Tastatur-Fokus sichtbar (Barrierefreiheit) */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--pine);outline-offset:3px;border-radius:2px}
.btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

/* Header – Monogramm-Siegel + Wortmarke */
header{padding:40px 0 0;display:flex;flex-direction:column;align-items:center;gap:0}
.brand{font-family:'Cormorant Garamond',serif;font-size:1.02rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink);font-weight:500;text-align:center}
.brand::before{
  content:"";display:block;width:58px;height:58px;margin:0 auto 14px;
  background:url("../assets/wolny-mark-ink.png") center/contain no-repeat;
}
.brand::after{content:"";display:block;width:40px;height:1px;background:linear-gradient(90deg,transparent,var(--bronze),transparent);margin:13px auto 0}
.ref-banner{display:none;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.04rem;color:var(--pine);margin-top:14px}

/* Progress */
.progress-zone{padding:34px 0 0;visibility:hidden}
.progress-meta{display:flex;justify-content:space-between;align-items:baseline;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
.progress-meta .frac{font-family:'Cormorant Garamond',serif;font-size:1.05rem;letter-spacing:.08em;color:var(--ink);text-transform:none}
.bar{height:1px;background:var(--hairline);margin-top:10px;position:relative}
.bar i{position:absolute;left:0;top:0;bottom:0;width:0%;background:linear-gradient(90deg,var(--pine),var(--bronze));transition:width .5s cubic-bezier(.4,0,.2,1)}

/* Stage */
main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:40px 0 52px}
.screen{display:none;animation:fade .45s ease both}
.screen.active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.screen{animation:none}.bar i{transition:none}}

.eyebrow{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--pine);margin-bottom:20px;font-weight:400;display:flex;align-items:center;gap:11px}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--bronze);flex:0 0 auto}
h1{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(2.2rem,6.6vw,3.15rem);line-height:1.08;letter-spacing:-.01em;margin-bottom:22px}
h1 em{font-style:italic;font-weight:400;color:var(--pine)}
h2{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(1.6rem,5vw,2.1rem);line-height:1.2;letter-spacing:-.005em;margin-bottom:8px}
h2 em{font-style:italic;font-weight:400;color:var(--pine)}
.sub{color:var(--ink-soft);font-size:.99rem;line-height:1.72;max-width:52ch}
.hint{color:var(--ink-soft);font-size:.85rem;line-height:1.6;margin-top:4px}

/* Answers: Registerzeilen statt Karten */
.answers{margin-top:32px;border-top:1px solid var(--hairline)}
.answer{
  width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--hairline);
  padding:19px 2px;cursor:pointer;display:flex;align-items:baseline;gap:18px;position:relative;
  font-family:'Outfit',sans-serif;font-weight:300;font-size:1.02rem;color:var(--ink);transition:background .18s,padding-left .22s;
}
.answer::before{content:"";position:absolute;left:0;top:0;bottom:-1px;width:2px;background:var(--pine);transform:scaleY(0);transform-origin:top;transition:transform .22s ease}
.answer:hover,.answer:focus-visible{background:var(--paper-warm);padding-left:16px;outline:none}
.answer:hover::before,.answer:focus-visible::before{transform:scaleY(1)}
.answer .key{flex:0 0 auto;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.05rem;color:var(--bronze-deep);width:18px}
.answer div{flex:1}
.answer small{display:block;color:var(--ink-soft);font-size:.82rem;margin-top:3px;line-height:1.5}
.answer .arrow{flex:0 0 auto;color:var(--pine);opacity:0;transform:translateX(-4px);transition:opacity .18s,transform .18s;font-size:.9rem}
.answer:hover .arrow,.answer:focus-visible .arrow{opacity:1;transform:none}

/* Buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;font-family:'Outfit',sans-serif;font-weight:400;font-size:.92rem;letter-spacing:.1em;padding:17px 40px;cursor:pointer;text-decoration:none;border-radius:0;transition:background .22s,color .22s,transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .22s;border:1px solid transparent}
.btn-ink{background:var(--ink);color:var(--paper-warm);border-color:var(--ink)}
.btn-ink:hover{background:var(--pine);border-color:var(--pine);transform:translateY(-2px);box-shadow:0 18px 34px -16px rgba(31,92,84,.62)}
.btn-line{background:transparent;color:var(--ink);border-color:var(--hairline)}
.btn-line:hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.btn-wa{background:var(--pine);color:var(--paper-warm);border-color:var(--pine)}
.btn-wa:hover{background:var(--ink);border-color:var(--ink);transform:translateY(-2px);box-shadow:0 18px 34px -16px rgba(24,36,48,.5)}
.back{background:none;border:none;color:var(--ink-soft);font-family:'Outfit',sans-serif;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;margin-top:30px;padding:8px 0}
.back:hover{color:var(--pine)}

/* Meta / Trust / Punch / Intro-Rule */
.meta-line{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:28px 0 32px;padding:15px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.meta-line b{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.08rem;color:var(--ink)}
.meta-line i{color:var(--bronze-deep);font-style:normal}
.trust{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.trust span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--hairline);padding:7px 13px;transition:border-color .18s,color .18s}
.trust span:hover{border-color:var(--bronze);color:var(--ink)}
.punch{margin:40px 0 0;border-top:1px solid var(--hairline);padding-top:24px}
.punch-head{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--pine);margin-bottom:6px;display:flex;align-items:center;gap:11px}
.punch-head::before{content:"";width:22px;height:1px;background:var(--bronze)}
.punch-row{display:flex;gap:18px;padding:16px 2px;border-bottom:1px solid var(--hairline-soft);align-items:baseline}
.punch-row .pk{flex:0 0 auto;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.1rem;color:var(--bronze-deep);width:20px}
.punch-row p{font-size:.93rem;line-height:1.62;color:var(--ink-soft)}
.punch-row p b{font-weight:500;color:var(--ink)}
.intro-rule{height:1px;background:var(--hairline-soft);position:relative;margin:22px 0 4px;max-width:250px;overflow:hidden}
.intro-rule i{position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,var(--pine),var(--bronze));animation:ruleGrow 1.15s cubic-bezier(.4,.05,.2,1) both;animation-delay:.5s}
@keyframes ruleGrow{to{width:100%}}
.topical-note{margin-top:10px;font-style:italic;font-family:'Cormorant Garamond',serif;font-size:1.02rem;color:var(--pine)}

/* Result */
.verdict{text-align:left;border-top:1px solid var(--hairline);padding-top:28px}
.verdict-label{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--pine);margin-bottom:14px;display:flex;align-items:center;gap:11px}
.verdict-label::before{content:"";width:22px;height:1px;background:var(--bronze)}
.gauge{height:2px;background:var(--hairline);margin:30px 0 8px;position:relative;border-radius:2px}
.gauge i{position:absolute;left:0;top:0;height:100%;width:0%;background:linear-gradient(90deg,var(--pine),var(--bronze));transition:width 1.2s cubic-bezier(.3,.7,.3,1)}
.gauge i::after{content:"";position:absolute;right:-5px;top:50%;width:10px;height:10px;border-radius:50%;background:var(--paper-warm);border:1.5px solid var(--pine);transform:translateY(-50%);box-shadow:0 2px 6px rgba(24,36,48,.25)}
.gauge-scale{display:flex;justify-content:space-between;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.result-points{margin:36px 0 0;border-top:1px solid var(--hairline)}
.rp{display:flex;gap:16px;padding:18px 2px;border-bottom:1px solid var(--hairline-soft);align-items:baseline}
.rp .marker{flex:0 0 auto;font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--bronze-deep);font-size:1.05rem;width:18px}
.rp p{font-size:.93rem;line-height:1.66;color:var(--ink-soft)}
.rp p b{font-weight:500;color:var(--ink)}
.rp.con .marker{color:var(--pine)}
.cta-zone{margin-top:42px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;width:100%}
.share-note{font-size:.83rem;color:var(--ink-soft);line-height:1.65;max-width:46ch}

/* Berater-Karte – Vertrauensanker mit echtem Portrait */
.advisor{display:flex;gap:17px;align-items:center;width:100%;padding:18px 20px;border:1px solid var(--hairline);background:linear-gradient(180deg,var(--paper-warm),var(--paper-deep));position:relative;overflow:hidden}
.advisor::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(var(--pine),var(--bronze))}
.advisor-photo{flex:0 0 auto;width:66px;height:66px;border-radius:50%;object-fit:cover;object-position:center 22%;border:1px solid var(--hairline);box-shadow:0 3px 12px rgba(24,36,48,.16)}
.advisor-body{flex:1;min-width:0}
.advisor-name{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.22rem;color:var(--ink);line-height:1.1}
.advisor-role{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--pine);margin-top:4px}
.advisor-quote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1rem;color:var(--ink-soft);line-height:1.42;margin-top:9px}
/* Größerer Berater-Block (Landing) */
.advisor-hero{display:flex;gap:24px;align-items:center;margin-top:34px;border-top:1px solid var(--hairline);padding-top:30px}
.advisor-hero .ah-photo{flex:0 0 auto;width:118px;height:157px;object-fit:cover;object-position:center 18%;border:1px solid var(--hairline);box-shadow:var(--shadow-lift)}
.advisor-hero .ah-body{flex:1;min-width:0}
.advisor-hero .ah-eyebrow{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--pine);margin-bottom:8px;display:flex;align-items:center;gap:10px}
.advisor-hero .ah-eyebrow::before{content:"";width:20px;height:1px;background:var(--bronze)}
.advisor-hero .ah-name{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.5rem;color:var(--ink);line-height:1.15}
.advisor-hero .ah-quote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.05rem;color:var(--ink-soft);line-height:1.45;margin-top:8px}
.advisor-hero .ah-reg{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-top:12px}
@media(max-width:480px){
  .advisor{gap:14px;padding:15px 16px}
  .advisor-photo{width:56px;height:56px}
  .advisor-hero{gap:16px}
  .advisor-hero .ah-photo{width:92px;height:123px}
}

/* Statement-Block – der Blickfang (dunkle Bühne, Gold-Ziffer) */
.potential{
  margin-top:38px;position:relative;overflow:hidden;
  background:linear-gradient(158deg,var(--night) 0%,var(--night-2) 100%);
  border:1px solid rgba(201,165,92,.26);
  padding:32px 30px;
  box-shadow:0 34px 74px -34px rgba(15,25,34,.72);
}
.potential::before{content:"";position:absolute;left:0;top:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.potential::after{content:"";position:absolute;right:-70px;top:-70px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(201,165,92,.16),transparent 68%);pointer-events:none}
.potential .p-label{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;position:relative}
.potential .p-num{
  font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(2.7rem,10vw,3.8rem);line-height:1;position:relative;
  background:linear-gradient(94deg,var(--gold-hi),var(--gold) 58%,#b8934e);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  /* Innenabstand für die Überhänge der Cormorant-Ziffern: background-clip malt nur in der Box.
     Cormorant setzt Mediävalziffern — 3, 4, 5, 7, 9 reichen unter die Grundlinie, bei line-height 1
     fehlte der 3 in „385.903" unten rund 0,12 em. Der negative Rand hebt den Abstand fürs Layout
     wieder auf. CI [11] wacht darüber. */
  padding:.12em .16em .2em;margin:-.12em -.16em -.2em;
}
.potential .p-num small{font-size:.3em;font-weight:400;-webkit-text-fill-color:rgba(242,235,220,.75);color:rgba(242,235,220,.75);background:none;letter-spacing:.02em}
.potential .p-sub{font-size:.86rem;color:rgba(242,235,220,.86);line-height:1.62;margin-top:12px;max-width:52ch;position:relative}
.potential .p-split{display:flex;gap:0;margin-top:18px;flex-wrap:wrap;border-top:1px solid rgba(201,165,92,.24);padding-top:18px;position:relative}
.potential .p-col{flex:1;min-width:150px;padding:6px 20px 0 0}
.potential .p-col + .p-col{border-left:1px solid rgba(201,165,92,.24);padding-left:20px}
.potential .p-col .p-num{font-size:clamp(1.8rem,6vw,2.4rem);font-weight:500;background:none;-webkit-text-fill-color:var(--ivory);color:var(--ivory)}
.potential .p-col .p-num small{-webkit-text-fill-color:rgba(242,235,220,.72);color:rgba(242,235,220,.72)}
.potential .p-col .p-tag{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(242,235,220,.82);margin-top:8px}
@media(max-width:480px){.potential .p-col + .p-col{border-left:none;border-top:1px solid rgba(201,165,92,.24);padding-left:0;padding-top:14px;margin-top:8px}}

/* Rechner (Regler) */
.calc{margin-top:40px;border:1px solid var(--hairline);background:linear-gradient(180deg,var(--paper-warm),var(--paper-deep));padding:26px;position:relative}
.calc::before{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:linear-gradient(90deg,var(--bronze),transparent 60%)}
.calc-head{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--pine);margin-bottom:16px;display:flex;align-items:center;gap:11px}
.calc-head::before{content:"";width:22px;height:1px;background:var(--bronze)}
.field{margin-top:20px}
.field:first-of-type{margin-top:0}
.calc-rate{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:2px}
.calc-rate > span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.calc-rate b span{font-size:inherit;letter-spacing:inherit;text-transform:none;color:inherit}
.calc-rate b{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.55rem;color:var(--ink)}
input[type=range].slider{-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;touch-action:pan-y;cursor:pointer;margin:0}
input[type=range].slider:focus{outline:none}
input[type=range].slider::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--pine),var(--hairline))}
input[type=range].slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;background:var(--paper-warm);border:1.5px solid var(--pine);margin-top:-11px;box-shadow:0 2px 7px rgba(24,36,48,.25);transition:box-shadow .16s,border-color .16s}
input[type=range].slider:hover::-webkit-slider-thumb,input[type=range].slider:focus::-webkit-slider-thumb{border-color:var(--bronze);box-shadow:0 0 0 6px rgba(201,165,92,.14),0 2px 7px rgba(24,36,48,.25)}
input[type=range].slider::-moz-range-track{height:2px;background:var(--hairline)}
input[type=range].slider::-moz-range-progress{height:2px;background:var(--pine)}
input[type=range].slider::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--paper-warm);border:1.5px solid var(--pine);box-shadow:0 2px 7px rgba(24,36,48,.25)}
input[type=range].slider:hover::-moz-range-thumb,input[type=range].slider:focus::-moz-range-thumb{border-color:var(--bronze);box-shadow:0 0 0 6px rgba(201,165,92,.14),0 2px 7px rgba(24,36,48,.25)}
.calc-scale{display:flex;justify-content:space-between;font-size:.68rem;letter-spacing:.1em;color:var(--ink-soft);margin-top:-6px}
/* Schnellwahl-Pills unter einem Regler (wie im AV-Depot-Kompass) */
.pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.pills button{border:1px solid var(--hairline);background:transparent;color:var(--ink-soft);font-family:'Outfit',sans-serif;font-weight:300;font-size:.72rem;letter-spacing:.04em;padding:6px 12px;border-radius:0;cursor:pointer;transition:border-color .14s,color .14s,background .14s}
.pills button:hover{border-color:var(--ink);color:var(--ink)}
.pills button.on{background:var(--ink);border-color:var(--ink);color:var(--paper);font-weight:400}
/* Feld-Hinweis (Gold-Braun, wie .est im Kompass) */
.field-note{font-size:.74rem;color:var(--bronze-deep);margin-top:6px;line-height:1.5}
/* Feld-Fehler: sichtbare Meldung + rot markiertes Feld (blockiert die Berechnung) */
.field-err{font-size:.78rem;color:#a4502e;margin-top:6px;line-height:1.5;font-weight:400}
.calc-num input.invalid,input.invalid{border-color:#a4502e!important;box-shadow:0 0 0 3px rgba(164,80,46,.12)!important}
/* Mini-Guide unterm Feld (aufklappbar) */
.field-guide{margin-top:8px;border:1px solid var(--hairline-soft);background:var(--paper-warm)}
.field-guide summary{padding:9px 12px;font-size:.74rem;letter-spacing:.06em;color:var(--ink-soft);cursor:pointer}
.field-guide summary:hover{color:var(--ink)}
.field-guide .fg-body{padding:2px 12px 12px;font-size:.8rem;line-height:1.65;color:var(--ink-soft)}
.field-guide .fg-body b{font-weight:500;color:var(--ink)}
/* „Weitere Checks"-Leiste (von checks.js injiziert) */
.related{margin-top:48px;padding-top:24px;border-top:1px solid var(--hairline)}
.related .rel-head{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--pine);margin-bottom:12px;display:flex;align-items:center;gap:11px}
.related .rel-head::before{content:"";width:22px;height:1px;background:var(--bronze)}
.related .rel-links{display:flex;gap:10px;flex-wrap:wrap}
.related .rel-links a{font-size:.78rem;letter-spacing:.06em;color:var(--ink);border:1px solid var(--hairline);padding:10px 16px;text-decoration:none;transition:border-color .16s,background .16s}
.related .rel-links a:hover{border-color:var(--pine);background:var(--paper-warm)}
.related .rel-links a.rel-site{border-color:var(--pine);color:var(--pine)}
/* Marke im Header verlinkt auf die Website */
header .brand a{color:inherit;text-decoration:none}
.exact-entry{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:-2px}
.exact-entry label{font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.exact-entry input{width:118px;min-height:40px;padding:8px 10px;border:1px solid var(--hairline);background:var(--paper-warm);color:var(--ink);font-family:'Outfit',sans-serif;font-size:.9rem;text-align:right;border-radius:0;font-variant-numeric:tabular-nums}
.exact-entry input:focus{outline:none;border-color:var(--pine);box-shadow:0 0 0 3px rgba(31,92,84,.1)}
.exact-entry .unit{min-width:48px;font-family:'Cormorant Garamond',serif;font-size:1rem;color:var(--ink-soft)}
.calc-num{display:flex;flex-direction:column;margin-top:6px}
.calc-num label{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:6px}
.calc-num input{font-family:'Outfit',sans-serif;font-weight:300;font-size:.95rem;color:var(--ink);background:var(--paper-warm);border:1px solid var(--hairline);padding:12px 13px;border-radius:0;width:100%;transition:border-color .16s,box-shadow .16s}
.calc-num input:focus{outline:none;border-color:var(--pine);box-shadow:0 0 0 3px rgba(31,92,84,.1)}
.calc-note{font-size:.76rem;color:var(--ink-soft);line-height:1.6;margin-top:16px}

/* Entwurf + zwei schnell speicherbare Beratungsszenarien */
.scenario-panel{margin-top:24px;border:1px solid var(--hairline);background:var(--paper-warm);padding:16px 18px}
.scenario-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}
.scenario-head strong{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--pine);font-weight:500}
.draft-status{font-size:.68rem;color:var(--ink-soft)}
.new-case{min-height:36px;padding:7px 11px;border:1px solid var(--hairline);background:transparent;color:var(--ink);font-family:'Outfit',sans-serif;font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;cursor:pointer}
.new-case:hover{border-color:var(--pine);color:var(--pine)}
.scenario-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scenario-slot{border:1px solid var(--hairline-soft);padding:12px;background:var(--paper-deep)}
.scenario-slot-title{font-family:'Cormorant Garamond',serif;font-size:1.05rem;color:var(--ink);margin-bottom:4px}
.scenario-summary{font-size:.73rem;line-height:1.45;color:var(--ink-soft);min-height:2.2em}
.scenario-actions{display:flex;gap:6px;margin-top:9px}
.scenario-actions button{flex:1;min-height:38px;border:1px solid var(--hairline);background:transparent;color:var(--ink);font-family:'Outfit',sans-serif;font-size:.67rem;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.scenario-actions button:hover:not(:disabled){border-color:var(--pine);color:var(--pine)}
.scenario-actions button:disabled{opacity:.4;cursor:not-allowed}
.scenario-actions .delete-scenario{flex:0 0 auto;padding:0 9px;color:var(--ink-soft)}
.model-badges{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px;position:relative}
.model-badges span{border:1px solid rgba(201,165,92,.36);padding:5px 8px;color:rgba(242,235,220,.82);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase}
@media(max-width:520px){
  .exact-entry{justify-content:space-between}
  .scenario-head{align-items:flex-start;flex-wrap:wrap}
  .draft-status{width:100%}
  .scenario-grid{grid-template-columns:1fr}
}

/* Auswertung läuft */
.analyzing{text-align:center;padding:40px 0}
.analyzing .a-line{width:120px;height:1px;background:var(--hairline);margin:26px auto 0;position:relative;overflow:hidden}
.analyzing .a-line i{position:absolute;left:-40%;top:0;height:100%;width:40%;background:linear-gradient(90deg,transparent,var(--pine),transparent);animation:sweep 1.1s ease-in-out infinite}
@keyframes sweep{to{left:100%}}
.analyzing h2{margin-bottom:6px}
.analyzing .a-step{font-size:.8rem;color:var(--ink-soft);letter-spacing:.06em;min-height:1.4em;margin-top:14px}

/* Landingpage (Hub) */
.landing-grid{display:flex;flex-direction:column;margin-top:24px;border-top:1px solid var(--hairline)}
.landing-card{display:flex;gap:18px;align-items:flex-start;padding:22px 4px;border-bottom:1px solid var(--hairline-soft);text-decoration:none;color:inherit;position:relative;transition:padding-left .2s ease,background .2s ease}
.landing-card::before{content:"";position:absolute;left:0;top:0;bottom:-1px;width:2px;background:var(--pine);transform:scaleY(0);transform-origin:top;transition:transform .22s ease}
.landing-card:hover{background:var(--paper-warm);padding-left:16px}
.landing-card:hover::before{transform:scaleY(1)}
.landing-card .lc-num{flex:0 0 auto;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.3rem;color:var(--bronze-deep);width:28px;line-height:1.45}
.landing-card .lc-body{flex:1}
.landing-card h3{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.35rem;margin-bottom:4px;display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.landing-card h3 .lc-go{font-family:'Outfit',sans-serif;font-size:.8rem;letter-spacing:.04em;color:var(--pine);flex:0 0 auto;transition:transform .2s}
.landing-card:hover h3 .lc-go{transform:translateX(3px)}
.landing-card p{font-size:.89rem;line-height:1.6;color:var(--ink-soft)}
.landing-note{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-top:28px;border-top:1px solid var(--hairline);padding-top:18px}

/* FAQ / Sektionen */
.sec{margin-top:48px;padding-top:28px;border-top:1px solid var(--hairline)}
.sec-head{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.55rem;color:var(--ink);margin-bottom:6px;line-height:1.25}
.sec-sub{font-size:.9rem;line-height:1.6;color:var(--ink-soft);margin-bottom:16px;max-width:60ch}
.faq{border-bottom:1px solid var(--hairline-soft)}
.faq summary{cursor:pointer;list-style:none;font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.14rem;color:var(--ink);padding:15px 0;display:flex;justify-content:space-between;gap:14px;align-items:baseline;transition:color .16s}
.faq summary:hover{color:var(--pine)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--bronze-deep);font-family:'Outfit',sans-serif;font-size:1.3rem;flex:0 0 auto;transition:transform .2s}
.faq[open] summary::after{content:"–"}
.faq-a{font-size:.9rem;line-height:1.68;color:var(--ink-soft);padding:0 0 16px;max-width:64ch}

/* Sticky-CTA mobil */
.sticky-cta{display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(246,245,241,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--hairline);padding:12px 16px calc(12px + env(safe-area-inset-bottom))}
.sticky-cta a{width:100%}
body.show-sticky .sticky-cta{display:block}
body.show-sticky main{padding-bottom:90px}

/* Rechtliches (Impressum / Datenschutz) */
.legal-overlay{display:none;position:fixed;inset:0;z-index:100;background:rgba(20,31,40,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);overflow-y:auto;padding:24px 16px}
.legal-overlay.open{display:block}
body.legal-open{overflow:hidden}
.legal-panel{max-width:680px;margin:0 auto;background:var(--paper-warm);border:1px solid var(--hairline);padding:38px 34px 46px;position:relative;box-shadow:0 40px 90px -30px rgba(15,25,34,.5)}
.legal-close{position:sticky;top:0;float:right;background:var(--paper-warm);border:1px solid var(--hairline);font-family:'Outfit',sans-serif;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);cursor:pointer;padding:8px 14px;margin:-10px -6px 0 16px}
.legal-close:hover{color:var(--ink);border-color:var(--ink)}
.legal-panel h2{margin-bottom:18px}
.legal-panel h3{font-family:'Outfit',sans-serif;font-weight:500;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--pine);margin:28px 0 8px}
.legal-panel p,.legal-panel li{font-size:.88rem;line-height:1.7;color:var(--ink-soft)}
.legal-panel p b{font-weight:500;color:var(--ink)}
.legal-panel a{color:var(--pine)}
.legal-section{display:none}
.legal-section.active{display:block}
@media(max-width:480px){.legal-panel{padding:26px 18px 36px}}

footer{padding:28px;text-align:center;font-size:.7rem;color:var(--ink-soft);letter-spacing:.04em;line-height:1.8;border-top:1px solid var(--hairline-soft)}
footer a{color:var(--ink-soft);transition:color .16s}
footer a:hover{color:var(--pine)}
.disclaimer{max-width:560px;margin:0 auto 6px}

@media(max-width:480px){.btn{width:100%}.cta-row{flex-direction:column}}

/* Gestaffelte Reveal-Animationen (PE-Look) */
@keyframes revealUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
[data-screen="question"].active #qTitle{opacity:0;animation:revealUp .55s cubic-bezier(.2,.7,.2,1) both;animation-delay:.02s}
[data-screen="question"].active #qHint{opacity:0;animation:revealUp .55s cubic-bezier(.2,.7,.2,1) both;animation-delay:.08s}
[data-screen="question"].active .answer{opacity:0;animation:revealUp .55s cubic-bezier(.2,.7,.2,1) both}
[data-screen="question"].active .answer:nth-child(1){animation-delay:.1s}
[data-screen="question"].active .answer:nth-child(2){animation-delay:.17s}
[data-screen="question"].active .answer:nth-child(3){animation-delay:.24s}
[data-screen="question"].active .answer:nth-child(4){animation-delay:.31s}
[data-screen="question"].active .answer:nth-child(5){animation-delay:.38s}
[data-screen="result"].active .verdict{opacity:0;animation:revealUp .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:.05s}
[data-screen="result"].active .potential{opacity:0;animation:revealUp .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:.12s}
[data-screen="result"].active .result-points .rp{opacity:0;animation:revealUp .55s cubic-bezier(.2,.7,.2,1) both}
[data-screen="result"].active .result-points .rp:nth-child(1){animation-delay:.5s}
[data-screen="result"].active .result-points .rp:nth-child(2){animation-delay:.6s}
[data-screen="result"].active .result-points .rp:nth-child(3){animation-delay:.7s}
[data-screen="result"].active .result-points .rp:nth-child(4){animation-delay:.8s}
[data-screen="result"].active .cta-zone{opacity:0;animation:revealUp .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:.7s}
.hidden{display:none !important}
@media (prefers-reduced-motion:reduce){
  [data-screen="question"].active #qTitle,
  [data-screen="question"].active #qHint,
  [data-screen="question"].active .answer,
  [data-screen="result"].active .verdict,
  [data-screen="result"].active .potential,
  [data-screen="result"].active .result-points .rp,
  [data-screen="result"].active .cta-zone{animation:none;opacity:1}
  .intro-rule i{animation:none;width:100%}
}

/* Mobil kompakt */
@media(max-width:640px){
  html{font-size:15px}
  header{padding:22px 0 0}
  .brand{font-size:.92rem;letter-spacing:.26em}
  .brand::before{width:44px;height:44px;margin-bottom:12px}
  .brand::after{margin-top:10px}
  main{padding:22px 0 40px;justify-content:flex-start}
  .screen[data-screen="intro"] .eyebrow{margin-bottom:12px;font-size:.62rem}
  .screen[data-screen="intro"] h1{font-size:clamp(1.7rem,7.6vw,2.15rem);margin-bottom:14px}
  .screen[data-screen="intro"] .sub{font-size:.9rem;line-height:1.58}
  .trust{margin-top:16px;gap:6px}
  .trust span{font-size:.63rem;padding:5px 9px;letter-spacing:.08em}
  .meta-line{margin:20px 0 22px;padding:12px 0;gap:10px}
  .meta-line b{font-size:.98rem}
  .punch{margin-top:28px;padding-top:18px}
  .punch-row{padding:13px 2px}
  .punch-row p{font-size:.87rem}
  .potential{padding:26px 22px}
}
