/* ============================================================
   NUBA EDUCATION · VARIANTE B · Unterseite Coloristik Master
   Lädt NACH variante-b.css. Nur seitenspezifische Ergänzungen.
   Fraunces immer 340.
   ============================================================ */

/* Unterseite: Logo in der Navigation immer sichtbar (kein großes Hero-Logo) */
.vb-sub .vb-brand img{opacity:1;transform:none;}

/* ---------- Hero ---------- */
.vbf-hero h1{font-size:clamp(2.45rem,5.7vw,5.5rem);}
.vbf-crumb{font-size:.72rem;letter-spacing:.08em;color:var(--cr-faint);margin-bottom:1.5rem;line-height:1.4;}
.vbf-crumb a{color:var(--cr-soft);border-bottom:1px solid rgba(239,201,128,.3);transition:color .25s,border-color .25s;}
.vbf-crumb a:hover{color:var(--gold);border-color:var(--gold);}
.vbf-crumb span[aria-hidden]{margin:0 .55rem;color:var(--gold);opacity:.7;}
.vb-trust .more{color:var(--gold);}
@media(max-width:600px){
  .vbf-crumb{margin-bottom:1.2rem;font-size:.68rem;}
  .vb-trust > span:last-child{flex-basis:auto;}
  .vb-trust .more{flex-basis:100%;}
}

/* ---------- Faktenleiste ---------- */
.vbf-facts{background:var(--deep);color:var(--cr);padding-block:clamp(2.75rem,5vw,3.75rem);
  border-top:1px solid rgba(239,201,128,.18);}
.vbf-facts-l{display:grid;grid-template-columns:repeat(5,1fr);}
.vbf-facts-l > div{position:relative;padding:0 .9rem;text-align:center;}
.vbf-facts-l > div + div::before{content:"";position:absolute;left:0;top:.15rem;bottom:.15rem;width:1px;background:var(--gline);}
.vbf-facts dt{font-size:.64rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);}
.vbf-facts dd{margin-top:.75rem;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:clamp(1.25rem,1.65vw,1.55rem);line-height:1.15;color:#FFFAEC;}
.vbf-facts dd small{display:block;margin-top:.5rem;font-family:'Hanken Grotesk',sans-serif;font-variation-settings:normal;font-weight:300;font-size:.8rem;line-height:1.45;color:var(--cr-soft);}
.vbf-facts dd small b{color:var(--gold);font-weight:600;}
@media(max-width:900px){
  .vbf-facts-l{grid-template-columns:1fr 1fr;gap:0 1.4rem;}
  .vbf-facts-l > div{text-align:left;padding:1.15rem 0 1.2rem;border-top:1px solid var(--gline);}
  .vbf-facts-l > div:nth-child(-n+2){border-top:0;padding-top:0;}
  .vbf-facts-l > div + div::before{display:none;}
  .vbf-facts-l > div:last-child{grid-column:1/-1;padding-bottom:0;}
}

/* ---------- System: drei Dimensionen ---------- */
.vbf-dims{margin-top:2.6rem;border-top:1px solid var(--gline);}
.vbf-dim{display:grid;grid-template-columns:4.4rem 1fr;gap:1.3rem;align-items:start;padding:1.4rem 0;border-bottom:1px solid var(--gline);}
.vbf-dim .no{font-family:'Fraunces',serif;font-style:italic;font-weight:340;font-variation-settings:'wght' 340;font-size:3.6rem;line-height:.9;
  background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:.08em;}
.vbf-dim .big{display:block;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:clamp(1.55rem,2.3vw,1.95rem);line-height:1.1;color:#FFFAEC;}
.vbf-dim b{display:block;margin-top:.5rem;font-size:.66rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);}
.vbf-dim .t{display:block;margin-top:.5rem;color:var(--cr-soft);font-size:.95rem;line-height:1.6;}
@media(max-width:560px){.vbf-dim{grid-template-columns:3rem 1fr;gap:.9rem;}.vbf-dim .no{font-size:2.7rem;}}

/* ---------- Inhalte: acht Karten mit Gold-Zahlen ---------- */
.vbf-learn{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-top:clamp(3rem,6vw,4.5rem);}
.vbf-learn li{position:relative;background:var(--paper);border:1px solid var(--line);padding:1.8rem 1.6rem 1.9rem;
  transition:opacity .95s var(--ease),transform .5s var(--ease),box-shadow .45s var(--ease),border-color .45s;}
.vbf-learn li:hover{transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(0,14,61,.4);border-color:rgba(138,106,34,.35);}
.vbf-learn .n{display:block;font-family:'Fraunces',serif;font-style:italic;font-weight:340;font-variation-settings:'wght' 340;font-size:2.5rem;line-height:1;margin-bottom:1.1rem;
  background:var(--grad-gold-deep);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:.06em;}
.vbf-learn h3{font-size:1.32rem;line-height:1.2;}
.vbf-learn p{margin-top:.6rem;font-size:.96rem;line-height:1.6;color:var(--ink);}
.vbf-why{max-width:760px;}
@media(max-width:1060px){.vbf-learn{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){
  .vbf-learn{grid-template-columns:1fr;gap:.75rem;}
  .vbf-learn li{display:grid;grid-template-columns:2.9rem 1fr;gap:.6rem;padding:1.3rem 1.2rem 1.35rem;}
  .vbf-learn .n{font-size:2rem;margin-bottom:0;}
  .vbf-learn h3{font-size:1.2rem;}
  .vbf-learn p{font-size:.94rem;}
}

/* ---------- Über Christoph auf Hell ---------- */
.vbf-about .vb-about-pic::before{border-color:rgba(138,106,34,.45);}
.vbf-about .hero-name{color:var(--navy);}
.vbf-about .hero-name span{color:var(--gold-deep);}
.vbf-about .vb-about-body .t{color:var(--ink);}
.vbf-about .vb-creds{border-top-color:var(--line);}
.vbf-about .vb-creds li{border-bottom-color:var(--line);color:var(--ink-soft);}
.vbf-about .vb-creds li b{color:var(--navy);}
.vb-btn.outline{border-color:var(--navy);color:var(--navy);background:transparent;}
.vb-btn.outline:hover,.vb-btn.outline:focus-visible{background:var(--navy);color:#FFFAEC;transform:translateY(-2px);}
/* Bilder immer Hochformat, auch am Handy */
@media(max-width:600px){.vbf-about .vb-about-pic img{aspect-ratio:4/5;}}

/* ---------- Abstände oben = unten ---------- */
/* Linksbündige Kicker ohne Zeilen-Strut, sonst sitzen sie 11px tiefer als zentrierte */
.vbf .vb-head > .kicker,.vbf .vb-about-body > .kicker,.vbf .vb-reg-info > .kicker{display:flex;}
/* letzte Station im Tagesablauf ohne Luft nach unten */
.vbf .vb-steps .h-step:last-child{padding-bottom:0;}
/* Bewertungs-Wand am Handy: Wisch-Polster unten ausgleichen */
@media(max-width:640px){.vbf .vb-wall{margin-bottom:-.6rem;}}

/* ---------- Anmeldung: Preiskarte ---------- */
.vbf-pc{margin:2rem 0 1.2rem;padding:2rem 1.8rem 1.8rem;}
.vbf-pc::after{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:var(--grad-gold-deep);}
.vbf-pc .pc-k .d{font-weight:600;}
.vbf-pc h3{min-height:0!important;}
.vbf-pc .pc-p{margin-top:1.3rem;padding-top:1.2rem;}
.vbf-pc .pc-i{display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.vbf-pc .pc-i .lbl{display:block;font-size:.62rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:.2rem;}
.vbf-pc .pc-i b{display:block;font-weight:600;color:var(--navy);line-height:1.35;}
.vbf-pc .pc-i .how{display:block;font-size:.8rem;color:var(--ink-soft);}
.vbf-pc .pc-i .p{font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:1.6rem;color:var(--navy);white-space:nowrap;}
.vbf-more{margin-top:1rem;font-size:.95rem;color:var(--ink-soft);line-height:1.55;}
@media(max-width:460px){.vbf-pc{padding:1.7rem 1.3rem 1.5rem;}.vbf-pc .pc-p .n{font-size:3.6rem;}}

/* ---------- Schluss-Zitat ---------- */
.vbf .vb-end .sig{font-style:italic;max-width:46ch;}

/* Preiskarte in der Anmeldung hervorgehoben im Blau der Beispielrechnung (Christoph 14.10.) */
.vbf-pc{background:radial-gradient(circle at 100% 0%,rgba(239,201,128,.16),rgba(239,201,128,0) 50%),linear-gradient(160deg,var(--navy) 0%,var(--deep) 100%);
  border:1px solid rgba(239,201,128,.3);border-radius:18px;color:var(--cr);box-shadow:0 40px 80px -40px rgba(0,14,61,.6),0 24px 56px -32px rgba(239,201,128,.35);overflow:hidden;}
.vbf-pc::before{display:none;}
.vbf-pc::after{background:var(--grad-gold);}
.vbf-pc .pc-k{color:var(--gold);}
.vbf-pc h3{color:#FFFAEC;}
.vbf-pc .pc-d{color:rgba(255,250,236,.7);}
.vbf-pc .pc-p{border-color:rgba(239,201,128,.25);}
.vbf-pc .pc-p .n{background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
.vbf-pc .pc-p .c{color:#FFFAEC;}
.vbf-pc .pc-p small{color:rgba(255,250,236,.6);}
.vbf-pc .pc-i{background:rgba(255,250,236,.07);border-left-color:var(--gold);}
.vbf-pc .pc-i .lbl{color:var(--gold);}
.vbf-pc .pc-i b{color:#FFFAEC;}
.vbf-pc .pc-i .how{color:rgba(255,250,236,.7);}
.vbf-pc .pc-i .p{color:var(--gold);}

/* Liste in der dunklen Preiskarte */
.vbf-pc .pc-l{list-style:none;margin-top:1.3rem;display:grid;gap:.55rem;}
.vbf-pc .pc-l li{position:relative;padding-left:1.6rem;font-size:.95rem;line-height:1.45;color:#FFFAEC;}
.vbf-pc .pc-l li::before{content:"";position:absolute;left:.1rem;top:.32em;width:.42rem;height:.72rem;border:solid var(--gold);border-width:0 1.6px 1.6px 0;transform:rotate(45deg);}


.vbf-dims{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem;}
.vbf-dim{position:relative;isolation:isolate;overflow:hidden;border-radius:18px;padding:1.6rem 1.4rem 1.5rem;min-height:230px;display:flex;flex-direction:column;justify-content:flex-end;
  border:1px solid rgba(239,201,128,.25);color:#FFFAEC;transition:transform .45s var(--ease),border-color .45s,box-shadow .45s;}
.vbf-dim::before{content:"";position:absolute;inset:0;z-index:-2;transition:transform 1.2s var(--ease);}
.vbf-dim::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,8,41,.15) 0%,rgba(0,8,41,.55) 45%,rgba(0,8,41,.92) 100%);}
.vbf-dim:nth-child(1)::before{background:linear-gradient(160deg,#F6E3B4 0%,#C9954F 35%,#6B3F1F 65%,#1A0F0A 100%);}
.vbf-dim:nth-child(2)::before{background:conic-gradient(from 210deg at 70% 30%,#F5D547,#F08A24,#D6342C,#7B3FA0,#2E5BBA,#2F9A5B,#F5D547);filter:saturate(.9);}
.vbf-dim:nth-child(3)::before{background:linear-gradient(120deg,#8A8A8A 0%,#B89A7A 40%,#E07A2B 75%,#FF8A1C 100%);}
.vbf-dim:nth-child(4)::before{background:linear-gradient(120deg,#7B3FA0 0%,#7B3FA0 45%,#F5D547 55%,#F5D547 100%);}
.vbf-dim:hover{transform:translateY(-5px);border-color:rgba(239,201,128,.6);box-shadow:0 26px 50px -30px rgba(0,8,41,.8);}
.vbf-dim:hover::before{transform:scale(1.06);}
.vbf-dim .no{position:absolute;top:1.1rem;right:1.2rem;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:1.3rem;color:rgba(255,250,236,.85);}
.vbf-dim .big{display:block;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:1.65rem;line-height:1.1;color:#FFFAEC;}
.vbf-dim b{display:block;margin-top:.35rem;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:600;}
.vbf-dim .t{display:block;margin-top:.55rem;font-size:.9rem;line-height:1.5;color:rgba(255,250,236,.85);}
@media(max-width:640px){.vbf-dims{grid-template-columns:1fr;}.vbf-dim{min-height:200px;}}
.vbf-dims{border-top:0;}
.vbf-dim .no{font-style:normal;background:none;-webkit-text-fill-color:currentColor;}
.vbf-pc{text-align:left;}
.vbf-about .vb-creds li{color:var(--gold-deep);}
.vbf-about .vb-creds li::before{background:var(--grad-gold-deep);box-shadow:0 0 0 3px rgba(138,106,34,.12);}

/* Vier Fragen-Karten in eigener Reihe unter Text + Bildern (16.10.2026) */
.vbf-dims.vbf-dims-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-top:clamp(2.6rem,5vw,3.6rem);}
.vbf-dims-row .vbf-dim{min-height:260px;}
.vbf-dims-note{margin-top:1.4rem;text-align:center;color:var(--cr-soft);font-size:.98rem;}
@media(max-width:1100px){.vbf-dims.vbf-dims-row{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.vbf-dims.vbf-dims-row{grid-template-columns:1fr;}.vbf-dims-row .vbf-dim{min-height:200px;}}
.vbf-dims-row .vbf-dim{justify-content:flex-start;padding-top:6.2rem;}
.vbf-dims-row .vbf-dim::before{filter:saturate(1.25);}
.vbf-dims-row .vbf-dim::after{background:linear-gradient(180deg,rgba(0,8,41,0) 0%,rgba(0,8,41,.3) 45%,rgba(0,8,41,.84) 100%);}
/* Inhalte: 4 Karten im blauen Schimmer wie «Was mich antreibt» auf der Startseite (16.10.2026) */
.vb-mission-cards.vbf-learn4{grid-template-columns:repeat(4,1fr);max-width:none;margin-top:clamp(2.4rem,5vw,3.4rem);}
.vb-mission-cards.vbf-learn4 > div:nth-child(4){animation-delay:4.5s;}
.vb-mission-cards.vbf-learn4 h3{font-size:1.3rem;line-height:1.2;}
@media(max-width:1100px){.vb-mission-cards.vbf-learn4{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.vb-mission-cards.vbf-learn4{grid-template-columns:1fr;}}

/* Farb-Check-Abschnitt hell (Reihenfolge angeglichen 17.10.2026) */
#farbcheck.light{background:radial-gradient(ellipse 60% 80% at 50% 0%,rgba(216,182,106,.16),rgba(216,182,106,0) 70%),var(--creme);}

/* Schlusszeile Wie/Warum auf allen Seiten gleich (17.10.2026) */
.vbf .vb-end .sig{font-style:normal;max-width:none;}
/* Handy: bunte Fragen-Karten kompakter (17.10.2026) */
@media(max-width:640px){.vbf-dims-row .vbf-dim{min-height:0;padding:3.1rem 1.3rem 1.3rem;}.vbf-dims-row .vbf-dim .big{font-size:1.5rem;}.vbf-dims-row .vbf-dim .t{margin-top:.4rem;}}
/* Go-Live-Audit 18.10.2026: Unterzeile auf den Farbverlaufs-Karten lesbar */
.vbf-dim b{color:#FFFAEC;}