body {
      background: var(--neutral-50) !important;
      color: var(--neutral-900);
    }
    .eyebrow::before { animation: none !important; box-shadow: none !important; }
    .button, .career-card, .catalog-card { transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease !important; }
    .button:hover, .career-card:hover, .catalog-card:hover { transform: none !important; }

    .site-header {
      border-bottom: 1px solid var(--neutral-200) !important;
      background: rgba(var(--surface-rgb), .96) !important;
      backdrop-filter: blur(12px);
    }
    .nav { min-height: 66px; }
    .brand-logo { width: 36px; height: 36px; }
    .brand { font-size: .95rem; }
    .brand small { font-size: .64rem; }
    .nav-links { gap: 26px; font-size: .84rem; font-weight: 600; }
    .mini-cart-button {
      border-color: var(--neutral-300) !important;
      border-radius: 999px !important;
      box-shadow: none !important;
    }
    .mini-cart-button.has-items {
      border-color: var(--primary-500) !important;
      background: var(--primary-100) !important;
      box-shadow: none !important;
    }

    .hero-v14 { padding: 82px 0 92px !important; }
    .hero-v14 .hero-grid { grid-template-columns: minmax(0,1.06fr) minmax(380px,.94fr); gap: 76px; align-items: center; }
    .hero-editorial { padding: 14px 0; }
    .hero-v14 .eyebrow {
      padding: 0 !important;
      border: 0 !important;
      background: transparent !important;
      color: var(--neutral-600) !important;
      font-size: .72rem;
      letter-spacing: .08em;
    }
    .hero-v14 h1 {
      max-width: 760px;
      margin: 22px 0 26px;
      color: var(--neutral-950);
      font-size: clamp(3.6rem, 7vw, 6.9rem);
      line-height: .90;
      letter-spacing: -.07em;
    }
    .hero-mark { display: block; color: var(--primary-700); }
    .hero-v14 .hero-copy {
      max-width: 660px;
      color: var(--neutral-600);
      font-size: clamp(1.05rem, 1.8vw, 1.25rem);
      line-height: 1.6;
    }
    .hero-v14 .hero-actions { align-items: center; gap: 20px; margin-top: 34px; }
    .hero-main-action {
      min-height: 52px;
      padding-inline: 22px;
      border-radius: 999px !important;
      color: var(--on-panel-dark) !important;
      background: var(--panel-dark) !important;
      border-color: var(--neutral-900) !important;
      box-shadow: none !important;
    }
    .hero-main-action:hover { background: var(--primary-900) !important; border-color: var(--primary-900) !important; }
    .hero-text-action {
      color: var(--neutral-700);
      font-size: .88rem;
      font-weight: 700;
      text-decoration: none;
      border-bottom: 1px solid var(--neutral-400);
    }
    .hero-price-anchor {
      margin-top: 30px !important;
      padding: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      color: var(--neutral-600) !important;
    }
    .hero-price-anchor strong { color: var(--neutral-900) !important; font-size: 1rem !important; }

    .hero-product {
      min-height: 500px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 30px;
      border-radius: 32px;
      color: var(--on-panel-dark);
      background: var(--panel-dark);
      box-shadow: 0 28px 70px rgba(var(--ink-rgb), .14);
      overflow: hidden;
      position: relative;
    }
    .hero-product::after {
      content: "";
      width: 280px;
      height: 280px;
      position: absolute;
      right: -110px;
      bottom: -120px;
      border-radius: 50%;
      background: var(--primary-500);
      opacity: .9;
    }
    .hero-product-head, .hero-product-footer { display: flex; align-items: center; gap: 9px; position: relative; z-index: 1; }
    .hero-product-head { justify-content: space-between; color: var(--on-panel-dark-muted); font-size: .75rem; font-weight: 600; }
    .hero-product-status { padding: 5px 9px; border: 1px solid var(--neutral-600); border-radius: 999px; color: var(--primary-100); }
    .hero-product-copy { max-width: 390px; position: relative; z-index: 1; }
    .hero-product-kicker { color: var(--on-panel-accent); font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
    .hero-product-copy h3 { margin: 13px 0 0; color: var(--on-panel-dark); font-size: clamp(2.2rem, 4vw, 3.6rem); line-height: .98; letter-spacing: -.055em; }
    .hero-product-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; position: relative; z-index: 1; border-top: 1px solid var(--neutral-700); border-bottom: 1px solid var(--neutral-700); }
    .hero-product-steps > div { min-height: 126px; display: flex; flex-direction: column; padding: 18px 14px 16px 0; }
    .hero-product-steps > div + div { padding-left: 16px; border-left: 1px solid var(--neutral-700); }
    .hero-product-steps strong { color: var(--neutral-400); font-size: .65rem; }
    .hero-product-steps span { margin-top: auto; color: var(--on-panel-dark); font-family: var(--font-heading) !important; font-size: 1rem; font-weight: 700; }
    .hero-product-steps small { margin-top: 4px; color: var(--muted); font-size: .68rem; line-height: 1.3; }
    .hero-product-footer { color: var(--neutral-300); font-size: .72rem; }
    .product-dot { width: 9px; height: 9px; border-radius: 50%; }
    .product-dot-green { background: var(--primary-400); }
    .product-dot-blue { background: var(--accent-blue-500); }
    .product-dot-violet { background: var(--accent-violet-500); }

    #berufe { padding-top: 82px; padding-bottom: 86px; border-top: 1px solid var(--neutral-200); }
    .planner-intro { margin-bottom: 34px; }
    .planner-kicker { display: inline-block; margin-bottom: 12px; color: var(--primary-700); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
    #berufe .section-heading { margin-bottom: 20px; }
    #berufe .section-heading h2 { max-width: 780px; margin-bottom: 10px; font-size: clamp(2.5rem,5vw,4.8rem); line-height: .96; letter-spacing: -.055em; }
    #berufe .section-heading p { max-width: 700px; color: var(--neutral-600); font-size: 1rem; }
    .planner-stage-strip {
      display: grid;
      grid-template-columns: repeat(4,1fr);
      margin-top: 30px;
      border-top: 1px solid var(--neutral-300);
      border-bottom: 1px solid var(--neutral-300);
    }
    .planner-stage-strip > span { display: flex; gap: 8px; align-items: center; min-height: 48px; color: var(--neutral-500); font-size: .76rem; font-weight: 600; }
    .planner-stage-strip > span + span { padding-left: 14px; border-left: 1px solid var(--neutral-200); }
    .planner-stage-strip b { color: var(--neutral-400); font-size: .66rem; }
    .planner-stage-strip > span.active { color: var(--neutral-900); }
    .planner-stage-strip > span.active b { color: var(--primary-700); }
    .planner-stage-strip > span.done { color: var(--primary-700); }

    .route-switch {
      display: grid !important;
      grid-template-columns: 1fr 1fr;
      gap: 12px !important;
      margin: 0 0 38px !important;
      padding: 0 !important;
      border: 0 !important;
      background: transparent !important;
    }
    .route-switch button {
      min-height: 88px !important;
      display: grid !important;
      align-content: center;
      justify-items: start;
      gap: 4px;
      padding: 16px 18px !important;
      border: 1px solid var(--neutral-200) !important;
      border-radius: 18px !important;
      color: var(--neutral-700) !important;
      background: var(--neutral-50) !important;
      text-align: left;
    }
    .route-switch button strong { color: var(--neutral-900); font-family: var(--font-heading) !important; font-size: 1rem; }
    .route-switch button span { color: var(--neutral-500); font-size: .74rem; font-weight: 500; }
    .route-switch button.active { border-color: var(--neutral-900) !important; background: var(--panel-dark) !important; box-shadow: none !important; }
    .route-switch button.active strong { color: var(--on-panel-dark); }
    .route-switch button.active span { color: var(--neutral-300); }

    .planner-shell { min-height: 360px; }
    .career-grid {
      display: grid !important;
      grid-template-columns: minmax(260px,.72fr) minmax(0,1.28fr) !important;
      gap: 54px !important;
      align-items: start;
    }
    .career-grid[hidden] { display: none !important; }
    .career-chooser-copy { position: sticky; top: 96px; display: grid; grid-template-columns: auto 1fr; gap: 18px; }
    .journey-number { width: 38px; height: 38px; display: inline-grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: var(--neutral-900); background: var(--accent-blue-200); font-size: .72rem; font-weight: 800; }
    .career-chooser-copy h3 { margin: 0 0 12px; font-size: clamp(1.7rem,3vw,2.6rem); line-height: 1.03; letter-spacing: -.04em; }
    .career-chooser-copy p { margin: 0; color: var(--neutral-600); }
    .career-list { border-top: 1px solid var(--neutral-300); }
    .career-row {
      width: 100%;
      min-height: 92px;
      display: grid !important;
      grid-template-columns: 42px minmax(0,1fr) auto;
      align-items: center;
      gap: 18px;
      padding: 14px 4px !important;
      border: 0 !important;
      border-bottom: 1px solid var(--neutral-200) !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      text-align: left;
      cursor: pointer;
    }
    .career-row:hover { background: var(--neutral-100) !important; }
    .career-row::after { display: none !important; }
    .career-orb { width: 34px; height: 34px; display: block; border-radius: 50%; background: var(--accent, var(--primary-100)); }
    .career-row-main { min-width: 0; display: grid; grid-template-columns: 48px minmax(0,1fr); column-gap: 12px; align-items: baseline; }
    .career-row .career-code { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--neutral-500) !important; font-size: .67rem; }
    .career-row strong { margin: 0 !important; max-width: none !important; color: var(--neutral-900); font-size: 1rem !important; }
    .career-row small { grid-column: 2; margin-top: 3px; color: var(--neutral-500); font-size: .72rem; line-height: 1.35; }
    .career-row-arrow { color: var(--neutral-400); font-size: 1.15rem; }

    .career-detail {
      display: none;
      padding: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    .journey-back { margin: 0 0 28px; padding: 0 0 3px; border: 0; border-bottom: 1px solid var(--neutral-400); color: var(--neutral-600); background: transparent; cursor: pointer; font-size: .8rem; font-weight: 700; }
    .career-detail-header { display: block !important; margin-bottom: 44px; padding-bottom: 34px; border-bottom: 1px solid var(--neutral-300); }
    .career-selection-summary { display: grid; grid-template-columns: 62px minmax(0,1fr); gap: 18px; align-items: start; }
    .career-selection-summary .career-orb { width: 58px; height: 58px; }
    .career-detail-header .badge { padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--neutral-500) !important; font-size: .7rem; }
    .career-detail-header h3 { margin: 8px 0 8px !important; max-width: 880px; color: var(--neutral-950); font-size: clamp(2.5rem,5vw,4.8rem) !important; line-height: .96 !important; letter-spacing: -.055em !important; }
    .career-detail-header p { max-width: 680px !important; margin: 0; color: var(--neutral-600); }
    .journey-step-label { display: flex; align-items: center; gap: 14px; margin: 34px 0 18px; }
    .journey-step-label > div { display: grid; gap: 2px; }
    .journey-step-label strong { color: var(--neutral-900); font-family: var(--font-heading) !important; font-size: 1rem; }
    .journey-step-label small { color: var(--neutral-500); font-size: .75rem; }

    .journey-year-tabs {
      display: grid !important;
      grid-template-columns: repeat(3,1fr);
      gap: 10px !important;
      max-width: none !important;
      margin: 0 0 14px !important;
      padding: 0 !important;
      border: 0 !important;
      background: transparent !important;
    }
    .journey-year-tabs .tab {
      min-height: 104px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: space-between;
      padding: 16px !important;
      border: 1px solid var(--neutral-200) !important;
      border-radius: 16px !important;
      color: var(--neutral-700) !important;
      background: transparent !important;
      box-shadow: none !important;
      text-align: left;
    }
    .journey-year-tabs .tab > span { color: var(--neutral-400); font-family: var(--font-heading) !important; font-size: 2rem; font-weight: 700; line-height: 1; }
    .journey-year-tabs .tab small { color: var(--neutral-600); font-size: .76rem; font-weight: 700; }
    .journey-year-tabs .tab.active { border-color: var(--neutral-900) !important; color: var(--on-panel-dark) !important; background: var(--panel-dark) !important; }
    .journey-year-tabs .tab.active > span, .journey-year-tabs .tab.active small { color: var(--on-panel-dark); }
    .year-exception-disclosure { max-width: 620px; margin: 0 0 42px; }

    .year-panel { border-top: 1px solid var(--neutral-300); padding-top: 8px; }
    .recommendation-intro {
      margin: 0 0 42px !important;
      padding: 34px 0 !important;
      border: 0 !important;
      border-bottom: 1px solid var(--neutral-200) !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }
    .recommendation-intro .year-intro-main { display: block !important; }
    .recommendation-intro .year-number { display: none !important; }
    .recommendation-kicker { color: var(--primary-700); font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
    .recommendation-intro h4 { margin: 10px 0 8px !important; max-width: 700px; color: var(--neutral-950); font-size: clamp(2rem,4vw,3.5rem) !important; line-height: 1 !important; letter-spacing: -.045em; }
    .recommendation-intro p { max-width: 680px; color: var(--neutral-600); font-size: .96rem; }
    .year-intro-actions { align-self: end; }

    .package-section { margin: 48px 0 !important; }
    .package-section .subheading { display: grid; grid-template-columns: minmax(180px,.36fr) minmax(0,.64fr); gap: 24px; align-items: start; margin-bottom: 20px; }
    .package-section .subheading h4 { margin: 0; color: var(--neutral-950); font-size: 1.35rem; }
    .package-section .subheading p { max-width: 540px; margin: 0; color: var(--neutral-500); font-size: .82rem; }
    .package-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 14px !important; }
    .recommendation-card {
      min-width: 0;
      padding: 22px !important;
      border: 1px solid var(--neutral-200) !important;
      border-radius: 20px !important;
      background: var(--neutral-0) !important;
      box-shadow: none !important;
    }
    .recommendation-card.has-selection { border-color: var(--primary-500) !important; background: var(--primary-50) !important; }
    .recommendation-card .package-head { align-items: start; }
    .recommendation-card .package-letter { width: 34px !important; height: 34px !important; min-width: 34px; border-radius: 10px !important; color: var(--on-panel-dark) !important; background: var(--panel-dark) !important; box-shadow: none !important; }
    .recommendation-label { display: block; margin-bottom: 4px; color: var(--primary-700); font-size: .64rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
    .recommendation-card .package-head h4 { margin: 0 0 7px !important; color: var(--neutral-950); font-size: 1.18rem; }
    .recommendation-card .package-head p { color: var(--neutral-500); font-size: .8rem; line-height: 1.45; }
    .package-summary-line { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 16px 0; color: var(--neutral-600); font-size: .72rem; font-weight: 600; }
    .package-actions-primary { justify-content: flex-start !important; margin: 0 0 14px !important; }
    .recommendation-card .button-primary { color: var(--on-panel-dark) !important; background: var(--panel-dark) !important; border-color: var(--neutral-900) !important; box-shadow: none !important; }
    .package-details { border-top: 1px solid var(--neutral-200); }
    .package-details summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; color: var(--neutral-700); font-size: .75rem; font-weight: 700; list-style: none; }
    .package-details summary::-webkit-details-marker { display: none; }
    .package-details summary small { color: var(--neutral-500); font-weight: 500; }
    .package-details-body { padding: 4px 0 2px; }
    .package-details .package-label { margin-top: 12px; }
    .package-seminar { background: transparent !important; }

    .journey-disclosure { margin-top: 58px; border-top: 1px solid var(--neutral-300); border-bottom: 1px solid var(--neutral-300); }
    .journey-disclosure > summary { min-height: 90px; display: flex; align-items: center; justify-content: space-between; gap: 22px; cursor: pointer; list-style: none; }
    .journey-disclosure > summary::-webkit-details-marker { display: none; }
    .journey-disclosure > summary > span:first-child { display: grid; gap: 4px; }
    .journey-disclosure > summary strong { color: var(--neutral-950); font-family: var(--font-heading) !important; font-size: 1.2rem; }
    .journey-disclosure > summary small { color: var(--neutral-500); font-size: .76rem; }
    .journey-disclosure-icon { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--neutral-300); border-radius: 9px; font-size: 1.15rem; }
    .journey-disclosure[open] .journey-disclosure-icon { transform: rotate(45deg); }
    .journey-disclosure-body { padding: 10px 0 46px; }
    .journey-disclosure .further-seminars, .journey-disclosure .builder { margin-top: 26px; }
    .builder { border: 1px solid var(--neutral-200) !important; border-radius: 20px !important; background: var(--neutral-0) !important; box-shadow: none !important; }

    .catalog-shell {
      padding: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }
    .catalog-toolbar { padding: 18px; border: 1px solid var(--neutral-200); border-radius: 18px; background: var(--neutral-100); }
    .catalog-status-row { padding-bottom: 16px; border-bottom: 1px solid var(--neutral-200); }
    .catalog-card { border-radius: 16px !important; box-shadow: none !important; }

    .journey-explainer-section { padding: 92px 0; background: var(--panel-dark); color: var(--on-panel-dark); }
    .journey-explainer { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 80px; align-items: start; }
    .journey-explainer .planner-kicker { color: var(--on-panel-accent); }
    .journey-explainer-copy h2 { max-width: 560px; margin-bottom: 18px; color: var(--on-panel-dark); font-size: clamp(2.4rem,5vw,4.6rem); line-height: .95; letter-spacing: -.055em; }
    .journey-explainer-copy p { max-width: 560px; color: var(--on-panel-dark-muted); }
    .journey-explainer-steps { border-top: 1px solid var(--neutral-600); }
    .journey-explainer-steps > div { display: grid; grid-template-columns: 42px minmax(130px,.42fr) minmax(0,.58fr); gap: 16px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--neutral-600); }
    .journey-explainer-steps span { color: var(--on-panel-dark-muted); font-size: .68rem; font-weight: 700; }
    .journey-explainer-steps strong { color: var(--on-panel-dark); font-family: var(--font-heading) !important; font-size: 1rem; }
    .journey-explainer-steps p { margin: 0; color: var(--on-panel-dark-muted); font-size: .78rem; }

    .pricing-section { padding: 92px 0 !important; }
    .pricing-section .section-heading h2 { font-size: clamp(2.5rem,5vw,4.6rem); line-height: .95; letter-spacing: -.05em; }
    .pricing-copy, .pricing-panel { border-radius: 22px !important; box-shadow: none !important; }
    .pricing-copy { background: var(--neutral-900) !important; border-color: var(--neutral-900) !important; }
    .pricing-copy h3, .pricing-copy > p { color: var(--on-panel-dark) !important; }
    .pricing-copy > p { opacity: .82; }
    .pricing-copy .pricing-kicker { color: var(--primary-100); background: transparent; border-color: var(--neutral-600); }
    .pricing-copy .pricing-tax-note { color: var(--neutral-300) !important; }
    .pricing-custom-note { border-color: var(--neutral-600) !important; background: var(--panel-dark-soft) !important; color: var(--neutral-200) !important; }
    .pricing-custom-note strong { color: var(--on-panel-accent) !important; }

    #anfrage { padding-top: 30px; }
    .contact-shell { border-radius: 28px !important; box-shadow: none !important; }

    @media (max-width: 980px) {
      .hero-v14 .hero-grid { grid-template-columns: 1fr; gap: 46px; }
      .hero-product { min-height: 430px; }
      .career-grid { grid-template-columns: 1fr !important; gap: 28px !important; }
      .career-chooser-copy { position: static; max-width: 660px; }
      .journey-explainer { grid-template-columns: 1fr; gap: 46px; }
      .package-grid { grid-template-columns: 1fr !important; }
    }

    @media (max-width: 680px) {
      .nav-links { display: none !important; }
      .hero-v14 { padding: 54px 0 62px !important; }
      .hero-v14 .hero-grid { gap: 34px; }
      .hero-v14 h1 { font-size: clamp(3.2rem,15vw,5.1rem); }
      .hero-v14 .hero-actions { align-items: flex-start; flex-direction: column; }
      .hero-product { min-height: 410px; padding: 22px; border-radius: 24px; }
      .hero-product-copy h3 { font-size: 2.4rem; }
      .hero-product-steps > div { min-height: 108px; padding: 14px 8px 12px 0; }
      .hero-product-steps > div + div { padding-left: 10px; }
      .hero-product-steps small { display: none; }
      #berufe { padding-top: 62px; }
      #berufe .section-heading h2 { font-size: 2.9rem; }
      .planner-stage-strip { grid-template-columns: repeat(2,1fr); }
      .planner-stage-strip > span:nth-child(3) { border-left: 0; border-top: 1px solid var(--neutral-200); }
      .planner-stage-strip > span:nth-child(4) { border-top: 1px solid var(--neutral-200); }
      .route-switch { grid-template-columns: 1fr !important; }
      .career-chooser-copy { grid-template-columns: 1fr; }
      .career-row { grid-template-columns: 32px minmax(0,1fr) auto; gap: 12px; }
      .career-orb { width: 28px; height: 28px; }
      .career-row-main { grid-template-columns: 1fr !important; gap: 4px !important; }
      .career-row .career-code { grid-column: 1; }
      .career-row strong, .career-row small { grid-column: 1; }
      .career-selection-summary { grid-template-columns: 44px minmax(0,1fr); gap: 12px; }
      .career-selection-summary .career-orb { width: 42px; height: 42px; }
      .career-detail-header h3 { font-size: 2.65rem !important; }
      .journey-year-tabs { grid-template-columns: 1fr !important; }
      .journey-year-tabs .tab { min-height: 68px; flex-direction: row; align-items: center; }
      .journey-year-tabs .tab > span { font-size: 1.45rem; }
      .recommendation-intro { align-items: stretch !important; }
      .recommendation-intro h4 { font-size: 2.35rem !important; }
      .package-section .subheading { grid-template-columns: 1fr; gap: 6px; }
      .package-actions-primary { display: grid !important; grid-template-columns: 1fr; }
      .journey-explainer-section { padding: 66px 0; }
      .journey-explainer-copy h2 { font-size: 2.8rem; }
      .journey-explainer-steps > div { grid-template-columns: 34px 1fr; }
      .journey-explainer-steps p { grid-column: 2; }
    }

/* Route switch: current route stays dark; only the alternative route advertises itself on hover. */
    .route-switch button.active,
    .route-switch button.active:hover,
    .seminar-view-switch.route-switch button.active:hover {
      color: var(--on-panel-dark) !important;
      border-color: var(--neutral-900) !important;
      background: var(--panel-dark) !important;
      box-shadow: none !important;
      transform: none !important;
      cursor: default !important;
    }
    .route-switch button.active strong,
    .route-switch button.active:hover strong { color: var(--on-panel-dark) !important; }
    .route-switch button.active span,
    .route-switch button.active:hover span { color: var(--neutral-300) !important; }
    .route-switch button:not(.active):hover {
      color: var(--primary-900) !important;
      border-color: var(--primary-500) !important;
      background: var(--primary-50) !important;
      box-shadow: 0 8px 22px rgba(var(--primary-900-rgb), .08) !important;
    }
    .route-switch button:not(.active):hover strong { color: var(--primary-900) !important; }
    .route-switch button:not(.active):hover span { color: var(--primary-800) !important; }

    /* Larger, easier-to-scan recommendation area. */
    .career-detail { font-size: 1rem; }
    .journey-back {
      min-height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin: 0 0 34px;
      padding: 0 18px;
      border: 1px solid var(--neutral-300);
      border-radius: 13px;
      color: var(--neutral-900);
      background: var(--neutral-50);
      font-size: .92rem;
      font-weight: 760;
      text-decoration: none;
    }
    .journey-back:hover { border-color: var(--neutral-500); background: var(--neutral-100); }
    .journey-step-label strong { font-size: 1.08rem; }
    .journey-step-label small { font-size: .82rem; }
    .recommendation-intro p { max-width: 760px; font-size: 1.04rem; line-height: 1.6; }
    .package-section { margin: 54px 0 !important; }
    .package-section .subheading {
      display: block !important;
      margin: 0 0 22px !important;
    }
    .package-section .subheading h4 { margin: 0 0 6px !important; font-size: 1.55rem !important; line-height: 1.15; }
    .package-section .subheading p { max-width: 760px; margin: 0 !important; color: var(--neutral-600) !important; font-size: .96rem !important; line-height: 1.5; }
    .package-grid { gap: 18px !important; }
    .recommendation-card { padding: 26px !important; }
    .recommendation-card .package-head { gap: 14px; }
    .recommendation-card .package-head h4 { margin-bottom: 8px !important; font-size: 1.32rem !important; line-height: 1.2; }
    .recommendation-card .package-head p { max-width: 620px; color: var(--muted) !important; font-size: .94rem !important; line-height: 1.55; }
    .recommendation-label { font-size: .70rem; }
    .package-summary-line { margin: 18px 0; font-size: .82rem; }
    .package-actions-primary { gap: 9px !important; }
    .package-actions-primary .button { min-height: 44px !important; padding-inline: 14px !important; font-size: .84rem !important; }
    .package-core-selected {
      color: var(--neutral-900) !important;
      border-color: var(--neutral-500) !important;
      background: var(--neutral-50) !important;
      box-shadow: none !important;
    }
    .package-core-selected:hover { border-color: var(--neutral-700) !important; background: var(--neutral-100) !important; }
    .package-options-selected {
      color: var(--accent-blue-700) !important;
      border-color: var(--accent-blue-500) !important;
      background: var(--accent-blue-200) !important;
      box-shadow: none !important;
    }
    .package-options-selected:hover { color: var(--neutral-950) !important; border-color: var(--accent-blue-700) !important; }
    .package-remove-all { margin-left: auto; }
    .package-details { margin-top: 4px; }
    .package-details summary {
      min-height: 50px;
      display: grid !important;
      grid-template-columns: minmax(0,1fr) auto 26px;
      gap: 10px;
      color: var(--neutral-800);
      font-size: .84rem;
    }
    .package-details summary small { font-size: .76rem; }
    .package-details-arrow { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid var(--neutral-300); border-radius: 50%; transition: transform 160ms ease; }
    .package-details[open] .package-details-arrow { transform: rotate(180deg); }
    .package-seminar { min-height: 54px !important; }
    .package-seminar label { font-size: .84rem; }

    /* Make the optional route clearly discoverable without turning it into a second main section. */
    .journey-disclosure {
      margin-top: 64px !important;
      padding: 0 22px;
      border: 1px solid var(--neutral-300) !important;
      border-radius: 18px;
      background: var(--neutral-50);
    }
    .journey-disclosure > summary { min-height: 104px !important; }
    .journey-disclosure > summary strong { font-size: 1.38rem !important; }
    .journey-disclosure > summary small { max-width: 700px; color: var(--neutral-600) !important; font-size: .86rem !important; line-height: 1.45; }
    .journey-disclosure-icon { flex: 0 0 auto; transition: transform 160ms ease; }
    .journey-disclosure[open] .journey-disclosure-icon { transform: rotate(180deg) !important; }

    /* Matrix behaves like a data grid: horizontal + vertical scrolling with a persistent header. */
    .catalog-matrix-frame { overflow: hidden !important; }
    .catalog-matrix-wrap {
      max-height: min(68vh, 720px);
      overflow: auto !important;
      overscroll-behavior: contain;
      scrollbar-gutter: stable;
    }
    .catalog-matrix thead th {
      position: sticky !important;
      top: 0 !important;
      z-index: 8 !important;
      background: var(--neutral-50) !important;
      box-shadow: 0 1px 0 var(--neutral-300), 0 8px 16px rgba(var(--ink-rgb), .05);
    }
    .catalog-matrix tbody tr[data-matrix-category="Soft Skills"] td:first-child { border-left: 4px solid var(--primary-500); }
    .catalog-matrix tbody tr[data-matrix-category="Kaufmännische Kompetenzen"] td:first-child { border-left: 4px solid var(--accent-violet-500); }
    .catalog-matrix tbody tr[data-matrix-category="Digitale Grundkompetenzen"] td:first-child { border-left: 4px solid var(--accent-blue-500); }
    .catalog-matrix tbody tr[data-matrix-category="KI-Kompetenzen"] td:first-child { border-left: 4px solid var(--accent-violet-700); }
    .catalog-matrix tbody tr[data-matrix-category="IT-Fachkompetenzen"] td:first-child { border-left: 4px solid var(--accent-blue-700); }
    .catalog-matrix tbody tr[data-matrix-category="Prüfungsvorbereitung"] td:first-child { border-left: 4px solid var(--primary-700); }
    .catalog-matrix-hint {
      width: 22px;
      height: 22px;
      display: inline-grid;
      place-items: center;
      flex: 0 0 auto;
      padding: 0;
      border: 1px solid var(--accent-violet-500);
      border-radius: 50%;
      color: var(--accent-violet-700);
      background: var(--accent-violet-200);
      cursor: pointer;
      font-size: .72rem;
      font-weight: 850;
    }
    .catalog-matrix-hint:hover { border-color: var(--accent-violet-700); background: var(--neutral-50); }

    .price-approval-actions { justify-content: space-between !important; }

    .selection-notice {
      position: fixed;
      right: 24px;
      bottom: 104px;
      z-index: 9999;
      width: min(430px, calc(100vw - 32px));
      padding: 14px 16px;
      border: 1px solid var(--accent-violet-500);
      border-radius: 14px;
      color: var(--accent-violet-700);
      background: var(--accent-violet-200);
      box-shadow: 0 18px 44px rgba(var(--ink-rgb), .14);
      font-size: .88rem;
      font-weight: 650;
      line-height: 1.45;
      opacity: 0;
      transform: translateY(8px);
      transition: opacity 160ms ease, transform 160ms ease;
    }
    .selection-notice.visible { opacity: 1; transform: translateY(0); }

    @media (max-width: 860px) {
      .package-grid { grid-template-columns: 1fr !important; }
      .package-remove-all { margin-left: 0; }
    }
    @media (max-width: 620px) {
      .recommendation-card { padding: 20px !important; }
      .package-actions-primary { display: grid !important; grid-template-columns: 1fr !important; }
      .package-actions-primary .button { width: 100%; }
      .journey-disclosure { padding: 0 14px; }
      .journey-disclosure > summary { min-height: 94px !important; }
      .selection-notice { right: 12px; bottom: 96px; width: calc(100vw - 24px); }
      .price-approval-actions { display: flex !important; flex-direction: row !important; gap: 10px; }
      .price-approval-actions .button { flex: 1 1 0; }
    }


    html { font-size: 17px; }
    body { line-height: 1.62; }

    /* The live indicator is useful feedback and may pulse again. */
    .hero-v14 .eyebrow::before {
      animation: livePulse 1.8s ease-out infinite !important;
      box-shadow: 0 0 0 0 rgba(70,179,133,.36) !important;
    }
    @media (prefers-reduced-motion: reduce) {
      .hero-v14 .eyebrow::before { animation: none !important; }
    }

    /* Make the positive price anchor deliberately visible. */
    .hero-price-anchor {
      gap: 7px 9px !important;
      color: var(--neutral-700) !important;
      font-size: 1.02rem !important;
      line-height: 1.25;
    }
    .hero-price-anchor strong {
      color: var(--primary-800) !important;
      font-size: 1.55rem !important;
      line-height: 1;
    }
    .hero-price-anchor:hover { color: var(--primary-900) !important; }

    /* Friendlier product explanation card with reliable contrast. */
    .hero-product {
      color: var(--neutral-900) !important;
      border: 1px solid var(--accent-blue-200);
      background: linear-gradient(145deg, var(--neutral-0) 0%, var(--primary-50) 58%, var(--accent-blue-200) 130%) !important;
      box-shadow: 0 24px 58px rgba(var(--ink-rgb), .10) !important;
    }
    .hero-product::after { background: var(--primary-300) !important; opacity: .58 !important; }
    .hero-product-head { color: var(--neutral-600) !important; font-size: .82rem !important; }
    .hero-product-status {
      color: var(--primary-900) !important;
      border-color: var(--primary-300) !important;
      background: var(--primary-100) !important;
    }
    .hero-product-kicker { color: var(--accent-blue-700) !important; font-size: .80rem !important; }
    .hero-product-copy h3 { color: var(--neutral-950) !important; }
    .hero-product-steps {
      border-color: var(--neutral-300) !important;
      background: rgba(var(--surface-rgb), .54);
    }
    .hero-product-steps > div {
      min-height: 142px;
      display: grid !important;
      grid-template-rows: auto auto 1fr;
      align-content: start;
      gap: 7px;
      padding: 20px 16px 18px 0 !important;
    }
    .hero-product-steps > div + div { border-left-color: var(--neutral-300) !important; padding-left: 18px !important; }
    .hero-product-steps strong { color: var(--primary-700) !important; font-size: .78rem !important; }
    .hero-product-steps span {
      margin-top: 0 !important;
      color: var(--neutral-950) !important;
      font-size: 1.12rem !important;
      line-height: 1.15;
    }
    .hero-product-steps small { margin-top: 0 !important; color: var(--muted) !important; font-size: .80rem !important; line-height: 1.42; }
    .hero-product-footer { color: var(--neutral-600) !important; font-size: .80rem !important; }

    /* Every recommendation card owns its own height; opening one never stretches its neighbour. */
    .package-grid { align-items: start !important; }
    .recommendation-card { align-self: start !important; }

    .recommendation-card .package-head h4 { font-size: 1.44rem !important; }
    .recommendation-card .package-head p { font-size: 1rem !important; line-height: 1.58 !important; }
    .recommendation-label { font-size: .76rem !important; }
    .package-summary-line {
      gap: 9px !important;
      margin: 20px 0 !important;
      font-size: .92rem !important;
      font-weight: 650 !important;
    }
    .package-summary-line span {
      display: inline-flex;
      align-items: baseline;
      gap: 4px;
      padding: 6px 9px;
      border: 1px solid var(--neutral-200);
      border-radius: 999px;
      background: var(--neutral-50);
      color: var(--neutral-700);
    }
    .package-summary-line strong { color: var(--neutral-950); font-size: 1.02rem; }

    /* Symmetric package action row. */
    .package-actions-primary {
      display: grid !important;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      align-items: stretch;
      gap: 9px !important;
      margin-bottom: 16px !important;
    }
    .package-actions-primary .button {
      width: 100%;
      min-height: 48px !important;
      padding: 9px 12px !important;
      font-size: .88rem !important;
      line-height: 1.25;
      white-space: normal;
      box-shadow: none !important;
    }
    .package-core-action {
      color: var(--on-panel-dark) !important;
      border-color: var(--primary-800) !important;
      background: var(--primary-800) !important;
    }
    .package-core-action:hover { border-color: var(--primary-700) !important; background: var(--primary-700) !important; }
    .package-options-action {
      color: var(--accent-blue-700) !important;
      border-color: var(--accent-blue-500) !important;
      background: var(--accent-blue-200) !important;
    }
    .package-options-action:hover { color: var(--neutral-950) !important; border-color: var(--accent-blue-700) !important; background: #c4eaff !important; }
    .package-core-selected,
    .package-options-selected {
      color: var(--neutral-800) !important;
      border-color: var(--neutral-400) !important;
      background: var(--neutral-100) !important;
    }
    .package-core-selected:hover,
    .package-options-selected:hover { color: var(--neutral-950) !important; border-color: var(--neutral-700) !important; background: var(--neutral-200) !important; }
    .package-remove-all {
      margin-left: 0 !important;
      color: var(--danger) !important;
      border-color: #d9a2a2 !important;
      background: #fff7f7 !important;
    }
    .package-remove-all:hover { border-color: var(--danger) !important; background: #fff0f0 !important; }

    .package-details summary { min-height: 56px !important; font-size: .94rem !important; }
    .package-details summary small { font-size: .84rem !important; }
    .package-seminar label { font-size: .94rem !important; }
    .package-label { font-size: .82rem !important; }

    /* More readable year decision. */
    .journey-year-tabs .tab {
      min-height: 118px;
      padding: 18px !important;
      cursor: pointer;
    }
    .journey-year-tabs .tab > span { font-size: 2.25rem !important; }
    .journey-year-tabs .tab small {
      width: 100%;
      color: var(--neutral-700) !important;
      font-size: 1rem !important;
      font-weight: 700 !important;
      line-height: 1.2;
    }
    .journey-year-tabs .tab:not(.active):hover {
      border-color: var(--primary-500) !important;
      background: var(--primary-50) !important;
      color: var(--primary-900) !important;
    }
    .journey-year-tabs .tab:not(.active):hover > span,
    .journey-year-tabs .tab:not(.active):hover small { color: var(--primary-900) !important; }
    .journey-year-tabs .tab.active small { color: var(--on-panel-dark) !important; }

    /* Consistent hover language: closed/available things visibly react, selected states remain stable. */
    .package-details summary,
    .journey-disclosure > summary,
    .year-exception-disclosure summary,
    .details-button,
    .journey-back,
    .career-row,
    .seminar-choice,
    .package-seminar,
    .matrix-header-filter,
    .catalog-matrix-hint { transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease, box-shadow 150ms ease !important; }
    .package-details summary:hover,
    .journey-disclosure > summary:hover,
    .year-exception-disclosure summary:hover {
      color: var(--primary-900) !important;
      background: var(--primary-50) !important;
    }
    .package-details summary:hover .package-details-arrow,
    .journey-disclosure > summary:hover .journey-disclosure-icon { border-color: var(--primary-500); background: var(--primary-100); }
    .seminar-choice:not(.selected):hover,
    .package-seminar:not(.selected):hover { border-color: var(--primary-400) !important; background: var(--primary-50) !important; }
    .details-button:hover { color: var(--primary-900) !important; border-color: var(--primary-500) !important; background: var(--primary-100) !important; }
    .matrix-header-filter:not(.active):hover { color: var(--primary-900) !important; border-color: var(--primary-500) !important; background: var(--primary-100) !important; }

    .journey-disclosure {
      border-color: var(--primary-300) !important;
      background: linear-gradient(135deg, var(--neutral-0), var(--primary-50)) !important;
    }
    .journey-disclosure > summary strong { font-size: 1.48rem !important; }
    .journey-disclosure > summary small { font-size: .94rem !important; }

    /* Natural page scrolling for the expert view. No separate vertical table scroller. */
    .catalog-matrix-frame { overflow: visible !important; }
    .catalog-matrix-wrap {
      max-height: none !important;
      overflow: visible !important;
      scrollbar-gutter: auto !important;
      overscroll-behavior: auto !important;
    }
    .catalog-matrix thead th {
      top: 66px !important;
      background: var(--neutral-50) !important;
      box-shadow: 0 1px 0 var(--neutral-300), 0 8px 18px rgba(var(--ink-rgb), .06) !important;
    }
    @media (max-width: 1399px) {
      .catalog-matrix-frame { overflow: hidden !important; }
      .catalog-matrix-wrap { overflow-x: auto !important; overflow-y: visible !important; }
    }

    /* Seminar details start loading immediately; if someone opens exceptionally fast, show no distracting status sentence. */
    .seminar-detail-skeleton { display: grid; gap: 8px; padding: 4px 0; }
    .seminar-detail-skeleton span {
      height: 9px;
      border-radius: 999px;
      background: var(--neutral-200);
      opacity: .72;
    }
    .seminar-detail-skeleton span:last-child { width: 68%; }

    /* Price calculator: two inputs, per-person calculation only. */
    .price-calculator-inputs {
      width: min(440px, 56%);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }
    .price-calculator-head label { width: auto !important; font-size: .86rem; }
    .price-calculator-result span { font-size: .82rem !important; }
    .price-calculator-result strong { font-size: 1.42rem !important; }
    .selection-price-estimate {
      margin-top: 10px !important;
      padding-top: 10px;
      border-top: 1px solid var(--neutral-200);
      color: var(--neutral-700) !important;
      font-size: .88rem !important;
    }
    .selection-price-estimate strong { display: inline !important; color: var(--primary-800); }
    .basket-selection-estimate {
      margin: 6px 0 0 !important;
      color: var(--primary-800) !important;
      font-size: .84rem !important;
      font-weight: 600;
    }

    /* Navigation in dialogs: back/cancel left, progress actions right. */
    .dialog-navigation-actions,
    .price-approval-actions { justify-content: space-between !important; align-items: center; }
    .dialog-navigation-actions .button-primary:last-child,
    .price-approval-actions .button-primary:last-child { margin-left: auto; }
    #seminarDialog .seminar-info-actions { justify-content: flex-end !important; }

    /* General readability in the main interaction areas. */
    #berufe .section-heading p,
    .career-chooser-copy p,
    .career-detail-header p,
    .builder-head p,
    .further-seminars .subheading p,
    .catalog-toolbar label,
    .catalog-status-row,
    .pricing-copy > p,
    .price-calculator > p,
    .contact-copy p,
    dialog .dialog-body { font-size: 1rem; }
    .career-row strong { font-size: 1.06rem !important; }
    .career-row small { font-size: .80rem !important; }
    .journey-step-label strong { font-size: 1.15rem !important; }
    .journey-step-label small { font-size: .88rem !important; }

    @media (max-width: 680px) {
      html { font-size: 16px; }
      .hero-product-steps > div { min-height: 118px; }
      .hero-product-steps small { display: block !important; font-size: .72rem !important; }
      .journey-year-tabs .tab { min-height: 78px; }
      .journey-year-tabs .tab small { width: auto; font-size: .98rem !important; }
      .package-actions-primary { grid-template-columns: 1fr !important; }
      .price-calculator-inputs { width: 100%; grid-template-columns: 1fr 1fr; }
      .dialog-navigation-actions { flex-direction: row !important; }
      .dialog-navigation-actions .button { flex: 1 1 0; width: auto !important; }
    }
    @media (max-width: 430px) {
      .dialog-navigation-actions { flex-direction: column !important; align-items: stretch !important; }
      .dialog-navigation-actions .button { width: 100% !important; }
      .dialog-navigation-actions .button-primary:last-child { margin-left: 0; }
    }


    .price-calculator-inputs { align-items: end; }
    .price-calculator-inputs label {
      min-width: 0;
      display: grid !important;
      grid-template-rows: minmax(42px, auto) 48px;
      align-items: end;
      gap: 7px;
      margin: 0 !important;
    }
    .price-calculator-inputs label > span {
      display: flex;
      align-items: flex-end;
      min-height: 42px;
      line-height: 1.25;
    }
    .price-calculator-inputs input {
      height: 48px;
      min-height: 48px !important;
      margin-top: 0 !important;
    }

    button.price-tier {
      width: 100%;
      appearance: none;
      font: inherit;
      cursor: pointer;
      transition: border-color 170ms ease, background-color 170ms ease, box-shadow 170ms ease, transform 170ms ease;
    }
    button.price-tier:hover:not(.is-selected),
    button.price-tier:focus-visible:not(.is-selected) {
      border-color: var(--accent-blue-500);
      background: var(--accent-blue-200);
      box-shadow: 0 8px 22px rgba(0,99,143,.10);
      outline: none;
    }
    button.price-tier.is-selected {
      color: var(--on-panel-dark);
      border-color: var(--primary-800);
      background: var(--primary-800);
      box-shadow: inset 0 0 0 1px var(--primary-700);
    }
    button.price-tier.is-selected span,
    button.price-tier.is-selected strong,
    button.price-tier.is-selected small { color: var(--on-panel-dark) !important; }

    /* Secondary actions react without turning every interaction green. */
    .button-secondary:not(:disabled):hover {
      color: var(--neutral-950) !important;
      border-color: var(--accent-blue-500) !important;
      background: var(--accent-blue-200) !important;
      box-shadow: 0 7px 18px rgba(0,99,143,.08) !important;
    }
    .button-quiet:not(.button-danger):not(:disabled):hover {
      color: var(--neutral-950) !important;
      border-color: var(--neutral-400) !important;
      background: var(--neutral-100) !important;
      box-shadow: 0 6px 16px rgba(var(--ink-rgb), .06) !important;
    }
    .year-intro-actions .button-secondary:not(:disabled):hover {
      color: var(--accent-violet-700) !important;
      border-color: var(--accent-violet-500) !important;
      background: var(--accent-violet-200) !important;
      box-shadow: 0 7px 18px rgba(89,79,149,.08) !important;
    }

    /* Rounded disclosures keep their hover wash inside their shape and use context-appropriate accents. */
    .package-details {
      border-top: 1px solid var(--neutral-200);
      border-radius: 14px;
      overflow: hidden;
    }
    .package-details summary { padding: 0 10px !important; border-radius: 13px; }
    .package-details summary:hover {
      color: var(--neutral-950) !important;
      background: var(--accent-blue-200) !important;
    }
    .package-details summary:hover .package-details-arrow {
      border-color: var(--accent-blue-500) !important;
      background: var(--neutral-0) !important;
    }
    .package-details[open] summary { border-radius: 13px 13px 8px 8px; }
    .package-details-body { padding-inline: 10px !important; }

    .journey-disclosure {
      border: 1px solid var(--accent-violet-200) !important;
      border-radius: 22px !important;
      overflow: hidden !important;
      background: var(--neutral-0) !important;
    }
    .journey-disclosure > summary {
      padding: 0 20px !important;
      border-radius: 21px;
      transition: background-color 170ms ease, color 170ms ease !important;
    }
    .journey-disclosure > summary:hover {
      color: var(--accent-violet-700) !important;
      background: rgba(210,207,255,.46) !important;
    }
    .journey-disclosure > summary:hover .journey-disclosure-icon {
      border-color: var(--accent-violet-500) !important;
      background: var(--neutral-0) !important;
    }
    .journey-disclosure[open] > summary {
      border-radius: 21px 21px 0 0;
      border-bottom: 1px solid var(--accent-violet-200);
    }
    .journey-disclosure-body { padding: 22px 20px 42px !important; }

    .year-exception-disclosure { border-radius: 14px; overflow: hidden; }
    .year-exception-disclosure summary:hover {
      color: var(--accent-violet-700) !important;
      background: rgba(210,207,255,.54) !important;
    }

    .details-button:hover,
    .matrix-header-filter:not(.active):hover {
      color: var(--accent-blue-700) !important;
      border-color: var(--accent-blue-500) !important;
      background: var(--accent-blue-200) !important;
    }

    #basketDialog .basket-total {
      display: grid !important;
      grid-template-columns: minmax(0,.72fr) minmax(260px,1.28fr);
      gap: 14px !important;
      padding: 16px !important;
      background: var(--neutral-100) !important;
    }
    .basket-total-overview,
    .basket-total-estimate {
      min-width: 0;
      display: grid;
      align-content: center;
      gap: 4px;
      padding: 12px 14px;
      border: 1px solid var(--neutral-200);
      border-radius: 13px;
      background: var(--neutral-0);
    }
    .basket-total-overview span,
    .basket-total-estimate span { color: var(--neutral-600); font-size: .82rem; font-weight: 650; }
    .basket-total-overview strong { color: var(--neutral-900); font-size: 1.08rem !important; }
    .basket-total-estimate strong { color: var(--primary-800); font-family: var(--font-heading) !important; font-size: 1.34rem !important; }
    .basket-total-estimate small { color: var(--neutral-600); font-size: .76rem; line-height: 1.35; }

    @media (max-width: 760px) {
      #basketDialog .basket-total { grid-template-columns: 1fr; }
      .price-calculator-inputs label { grid-template-rows: minmax(38px, auto) 48px; }
      .price-calculator-inputs label > span { min-height: 38px; }
    }
    @media (max-width: 430px) {
      .price-calculator-inputs label { grid-template-rows: auto 48px; }
      .price-calculator-inputs label > span { min-height: 0; }
    }

/* More air between the hero statement and its 01/02/03 area. */
    .hero-product-copy { padding-bottom: 28px !important; }

    /* Explain multi-group / individual planning without adding another decision step. */
    .planning-flexibility-note {
      display: grid;
      grid-template-columns: 38px minmax(0,1fr);
      gap: 14px;
      align-items: start;
      margin: 18px 0 34px;
      padding: 17px 19px;
      border: 1px solid var(--neutral-200);
      border-radius: 18px;
      color: var(--neutral-700);
      background: var(--neutral-50);
    }
    .planning-flexibility-icon {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      border-radius: 11px;
      color: var(--primary-900);
      background: var(--primary-100);
      font-size: 1rem;
      font-weight: 800;
    }
    .planning-flexibility-note strong { display: block; margin: 1px 0 4px; color: var(--neutral-950); font-family: var(--font-heading) !important; font-size: 1.02rem; }
    .planning-flexibility-note p { max-width: 980px; margin: 0; font-size: .91rem; line-height: 1.55; }

    /* Restore the softly violet optional route. The whole header reaches the outer frame. */
    .journey-disclosure {
      padding: 0 !important;
      background: rgba(210,207,255,.28) !important;
      border-color: var(--accent-violet-200) !important;
    }
    .journey-disclosure > summary {
      width: 100%;
      min-height: 104px !important;
      margin: 0 !important;
      padding: 20px 22px !important;
      border-radius: 21px !important;
      background: transparent !important;
    }
    .journey-disclosure > summary:hover { background: rgba(210,207,255,.58) !important; }
    .journey-disclosure[open] > summary { border-radius: 21px 21px 0 0 !important; }
    .journey-disclosure-body { padding: 22px 22px 42px !important; background: var(--neutral-0); }

    /* Package disclosure arrow mirrors the quieter rounded-square year disclosure. */
    .package-details summary { grid-template-columns: minmax(0,1fr) 30px !important; }
    .package-details-arrow {
      width: 30px !important;
      height: 30px !important;
      border: 0 !important;
      border-radius: 8px !important;
      color: var(--accent-blue-700) !important;
      background: var(--accent-blue-200) !important;
      font-size: 1rem;
    }
    .package-details summary:hover .package-details-arrow { color: var(--accent-blue-700) !important; border: 0 !important; background: var(--accent-blue-200) !important; }

    .year-exception-content p { margin: 0 0 12px; }
    .year-exception-catalog-button { min-height: 40px !important; padding-inline: 13px !important; }

    /* The package list scrolls; estimate and navigation stay visible. */
    #basketDialog .basket-dialog-body {
      display: grid !important;
      grid-template-rows: minmax(0,1fr) auto;
      min-height: 0;
      max-height: min(690px, calc(100vh - 120px));
      padding: 0 !important;
      overflow: hidden !important;
      background: var(--neutral-50) !important;
    }
    #basketDialog .basket-list {
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      padding: 20px 24px 18px;
    }
    #basketDialog .basket-sticky-footer {
      position: relative;
      z-index: 2;
      padding: 0 24px 22px;
      border-top: 1px solid var(--neutral-200);
      background: var(--neutral-50);
      box-shadow: 0 -12px 28px rgba(var(--ink-rgb), .06);
    }
    #basketDialog .basket-total { margin-top: 14px !important; }
    #basketDialog .basket-sticky-footer .dialog-actions { margin-top: 12px; }

    /* Catalog -> guided-plan transfer review. */
    .mode-switch-dialog { width: min(880px, calc(100vw - 28px)); }
    .mode-switch-body { display: grid; gap: 17px; }
    .mode-switch-intro { margin: 0; color: var(--neutral-700); line-height: 1.55; }
    .mode-switch-target-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .mode-switch-target-grid label { display: grid; gap: 6px; margin: 0; color: var(--neutral-700); font-size: .83rem; font-weight: 700; }
    .mode-switch-target-grid select { width: 100%; }
    .mode-switch-review-head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding-top: 4px; }
    .mode-switch-review-head strong { color: var(--neutral-950); font-family: var(--font-heading) !important; font-size: 1.03rem; }
    .mode-switch-review-head span { color: var(--neutral-600); font-size: .78rem; }
    .mode-switch-seminar-list { display: grid; gap: 7px; max-height: 300px; overflow-y: auto; padding-right: 3px; }
    .mode-switch-seminar {
      display: grid;
      grid-template-columns: minmax(0,1fr) minmax(120px,.42fr);
      gap: 12px;
      align-items: center;
      padding: 11px 12px;
      border: 1px solid var(--neutral-200);
      border-radius: 12px;
      background: var(--neutral-0);
    }
    .mode-switch-seminar > div { min-width: 0; display: flex; gap: 8px; align-items: baseline; }
    .mode-switch-seminar-id { flex: 0 0 auto; color: var(--neutral-500); font-size: .72rem; font-weight: 800; }
    .mode-switch-seminar strong { min-width: 0; color: var(--neutral-900); font-size: .88rem; }
    .mode-switch-status { justify-self: end; color: var(--neutral-600); font-size: .75rem; text-align: right; line-height: 1.3; }
    .mode-switch-seminar.is-compatible { border-color: var(--primary-300); background: var(--primary-50); }
    .mode-switch-seminar.is-compatible .mode-switch-status { color: var(--primary-800); font-weight: 750; }
    .mode-switch-seminar.is-incompatible { border-color: var(--accent-violet-200); background: rgba(210,207,255,.24); }
    .mode-switch-seminar.is-incompatible .mode-switch-status { color: var(--accent-violet-700); }
    .mode-switch-exception-option {
      display: grid;
      grid-template-columns: auto minmax(0,1fr);
      gap: 11px;
      align-items: start;
      margin: 0;
      padding: 13px 14px;
      border: 1px solid var(--accent-violet-200);
      border-radius: 13px;
      background: rgba(210,207,255,.24);
      cursor: pointer;
    }
    .mode-switch-exception-option input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--accent-violet-700); }
    .mode-switch-exception-option span { display: grid; gap: 3px; }
    .mode-switch-exception-option strong { color: var(--neutral-900); font-size: .88rem; }
    .mode-switch-exception-option small { color: var(--neutral-600); font-size: .78rem; line-height: 1.4; }
    #modeSwitchDialog .dialog-close { color: var(--on-panel-dark) !important; background: var(--danger) !important; border-color: var(--danger) !important; }

    @media (max-width: 680px) {
      .planning-flexibility-note { grid-template-columns: 32px minmax(0,1fr); padding: 14px; }
      .planning-flexibility-icon { width: 30px; height: 30px; }
      #basketDialog .basket-dialog-body { max-height: calc(100dvh - 92px); }
      #basketDialog .basket-list { padding: 14px 12px 12px; }
      #basketDialog .basket-sticky-footer { padding: 0 12px 12px; }
      .mode-switch-target-grid { grid-template-columns: 1fr; }
      .mode-switch-seminar { grid-template-columns: 1fr; gap: 5px; }
      .mode-switch-status { justify-self: start; text-align: left; }
    }


    .hero-v14 {
      background: linear-gradient(180deg, var(--neutral-50) 0%, var(--primary-50) 100%) !important;
      border-bottom-color: var(--neutral-200) !important;
    }

    /* The expanded 200 € explanation stays compact but readable. */
    .hero-price-anchor {
      width: min(100%, 650px) !important;
      display: grid !important;
      gap: 7px !important;
      padding: 13px 15px !important;
      border: 1px solid var(--primary-200) !important;
      border-radius: 14px !important;
      background: var(--neutral-0) !important;
      text-align: left !important;
    }
    .hero-price-main { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 8px; }
    .hero-price-main > span { color: var(--neutral-700); font-size: .94rem; font-weight: 650; }
    .hero-price-anchor strong { color: var(--primary-800) !important; }
    .hero-price-rule { display: block; color: var(--neutral-700); font-size: .82rem; line-height: 1.45; }
    .hero-price-rule b { color: var(--neutral-950); }
    .hero-price-anchor:hover { border-color: var(--primary-500) !important; background: var(--primary-100) !important; }

    /* "Eine Anfrage kann mehrere …" keeps the violet friendly surface. */
    .planning-flexibility-note {
      border-color: var(--accent-violet-200) !important;
      background: linear-gradient(135deg, var(--neutral-0), var(--accent-violet-200)) !important;
    }
    .planning-flexibility-icon {
      color: var(--accent-violet-700) !important;
      background: var(--neutral-0) !important;
    }


    .pricing-section { background: var(--neutral-100) !important; }
    .pricing-copy {
      color: var(--neutral-900) !important;
      background: linear-gradient(145deg, var(--neutral-0), var(--primary-50)) !important;
      border-color: var(--primary-200) !important;
    }
    .pricing-copy h3 { color: var(--neutral-950) !important; }
    .pricing-copy > p { color: var(--neutral-700) !important; opacity: 1 !important; }
    .pricing-copy .pricing-kicker { color: var(--primary-800) !important; border-color: var(--primary-200) !important; }
    .pricing-copy .pricing-tax-note { color: var(--neutral-700) !important; }
    .pricing-custom-note {
      border-color: var(--accent-blue-200) !important;
      background: var(--accent-blue-200) !important;
      color: var(--neutral-800) !important;
    }
    .pricing-custom-note strong { color: var(--accent-blue-700) !important; }
    .pricing-panel { background: var(--neutral-0) !important; border-color: var(--neutral-200) !important; }

    /* Planning completion: retain the friendly light closing surface only. */
    #anfrage { background: var(--neutral-0) !important; }
    .contact-shell {
      color: var(--neutral-900) !important;
      border: 1px solid var(--accent-blue-200) !important;
      background: linear-gradient(145deg, var(--neutral-0), var(--primary-50), var(--accent-blue-200)) !important;
    }
    .contact-copy h2 { color: var(--neutral-950) !important; }
    .contact-copy > p { color: var(--neutral-700) !important; }
    .contact-point { color: var(--neutral-800) !important; }

    @media (max-width: 680px) {
      .hero-price-anchor { width: 100% !important; }
    }


    @media (max-width: 760px) {
      html,
      body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: clip !important;
      }

      body,
      header,
      main,
      footer,
      section,
      .container,
      .hero-grid,
      .hero-product,
      .hero-product-copy,
      .hero-product-steps,
      .planner-stage-strip,
      .seminar-view-switch,
      .career-chooser,
      .career-list,
      .career-detail,
      .year-panel,
      .package-section,
      .package-grid,
      .recommendation-card,
      .journey-disclosure,
      .journey-disclosure-body,
      .further-seminars,
      .builder,
      .catalog-shell,
      .catalog-toolbar,
      .catalog-status-row,
      .pricing-shell,
      .pricing-copy,
      .pricing-panel,
      .price-calculator,
      .contact-shell,
      .contact-form,
      .form-grid {
        min-width: 0 !important;
        max-width: 100% !important;
      }

      .container {
        width: calc(100% - 24px) !important;
      }

      h1, h2, h3, h4, h5, h6,
      p, small, strong, span, label,
      .button, button,
      .career-row,
      .seminar-choice,
      .package-seminar,
      .catalog-card,
      .contact-point {
        overflow-wrap: anywhere;
        word-break: normal;
      }

      img, svg, video, iframe {
        max-width: 100%;
      }

      /* The product explainer remains readable instead of squeezing three columns. */
      .hero-product { min-height: 0 !important; }
      .hero-product-steps {
        grid-template-columns: 1fr !important;
      }
      .hero-product-steps > div,
      .hero-product-steps > div + div {
        min-height: 0 !important;
        padding: 15px 0 !important;
        border-left: 0 !important;
        border-top: 1px solid var(--neutral-300);
      }
      .hero-product-steps > div:first-child { border-top: 0; }

      .planning-flexibility-note,
      .career-selection-summary,
      .career-row,
      .journey-explainer-steps > div,
      .basket-total,
      .mode-switch-seminar,
      .selection-edit-item {
        min-width: 0 !important;
      }

      .journey-disclosure > summary,
      .package-details summary,
      .year-exception-disclosure summary {
        max-width: 100%;
      }

      .price-tier-grid,
      .price-calculator-inputs,
      .dialog-form-grid,
      .mode-switch-target-grid {
        min-width: 0 !important;
        max-width: 100% !important;
      }

      /* Every popup uses the actual mobile viewport width. */
      dialog, dialog.wide, .price-approval-dialog, .mode-switch-dialog, #selectionEditDialog, #seminarDialog, #addDialog, #basketDialog, #priceApprovalDialog, #modeSwitchDialog {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        min-width: 0 !important;
        max-height: calc(100dvh - 16px) !important;
        border-radius: 18px !important;
      }

      dialog[open] {
        grid-template-columns: minmax(0, 1fr) !important;
      }

      dialog .dialog-head,
      dialog .dialog-head > div,
      dialog .dialog-body,
      dialog .dialog-body > *,
      dialog .dialog-actions,
      dialog .dialog-form-grid,
      dialog fieldset,
      dialog label,
      dialog input,
      dialog select,
      dialog textarea {
        min-width: 0 !important;
        max-width: 100% !important;
      }

      dialog .dialog-head {
        width: 100%;
        padding: 14px 13px 11px !important;
      }
      dialog .dialog-head > div { flex: 1 1 auto; }
      dialog .dialog-head h3 {
        max-width: 100%;
        font-size: clamp(1.22rem, 6vw, 1.62rem) !important;
        overflow-wrap: anywhere;
      }
      dialog .dialog-body {
        width: 100% !important;
        padding: 13px !important;
        overflow-x: hidden !important;
      }

      #selectionEditDialog .selection-edit-list,
      #modeSwitchDialog .mode-switch-seminar-list,
      #basketDialog .basket-list {
        width: 100%;
        min-width: 0;
        max-width: 100%;
      }

      #selectionEditDialog .selection-edit-footer,
      #selectionEditDialog .selection-edit-actions,
      #modeSwitchDialog .mode-switch-actions,
      #priceApprovalDialog .price-approval-actions {
        width: 100%;
        min-width: 0;
      }

      #basketDialog .basket-dialog-body {
        width: 100% !important;
        max-width: 100% !important;
        max-height: calc(100dvh - 82px) !important;
      }
      #basketDialog .basket-list {
        padding: 12px !important;
      }
      #basketDialog .basket-sticky-footer {
        width: 100%;
        min-width: 0;
        padding: 0 12px calc(12px + env(safe-area-inset-bottom)) !important;
      }
      #basketDialog .basket-total,
      #basketDialog .basket-total-overview,
      #basketDialog .basket-total-estimate {
        width: 100%;
        min-width: 0 !important;
        max-width: 100% !important;
      }

      .price-approval-options { width: 100%; }
      .price-approval-option {
        width: 100%;
        min-width: 0;
        grid-template-columns: 20px minmax(0, 1fr) !important;
      }

      /* The selection panel is a full-width mobile control, not a narrow desktop card. */
      .selection-tray,
      html.seminarplaner-autoheight .selection-tray {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        min-width: 0 !important;
        right: 8px !important;
        left: auto !important;
        padding: 12px !important;
        border-radius: 16px !important;
      }
      .selection-tray-top,
      .selection-tray-top > div,
      .selection-tray-actions {
        min-width: 0 !important;
        max-width: 100% !important;
      }
      .selection-tray p,
      .selection-tray strong { overflow-wrap: anywhere; }
      .selection-tray-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 7px !important;
      }
      .selection-tray .button,
      html.seminarplaner-autoheight .selection-tray .button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 40px !important;
        padding: 7px 8px !important;
        font-size: .76rem !important;
        white-space: normal !important;
      }

      .selection-notice {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        right: 10px !important;
      }
    }

    @media (max-width: 430px) {
      .container { width: calc(100% - 18px) !important; }
      .selection-tray-actions { grid-template-columns: 1fr !important; }
      .planning-flexibility-note { grid-template-columns: 1fr !important; }
      .planning-flexibility-icon { margin-bottom: 2px; }
      .journey-explainer-steps > div {
        grid-template-columns: 30px minmax(0, 1fr) !important;
        gap: 9px !important;
      }
    }


    #seminarDialog[open] {
      min-height: var(--seminar-dialog-stable-height, 0px) !important;
      overflow: hidden !important;
    }
    #seminarDialog[open] .dialog-body.seminar-info-layout {
      min-height: 0 !important;
      overflow: hidden !important;
    }
    #seminarDialog[open] .seminar-info-scroll {
      min-height: 0 !important;
      overflow-y: auto !important;
      overscroll-behavior: contain;
    }
    @media (min-width: 761px) and (max-width: 1100px) {
      #seminarDialog {
        width: min(680px, calc(100vw - 32px));
      }
    }

/* Keep the calculator fields aligned and prevent overlap on tablet widths. */
    .price-calculator-inputs {
      min-width: 0;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .price-calculator-inputs label,
    .price-calculator-inputs label > span,
    .price-calculator-inputs input {
      min-width: 0;
      max-width: 100%;
    }
    .price-calculator-inputs input {
      box-sizing: border-box;
    }

    @media (max-width: 1024px) {
      .price-calculator-head {
        flex-direction: column;
        align-items: stretch;
      }
      .price-calculator-inputs {
        width: 100% !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 430px) {
      .price-calculator-inputs {
        grid-template-columns: 1fr;
      }
    }


    :is(#addDialog, #basketDialog, #priceApprovalDialog, #selectionEditDialog, #modeSwitchDialog, #planExportDialog, #planImportDialog) {
      width: min(780px, calc(100vw - 28px));
      min-width: 0;
      max-width: calc(100vw - 20px);
      overflow: hidden !important;
    }

    :is(#addDialog, #priceApprovalDialog, #planExportDialog, #planImportDialog)[open] .dialog-body.request-flow-body {
      display: grid !important;
      grid-template-rows: minmax(0, 1fr) auto !important;
      min-height: 0 !important;
      padding: 0 !important;
      overflow: hidden !important;
      background: var(--neutral-0);
    }

    .request-flow-scroll {
      min-width: 0;
      min-height: 0;
      max-width: 100%;
      padding: 20px 24px;
      overflow-x: hidden;
      overflow-y: auto;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
    }

    .request-flow-footer {
      position: relative !important;
      inset: auto !important;
      z-index: 4;
      flex: 0 0 auto;
      width: 100%;
      min-width: 0;
      margin: 0 !important;
      padding: 14px 24px calc(16px + env(safe-area-inset-bottom));
      border-top: 1px solid var(--neutral-200);
      background: var(--neutral-0) !important;
      box-shadow: 0 -12px 28px rgba(var(--ink-rgb), .06);
    }

    #selectionEditDialog .dialog-body {
      display: grid !important;
      grid-template-rows: auto minmax(0, 1fr) auto !important;
      min-height: 0 !important;
      overflow: hidden !important;
    }
    #selectionEditDialog .selection-edit-list {
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
    }
    #selectionEditDialog .selection-edit-footer {
      position: relative;
      z-index: 3;
      background: var(--neutral-0);
    }

    #basketDialog .basket-dialog-body {
      max-height: none !important;
    }

    /* In an auto-height WordPress iframe, 100vh is the iframe height rather than
       the visible browser area. The host viewport value below is therefore used
       for the inner dialog body on phones/tablets. */
    html.seminarplaner-autoheight :is(#addDialog, #basketDialog, #priceApprovalDialog, #selectionEditDialog, #modeSwitchDialog, #planExportDialog, #planImportDialog)[open] .dialog-body {
      max-height: calc(var(--request-flow-visible-height, 700px) - 86px) !important;
    }

    @media (max-width: 900px) {
      :is(#addDialog, #basketDialog, #priceApprovalDialog, #selectionEditDialog, #modeSwitchDialog, #planExportDialog, #planImportDialog) {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        border-radius: 18px !important;
      }
      .request-flow-scroll { padding: 16px; }
      .request-flow-footer { padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); }
      #addDialog .dialog-form-grid { grid-template-columns: 1fr !important; }
      #addDialog .dialog-form-grid .full { grid-column: auto !important; }
      #addDialog input, #addDialog select,
      #priceApprovalDialog input, #priceApprovalDialog select {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
      }
    }

    @media (max-width: 520px) {
      :is(#addDialog, #basketDialog, #priceApprovalDialog, #selectionEditDialog, #modeSwitchDialog, #planExportDialog, #planImportDialog) {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        border-radius: 16px !important;
      }
      .request-flow-scroll { padding: 13px; }
      .request-flow-footer {
        display: grid !important;
        grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
        gap: 8px !important;
        padding: 10px 13px calc(12px + env(safe-area-inset-bottom));
      }
      .request-flow-footer .button {
        width: 100%;
        min-width: 0;
        white-space: normal;
      }
    }

    @media (max-width: 390px) {
      .request-flow-footer { grid-template-columns: 1fr !important; }
    }


    h1, h2, h3 {
      letter-spacing: -0.018em !important;
    }
    h4, h5, h6 {
      letter-spacing: -0.005em !important;
    }

    /* Small orientation labels get a little more tracking for quicker scanning. */
    .eyebrow,
    .planner-kicker,
    .hero-product-kicker,
    .recommendation-kicker,
    .pricing-kicker,
    .package-label,
    .career-code {
      letter-spacing: 0.095em !important;
    }

    /* Keep both calculator labels in the same reserved label area.
       The company-wide qualifier gets its own line instead of colliding with the input. */
    .price-calculator-inputs {
      align-items: stretch !important;
    }
    .price-calculator-inputs label {
      grid-template-rows: minmax(58px, auto) 48px !important;
      align-items: stretch !important;
    }
    .price-calculator-inputs label > span {
      min-height: 58px !important;
      display: grid !important;
      align-content: end;
      gap: 3px;
      overflow: visible;
      line-height: 1.22;
    }
    .price-calculator-inputs label > span b {
      display: block;
      color: var(--neutral-600);
      font-size: 0.76rem;
      font-weight: 650;
      line-height: 1.15;
      letter-spacing: 0.035em;
    }

    @media (max-width: 430px) {
      .price-calculator-inputs label {
        grid-template-rows: auto 48px !important;
      }
      .price-calculator-inputs label > span {
        min-height: 0 !important;
      }
    }


    button, .button, select, input, .catalog-select-control, .seminar-view-switch button {
      touch-action: manipulation;
    }

    .catalog-card { cursor: default !important; }
    .catalog-select-button {
      width: 100%;
      min-height: 46px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      border: 1px solid var(--neutral-300);
      border-radius: 12px;
      color: var(--neutral-800);
      background: var(--neutral-50);
      cursor: pointer;
      font-size: .84rem;
      font-weight: 700;
    }
    .catalog-select-button:hover,
    .catalog-select-button:focus-visible {
      border-color: var(--primary-500);
      background: var(--primary-50);
      outline: none;
    }
    .catalog-card.selected .catalog-select-button {
      border-color: var(--primary-500);
      color: var(--primary-900);
      background: var(--primary-100);
    }
    .catalog-select-icon {
      display: inline-grid;
      place-items: center;
      width: 22px;
      height: 22px;
      flex: 0 0 22px;
      border-radius: 7px;
      background: var(--neutral-0);
      font-size: .95rem;
      line-height: 1;
    }

    .catalog-matrix-select-button {
      width: 34px;
      min-width: 34px;
      height: 34px;
      min-height: 34px;
      padding: 0;
      border: 1px solid var(--neutral-300);
      border-radius: 9px;
      color: var(--neutral-700);
      background: var(--neutral-0);
      cursor: pointer;
      font-weight: 800;
    }
    tr.selected .catalog-matrix-select-button {
      border-color: var(--primary-500);
      color: var(--primary-900);
      background: var(--primary-100);
    }

    #modeSwitchDialog[open] .dialog-body.request-flow-body {
      display: grid !important;
      grid-template-rows: minmax(0, 1fr) auto !important;
      min-height: 0 !important;
      padding: 0 !important;
      overflow: hidden !important;
      background: var(--neutral-0);
    }
    #modeSwitchDialog .mode-switch-scroll {
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior: contain;
    }
    #modeSwitchDialog .mode-switch-seminar-list {
      max-height: none;
      overflow: visible;
      padding-right: 0;
    }
    #modeSwitchDialog .mode-switch-actions {
      position: relative !important;
      inset: auto !important;
      z-index: 4;
      margin: 0 !important;
      border-top: 1px solid var(--neutral-200);
      background: var(--neutral-0) !important;
    }

    /* A hidden/stale embed overlay must never remain interactive after the dialog
       itself is gone. */
    html.seminarplaner-autoheight #seminarplaner-modal-overlay:not(.active) {
      display: none !important;
      pointer-events: none !important;
    }
    html.seminarplaner-autoheight #seminarplaner-modal-overlay.active {
      pointer-events: auto !important;
    }

    @media (max-width: 900px) {
      .catalog-card-actions,
      .catalog-select-button { width: 100%; }
      #modeSwitchDialog .mode-switch-target-grid { grid-template-columns: 1fr !important; }
      #modeSwitchDialog .mode-switch-review-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
      }
      #modeSwitchDialog .request-flow-footer {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 8px !important;
      }
      #modeSwitchDialog .request-flow-footer .button {
        width: 100%;
        min-width: 0;
        white-space: normal;
      }
    }
    @media (max-width: 480px) {
      #modeSwitchDialog .request-flow-footer { grid-template-columns: 1fr !important; }
    }


    @media (min-width: 981px) {
      .hero-v14 .hero-grid {
        grid-template-columns: minmax(0, 1.04fr) minmax(420px, .96fr) !important;
        gap: clamp(44px, 5vw, 72px) !important;
      }
      .hero-product,
      .hero-product-copy {
        min-width: 0 !important;
        max-width: 100% !important;
      }
      .hero-product-copy {
        width: 100% !important;
        padding-right: clamp(0px, 1.8vw, 22px) !important;
      }
      .hero-product-copy h3 {
        width: 100%;
        max-width: 100%;
        font-size: clamp(2.15rem, 3.15vw, 3.2rem) !important;
        line-height: 1.01 !important;
        overflow-wrap: break-word;
        word-break: normal;
        hyphens: auto;
      }
    }

    /* Tablet: fixed navigation should be present, but only as tall as needed. */
    @media (min-width: 681px) and (max-width: 1100px) {
      .request-flow-footer {
        min-height: 0 !important;
        gap: 8px !important;
        padding: 8px 14px calc(9px + env(safe-area-inset-bottom)) !important;
        box-shadow: 0 -7px 18px rgba(var(--ink-rgb), .045) !important;
      }
      .request-flow-footer .button,
      #basketDialog .basket-sticky-footer .button,
      #selectionEditDialog .selection-edit-footer .button,
      #modeSwitchDialog .mode-switch-actions .button {
        min-height: 38px !important;
        padding: 7px 11px !important;
        font-size: .80rem !important;
        line-height: 1.2 !important;
      }

      #selectionEditDialog .selection-edit-footer {
        gap: 8px !important;
        padding-top: 8px !important;
      }
      #selectionEditDialog .selection-edit-actions {
        gap: 6px !important;
      }
      #selectionEditDialog .selection-edit-count {
        font-size: .78rem !important;
      }

      #basketDialog .basket-sticky-footer {
        padding: 0 14px calc(10px + env(safe-area-inset-bottom)) !important;
        box-shadow: 0 -7px 18px rgba(var(--ink-rgb), .045) !important;
      }
      #basketDialog .basket-total {
        gap: 8px !important;
        margin-top: 8px !important;
        padding: 8px !important;
      }
      #basketDialog .basket-total-overview,
      #basketDialog .basket-total-estimate {
        gap: 2px !important;
        padding: 7px 9px !important;
        border-radius: 10px !important;
      }
      #basketDialog .basket-total-overview span,
      #basketDialog .basket-total-estimate span {
        font-size: .73rem !important;
      }
      #basketDialog .basket-total-overview strong {
        font-size: .94rem !important;
      }
      #basketDialog .basket-total-estimate strong {
        font-size: 1.08rem !important;
      }
      #basketDialog .basket-total-estimate small {
        font-size: .68rem !important;
        line-height: 1.25 !important;
      }
      #basketDialog .basket-sticky-footer .dialog-actions {
        gap: 8px !important;
        margin-top: 8px !important;
      }

      #modeSwitchDialog .mode-switch-actions,
      #priceApprovalDialog .price-approval-actions {
        margin-top: 0 !important;
      }
    }


    @media (min-width: 981px) {
      .hero-v14 .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: clamp(46px, 5vw, 76px) !important;
        align-items: stretch !important;
      }
      .hero-editorial {
        min-width: 0;
        height: 100%;
      }
      .hero-product {
        width: 100%;
        min-width: 0 !important;
        min-height: 100% !important;
        height: 100%;
        align-self: stretch;
      }
      .hero-product-copy {
        width: 100% !important;
        max-width: none !important;
        padding-right: 0 !important;
      }
      .hero-product-copy h3 {
        width: 100%;
        max-width: 100%;
        font-size: clamp(2.45rem, 3.55vw, 3.6rem) !important;
        line-height: 1.01 !important;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: auto;
      }
    }


    @media (min-width: 981px) {
      .hero-v14 .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: clamp(46px, 5vw, 76px) !important;
        align-items: start !important;
      }
      .hero-editorial {
        height: auto !important;
      }
      .hero-product {
        width: 100%;
        min-height: 0 !important;
        height: auto !important;
        align-self: start !important;
        margin-top: 38px;
        padding: 24px 26px !important;
      }
      .hero-product-copy {
        width: 100% !important;
        max-width: 430px !important;
        margin: 24px 0 22px;
        padding-right: 0 !important;
      }
      .hero-product-copy h3 {
        margin-top: 10px !important;
        font-size: clamp(2.15rem, 2.75vw, 2.8rem) !important;
        line-height: 1.02 !important;
        letter-spacing: -.045em !important;
        overflow-wrap: normal;
        word-break: normal;
      }
      .hero-product-steps > div {
        min-height: 92px !important;
        padding-top: 13px !important;
        padding-bottom: 12px !important;
      }
      .hero-product-footer {
        margin-top: 18px;
      }
    }


    @media (min-width: 981px) {
      .hero-v14 .hero-grid {
        align-items: start !important;
      }
      .hero-product {
        box-sizing: border-box;
        min-height: 0 !important;
        max-height: none !important;
        margin-top: var(--hero-product-offset, 0px) !important;
        height: var(--hero-product-match-height, auto) !important;
        padding: clamp(22px, 2.2vw, 30px) !important;
        justify-content: space-between !important;
      }
      .hero-product-copy {
        width: 100% !important;
        max-width: none !important;
        margin: clamp(16px, 2.1vh, 24px) 0 clamp(14px, 1.9vh, 22px) !important;
        padding: 0 !important;
      }
      .hero-product-copy h3 {
        max-width: 100% !important;
        margin-top: 9px !important;
        font-size: clamp(2.1rem, 2.7vw, 3.05rem) !important;
        line-height: 1.01 !important;
        letter-spacing: -.045em !important;
        hyphens: none !important;
        -webkit-hyphens: none !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
        text-wrap: balance;
      }
      .hero-product-steps > div {
        min-height: 0 !important;
        padding-top: clamp(11px, 1.4vw, 16px) !important;
        padding-bottom: clamp(10px, 1.3vw, 15px) !important;
      }
      .hero-product-footer {
        margin-top: clamp(12px, 1.6vw, 18px) !important;
      }
    }

    /* Never split words in this prominent statement, including stacked tablet/mobile layouts. */
    .hero-product-copy h3 {
      hyphens: none !important;
      -webkit-hyphens: none !important;
      word-break: keep-all !important;
      overflow-wrap: normal !important;
    }

/* Tablet filter layout: search spans the width, remaining filters no longer squeeze into four columns. */
    @media (min-width: 681px) and (max-width: 900px) {
      .catalog-toolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
      }
      .catalog-toolbar .catalog-filter { min-width: 0 !important; }
      .catalog-toolbar .catalog-filter:first-child,
      .catalog-toolbar .catalog-filter:last-child { grid-column: 1 / -1; }
      .catalog-filter input,
      .catalog-filter select { min-width: 0 !important; max-width: 100% !important; }
    }

    /* In auto-height embeds the host page scrolls, so the bridge moves the matrix header. */
    html.seminarplaner-autoheight .catalog-matrix thead th {
      position: relative !important;
      top: auto !important;
      z-index: 9 !important;
      background: var(--neutral-50) !important;
      box-shadow: 0 1px 0 var(--neutral-300), 0 8px 18px rgba(var(--ink-rgb), .06) !important;
      will-change: transform;
    }

    .planning-format-note {
      margin-top: 10px !important;
      color: var(--neutral-700) !important;
    }
    .pricing-custom-note { scroll-margin-top: 92px; }
    .pricing-custom-link {
      display: inline-flex;
      width: fit-content;
      margin-top: 11px;
      color: var(--accent-blue-700);
      font-weight: 750;
      text-decoration: underline;
      text-underline-offset: 3px;
    }
    .contact-format-note {
      padding: 11px 12px;
      border: 1px solid var(--accent-blue-200);
      border-radius: 11px;
      color: var(--neutral-700);
      background: var(--neutral-50);
      font-size: .84rem;
      line-height: 1.45;
    }
    .contact-format-note strong { color: var(--neutral-900); }

    /* iPad safe-area padding inside an iframe created the visible empty strip below fixed actions. */
    @media (min-width: 681px) and (max-width: 1100px) {
      .request-flow-footer {
        padding: 6px 12px 4px !important;
      }
      #basketDialog .basket-sticky-footer {
        padding: 0 12px 4px !important;
      }
      #selectionEditDialog .dialog-body {
        padding-bottom: 4px !important;
      }
      #selectionEditDialog .selection-edit-footer {
        padding-top: 6px !important;
        padding-bottom: 0 !important;
      }
      #basketDialog .basket-sticky-footer .dialog-actions { margin-bottom: 0 !important; }
    }

    @media (max-width: 680px) {
      .hero-actions .hero-custom-action { width: 100%; }
      .contact-format-note { font-size: .80rem; }
    }

.planning-individual-action {
      width: fit-content;
      margin-top: 11px;
    }
    .planning-format-note a {
      color: var(--accent-blue-700);
      font-weight: 750;
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    .catalog-matrix-frame { position: relative; }
    .catalog-matrix-floating-head {
      background: var(--neutral-50);
      box-shadow: 0 8px 18px rgba(var(--ink-rgb), .08);
    }
    .catalog-matrix-floating-head .catalog-matrix {
      margin: 0 !important;
      background: var(--neutral-0);
    }
    .catalog-matrix-floating-head .catalog-matrix thead th {
      position: static !important;
      top: auto !important;
      transform: none !important;
      background: var(--neutral-50) !important;
      box-shadow: 0 1px 0 var(--neutral-300) !important;
    }

    @media (max-width: 900px) {
      .catalog-filter.catalog-filter-compact { position: relative; }
      .catalog-filter.catalog-filter-compact select {
        color: transparent !important;
        -webkit-text-fill-color: transparent !important;
        text-shadow: none !important;
      }
      .catalog-filter.catalog-filter-compact select option {
        color: var(--ink) !important;
        -webkit-text-fill-color: var(--ink) !important;
      }
      .catalog-filter.catalog-filter-compact::after {
        content: attr(data-compact-label);
        position: absolute;
        z-index: 2;
        right: 35px;
        bottom: 0;
        left: 12px;
        height: 44px;
        display: flex;
        align-items: center;
        overflow: hidden;
        pointer-events: none;
        color: var(--ink);
        font-size: .86rem;
        font-weight: 650;
        line-height: 1;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
    }

    /* The footer itself ends directly after the buttons. Short dialogs are no
       longer stretched to the maximum tablet viewport height. */
    @media (min-width: 681px) and (max-width: 1100px) {
      :is(#addDialog, #priceApprovalDialog, #modeSwitchDialog)[open] .request-flow-footer {
        align-self: start !important;
        padding: 7px 12px 7px !important;
      }
      #basketDialog .basket-sticky-footer {
        padding-bottom: 7px !important;
      }
      #selectionEditDialog .selection-edit-footer {
        padding-bottom: 0 !important;
      }
    }

/* Individual solutions now live with the planning explanation instead of the price section. */
    .planning-individual-details {
      margin-top: 8px;
      border: 0;
      background: transparent;
    }
    .planning-individual-details > summary {
      width: fit-content;
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 0;
      cursor: pointer;
      color: var(--accent-blue-700);
      font-weight: 750;
      text-decoration: underline;
      text-underline-offset: 2px;
      list-style: none;
    }
    .planning-individual-details > summary::-webkit-details-marker { display: none; }
    .planning-individual-details > summary::after { content: "⌄"; text-decoration: none; transition: transform 160ms ease; }
    .planning-individual-details[open] > summary::after { transform: rotate(180deg); }
    .planning-individual-content {
      max-width: 820px;
      margin-top: 8px;
      padding: 11px 13px;
      border-left: 3px solid var(--accent-blue-200);
      color: var(--neutral-700);
      background: rgba(var(--surface-rgb), .66);
    }
    .planning-individual-content p { margin: 0 0 7px !important; }
    .planning-individual-content a {
      color: var(--accent-blue-700);
      font-weight: 750;
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    /* Additional current-year seminars sit next to the package recommendations. */
    .package-adjacent-seminars {
      margin: 44px 0 !important;
    }

    /* Previous-year offers are deliberately optional and collapsed by default. */
    .past-year-seminars {
      margin-top: 18px;
      overflow: hidden;
      border: 1px solid rgba(152,143,227,.32);
      border-radius: 16px;
      background: linear-gradient(135deg, rgba(210,207,255,.18), rgba(170,221,251,.12));
      box-shadow: 0 8px 22px rgba(89,79,149,.05);
    }
    .past-year-seminars > summary {
      min-height: 64px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 12px 15px;
      cursor: pointer;
      list-style: none;
      transition: background-color 160ms ease;
    }
    .past-year-seminars > summary:hover { background: rgba(210,207,255,.24); }
    .past-year-seminars > summary::-webkit-details-marker { display: none; }
    .past-year-seminars > summary span:first-child { display: grid; gap: 2px; }
    .past-year-seminars > summary strong { color: var(--neutral-900); font-size: .98rem; }
    .past-year-seminars > summary small { color: var(--neutral-600); font-size: .80rem; line-height: 1.35; }
    .past-year-arrow {
      width: 30px;
      height: 30px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border: 1px solid rgba(152,143,227,.30);
      border-radius: 9px;
      color: var(--accent-violet-700);
      background: rgba(var(--surface-rgb), .82);
      font-size: 1rem;
      font-weight: 800;
      line-height: 1;
      transform: rotate(0deg);
      transform-origin: 50% 50%;
      transition: transform 180ms ease, background-color 160ms ease, border-color 160ms ease;
      will-change: transform;
    }
    .past-year-seminars > summary:hover .past-year-arrow {
      border-color: rgba(152,143,227,.52);
      background: var(--neutral-0);
    }
    .past-year-seminars[open] > summary .past-year-arrow { transform: rotate(180deg); }
    .past-year-seminars-body { padding: 0 15px 16px; }
    .past-year-note { margin: 0 0 16px; color: var(--neutral-600); font-size: .86rem; line-height: 1.5; }
    .past-year-meta { display: block; margin-top: 4px; color: var(--neutral-600); font-size: .72rem; }

    /* Price calculator: title first, then two equally wide input/result columns. */
    .price-calculator-title { margin-bottom: 15px; }
    .price-calculator-title h3 { margin: 0 0 4px !important; font-size: clamp(1.45rem, 2.8vw, 1.9rem) !important; }
    .price-calculator-title p { margin: 0; color: var(--neutral-600); font-size: .92rem; }
    .price-calculator-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }
    .price-calculator-column { min-width: 0; display: grid; gap: 9px; }
    .price-calculator-column label {
      width: 100% !important;
      min-width: 0;
      display: grid !important;
      grid-template-rows: minmax(58px, auto) 48px;
      gap: 7px;
      margin: 0 !important;
      color: var(--neutral-700);
    }
    .price-calculator-column label > span {
      min-height: 58px;
      display: grid;
      align-content: end;
      gap: 3px;
      line-height: 1.22;
    }
    .price-calculator-column label > span b {
      display: block;
      color: var(--neutral-600);
      font-size: .76rem;
      font-weight: 650;
    }
    .price-calculator-column input {
      width: 100%;
      height: 48px;
      min-height: 48px !important;
      margin: 0 !important;
      box-sizing: border-box;
      background: var(--neutral-0);
    }
    .price-calculator-value {
      min-width: 0;
      min-height: 78px;
      display: grid;
      align-content: center;
      gap: 3px;
      padding: 12px;
      border: 1px solid var(--neutral-200);
      border-radius: 12px;
      background: var(--neutral-0);
    }
    .price-calculator-value span { color: var(--neutral-600); font-size: .82rem; }
    .price-calculator-value strong { color: var(--primary-800); font-family: var(--font-heading) !important; font-size: 1.42rem; }

    /* Visible request status before the customer leaves for the contact form. */
    .request-overview {
      padding: 14px;
      border: 1px solid var(--primary-200);
      border-radius: 14px;
      background: var(--primary-50);
    }
    .request-overview-head { display: grid; gap: 11px; }
    .request-overview-head > div:first-child { display: grid; gap: 2px; }
    .request-overview-head > div:first-child > span { color: var(--neutral-600); font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .045em; }
    .request-overview-head > div:first-child > strong { color: var(--neutral-950); font-size: 1rem; }
    .request-overview-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
    .request-overview-stats span { padding: 7px 8px; border-radius: 9px; background: var(--neutral-0); color: var(--neutral-700); font-size: .74rem; line-height: 1.2; }
    .request-overview-stats b { display: block; margin-bottom: 2px; color: var(--primary-800); font-size: 1.05rem; }
    .request-overview-items { display: grid; gap: 6px; margin-top: 10px; color: var(--neutral-700); font-size: .80rem; }
    .request-overview-items > span { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 6px; border-top: 1px solid rgba(169,226,197,.8); }
    .request-overview-items strong { color: var(--neutral-900); font-size: .80rem; }
    .request-overview-items small { color: var(--neutral-600); font-size: .74rem; text-align: right; }
    .request-overview-more { justify-content: flex-start !important; color: var(--primary-800); font-weight: 700; }

    @media (max-width: 680px) {
      .price-calculator-grid { grid-template-columns: 1fr; }
      .price-calculator-column label { grid-template-rows: auto 48px; }
      .price-calculator-column label > span { min-height: 0; }
      .request-overview-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .request-overview-items > span { display: grid; gap: 2px; }
      .request-overview-items small { text-align: left; }
    }

/* The complete violet planning hint is collapsible; it starts expanded. */
    .planning-flexibility-details {
      display: block !important;
      padding: 0 !important;
      overflow: hidden;
    }
    .planning-flexibility-details > summary {
      min-height: 68px;
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr) 30px;
      gap: 14px;
      align-items: center;
      padding: 15px 18px;
      cursor: pointer;
      list-style: none;
      user-select: none;
    }
    .planning-flexibility-details > summary::-webkit-details-marker { display: none; }
    .planning-flexibility-summary strong {
      margin: 0 !important;
      font-size: 1.02rem !important;
    }
    .planning-flexibility-chevron {
      width: 30px;
      height: 30px;
      display: grid;
      place-items: center;
      justify-self: end;
      border-radius: 9px;
      color: var(--accent-violet-700);
      background: rgba(var(--surface-rgb), .78);
      font-size: 1rem;
      font-weight: 800;
      transition: transform 160ms ease, background-color 160ms ease;
    }
    .planning-flexibility-details[open] .planning-flexibility-chevron { transform: rotate(180deg); }
    .planning-flexibility-details > summary:hover .planning-flexibility-chevron { background: var(--neutral-0); }
    .planning-flexibility-body {
      padding: 0 18px 17px 70px;
    }
    .planning-flexibility-body > p { max-width: 980px; }
    .planning-flexibility-body > p + p { margin-top: 18px !important; }
    .planning-individual-note {
      color: var(--neutral-700);
    }
    .planning-individual-note a {
      color: var(--accent-blue-700);
      font-weight: 750;
      text-decoration: underline;
      text-underline-offset: 2px;
    }
    .planning-individual-note a strong {
      display: inline !important;
      margin: 0 !important;
      color: inherit !important;
      font-family: inherit !important;
      font-size: inherit !important;
    }

    /* A quieter, more deliberate heading hierarchy for the calculator. */
    .price-calculator-title {
      position: relative;
      display: grid;
      gap: 3px;
      margin: 0 0 18px !important;
      padding: 3px 0 15px 16px;
      border-bottom: 1px solid var(--neutral-200);
    }
    .price-calculator-title::before {
      content: "";
      width: 4px;
      position: absolute;
      top: 3px;
      bottom: 15px;
      left: 0;
      border-radius: 999px;
      background: linear-gradient(180deg, var(--primary-500), var(--accent-blue-500));
    }
    .price-calculator-title h3 {
      margin: 0 !important;
      color: var(--neutral-950) !important;
      font-size: clamp(1.55rem, 2.8vw, 2rem) !important;
      line-height: 1.08 !important;
      letter-spacing: -.025em;
    }
    .price-calculator-title p {
      margin: 0 !important;
      color: var(--neutral-600) !important;
      font-size: .95rem !important;
      line-height: 1.4;
    }

    @media (max-width: 760px) {
      .planning-flexibility-details > summary {
        grid-template-columns: 34px minmax(0, 1fr) 28px;
        gap: 10px;
        padding: 13px 14px;
      }
      .planning-flexibility-body { padding: 0 14px 15px; }
      .planning-flexibility-body > p + p { margin-top: 16px !important; }
      .planning-flexibility-summary strong { font-size: .98rem !important; }
    }

.request-contact-fields {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }
    .request-contact-fields input {
      width: 100%;
      min-width: 0;
      min-height: 46px;
      padding: 0 12px;
      border: 1px solid var(--line);
      border-radius: 11px;
      outline: none;
      color: var(--ink);
      background: var(--neutral-0);
      font: inherit !important;
      font-size: .88rem !important;
      line-height: 1.2;
    }
    .request-contact-fields input::placeholder {
      color: var(--neutral-500);
      opacity: 1;
    }
    .request-contact-fields input:focus {
      border-color: rgba(17,119,82,0.68);
      box-shadow: 0 0 0 4px rgba(70,179,133,0.14);
    }
    .request-overview-title-row {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
    }
    .request-overview-title-row > div { display: grid; gap: 2px; min-width: 0; }
    .request-overview-title-row > div > span { color: var(--neutral-600); font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .045em; }
    .request-overview-title-row > div > strong { color: var(--neutral-950); font-size: 1rem; }
    .request-overview-edit {
      flex: 0 0 auto;
      min-height: 34px !important;
      padding-inline: 10px !important;
      font-size: .76rem !important;
      white-space: nowrap;
    }
    .request-privacy {
      display: flex !important;
      align-items: flex-start;
      gap: 10px;
      margin: 0 !important;
      padding: 11px 12px;
      border: 1px solid var(--neutral-200);
      border-radius: 11px;
      color: var(--neutral-700);
      background: var(--neutral-50);
      font-size: .78rem;
      font-weight: 500;
      line-height: 1.45;
      cursor: pointer;
    }
    .request-privacy input {
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
      margin: 1px 0 0;
      accent-color: var(--primary-700);
    }
    .request-privacy strong { color: var(--neutral-900); font-weight: 760; }
    .request-validation-hint {
      display: grid;
      gap: 3px;
      padding: 11px 13px;
      border: 1px solid rgba(180,126,20,.30);
      border-radius: 11px;
      color: #62490e;
      background: #fff8e8;
      font-size: .80rem;
      line-height: 1.42;
    }
    .request-validation-hint strong { color: #4e3908; font-size: .82rem; }
    .request-validation-hint.is-ready {
      border-color: rgba(17,119,82,.25);
      color: var(--primary-800);
      background: var(--primary-50);
    }
    .request-validation-hint.is-ready strong { color: var(--primary-800); }
    .request-overview-items > .request-overview-item {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 2px;
      align-items: start;
    }
    .request-overview-item strong,
    .request-overview-item small {
      display: block;
      min-width: 0;
      text-align: left;
    }
    @media (max-width: 680px) {
      .request-contact-fields { grid-template-columns: 1fr; }
      .request-overview-title-row { align-items: stretch; flex-direction: column; }
      .request-overview-edit { width: 100%; }
    }

.seminar-availability-note {
      display: grid;
      gap: 4px;
      margin-top: 10px;
      padding: 10px 12px;
      border: 1px solid rgba(64,167,220,.34);
      border-radius: 11px;
      color: var(--neutral-700);
      background: rgba(170,221,251,.16);
      font-size: .78rem;
      line-height: 1.45;
    }
    .seminar-availability-note > strong { color: var(--accent-blue-700); font-size: .8rem; }
    .seminar-availability-note-itse {
      border-color: rgba(152,143,227,.46);
      background: linear-gradient(135deg, rgba(210,207,255,.25), rgba(170,221,251,.13));
    }
    .seminar-availability-note-itse > strong { color: var(--accent-violet-700); }
    .seminar-availability-extra {
      display: block;
      margin-top: 4px;
    }
    .seminar-availability-extra strong { color: var(--accent-violet-700); }
    .seminar-availability-badge {
      display: inline-flex;
      align-items: center;
      min-height: 22px;
      margin-left: 6px;
      padding: 2px 7px;
      border: 1px solid rgba(152,143,227,.42);
      border-radius: 7px;
      color: var(--accent-violet-700);
      background: rgba(210,207,255,.32);
      font-size: .62rem;
      font-weight: 800;
      line-height: 1.15;
      white-space: nowrap;
    }
    .package-seminar.has-individual-request {
      border-color: rgba(152,143,227,.38);
      background: linear-gradient(135deg, rgba(var(--surface-rgb), .96), rgba(210,207,255,.16));
    }
    .package-seminar-note {
      grid-column: 2 / -1;
      margin: -3px 0 2px;
      color: var(--neutral-600);
      font-size: .72rem;
      line-height: 1.4;
    }
    .seminar-choice.has-individual-request {
      border-color: rgba(152,143,227,.38) !important;
      background: linear-gradient(135deg, rgba(var(--surface-rgb), .96), rgba(210,207,255,.16));
    }
    .seminar-choice-note {
      display: block;
      margin-top: 6px;
      color: var(--neutral-600);
      font-size: .72rem;
      line-height: 1.4;
    }
    .catalog-check-request {
      border: 1px solid rgba(152,143,227,.42);
      border-radius: 7px;
      color: var(--accent-violet-700) !important;
      background: rgba(210,207,255,.28);
      font-weight: 850;
    }
    #dialogPrerequisiteNote .seminar-availability-note { margin: 0 0 11px; }
    #dialogPrerequisiteNote .dialog-subnote-title {
      display: block;
      margin-top: 2px;
      color: var(--neutral-900);
    }
    @media (max-width: 760px) {
      .seminar-availability-badge { white-space: normal; }
      .package-seminar-note { grid-column: 1 / -1; margin-left: 27px; }
    }

.request-overview-transfer-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 10px;
    }
    .request-overview-transfer-actions .button {
      min-height: 34px !important;
      padding-inline: 10px !important;
      font-size: .76rem !important;
    }
    .request-overview-transfer-actions .button[disabled] {
      opacity: .52;
      cursor: not-allowed;
    }
    .plan-transfer-dialog {
      width: min(720px, calc(100vw - 28px));
      max-width: calc(100vw - 20px);
      overflow: hidden !important;
    }
    .plan-transfer-dialog .dialog-body.request-flow-body {
      display: grid !important;
      grid-template-rows: minmax(0, 1fr) auto !important;
      min-height: 0 !important;
      padding: 0 !important;
      overflow: hidden !important;
      background: var(--neutral-0);
    }
    .plan-transfer-intro {
      margin: 0 0 16px;
      color: var(--neutral-700);
      line-height: 1.55;
    }
    .plan-export-filename-field {
      display: grid;
      gap: 6px;
      margin-bottom: 12px;
    }
    .plan-export-filename-field > span {
      color: var(--neutral-800);
      font-size: .82rem;
      font-weight: 750;
    }
    .plan-export-filename-composer {
      min-width: 0;
      display: flex;
      align-items: stretch;
      overflow: hidden;
      border: 1px solid var(--neutral-300);
      border-radius: 11px;
      background: var(--neutral-0);
      box-sizing: border-box;
      transition: border-color 140ms ease, box-shadow 140ms ease;
    }
    .plan-export-filename-composer:focus-within {
      border-color: var(--primary-500);
      box-shadow: 0 0 0 4px rgba(17,119,82,.10);
    }
    .plan-export-filename-fixed {
      display: inline-flex;
      align-items: center;
      min-height: 46px;
      flex: 0 0 auto;
      padding: 0 10px;
      color: var(--neutral-500);
      background: var(--neutral-100);
      font-size: .82rem;
      font-weight: 650;
      white-space: nowrap;
      user-select: none;
    }
    .plan-export-filename-prefix { border-right: 1px solid var(--neutral-200); }
    .plan-export-filename-extension { border-left: 1px solid var(--neutral-200); }
    .plan-export-filename-field input {
      width: 100%;
      min-width: 92px;
      min-height: 46px;
      flex: 1 1 auto;
      padding: 0 10px;
      border: 0;
      border-radius: 0;
      outline: none;
      color: var(--neutral-900);
      background: var(--neutral-0);
      font: inherit;
      font-size: .9rem;
      box-sizing: border-box;
    }
    @media (max-width: 620px) {
      .plan-export-filename-fixed { padding-inline: 7px; font-size: .72rem; }
      .plan-export-filename-field input { min-width: 64px; padding-inline: 7px; font-size: .84rem; }
    }
    .plan-export-protection-option {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 14px;
      padding: 11px 12px;
      border: 1px solid var(--neutral-200);
      border-radius: 11px;
      background: var(--neutral-50);
      cursor: pointer;
    }
    .plan-export-protection-option input {
      width: 19px;
      height: 19px;
      flex: 0 0 auto;
      margin: 0;
      accent-color: var(--primary-700);
    }
    .plan-export-protection-option strong {
      color: var(--neutral-900);
      font-size: .84rem;
    }
    .plan-transfer-code-card[hidden],
    .plan-transfer-code-field[hidden] {
      display: none !important;
    }
    .plan-transfer-info {
      display: grid;
      gap: 5px;
      margin: 0 0 16px;
      padding: 12px 13px;
      border: 1px solid var(--neutral-200);
      border-radius: 12px;
      background: var(--neutral-50);
      color: var(--neutral-700);
      font-size: .82rem;
      line-height: 1.48;
    }
    .plan-transfer-info strong { color: var(--neutral-900); }
    .plan-transfer-code-card {
      display: grid;
      gap: 8px;
      margin: 0 0 14px;
      padding: 14px;
      border: 1px solid rgba(152,143,227,.35);
      border-radius: 14px;
      background: linear-gradient(135deg, rgba(210,207,255,.22), rgba(170,221,251,.12));
    }
    .plan-transfer-code-card > span {
      color: var(--neutral-600);
      font-size: .74rem;
      font-weight: 750;
      text-transform: uppercase;
      letter-spacing: .045em;
    }
    .plan-transfer-code-row {
      display: flex;
      align-items: center;
      gap: 9px;
    }
    .plan-transfer-code {
      min-width: 0;
      flex: 1 1 auto;
      padding: 10px 12px;
      border: 1px solid rgba(152,143,227,.42);
      border-radius: 10px;
      color: var(--accent-violet-700);
      background: var(--neutral-0);
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
      font-size: clamp(.84rem, 2.5vw, 1rem);
      font-weight: 800;
      letter-spacing: .055em;
      overflow-wrap: anywhere;
      user-select: all;
    }
    .plan-transfer-code-copy {
      flex: 0 0 auto;
      min-height: 38px !important;
      padding-inline: 10px !important;
      font-size: .76rem !important;
    }
    .plan-transfer-separate-note {
      margin: 0;
      color: var(--neutral-600);
      font-size: .78rem;
      line-height: 1.48;
    }
    .plan-transfer-file-field {
      display: grid;
      gap: 6px;
      margin-top: 14px;
    }
    .plan-transfer-file-field > span,
    .plan-transfer-code-field > span {
      color: var(--neutral-800);
      font-size: .82rem;
      font-weight: 750;
    }
    .plan-transfer-file-field input[type="file"] {
      width: 100%;
      min-height: 44px;
      padding: 8px;
      border: 1px solid var(--neutral-300);
      border-radius: 11px;
      background: var(--neutral-0);
      color: var(--neutral-800);
      font: inherit;
      font-size: .82rem;
    }
    .plan-transfer-code-field {
      display: grid;
      gap: 6px;
      margin-top: 14px;
    }
    .plan-transfer-code-field input {
      width: 100%;
      min-height: 46px;
      padding: 0 12px;
      border: 1px solid var(--neutral-300);
      border-radius: 11px;
      outline: none;
      color: var(--neutral-900);
      background: var(--neutral-0);
      font: inherit;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
      font-size: .9rem;
      font-weight: 700;
      letter-spacing: .035em;
      text-transform: uppercase;
    }
    .plan-transfer-code-field input:focus {
      border-color: rgba(152,143,227,.72);
      box-shadow: 0 0 0 4px rgba(152,143,227,.13);
    }
    .plan-transfer-status {
      display: grid;
      gap: 3px;
      margin-top: 14px;
      padding: 10px 12px;
      border: 1px solid var(--neutral-200);
      border-radius: 11px;
      color: var(--neutral-700);
      background: var(--neutral-50);
      font-size: .80rem;
      line-height: 1.45;
    }
    .plan-transfer-status strong { color: var(--neutral-900); }
    .plan-transfer-status.is-error {
      border-color: rgba(180,70,70,.28);
      color: #6f3030;
      background: #fff3f2;
    }
    .plan-transfer-status.is-error strong { color: #672727; }
    .plan-transfer-status.is-success {
      border-color: rgba(17,119,82,.25);
      color: var(--primary-800);
      background: var(--primary-50);
    }
    .plan-transfer-status.is-success strong { color: var(--primary-800); }
    .plan-import-replace-warning {
      margin-top: 14px;
      padding: 10px 12px;
      border: 1px solid rgba(180,126,20,.30);
      border-radius: 11px;
      color: #62490e;
      background: #fff8e8;
      font-size: .80rem;
      line-height: 1.45;
    }
    @media (max-width: 680px) {
      .request-overview-transfer-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .request-overview-transfer-actions .button { width: 100%; }
      .plan-transfer-dialog {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        border-radius: 16px !important;
      }
      .plan-transfer-code-row { align-items: stretch; flex-direction: column; }
      .plan-transfer-code-copy { width: 100%; }
    }


/* =====================================================================
   Dunkelmodus: Flaechen mit fest kodierten Farbwerten

   Erzeugt aus den Originalregeln: Farbton bleibt, Helligkeit sinkt auf
   8,5 bis 11 Prozent. Ein im Original vorhandenes !important wird vorher
   abgetrennt - sonst entstuende "!important !important", und die
   Deklaration waere ungueltig.
   ===================================================================== */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .package-options-action:hover {
    background: #101f27 !important;
  }
  :root:not([data-theme="light"]) .package-remove-all {
    background: #271010 !important;
  }
  :root:not([data-theme="light"]) .package-remove-all:hover {
    background: #271010 !important;
  }
  :root:not([data-theme="light"]) .journey-disclosure > summary:hover {
    background: rgba(17,16,39,.46) !important;
  }
  :root:not([data-theme="light"]) .year-exception-disclosure summary:hover {
    background: rgba(17,16,39,.54) !important;
  }
  :root:not([data-theme="light"]) .journey-disclosure {
    background: rgba(17,16,39,.28) !important;
  }
  :root:not([data-theme="light"]) .journey-disclosure > summary:hover {
    background: rgba(17,16,39,.58) !important;
  }
  :root:not([data-theme="light"]) .mode-switch-seminar.is-incompatible {
    background: rgba(17,16,39,.24) !important;
  }
  :root:not([data-theme="light"]) .mode-switch-exception-option {
    background: rgba(17,16,39,.24) !important;
  }
  :root:not([data-theme="light"]) .past-year-seminars > summary:hover {
    background: rgba(17,16,39,.24) !important;
  }
  :root:not([data-theme="light"]) .request-validation-hint {
    background: #272010 !important;
  }
  :root:not([data-theme="light"]) .seminar-availability-note-itse {
    background: linear-gradient(135deg, rgba(17,16,39,.25), rgba(170,221,251,.13)) !important;
  }
  :root:not([data-theme="light"]) .seminar-availability-badge {
    background: rgba(17,16,39,.32) !important;
  }
  :root:not([data-theme="light"]) .catalog-check-request {
    background: rgba(17,16,39,.28) !important;
  }
  :root:not([data-theme="light"]) .plan-transfer-code-card {
    background: linear-gradient(135deg, rgba(17,16,39,.22), rgba(170,221,251,.12)) !important;
  }
  :root:not([data-theme="light"]) .plan-transfer-status.is-error {
    background: #271210 !important;
  }
  :root:not([data-theme="light"]) .plan-import-replace-warning {
    background: #272010 !important;
  }
}

:root[data-theme="dark"] .package-options-action:hover {
  background: #101f27 !important;
}
:root[data-theme="dark"] .package-remove-all {
  background: #271010 !important;
}
:root[data-theme="dark"] .package-remove-all:hover {
  background: #271010 !important;
}
:root[data-theme="dark"] .journey-disclosure > summary:hover {
  background: rgba(17,16,39,.46) !important;
}
:root[data-theme="dark"] .year-exception-disclosure summary:hover {
  background: rgba(17,16,39,.54) !important;
}
:root[data-theme="dark"] .journey-disclosure {
  background: rgba(17,16,39,.28) !important;
}
:root[data-theme="dark"] .journey-disclosure > summary:hover {
  background: rgba(17,16,39,.58) !important;
}
:root[data-theme="dark"] .mode-switch-seminar.is-incompatible {
  background: rgba(17,16,39,.24) !important;
}
:root[data-theme="dark"] .mode-switch-exception-option {
  background: rgba(17,16,39,.24) !important;
}
:root[data-theme="dark"] .past-year-seminars > summary:hover {
  background: rgba(17,16,39,.24) !important;
}
:root[data-theme="dark"] .request-validation-hint {
  background: #272010 !important;
}
:root[data-theme="dark"] .seminar-availability-note-itse {
  background: linear-gradient(135deg, rgba(17,16,39,.25), rgba(170,221,251,.13)) !important;
}
:root[data-theme="dark"] .seminar-availability-badge {
  background: rgba(17,16,39,.32) !important;
}
:root[data-theme="dark"] .catalog-check-request {
  background: rgba(17,16,39,.28) !important;
}
:root[data-theme="dark"] .plan-transfer-code-card {
  background: linear-gradient(135deg, rgba(17,16,39,.22), rgba(170,221,251,.12)) !important;
}
:root[data-theme="dark"] .plan-transfer-status.is-error {
  background: #271210 !important;
}
:root[data-theme="dark"] .plan-import-replace-warning {
  background: #272010 !important;
}


/* Dunkelmodus: Schriftfarben auf Warn- und Fehlerflaechen.
   Sie standen fest kodiert und dunkel im CSS - auf den jetzt dunklen
   Flaechen waeren sie unlesbar. Farbton bleibt, Helligkeit auf 76 %. */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .request-validation-hint {
    color: #e3cfa0 !important;
  }
  :root:not([data-theme="light"]) .plan-transfer-status.is-error {
    color: #daaaaa !important;
  }
  :root:not([data-theme="light"]) .plan-import-replace-warning {
    color: #e3cfa0 !important;
  }
}

:root[data-theme="dark"] .request-validation-hint {
  color: #e3cfa0 !important;
}
:root[data-theme="dark"] .plan-transfer-status.is-error {
  color: #daaaaa !important;
}
:root[data-theme="dark"] .plan-import-replace-warning {
  color: #e3cfa0 !important;
}