
:root{
  --ukpn-navy:#082B46;--ukpn-deep:#103E5F;--ukpn-gold:#D6A63A;--ukpn-ivory:#F8F5EE;
  --ukpn-slate:#5D6975;--ukpn-white:#fff;--ukpn-ink:#10293D;
}
.ukpbe-content{max-width:none}.ukpn{width:100%}
.ukpn{font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ukpn-ink);background:var(--ukpn-ivory)}
.ukpn *{box-sizing:border-box}
.ukpn-shell{width:min(1180px,calc(100% - 40px));margin:0 auto}
.ukpn-hero{background:linear-gradient(125deg,#082B46 0%,#103E5F 100%);color:#fff;overflow:hidden}
.ukpn-hero-grid{min-height:430px;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:70px;align-items:center;padding:76px 0}
.ukpn-eyebrow,.ukpn-kicker{margin:0 0 12px;color:var(--ukpn-gold);font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.ukpn-hero h1,.ukpn h2{font-family:Georgia,"Times New Roman",serif;font-weight:500;letter-spacing:-.02em}
.ukpn-hero h1{font-size:clamp(54px,7vw,88px);line-height:.98;margin:0 0 22px;color:#fff}
.ukpn-lead{font-size:clamp(20px,2.2vw,28px);line-height:1.45;max-width:780px;color:#fff;margin:0 0 16px}
.ukpn-lead strong{color:#F0D27B}
.ukpn-sub{font-size:16px;line-height:1.65;color:rgba(255,255,255,.72);max-width:720px;margin:0}
.ukpn-compass{width:280px;height:280px;border:1px solid rgba(214,166,58,.42);border-radius:50%;position:relative;justify-self:center}
.ukpn-compass:before,.ukpn-compass:after{content:"";position:absolute;background:rgba(214,166,58,.26)}
.ukpn-compass:before{width:1px;height:118%;left:50%;top:-9%}.ukpn-compass:after{height:1px;width:118%;top:50%;left:-9%}
.ukpn-compass i{position:absolute;width:30px;height:132px;background:linear-gradient(to bottom,var(--ukpn-gold) 0 50%,rgba(255,255,255,.72) 50%);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);left:50%;top:50%;transform:translate(-50%,-50%) rotate(24deg)}
.ukpn-compass span{position:absolute;font-size:11px;font-weight:800;color:#F0D27B}
.ukpn-compass span:nth-child(1){top:12px;left:50%;transform:translateX(-50%)}.ukpn-compass span:nth-child(2){right:12px;top:50%;transform:translateY(-50%)}.ukpn-compass span:nth-child(3){bottom:12px;left:50%;transform:translateX(-50%)}.ukpn-compass span:nth-child(4){left:12px;top:50%;transform:translateY(-50%)}
.ukpn-app{padding:54px 0 100px}
.ukpn-progress{max-width:820px;margin:0 auto 58px}
.ukpn-progress-line{height:3px;background:#dce1e4;position:relative}.ukpn-progress-line span{display:block;width:0;height:100%;background:var(--ukpn-gold);transition:width .35s ease}
.ukpn-progress-labels{display:grid;grid-template-columns:repeat(3,1fr);margin-top:10px;color:#7a858e;font-size:12px;font-weight:700}
.ukpn-progress-labels span:nth-child(2){text-align:center}.ukpn-progress-labels span:nth-child(3){text-align:right}
.ukpn-progress-labels .is-active{color:var(--ukpn-navy)}
.ukpn-panel{display:none}.ukpn-panel.is-active{display:block;animation:ukpnFade .28s ease}
@keyframes ukpnFade{from{opacity:.2;transform:translateY(8px)}to{opacity:1;transform:none}}
.ukpn-section-head{text-align:center;max-width:850px;margin:0 auto 36px}
.ukpn-section-head h2,.ukpn-result h2,.ukpn-trust h2{font-size:clamp(34px,4vw,52px);line-height:1.08;margin:0 0 16px;color:var(--ukpn-navy)}
.ukpn-section-head>p:last-child{color:var(--ukpn-slate);font-size:17px;line-height:1.65}
.ukpn-grid{display:grid;gap:18px}.ukpn-grid-4{grid-template-columns:repeat(4,1fr)}.ukpn-grid-2{grid-template-columns:repeat(2,1fr);max-width:960px;margin:0 auto}
.ukpn-choice{appearance:none;text-align:left;background:#fff;border:1px solid rgba(8,43,70,.10);border-radius:20px;padding:26px;min-height:250px;box-shadow:0 12px 35px rgba(8,43,70,.06);cursor:pointer;color:var(--ukpn-ink);font:inherit;transition:.25s ease}
.ukpn-choice:hover,.ukpn-choice:focus-visible{transform:translateY(-5px);border-color:rgba(214,166,58,.65);box-shadow:0 18px 42px rgba(8,43,70,.11);outline:none}
.ukpn-choice small{display:block;color:var(--ukpn-gold);font-weight:800;font-size:11px;letter-spacing:.04em;margin-bottom:10px}
.ukpn-choice strong{display:block;font-family:Georgia,"Times New Roman",serif;color:var(--ukpn-navy);font-size:22px;line-height:1.15;margin:7px 0 12px}
.ukpn-choice>span:not(.ukpn-icon){display:block;color:var(--ukpn-slate);line-height:1.55;font-size:14px}
.ukpn-choice b{display:block;margin-top:20px;color:var(--ukpn-navy);font-size:13px}
.ukpn-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#f3f6f7;color:var(--ukpn-navy);margin-bottom:18px}.ukpn-icon svg,.ukpn-trust-mark svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ukpn-topics .ukpn-choice{min-height:190px}
.ukpn-priorities .ukpn-choice{min-height:220px}
.ukpn-back{border:0;background:transparent;color:var(--ukpn-slate);font:700 13px inherit;cursor:pointer;margin:0 0 20px;padding:6px 0}
.ukpn-back:hover{color:var(--ukpn-navy)}
.ukpn-result{max-width:900px;margin:0 auto;background:#fff;border-radius:28px;box-shadow:0 22px 60px rgba(8,43,70,.10);overflow:hidden}
.ukpn-result-top{padding:48px 52px 34px}.ukpn-result-title{text-align:left!important}.ukpn-result-body{font-size:19px;line-height:1.7;color:var(--ukpn-slate)}
.ukpn-next{padding:28px 52px;background:var(--ukpn-navy);color:#fff}.ukpn-next-label{display:block;color:#F0D27B;font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:9px}.ukpn-next p{font-size:18px;line-height:1.6;margin:0}
.ukpn-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#e6e9eb;border-top:1px solid #e6e9eb;border-bottom:1px solid #e6e9eb}.ukpn-summary div{background:#fff;padding:20px}.ukpn-summary small{display:block;color:#8a949b;font-size:10px;text-transform:uppercase;letter-spacing:.09em;margin-bottom:5px}.ukpn-summary strong{color:var(--ukpn-navy);font-size:13px}
.ukpn-result-actions{padding:30px 52px 18px;display:flex;gap:14px;flex-wrap:wrap}.ukpn-btn{display:inline-flex;justify-content:center;align-items:center;border-radius:14px;padding:13px 18px;text-decoration:none;font:800 14px inherit;cursor:pointer}.ukpn-btn-primary{background:var(--ukpn-gold);color:var(--ukpn-navy);border:1px solid var(--ukpn-gold)}.ukpn-btn-secondary{background:#fff;color:var(--ukpn-navy);border:1px solid #cbd4d9}
.ukpn-disclaimer{padding:0 52px 34px;margin:0;color:#87929a;font-size:12px;line-height:1.5}
.ukpn-trust{margin:90px auto 0;max-width:980px;display:grid;grid-template-columns:90px 1fr;gap:32px;padding:36px;border-top:1px solid rgba(8,43,70,.12)}
.ukpn-trust-mark{width:74px;height:74px;border:1px solid rgba(214,166,58,.55);border-radius:50%;display:grid;place-items:center;color:var(--ukpn-gold)}
.ukpn-trust h2{font-size:34px}.ukpn-trust p:last-child{color:var(--ukpn-slate);line-height:1.7}
@media(max-width:950px){.ukpn-grid-4{grid-template-columns:repeat(2,1fr)}.ukpn-hero-grid{grid-template-columns:1fr}.ukpn-compass{display:none}}
@media(max-width:650px){.ukpn-shell{width:min(100% - 28px,1180px)}.ukpn-hero-grid{padding:55px 0}.ukpn-app{padding-top:38px}.ukpn-grid-4,.ukpn-grid-2{grid-template-columns:1fr}.ukpn-choice{min-height:0}.ukpn-result-top,.ukpn-next,.ukpn-result-actions{padding-left:24px;padding-right:24px}.ukpn-disclaimer{padding-left:24px;padding-right:24px}.ukpn-summary{grid-template-columns:1fr}.ukpn-trust{grid-template-columns:1fr;padding:28px 0}.ukpn-progress-labels{font-size:10px}}
@media(prefers-reduced-motion:reduce){.ukpn *{animation:none!important;transition:none!important}}


/* 1.0.3 — Lebensphasen-Hero + klare Zustandswechsel */
.ukpn-hero{
  transition:background .35s ease;
}
.ukpn-hero-grid{
  transition:min-height .35s ease;
}
.ukpn-hero-title,
.ukpn-hero-lead,
.ukpn-hero-sub,
.ukpn-hero-eyebrow{
  transition:opacity .2s ease;
}

/* Gleiche UKP-Markenwelt, aber je Lebensphase eine eigene visuelle Nuance */
.ukpn-hero--start{
  background:
    radial-gradient(circle at 79% 42%, rgba(214,166,58,.15), transparent 22rem),
    linear-gradient(125deg,#082B46 0%,#124662 100%);
}
.ukpn-hero--family{
  background:
    radial-gradient(circle at 79% 42%, rgba(248,245,238,.10), transparent 24rem),
    linear-gradient(125deg,#082B46 0%,#173F52 100%);
}
.ukpn-hero--business{
  background:
    radial-gradient(circle at 79% 42%, rgba(214,166,58,.10), transparent 22rem),
    linear-gradient(125deg,#071F35 0%,#0D3852 100%);
}
.ukpn-hero--retire{
  background:
    radial-gradient(circle at 79% 42%, rgba(214,166,58,.18), transparent 24rem),
    linear-gradient(125deg,#082B46 0%,#1A4658 100%);
}
.ukpn-hero--start .ukpn-compass i{transform:translate(-50%,-50%) rotate(8deg)}
.ukpn-hero--family .ukpn-compass i{transform:translate(-50%,-50%) rotate(58deg)}
.ukpn-hero--business .ukpn-compass i{transform:translate(-50%,-50%) rotate(118deg)}
.ukpn-hero--retire .ukpn-compass i{transform:translate(-50%,-50%) rotate(205deg)}

/* WordPress-Seitentitel auf /navigator/ ausblenden: der Hero trägt die Seitentitel-Funktion. */
body.page-navigator .entry-header,
body.page-navigator .entry-title{
  display:none!important;
}


/* ==========================================================
   UKP Navigator 1.0.4 — Hero Contrast / klare Hauptfrage
   ========================================================== */

/* Die große Hauptfrage ist ab jetzt immer klar lesbar. */
.ukpn-hero .ukpn-hero-title{
  color:#fff!important;
  opacity:1!important;
  text-shadow:0 2px 18px rgba(0,0,0,.20);
  font-size:clamp(54px,6vw,86px)!important;
  line-height:.98!important;
  max-width:760px;
  margin-bottom:22px!important;
}

/* Unterzeile bewusst heller, aber untergeordnet. */
.ukpn-hero .ukpn-hero-lead{
  color:#fff!important;
  opacity:1!important;
  max-width:760px;
}
.ukpn-hero .ukpn-hero-sub{
  color:rgba(255,255,255,.80)!important;
  max-width:700px;
}
.ukpn-hero .ukpn-hero-eyebrow{
  color:#F1BE3E!important;
  opacity:1!important;
}

/* Subtile Tiefenwirkung statt flachem Dunkelblau.
   Jede Lebensphase bekommt eine leicht eigene Atmosphäre. */
.ukpn-hero{
  position:relative;
  isolation:isolate;
}
.ukpn-hero:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(circle at 78% 28%, rgba(255,255,255,.09), transparent 25rem),
    radial-gradient(circle at 18% 82%, rgba(214,166,58,.06), transparent 24rem);
}
.ukpn-hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.38;
  background:
    linear-gradient(165deg, transparent 0 45%, rgba(255,255,255,.035) 45% 46%, transparent 46% 100%),
    linear-gradient(15deg, transparent 0 58%, rgba(0,0,0,.05) 58% 60%, transparent 60% 100%);
}

.ukpn-hero--start{
  background:
    linear-gradient(125deg,#072B47 0%,#0E4967 62%,#1B5C72 100%)!important;
}
.ukpn-hero--family{
  background:
    linear-gradient(125deg,#082B46 0%,#154658 60%,#2A5A5F 100%)!important;
}
.ukpn-hero--business{
  background:
    linear-gradient(125deg,#061F34 0%,#0B354F 60%,#163C52 100%)!important;
}
.ukpn-hero--retire{
  background:
    linear-gradient(125deg,#082B46 0%,#174659 58%,#365B5A 100%)!important;
}

/* Kompass etwas heller und präsenter. */
.ukpn-compass{
  border-color:rgba(214,166,58,.70)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.03),0 18px 45px rgba(0,0,0,.16);
}
.ukpn-compass:before,
.ukpn-compass:after{
  background:rgba(214,166,58,.42)!important;
}
.ukpn-compass span{
  color:#F1BE3E!important;
}

/* WordPress-Seitentitel oberhalb des Navigators zuverlässig entfernen. */
body.page-navigator .entry-header,
body.page-navigator .entry-title,
body.page-navigator main .entry-content > h1:first-child{
  display:none!important;
}

/* Der Navigator soll als zentrales Tool großzügiger wirken. */
body.page-navigator .site-main,
body.page-navigator .inside-article,
body.page-navigator .entry-content{
  max-width:none!important;
}
body.page-navigator .entry-content{
  margin-top:0!important;
}

@media(max-width:700px){
  .ukpn-hero .ukpn-hero-title{
    font-size:clamp(42px,12vw,64px)!important;
  }
}

/* 1.1.0 — fachliche Entscheidungswege */
.ukpn-learning{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:28px 0}
.ukpn-learning-card{background:#fff;border:1px solid rgba(8,43,70,.12);border-radius:20px;padding:24px}
.ukpn-learning-card--wide{grid-column:1/-1;background:#F8F5EE}
.ukpn-learning-card ul{margin:14px 0 0;padding-left:20px}
.ukpn-learning-card li{margin:0 0 10px;color:#334554;line-height:1.55}
.ukpn-btn-contact{display:block!important;width:100%;margin-top:12px!important;text-align:center!important;background:transparent!important;border:1px solid #D6A63A!important;color:#082B46!important}
.ukpn-btn-contact:hover{background:#F8F5EE!important}
@media(max-width:760px){.ukpn-learning{grid-template-columns:1fr}.ukpn-learning-card--wide{grid-column:auto}}

/* 1.1.1 — GeneratePress/Brand-Edition Seitentitel auf /navigator/ sicher entfernen */
body.page-id-0 .entry-title{display:none!important}
body.page .ukpbe-content > .entry-header{display:none!important}
body.page .ukpbe-content > h1:first-child{display:none!important}
body.page .site-main article.page .entry-header:has(+ .entry-content .ukpn){display:none!important}
body.page .site-main article.page:has(.ukpn) > .inside-article > .entry-header{display:none!important}
body.page .site-main article.page:has(.ukpn) .entry-content{margin-top:0!important}

/* 1.2.0 — Entscheidungsmaschine */
.ukpn-machine-next{margin:28px 0;padding:25px;border-radius:20px;background:#082B46;color:#fff;border-left:4px solid #D6A63A}
.ukpn-machine-next[hidden]{display:none!important}
.ukpn-machine-next h3{color:#fff!important;font:500 27px Georgia,serif;margin:7px 0 9px}
.ukpn-machine-next p{color:#dce7ed;line-height:1.55;margin:0 0 8px}
.ukpn-btn-machine{display:inline-flex!important;width:auto!important;background:#D6A63A!important;color:#082B46!important;margin-top:13px!important}

/* 1.3.0 — Entscheidungsmaschine Phase 2 */
.ukpn-priority-path{margin:28px 0;padding:28px;border:1px solid #d9dee2;border-radius:20px;background:#F8F5EE}
.ukpn-priority-path[hidden]{display:none!important}
.ukpn-priority-path h3{font:500 28px Georgia,serif;color:#082B46;margin:7px 0 10px}
.ukpn-priority-path>p{color:#44515d;line-height:1.65}
.ukpn-priority-questions{margin:20px 0;padding:18px 20px;background:#fff;border-radius:14px}
.ukpn-priority-questions strong{display:block;color:#082B46;margin-bottom:10px}
.ukpn-priority-questions ol{margin:0;padding-left:22px}
.ukpn-priority-questions li{margin:7px 0;line-height:1.5;color:#44515d}
.ukpn-priority-next{font-weight:600;color:#082B46!important;margin-bottom:0!important}

/* 1.4.0 — Entscheidungsmaschine Phase 3 */
.ukpn-action-route{margin:30px 0;padding:28px;border-radius:20px;background:#fff;border:1px solid #d9dee2;box-shadow:0 12px 32px rgba(8,43,70,.07)}
.ukpn-action-route[hidden]{display:none!important}
.ukpn-action-eyebrow{display:block;font-size:12px;font-weight:800;letter-spacing:.13em;color:#9b7622;margin-bottom:8px}
.ukpn-action-route h3{font:500 29px Georgia,serif;color:#082B46;margin:0 0 10px}
.ukpn-action-route p{color:#44515d;line-height:1.65;max-width:780px}
.ukpn-action-buttons{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:17px}
.ukpn-action-primary{width:auto!important}
.ukpn-action-secondary{font-weight:700;color:#103E5F;text-decoration:none;border-bottom:1px solid #D6A63A;padding-bottom:2px}
.ukpn-action-route[data-type="report"]{border-left:4px solid #D6A63A}
.ukpn-action-route[data-type="contact"]{background:#F8F5EE}
@media(max-width:640px){.ukpn-action-buttons{align-items:flex-start;flex-direction:column;gap:12px}}

/* 1.4.1 — Schritt-Navigation robust */
.ukpn-panel[hidden]{display:none!important}
.ukpn-panel{scroll-margin-top:110px}
.ukpn-panel.is-active{display:block!important}

/* 1.6.2 — Hero-Titel: Wörter nicht innerhalb umbrechen */
.ukpn-hero h1,
.ukpn-hero-title,
.ukpn-hero h2{
  overflow-wrap:normal!important;
  word-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
  -webkit-hyphens:none!important;
}

/* 1.7.0 — Nächster-Schritt-Engine */
.ukpn-action-route[data-type="contact"]{border-left:4px solid #D6A63A}
.ukpn-action-route[data-type="report"],
.ukpn-action-route[data-type="tool"]{border-left:4px solid #D6A63A}
.ukpn-action-route .ukpn-action-eyebrow{letter-spacing:.11em}
.ukpn-result-cta[hidden]{display:none!important}

/* 1.7.3 — klare CTA-Hierarchie */
.ukpn-action-route{
  padding:22px 24px!important;
}
.ukpn-action-buttons{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,.72fr);
  gap:12px!important;
  align-items:stretch;
  margin-top:18px!important;
}
.ukpn-action-primary{
  display:flex!important;
  align-items:center;
  justify-content:center;
  min-height:46px;
  text-align:center;
}
.ukpn-action-secondary{
  display:flex!important;
  align-items:center;
  justify-content:center;
  min-height:46px;
  box-sizing:border-box;
  padding:11px 14px!important;
  border:1px solid #b7c2c9!important;
  border-radius:9px!important;
  background:#fff!important;
  color:#0b3652!important;
  text-decoration:none!important;
  font-weight:800!important;
  text-align:center;
}
.ukpn-action-secondary.is-contact-secondary{
  border-color:#D6A63A!important;
  background:#FFF9EB!important;
}
.ukpn-action-secondary[hidden],
.ukpn-btn-contact[hidden]{display:none!important}
@media(max-width:680px){
  .ukpn-action-buttons{grid-template-columns:1fr!important}
}
