/*
 * css-karriere-bewerbung.css — page-specific CSS für /karriere/bewerbungsprozess/
 * Auto-enqueued via capicard_karriere_per_page_css() (functions.php Z. 1564+)
 * Konvention: .picard-bewerbung-* für eigene Klassen, .karriere-* für übernommene Landing-Patterns
 */

/* ================================================================
   HERO — Übernommen von Karriere-Landing/Ausbildung
   ================================================================ */
.picard-karriere-hero{padding-bottom:80px!important;position:relative;overflow:hidden;isolation:isolate;}
.picard-karriere-hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(135deg,rgba(20,20,22,.55),rgba(20,20,22,.2) 60%,rgba(198,4,31,.15)),radial-gradient(1100px 700px at 20% 20%,#3a3f46 0%,#1b1d20 60%,#0a0b0c 100%);}
.picard-karriere-hero::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(115deg,rgba(255,255,255,.03) 0 2px,transparent 2px 7px),radial-gradient(600px 400px at 80% 80%,rgba(198,4,31,.18),transparent 60%);mix-blend-mode:screen;}
.picard-karriere-hero .et_pb_row{position:relative;z-index:2;}
.picard-karriere-hero-row{display:flow-root;}
.picard-karriere-hero-row::after{content:"";position:absolute;right:-120px;top:-60px;width:780px;height:780px;border:1px solid rgba(255,255,255,.06);transform:rotate(18deg);pointer-events:none;z-index:0;}

.karriere-hero-eyebrow p{margin:0 0 16px;color:#C6041F;font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;}
.karriere-hero-h1 h1{color:#fff!important;font-weight:700!important;font-size:72px!important;line-height:1.2!important;margin:0;}
@media(max-width:767px){.karriere-hero-h1 h1{font-size:40px!important;}}
.karriere-hero-lead p{margin:20px 0 0;max-width:56ch;color:rgba(255,255,255,0.82);font-weight:300;font-size:clamp(16px,1.4vw,20px);line-height:1.6;}

/* Hero Button — homogen mit Landing/Ausbildung */
.et_pb_button.karriere-hero-btn-primary{background-color:#C6041F !important;color:#ffffff !important;font-size:16px !important;font-weight:600 !important;font-family:'Roboto',sans-serif !important;border:0 !important;border-radius:6px !important;padding:.3em 1em !important;letter-spacing:0 !important;line-height:1.7em !important;margin-top:32px;}
.et_pb_button.karriere-hero-btn-primary:hover{background-color:#f80527 !important;padding:.3em 1em !important;border:0 !important;}
.et_pb_button.karriere-hero-btn-primary::before,
.et_pb_button.karriere-hero-btn-primary::after{display:none!important;}

/* ================================================================
   CTA-BRIDGE — Roter Banner mit 2 Buttons → Stellenangebote
   ================================================================ */
.picard-bewerbung-cta-bridge{position:relative;overflow:hidden;}
.picard-bewerbung-cta-bridge::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 60px,rgba(255,255,255,.04) 60px 61px,transparent 61px 120px),radial-gradient(800px 400px at 50% 0%,rgba(255,255,255,.08),transparent 60%);}
.picard-bewerbung-cta-bridge .et_pb_row{position:relative;z-index:2;}
.picard-bewerbung-cta-eyebrow p{margin:0 0 12px;text-align:center;color:#ffffff;font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;opacity:.85;}
.picard-bewerbung-cta-h2 h2{margin:0;color:#fff;}

/* CTA Buttons — White (primary) + Outline */
/* Bridge-Buttons — INVERSE Picard-Pattern (rotes BG → weiß+rote Schrift, KEIN Hover-Change). Higher specificity um Divi-cached zu schlagen. */
body #page-container .et_pb_section .et_pb_button.picard-bewerbung-cta-btn{font-size:16px !important;font-weight:600 !important;font-family:'Roboto',sans-serif !important;border-radius:3px !important;padding:.3em 1em !important;letter-spacing:0 !important;line-height:1.7em !important;background-color:#ffffff !important;color:#C6041F !important;border:0 !important;border-width:0 !important;transition:none !important;box-shadow:none !important;}
.et_pb_button.picard-bewerbung-cta-btn::before,
.et_pb_button.picard-bewerbung-cta-btn::after,
.et_pb_button.picard-bewerbung-cta-btn:hover::before,
.et_pb_button.picard-bewerbung-cta-btn:hover::after{display:none!important;content:none!important;}
body #page-container .et_pb_section .et_pb_button.picard-bewerbung-cta-btn--white,
body #page-container .et_pb_section .et_pb_button.picard-bewerbung-cta-btn--outline{background-color:#ffffff !important;color:#C6041F !important;border:0 !important;border-width:0 !important;}
body #page-container .et_pb_section .et_pb_button.picard-bewerbung-cta-btn--white:hover,
body #page-container .et_pb_section .et_pb_button.picard-bewerbung-cta-btn--outline:hover{background-color:#ffffff !important;color:#C6041F !important;border:0 !important;border-width:0 !important;padding:.3em 1em !important;transform:none !important;box-shadow:none !important;}

@media(max-width:600px){
  .picard-bewerbung-cta-buttons-row{flex-direction:column !important;}
  .picard-bewerbung-cta-buttons-row .et_pb_column{width:100% !important;margin-bottom:16px !important;}
  .picard-bewerbung-cta-buttons-row .et_pb_column:last-child{margin-bottom:0 !important;}
}

/* =====================================================
   KONTAKT (bottom) — Personen + Form
   ===================================================== */
.picard-karriere-kontakt-row { display: flex !important; align-items: stretch !important; }
.picard-karriere-kontakt-row .et_pb_column { display: flex !important; flex-direction: column !important; }

/* Left column: 2-col grid for the 2 person cards (eyebrow/h2/intro span both) */
/* Override Divi column flex with grid (specificity .row .col beats .col-flex) */
.picard-karriere-kontakt-row .picard-karriere-kontakt-left {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  flex-direction: row !important;
  gap: 20px;
  align-content: start;
  align-items: stretch !important;
}
.picard-karriere-kontakt-row .picard-karriere-kontakt-left > .picard-karriere-person {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.picard-karriere-kontakt-row .picard-karriere-kontakt-left > .picard-karriere-person > .et_pb_text_inner {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
.picard-karriere-kontakt-row .picard-karriere-kontakt-left > .et_pb_module:not(.picard-karriere-person) {
  grid-column: 1 / -1;
}

/* Bottom Eyebrow / H2 / Intro */
/* Override Divi default text-module bottom margin for tight vertical rhythm */
.picard-karriere-kontakt-left > .picard-kontakt-bottom-eyebrow,
.picard-karriere-kontakt-left > .picard-kontakt-bottom-h2,
.picard-karriere-kontakt-left > .picard-kontakt-bottom-intro {
  margin-bottom: 0 !important;
}
.picard-karriere-kontakt-left .picard-kontakt-bottom-eyebrow p {
  margin: 0 0 8px 0;
  font: 700 13px/1 "Roboto", sans-serif;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #C6041F;
}
.picard-karriere-kontakt-left .picard-kontakt-bottom-h2 h2 {
  margin: 0 0 12px 0;
  font: 700 28px/1.15em "Roboto", sans-serif;
  letter-spacing: -0.5px;
  color: #0F172A;
}
.picard-karriere-kontakt-left .picard-kontakt-bottom-intro p {
  margin: 0 0 28px 0;
  font: 400 16px/1.7em "Roboto", sans-serif;
  color: #3f4756;
  max-width: 48ch;
}

/* Person card */
.picard-karriere-kontakt-left .picard-karriere-person {
  background: #F8FAFC;
  padding: 28px 22px 24px;
  border: 1px solid #E5E7EB;
  text-align: center;
  position: relative;
  transition: transform .3s, box-shadow .3s, border-color .3s;
  overflow: hidden;
}
.picard-karriere-kontakt-left .picard-karriere-person::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: #C6041F;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s;
}
.picard-karriere-kontakt-left .picard-karriere-person:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 32px -16px rgba(15, 23, 42, .16);
  border-color: #fff;
}
.picard-karriere-kontakt-left .picard-karriere-person:hover::after { transform: scaleX(1); }

/* Avatar circle (CSS-only, replaces former SVG-in-HTML) */
.picard-karriere-kontakt-left .picard-karriere-person .et_pb_text_inner::before {
  content: "";
  display: block;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  margin: 0 auto 16px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.85)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center/40px no-repeat,
    linear-gradient(135deg, #cbd2d9 0%, #8a94a0 100%);
}

/* Card content (h4, role p, links) */
.picard-karriere-kontakt-left .picard-karriere-person h4 {
  margin: 0 0 6px 0;
  font: 700 17px/1.2 "Roboto", sans-serif;
  color: #0F172A;
}
.picard-karriere-kontakt-left .picard-karriere-person p {
  margin: 0 0 8px 0;
  font-family: "Roboto", sans-serif;
  line-height: 1.4;
}
/* Role (1st p) */
.picard-karriere-kontakt-left .picard-karriere-person p:nth-of-type(1) {
  margin-bottom: 16px;
  font: 700 11px/1 "Roboto", sans-serif;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #C6041F;
}
/* Tel + Mail (links) */
.picard-karriere-kontakt-left .picard-karriere-person p:nth-of-type(2),
.picard-karriere-kontakt-left .picard-karriere-person p:nth-of-type(3) {
  margin: 0;
}
.picard-karriere-kontakt-left .picard-karriere-person p a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #3f4756;
  line-height: 1.25;
  text-decoration: none;
  transition: color .25s;
}
.picard-karriere-kontakt-left .picard-karriere-person p a:hover { color: #C6041F; }

/* Phone icon (2nd p, before <a>) */
.picard-karriere-kontakt-left .picard-karriere-person p:nth-of-type(2) a::before {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C6041F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Mail icon (3rd p, before <a>) */
.picard-karriere-kontakt-left .picard-karriere-person p:nth-of-type(3) a::before {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C6041F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Right column: Form Eyebrow + H3 + CF7 */
.picard-karriere-kontakt-right .picard-kontakt-form-eyebrow p {
  margin: 0 0 6px 0;
  font: 700 13px/1 "Roboto", sans-serif;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #C6041F;
}
.picard-karriere-kontakt-right .picard-kontakt-form-h3 h3 {
  margin: -9px 0 0 0;
  font: 700 22px/1.25em "Roboto", sans-serif;
  color: #0F172A;
  padding-top: 0px;
}

/* CF7 form styling (unchanged from before) */
.picard-karriere-kontakt .wpcf7 { margin-top: 18px; }
.picard-karriere-kontakt .wpcf7-form > p { margin: 0 0 10px; }
.picard-karriere-kontakt .wpcf7-form > p:last-of-type { margin-bottom: 0; }
.picard-karriere-kontakt .wpcf7-form br { display: none; }
.picard-karriere-kontakt .form-cell { display: block; }
.picard-karriere-kontakt .form-control,
.picard-karriere-kontakt input[type="text"].wpcf7-form-control,
.picard-karriere-kontakt input[type="email"].wpcf7-form-control,
.picard-karriere-kontakt input[type="tel"].wpcf7-form-control,
.picard-karriere-kontakt textarea.wpcf7-form-control {
  width: 100%;
  padding: 13px 16px;
  border: 1px solid #D1D5DB;
  border-radius: 0;
  background: #fff;
  font-family: 'Roboto', sans-serif;
  font-size: 15px;
  color: #0F172A;
  transition: border-color .25s, box-shadow .25s;
  box-sizing: border-box;
  line-height: 1.4;
  display: block;
}
.picard-karriere-kontakt .form-control::placeholder,
.picard-karriere-kontakt .wpcf7-form-control::placeholder {
  color: #9CA3AF;
  opacity: 1;
  font-family: 'Roboto', sans-serif;
  font-size: 15px;
}
.picard-karriere-kontakt .form-control:focus,
.picard-karriere-kontakt .wpcf7-form-control:focus {
  outline: none;
  border-color: #C6041F;
  box-shadow: 0 0 0 3px rgba(198, 4, 31, .12);
}
.picard-karriere-kontakt textarea.form-control,
.picard-karriere-kontakt textarea.wpcf7-form-control {
  min-height: 60px;
  resize: vertical;
}
.picard-karriere-kontakt .karriere-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0 0 10px;
}
.picard-karriere-kontakt .karriere-form-grid > p { display: contents; margin: 0; }
.picard-karriere-kontakt .karriere-form-grid .form-cell { display: block; margin: 0; }
.picard-karriere-kontakt .form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  margin: 12px 0 4px;
}
.picard-karriere-kontakt .form-footer > p { display: contents; }
.picard-karriere-kontakt .akzeptieren-form { margin: 0; flex: 1 1 auto; text-align: left; }
.picard-karriere-kontakt .akzeptieren-form > p { margin: 0; display: inline; }
.picard-karriere-kontakt .akzeptieren-form .wpcf7-form-control-wrap,
.picard-karriere-kontakt .akzeptieren-form .wpcf7-acceptance,
.picard-karriere-kontakt .akzeptieren-form .wpcf7-list-item { display: inline; margin: 0; }
.picard-karriere-kontakt .akzeptieren-form .wpcf7-list-item label {
  display: inline-flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
  font-size: 13px;
  color: #3f4756;
  line-height: 1.4;
  text-align: left;
}
.picard-karriere-kontakt .akzeptieren-form .wpcf7-list-item-label { display: inline; }
.picard-karriere-kontakt .akzeptieren-form input[type="checkbox"] {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  accent-color: #C6041F;
  cursor: pointer;
  margin: 1px 0 0;
}
.picard-karriere-kontakt .akzeptieren-form a { color: #C6041F; text-decoration: underline; }
.picard-karriere-kontakt .akzeptieren-form a:hover { color: #f80527; }
.picard-karriere-kontakt .form-hint {
  font-size:13px;
  color: #9CA3AF;
  font-weight: 400;
  margin: 0;
  flex: 1 1 200px;
}
.picard-karriere-kontakt .wpcf7-submit {
  background: #C6041F !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 13px 28px !important;
  font-family: 'Roboto', sans-serif !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  cursor: pointer;
  transition: background .3s;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.4em !important;
  margin-top: 14px;
  background-image: none !important;
}
.picard-karriere-kontakt .wpcf7-submit:hover {
  background: #f80527 !important;
  color: #fff !important;
  padding: 13px 28px !important;
  border: 0 !important;
  background-image: none !important;
}
.picard-karriere-kontakt .wpcf7-submit::before,
.picard-karriere-kontakt .wpcf7-submit::after,
.picard-karriere-kontakt .wpcf7-submit:hover::before,
.picard-karriere-kontakt .wpcf7-submit:hover::after {
  display: none !important;
  content: none !important;
}
.picard-karriere-kontakt .wpcf7-not-valid-tip {
  color: #C6041F !important;
  font-size:13px !important;
  font-weight: 600;
  margin-top: 4px;
}
.picard-karriere-kontakt .wpcf7-response-output {
  margin: 18px 0 0 !important;
  border: 1px solid #D1D5DB !important;
  padding: 12px 14px !important;
  font-size: 14px;
}
.picard-karriere-kontakt .wpcf7 form.sent .wpcf7-response-output {
  border-color: #22C55E !important;
  background: #F0FDF4;
  color: #15803D;
}
.picard-karriere-kontakt .wpcf7 form.invalid .wpcf7-response-output,
.picard-karriere-kontakt .wpcf7 form.failed .wpcf7-response-output {
  border-color: #C6041F !important;
  background: #FEF2F2;
  color: #991B1B;
}
.picard-karriere-kontakt .wpcf7-spinner { margin: 0 0 0 12px; }

/* KONTAKT mobile */
@media (max-width: 980px) {
  .picard-karriere-kontakt-row { flex-direction: column !important; }
  .picard-karriere-kontakt-left { padding: 0 !important; margin-bottom: 48px !important; }
}
@media (max-width: 480px) {
  .picard-karriere-kontakt-left { grid-template-columns: 1fr; }
  .picard-karriere-kontakt .karriere-form-grid { grid-template-columns: 1fr; }
}
/* Fraunces font (war früher in V4-Block) */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,ital,wght@9..144,0,300..700;9..144,1,300..700&display=swap');

/* PATCH 7+8 (2026-04-29) — Timeline visual fixes:
   a) Connector ::before red (against Divi-cached F6F6F6 override)
   b) Animation-ranges weiter — earlier start, faster fill so spine + dots sichtbar bei scroll
   STEP-CARD BG NICHT überschrieben — David's Patch 12 (pures Weiß) gilt. */
body #page-container .picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper::before {
    background: #C6041F !important;
}
body #page-container .picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::before {
    animation-range: entry 50% cover 50% !important;
}
body #page-container .picard-bewerbung-supreme-step--final.dsm-content-timeline-item-wrapper::before {
    animation-range: entry 50% cover 50% !important;
}
body #page-container .picard-bewerbung-supreme-timeline .dsm-content-timeline-items-wrapper::after {
    animation-range: cover 0% cover 100% !important;
}


/* ================================================================================
   SUPREME — Editorial Print × Supreme Pro Content Timeline (Fachkräfte only)
   Mirror des V4 Designs für die nativ-editierbare Section #picard-bewerbung-supreme.
   Scope: .picard-bewerbung-supreme-*
   Hinweis: KEIN Tabs-Wrapper. Code-Modul-Toggle (Fachkraft/Ausbildung) folgt später.
   ================================================================================ */

/* --- SECTION canvas (paper + noise) -------------------------------------------- */
.picard-bewerbung-supreme-section{position:relative;isolation:isolate;}
.picard-bewerbung-supreme-section::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.4  0 0 0 0 0.3  0 0 0 0 0.2  0 0 0 0.06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.55;mix-blend-mode:multiply;}
.picard-bewerbung-supreme-section > .et_pb_row{position:relative;z-index:1;}

/* --- HEADER ROW ---------------------------------------------------------------- */
.picard-bewerbung-supreme-eyebrow p{margin:0 0 18px;font:700 12px/1 'Roboto',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#C6041F;}
.picard-bewerbung-supreme-headline h2{margin:0;font:400 clamp(40px,6.4vw,84px)/1.05 'Fraunces',serif;font-variation-settings:"opsz" 144,"wght" 700;color:#0F172A;letter-spacing:-.025em;}
.picard-bewerbung-supreme-headline h2 em{font-style:italic;font-variation-settings:"opsz" 144,"wght" 400;color:#C6041F;}
.picard-bewerbung-supreme-lead p{margin:32px 0 0;max-width:60ch;font:400 17px/1.7 'Roboto',sans-serif;color:#4B5563;}

/* ================================================================================
   SUPREME TIMELINE — Reset + Custom Spine + Custom Dots (mirror V4 logic)
   ================================================================================ */

/* Hide ALL Supreme structural drawing — wir zeichnen alles selbst */
.picard-bewerbung-supreme-timeline .dsm-content-timeline-tree{display:none !important;}
.picard-bewerbung-supreme-timeline .dsm-pointer-wrapper{display:none !important;}

/* Container + items-wrapper als Positioning-Context */
.picard-bewerbung-supreme-timeline.dsm_content_timeline,
.picard-bewerbung-supreme-timeline .dsm_content_timeline{background:transparent !important;padding:0 !important;}
.picard-bewerbung-supreme-timeline .dsm-content-timeline-items-wrapper{position:relative !important;padding:20px 0 0 !important;}

/* --- SPINE (Track + Fill) ------------------------------------------------------ */
.picard-bewerbung-supreme-timeline .dsm-content-timeline-items-wrapper::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  width:2px;
  background:rgba(198,4,31,.16);
  transform:translateX(-50%);
  z-index:0;
  pointer-events:none;
}
.picard-bewerbung-supreme-timeline .dsm-content-timeline-items-wrapper::after{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:2px;
  height:0;
  background:linear-gradient(180deg,#C6041F 0%,#C6041F 92%,rgba(198,4,31,.5) 100%);
  transform:translateX(-50%);
  z-index:1;
  pointer-events:none;
  box-shadow:0 0 16px -2px rgba(198,4,31,.45);
  animation:supremeSpineFill linear forwards;
  animation-timeline:view();
  animation-range:cover 0% cover 70%;
}
@keyframes supremeSpineFill{
  to{ height:100%; }
}

/* --- ITEM WRAPPER + Custom Dot ------------------------------------------------- */
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper{
  position:relative !important;
  margin-bottom:48px !important;
}
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper:last-child{margin-bottom:0 !important;}

.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::before{
  content:"";
  position:absolute;
  left:50%;
  top:20px;
  width:18px;
  height:18px;
  background:#FBF8F4;
  border:2px solid #C6041F;
  border-radius:50%;
  box-shadow:0 0 0 6px #FBF8F4;
  transform:translateX(-50%);
  z-index:3;
  transition:background .35s ease, box-shadow .35s ease;
  animation:supremeDotFill linear both;
  animation-timeline:view();
  animation-range:cover 30% cover 55%;
}
.picard-bewerbung-supreme-step--final.dsm-content-timeline-item-wrapper::before{
  width:22px;
  height:22px;
  border-width:3px;
  top:18px;
}
@keyframes supremeDotFill{
  to{
    background:#C6041F;
    box-shadow:0 0 0 6px #FBF8F4, 0 0 24px -2px rgba(198,4,31,.55);
  }
}

/* Fallback für Browser ohne scroll-driven animations */
@supports not (animation-timeline:view()){
  .picard-bewerbung-supreme-timeline .dsm-content-timeline-items-wrapper::after{
    height:100%;
    animation:none;
  }
  .picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::before{
    background:#C6041F;
    animation:none;
  }
}

/* --- OPPOSITE TEXT (große italic Step-Nummer) --------------------------------- */
.picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-desktop{background:transparent !important;padding:0 !important;border:0 !important;}
.picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-desktop .date{
  color:#C6041F !important;
  font:400 clamp(56px,7.5vw,110px)/.85 'Fraunces',serif !important;
  font-style:italic !important;
  font-variation-settings:"opsz" 144,"wght" 300 !important;
  letter-spacing:-.045em !important;
  display:block !important;
  background:transparent !important;
  padding:0 !important;
  border:0 !important;
  text-align:inherit !important;
  opacity:.92;
}
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper:nth-child(odd) .dsm-content-timeline-date.dsm-desktop{text-align:right;padding-right:60px !important;}
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper:nth-child(even) .dsm-content-timeline-date.dsm-desktop{text-align:left;padding-left:60px !important;}

/* --- CARD WRAPPER ------------------------------------------------------------- */
.picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper{
  background:rgba(251,248,244,.7) !important;
  backdrop-filter:blur(2px);
  border:0 !important;
  box-shadow:none !important;
  padding:0 40px 32px 40px !important;
  margin:0 !important;
  border-radius:2px;
  position:relative;
  z-index:2;
}
.picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper::before{content:"";position:absolute;left:40px;top:-2px;width:48px;height:2px;background:#C6041F;}
.picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper::after{display:none !important;}

/* TIMELINE CONTENT */
.picard-bewerbung-supreme-step .dsm-timeline-content{padding:0 !important;}
.picard-bewerbung-supreme-step .dsm-title{font:400 28px/1.25 'Fraunces',serif !important;font-style:italic !important;font-variation-settings:"opsz" 144,"wght" 600;color:#0F172A !important;letter-spacing:-.015em;margin:14px 0 18px !important;text-transform:none !important;}
.picard-bewerbung-supreme-step .dsm-description{font:400 16px/1.7 'Roboto',sans-serif;color:#1F2937;margin:0;}
.picard-bewerbung-supreme-step .dsm-description::first-letter{
  -webkit-initial-letter:3 1;
  initial-letter:3 1;
  color:#C6041F;
  font-family:'Fraunces',serif;
  font-style:italic;
  font-weight:700;
  margin-right:12px;
  letter-spacing:-.04em;
  float:none;
  font-size:inherit;
  line-height:inherit;
  margin-top:0;
}
@supports not ((initial-letter:3) or (-webkit-initial-letter:3)){
  .picard-bewerbung-supreme-step .dsm-description::first-letter{
    float:left;
    font-size:88px;
    line-height:.82;
    margin:4px 14px 0 0;
  }
}

/* FINAL STEP */
.picard-bewerbung-supreme-step--final .dsm-title{color:#C6041F !important;}
.picard-bewerbung-supreme-step--final .dsm-content-timeline-content-wrapper::before{width:120px;height:3px;}
.picard-bewerbung-supreme-step--final .dsm-description{font-style:italic;}

/* MOBILE date — auf Desktop ausblenden */
@media (min-width:981px){
  .picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-mobile{display:none !important;}
}

/* --- MOBILE -------------------------------------------------------------------- */
@media (max-width:980px){
  .picard-bewerbung-supreme-section{padding:80px 0 !important;}
  .picard-bewerbung-supreme-timeline .dsm-content-timeline-items-wrapper::before,
  .picard-bewerbung-supreme-timeline .dsm-content-timeline-items-wrapper::after{left:11px !important;transform:none !important;}
  .picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::before{left:11px !important;transform:translateX(-50%) !important;}
  .picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-desktop{display:none !important;}
  .picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-mobile{display:block !important;margin:0 0 12px 30px !important;background:transparent !important;padding:0 !important;}
  .picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-mobile .date{color:#C6041F !important;font:400 36px/1 'Fraunces',serif !important;font-style:italic !important;background:transparent !important;padding:0 !important;}
  .picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper{margin-bottom:36px !important;padding-left:30px !important;}
  .picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper{padding:20px 0 0 0 !important;width:auto !important;}
  .picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper::before{left:0;}
  .picard-bewerbung-supreme-step .dsm-title{font-size:22px !important;}
  .picard-bewerbung-supreme-step .dsm-description::first-letter{font-size:44px;}
}


/* ================================================================================
   SUPREME PATCH 3+4 — Title-Alignment + Step-Connector (mirror V4 PATCH 3+4)
   ================================================================================ */

/* --- PATCH 3: Title cap-top === Schritt cap-top --------------------------------- */
.picard-bewerbung-supreme-step .dsm-timeline-content{
  margin-top:0 !important;
  padding-top:0 !important;
}
.picard-bewerbung-supreme-step .dsm-title{
  margin:0 0 18px 0 !important;
}
.picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper::before{
  top:-12px !important;
  height:2px !important;
}
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::before{
  top:14px !important;
}
.picard-bewerbung-supreme-step--final.dsm-content-timeline-item-wrapper::before{
  top:12px !important;
}

/* Drop-cap: 2 lines instead of 3 */
.picard-bewerbung-supreme-step .dsm-description::first-letter{
  -webkit-initial-letter:2 1;
  initial-letter:2 1;
  margin-right:10px;
}
@supports not ((initial-letter:2) or (-webkit-initial-letter:2)){
  .picard-bewerbung-supreme-step .dsm-description::first-letter{
    float:left;
    font-size:54px;
    line-height:.85;
    margin:2px 10px 0 0;
  }
}

/* --- PATCH 4: Step-Gruppierung + horizontaler Connector ------------------------ */
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper{
  margin-bottom:96px !important;
}
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper:last-child{
  margin-bottom:0 !important;
}

/* Connector-Strich: roter horizontaler Strich auf Höhe des Dots */
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:22px;
  height:1px;
  background:linear-gradient(
    to right,
    rgba(198,4,31,.22) 0%,
    rgba(198,4,31,.22) calc(50% - 22px),
    transparent calc(50% - 22px),
    transparent calc(50% + 22px),
    rgba(198,4,31,.22) calc(50% + 22px),
    rgba(198,4,31,.22) 100%
  );
  z-index:0;
  pointer-events:none;
}

.picard-bewerbung-supreme-step--final.dsm-content-timeline-item-wrapper::after{
  background:linear-gradient(
    to right,
    rgba(198,4,31,.45) 0%,
    rgba(198,4,31,.45) calc(50% - 24px),
    transparent calc(50% - 24px),
    transparent calc(50% + 24px),
    rgba(198,4,31,.45) calc(50% + 24px),
    rgba(198,4,31,.45) 100%
  );
}


/* ================================================================================
   SUPREME PATCH 5 — Toggle Fachkräfte / Ausbildung (David 2026-04-28)
   ================================================================================ */

/* --- Pane visibility ----------------------------------------------------------- */
#picard-bewerbung-supreme .picard-bewerbung-supreme-pane{display:none;}
#picard-bewerbung-supreme[data-active="fach"] .picard-bewerbung-supreme-pane--fach{display:block;}
#picard-bewerbung-supreme[data-active="azu"] .picard-bewerbung-supreme-pane--azu{display:block;}
/* Sicherstellen, dass die default-anzeige funktioniert, falls JS noch nicht gelaufen ist */
#picard-bewerbung-supreme:not([data-active]) .picard-bewerbung-supreme-pane--fach{display:block;}

/* --- Toggle wrapper (Code-Modul Container) ------------------------------------- */
.picard-bewerbung-supreme-toggle-wrap{margin:0 !important;}

/* --- Toggle pills (Editorial-Stil mirror V4 tabs) ------------------------------ */
.picard-bewerbung-supreme-toggle{
  display:flex;
  gap:0;
  border-bottom:1px solid rgba(15,23,42,.18);
  position:relative;
}

.picard-bewerbung-supreme-toggle__btn{
  flex:1;
  display:block;
  padding:28px 32px 26px;
  background:transparent;
  border:0;
  cursor:pointer;
  text-align:left;
  position:relative;
  color:#0F172A;
  font:400 28px/1.15 'Fraunces',serif;
  font-style:italic;
  font-variation-settings:"opsz" 144,"wght" 500;
  letter-spacing:-.015em;
  transition:background .25s ease;
  -webkit-appearance:none;
  appearance:none;
}
.picard-bewerbung-supreme-toggle__btn:focus{outline:0;}
.picard-bewerbung-supreme-toggle__btn:focus-visible{outline:2px dashed #C6041F;outline-offset:-6px;}

.picard-bewerbung-supreme-toggle__num{
  display:block;
  margin-bottom:8px;
  font:700 13px/1 'Roboto',sans-serif;
  font-style:normal;
  letter-spacing:.22em;
  color:#C6041F;
  text-transform:uppercase;
}

.picard-bewerbung-supreme-toggle__label{
  display:block;
  color:inherit;
}

.picard-bewerbung-supreme-toggle__meta{
  display:block;
  margin-top:10px;
  font:400 12px/1 'Roboto',sans-serif;
  font-style:normal;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6B7280;
}

.picard-bewerbung-supreme-toggle__btn:hover{background:rgba(198,4,31,.025);}

.picard-bewerbung-supreme-toggle__btn.is-active{background:rgba(198,4,31,.04);}
.picard-bewerbung-supreme-toggle__btn.is-active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:3px;
  background:#C6041F;
  box-shadow:0 10px 28px -6px rgba(198,4,31,.45);
}

/* --- Mobile -------------------------------------------------------------------- */
@media (max-width:980px){
  .picard-bewerbung-supreme-toggle__btn{padding:18px 16px;font-size:20px;}
  .picard-bewerbung-supreme-toggle__meta{font-size:10px;margin-top:8px;}
  .picard-bewerbung-supreme-toggle__num{font-size:13px;letter-spacing:.18em;}
}


/* ================================================================================
   SUPREME PATCH 6 — Roboto-only + Header centered + Toggle kompakt (David 2026-04-28)
   ================================================================================ */

/* --- A) Fraunces komplett raus → Roboto wie auf der restlichen Seite ---------- */
.picard-bewerbung-supreme-eyebrow p,
.picard-bewerbung-supreme-headline h2,
.picard-bewerbung-supreme-headline h2 em,
.picard-bewerbung-supreme-lead p,
.picard-bewerbung-supreme-toggle__btn,
.picard-bewerbung-supreme-toggle__num,
.picard-bewerbung-supreme-toggle__label,
.picard-bewerbung-supreme-toggle__meta,
.picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-desktop .date,
.picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-mobile .date,
.picard-bewerbung-supreme-step .dsm-title,
.picard-bewerbung-supreme-step .dsm-description::first-letter{
  font-family:'Roboto',sans-serif !important;
  font-variation-settings:normal !important;
}

/* --- B) Header full-width + centered ------------------------------------------ */
#picard-bewerbung-supreme .picard-bewerbung-supreme-headerrow{
  max-width:100% !important;
  text-align:center;
}
#picard-bewerbung-supreme .picard-bewerbung-supreme-headerrow .et_pb_column{
  width:100% !important;
}
.picard-bewerbung-supreme-eyebrow p,
.picard-bewerbung-supreme-headline h2,
.picard-bewerbung-supreme-lead p{
  text-align:center !important;
}
.picard-bewerbung-supreme-lead p{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* --- C) Headline ohne Fraunces-Quirks ----------------------------------------- */
.picard-bewerbung-supreme-headline h2{
  font-weight:700 !important;
  font-style:normal !important;
  letter-spacing:-.015em;
}
.picard-bewerbung-supreme-headline h2 em{
  font-weight:700 !important;
  font-style:italic !important;
  color:#C6041F;
}

/* --- D) Toggle pills kompakter ------------------------------------------------ */
.picard-bewerbung-supreme-toggle__btn{
  padding:16px 22px 14px !important;
  font-size:18px !important;
  font-style:normal !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
}
.picard-bewerbung-supreme-toggle__num{
  margin-bottom:4px;
  font-size:13px;
  letter-spacing:.18em;
}
.picard-bewerbung-supreme-toggle__meta{
  margin-top:6px;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:none;
  font-weight:400;
}

/* --- E) Step-opposite-text (Schritt 0X) — Roboto Light Italic ---------------- */
.picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-desktop .date{
  font-size:clamp(40px,5vw,72px) !important;
  font-weight:300 !important;
  font-style:italic !important;
  line-height:1 !important;
  letter-spacing:-.02em !important;
}
.picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-mobile .date{
  font-weight:600 !important;
  font-style:italic !important;
  font-size:30px !important;
}

/* --- F) Step-Title — Roboto Bold ---------------------------------------------- */
.picard-bewerbung-supreme-step .dsm-title{
  font-size:22px !important;
  font-weight:700 !important;
  font-style:normal !important;
  line-height:1.3 !important;
  letter-spacing:-.005em !important;
}

/* --- G) Drop-Cap Roboto Bold -------------------------------------------------- */
.picard-bewerbung-supreme-step .dsm-description::first-letter{
  font-weight:700 !important;
  font-style:normal !important;
  letter-spacing:0 !important;
}

/* --- H) Mobile Anpassungen für die kompakteren Pillen ------------------------- */
@media (max-width:980px){
  .picard-bewerbung-supreme-toggle__btn{padding:12px 14px 10px !important;font-size:15px !important;}
  .picard-bewerbung-supreme-toggle__num{font-size:10px;letter-spacing:.16em;}
  .picard-bewerbung-supreme-toggle__meta{font-size:10px;}
  .picard-bewerbung-supreme-step .dsm-title{font-size:19px !important;}
}


/* ================================================================================
   SUPREME PATCH 7 — Toggle pill text größer (David 2026-04-28)
   ================================================================================ */
.picard-bewerbung-supreme-toggle__btn{
  font-size:22px !important;
  padding:18px 24px 16px !important;
}
.picard-bewerbung-supreme-toggle__num{
  font-size:13px;
  letter-spacing:.20em;
  margin-bottom:6px;
}
.picard-bewerbung-supreme-toggle__meta{
  font-size:13px;
  margin-top:8px;
}

@media (max-width:980px){
  .picard-bewerbung-supreme-toggle__btn{padding:14px 16px 12px !important;font-size:17px !important;}
  .picard-bewerbung-supreme-toggle__num{font-size:13px;}
  .picard-bewerbung-supreme-toggle__meta{font-size:13px;}
}


/* ================================================================================
   SUPREME PATCH 8 — Toggle Display-Numbers + Headline-Mirror + CTA-Bridge Redesign
   David 2026-04-28 12:00
   ================================================================================ */

/* --- A) Toggle: BIG display number anchor + stacked label/meta -------------- */
.picard-bewerbung-supreme-toggle__btn{
  display:grid !important;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;
  column-gap:20px;
  row-gap:0;
  align-items:center;
  text-align:left !important;
  padding:18px 28px !important;
}

.picard-bewerbung-supreme-toggle__num{
  grid-row:1 / span 2;
  grid-column:1;
  margin:0 !important;
  font-size:64px !important;
  font-weight:200 !important;
  font-style:italic !important;
  line-height:1 !important;
  letter-spacing:-.04em !important;
  color:#C6041F !important;
  text-transform:none !important;
  font-feature-settings:"tnum" 1, "lnum" 1;
}

.picard-bewerbung-supreme-toggle__label{
  grid-row:1;
  grid-column:2;
  align-self:end;
  display:block;
  font-size:22px !important;
  font-weight:700 !important;
  line-height:1.1 !important;
  color:#0F172A;
}

.picard-bewerbung-supreme-toggle__meta{
  grid-row:2;
  grid-column:2;
  align-self:start;
  display:block;
  margin:4px 0 0 !important;
  font-size:13px !important;
  font-weight:500 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:#6B7280 !important;
}

.picard-bewerbung-supreme-toggle__btn.is-active .picard-bewerbung-supreme-toggle__num{
  font-weight:300 !important;
}

/* Mobile toggle adjustments */
@media (max-width:980px){
  .picard-bewerbung-supreme-toggle__btn{padding:14px 18px !important;column-gap:14px;}
  .picard-bewerbung-supreme-toggle__num{font-size:48px !important;}
  .picard-bewerbung-supreme-toggle__label{font-size:17px !important;}
  .picard-bewerbung-supreme-toggle__meta{font-size:10px !important;}
}
@media (max-width:560px){
  .picard-bewerbung-supreme-toggle__num{font-size:38px !important;}
  .picard-bewerbung-supreme-toggle__label{font-size:15px !important;}
}

/* --- B) Headline-Mirror: Startseite-H2 (30px / 800 / #333) ------------------ */
.picard-bewerbung-supreme-headline h2{
  font-family:'Roboto',sans-serif !important;
  font-size:30px !important;
  font-weight:800 !important;
  font-style:normal !important;
  line-height:1.4em !important;
  color:#333333 !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}
.picard-bewerbung-supreme-headline h2 em{
  font-style:italic !important;
  font-weight:800 !important;
  color:#C6041F !important;
}
.picard-bewerbung-supreme-headline h2 br{display:none;}

/* --- C) CTA-BRIDGE — Redesign (clean confident magazine-style) -------------- */

/* Texture: dezenter horizontaler Grain statt aggressiver 135° Linien */
.picard-bewerbung-cta-bridge::before{
  background-image:
    radial-gradient(1100px 500px at 50% -10%, rgba(255,255,255,.10), transparent 65%),
    repeating-linear-gradient(180deg, transparent 0 3px, rgba(255,255,255,.025) 3px 4px) !important;
  opacity:.9;
}

/* Decorative top hairline + bottom hairline für Magazine-feeling */
.picard-bewerbung-cta-bridge{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.picard-bewerbung-cta-bridge::after{
  content:"";
  position:absolute;
  left:50%;
  top:36px;
  transform:translateX(-50%);
  width:48px;
  height:2px;
  background:rgba(255,255,255,.6);
  z-index:1;
  pointer-events:none;
}

/* Eyebrow — kompakt aber prominent */
.picard-bewerbung-cta-eyebrow p{
  margin:0 auto 14px !important;
  font:700 12px/1 'Roboto',sans-serif;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(255,255,255,.78) !important;
  text-align:center;
}

/* Headline — größer, breiter atmend, mit Trennstrich darunter */
.picard-bewerbung-cta-h2 h2{
  font-size:44px !important;
  line-height:1.1em !important;
  font-weight:800 !important;
  letter-spacing:-.01em !important;
  margin:0 !important;
  position:relative;
  padding-bottom:32px;
}
.picard-bewerbung-cta-h2 h2::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:8px;
  transform:translateX(-50%);
  width:64px;
  height:2px;
  background:#ffffff;
  opacity:.4;
}

@media (max-width:980px){
  .picard-bewerbung-cta-h2 h2{font-size:32px !important;}
}
@media (max-width:560px){
  .picard-bewerbung-cta-h2 h2{font-size:26px !important;}
}

/* Section padding atmender + dezenter Top/Bottom */
.picard-bewerbung-cta-bridge{
  padding-top:96px !important;
  padding-bottom:96px !important;
}

/* Buttons — stärkerer Shadow, höhere Confidence */
.picard-bewerbung-cta-btn .et_pb_button{
  padding:16px 32px !important;
  letter-spacing:.04em !important;
  border-radius:2px !important;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease !important;
}
.picard-bewerbung-cta-btn--white .et_pb_button{
  box-shadow:0 12px 32px -8px rgba(0,0,0,.35);
}
.picard-bewerbung-cta-btn--white .et_pb_button:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 42px -10px rgba(0,0,0,.5);
}
.picard-bewerbung-cta-btn--outline .et_pb_button{
  backdrop-filter:blur(2px);
}
.picard-bewerbung-cta-btn--outline .et_pb_button:hover{
  transform:translateY(-2px);
}

/* Hero H1 fix (war versehentlich h2) — make sure typography matches existing rule */
.karriere-hero-h1 h1{
  font-family:'Roboto',sans-serif;
  font-weight:700;
  color:#ffffff;
  font-size:72px;
  line-height:1.2em;
}
@media (max-width:980px){
  .karriere-hero-h1 h1{font-size:56px;}
}
@media (max-width:560px){
  .karriere-hero-h1 h1{font-size:40px;}
}


/* ============================================================================
   PICARD CTA-BRIDGE — PATCH 9 — Industrial Editorial / "Step 08" Aufruf
   Swiss asymmetric grid + dramatic display H2 + outline numeral anchor.
   David 2026-04-28 12:30
   ============================================================================ */

.picard-bewerbung-cta-bridge{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
  padding:clamp(96px,12vw,160px) 0 !important;
  background:#C6041F !important;
}

.picard-bewerbung-cta-bridge::before,
.picard-bewerbung-cta-bridge::after{
  pointer-events:none;
}

.picard-bewerbung-cta-bridge::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    repeating-linear-gradient(90deg,
      transparent 0,
      transparent calc(8.333% - 1px),
      rgba(255,255,255,.045) calc(8.333% - 1px),
      rgba(255,255,255,.045) 8.333%),
    radial-gradient(900px 600px at 92% -10%, rgba(255,255,255,.10), transparent 55%) !important;
  opacity:1 !important;
  mix-blend-mode:normal !important;
  z-index:0 !important;
}

.picard-bewerbung-cta-bridge::after{
  content:"08" !important;
  position:absolute !important;
  right:clamp(-2vw,2vw,4vw) !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  font-family:'Roboto',sans-serif !important;
  font-size:clamp(220px,32vw,440px) !important;
  font-weight:100 !important;
  line-height:.85 !important;
  letter-spacing:-.06em !important;
  color:transparent !important;
  -webkit-text-stroke:1px rgba(255,255,255,.22) !important;
  z-index:1 !important;
  user-select:none !important;
  background:none !important;
  width:auto !important;
  height:auto !important;
  box-shadow:none !important;
}

.picard-bewerbung-cta-bridge > .et_pb_row{
  position:relative !important;
  z-index:2 !important;
}

.picard-bewerbung-cta-bridge > .et_pb_row:first-of-type{
  max-width:1280px !important;
  width:100% !important;
  margin:0 auto !important;
  padding:0 clamp(24px,6vw,88px) !important;
}

.picard-bewerbung-cta-bridge .et_pb_text_align_center,
.picard-bewerbung-cta-bridge .et_pb_text_align_left{
  text-align:left !important;
}

.picard-bewerbung-cta-eyebrow{
  text-align:left !important;
  margin:0 0 28px !important;
}
.picard-bewerbung-cta-eyebrow p{
  display:inline-flex !important;
  align-items:center !important;
  gap:14px !important;
  margin:0 !important;
  font-family:'Roboto',sans-serif !important;
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:.32em !important;
  text-transform:uppercase !important;
  color:rgba(255,255,255,.92) !important;
  line-height:1 !important;
}
.picard-bewerbung-cta-eyebrow p::before{
  content:"08";
  display:inline-block;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.55);
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
}

.picard-bewerbung-cta-h2{
  text-align:left !important;
  margin:0 !important;
  position:relative;
  max-width:880px;
}
.picard-bewerbung-cta-h2 h2{
  font-family:'Roboto',sans-serif !important;
  font-size:clamp(40px,6.4vw,88px) !important;
  font-weight:900 !important;
  line-height:.96 !important;
  letter-spacing:-.028em !important;
  color:#ffffff !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
  text-transform:none !important;
  max-width:18ch;
}
.picard-bewerbung-cta-h2 h2::after{
  display:none !important;
  content:none !important;
}
.picard-bewerbung-cta-h2 .et_pb_text_inner::after{
  content:"";
  display:block;
  margin-top:32px;
  width:96px;
  height:4px;
  background:#ffffff;
}

.picard-bewerbung-cta-buttons-row{
  max-width:1280px !important;
  width:100% !important;
  margin:56px auto 0 !important;
  padding:0 clamp(24px,6vw,88px) !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,360px)) !important;
  gap:16px !important;
  justify-content:start !important;
}
.picard-bewerbung-cta-buttons-row > .et_pb_column{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.picard-bewerbung-cta-buttons-row .et_pb_button_module_wrapper{
  width:100% !important;
  text-align:left !important;
  margin:0 !important;
}

.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:100% !important;
  padding:22px 28px !important;
  font-family:'Roboto',sans-serif !important;
  font-size:14px !important;
  font-weight:700 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  border-radius:0 !important;
  border-width:1px !important;
  border-style:solid !important;
  position:relative;
  overflow:hidden;
  box-shadow:none !important;
  transform:none !important;
  transition:
    color .4s cubic-bezier(.2,.8,.2,1),
    background-color .4s cubic-bezier(.2,.8,.2,1),
    border-color .4s cubic-bezier(.2,.8,.2,1) !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button::before{
  content:"→" !important;
  display:inline-block !important;
  font-family:'Roboto',sans-serif !important;
  font-weight:400 !important;
  font-size:22px !important;
  letter-spacing:0 !important;
  margin-right:14px !important;
  transition:transform .45s cubic-bezier(.2,.8,.2,1) !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button::after{
  content:none !important;
  display:none !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button:hover::before{
  transform:translateX(8px);
}

.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--white.et_pb_button{
  background-color:#ffffff !important;
  color:#C6041F !important;
  border-color:#ffffff !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--white.et_pb_button:hover{
  background-color:#0F172A !important;
  color:#ffffff !important;
  border-color:#0F172A !important;
}

.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--outline.et_pb_button{
  background-color:transparent !important;
  color:#ffffff !important;
  border-color:rgba(255,255,255,.55) !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--outline.et_pb_button:hover{
  background-color:#ffffff !important;
  color:#C6041F !important;
  border-color:#ffffff !important;
}

@media (max-width:980px){
  .picard-bewerbung-cta-bridge{padding:80px 0 !important;}
  .picard-bewerbung-cta-bridge::after{
    font-size:clamp(180px,42vw,320px) !important;
    right:-12vw !important;
    opacity:.65;
  }
  .picard-bewerbung-cta-h2 h2{font-size:clamp(34px,9vw,56px) !important;}
  .picard-bewerbung-cta-buttons-row{
    grid-template-columns:1fr !important;
    max-width:480px !important;
  }
}

@media (max-width:560px){
  .picard-bewerbung-cta-bridge::after{
    font-size:220px !important;
    right:-16vw !important;
  }
  .picard-bewerbung-cta-h2 h2{
    font-size:30px !important;
    letter-spacing:-.02em !important;
  }
  .picard-bewerbung-cta-eyebrow p{
    flex-wrap:wrap;
    gap:10px !important;
  }
  .picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button{
    padding:18px 22px !important;
    font-size:13px !important;
    letter-spacing:.08em !important;
  }
  .picard-bewerbung-cta-h2 .et_pb_text_inner::after{
    width:64px;
    height:3px;
    margin-top:24px;
  }
}

@media (prefers-reduced-motion:reduce){
  .picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button,
  .picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button::before{
    transition:none !important;
  }
}


/* ============================================================================
   PICARD CTA-BRIDGE — PATCH 10 — Brand-numeral + standard buttons + clean H2
   David 2026-04-28 12:30
   - Background numeral "08" → wordmark "C.A.PICARD"
   - Remove [08] eyebrow chip
   - Remove white rule under H2
   - Buttons revert to Picard standard design (rounded 6px, no uppercase, no arrow)
   ============================================================================ */

/* --- A) Background wordmark instead of "08" ---------------------------------- */
.picard-bewerbung-cta-bridge::after{
  content:"C.A.PICARD" !important;
  font-size:clamp(80px,12vw,180px) !important;
  font-weight:200 !important;
  letter-spacing:-.04em !important;
  -webkit-text-stroke:1px rgba(255,255,255,.18) !important;
  right:clamp(-2vw,2vw,4vw) !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  white-space:nowrap !important;
}

/* --- B) Remove [08] chip from eyebrow ---------------------------------------- */
.picard-bewerbung-cta-eyebrow p::before{
  content:none !important;
  display:none !important;
  border:0 !important;
  padding:0 !important;
}
/* Optional: leading short rule statt chip — minimaler editorial-anchor */
.picard-bewerbung-cta-eyebrow p{
  position:relative;
}
.picard-bewerbung-cta-eyebrow p::after{
  content:"";
  display:inline-block;
  width:48px;
  height:1px;
  background:rgba(255,255,255,.55);
  vertical-align:middle;
  margin-left:14px;
}

/* --- C) Remove white rule below H2 ------------------------------------------- */
.picard-bewerbung-cta-h2 .et_pb_text_inner::after{
  display:none !important;
  content:none !important;
}

/* --- D) Buttons → Picard standard design ------------------------------------- */
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  padding:.3em 1em !important;
  font-family:'Roboto',sans-serif !important;
  font-size:16px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  line-height:1.7em !important;
  border-radius:6px !important;
  border:0 !important;
  border-width:0 !important;
  position:relative;
  overflow:hidden;
  box-shadow:none !important;
  transform:none !important;
  transition:background-color .2s ease, color .2s ease !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button::before,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button::after{
  content:none !important;
  display:none !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button:hover{
  padding:.3em 1em !important;
  border:0 !important;
}

/* White (primary) — solid white plate, hover → ink */
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--white.et_pb_button{
  background-color:#ffffff !important;
  color:#C6041F !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--white.et_pb_button:hover{
  background-color:#0F172A !important;
  color:#ffffff !important;
}

/* Outline (secondary) — ghost, hover → solid white */
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--outline.et_pb_button{
  background-color:transparent !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.55) !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--outline.et_pb_button:hover{
  background-color:#ffffff !important;
  color:#C6041F !important;
  border-color:#ffffff !important;
}

/* Reset buttons-row grid to natural alignment (no fixed column widths) */
.picard-bewerbung-cta-buttons-row{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:14px !important;
  justify-content:flex-start !important;
}
.picard-bewerbung-cta-buttons-row > .et_pb_column{
  width:auto !important;
  flex:0 0 auto !important;
}
.picard-bewerbung-cta-buttons-row .et_pb_button_module_wrapper{
  width:auto !important;
  text-align:left !important;
}

/* --- E) Mobile adjustments --------------------------------------------------- */
@media (max-width:980px){
  .picard-bewerbung-cta-bridge::after{
    font-size:clamp(60px,16vw,140px) !important;
    right:-8vw !important;
  }
  .picard-bewerbung-cta-buttons-row{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
}

@media (max-width:560px){
  .picard-bewerbung-cta-bridge::after{
    font-size:64px !important;
    right:-10vw !important;
  }
  .picard-bewerbung-cta-eyebrow p::after{display:none !important;}
}


/* ============================================================================
   PICARD CTA-BRIDGE — PATCH 11 — Wordmark raus + Button-Hover-Lock
   David 2026-04-28 12:45
   ============================================================================ */

/* --- A) Background "C.A.PICARD" wordmark komplett raus ---------------------- */
.picard-bewerbung-cta-bridge::after{
  content:none !important;
  display:none !important;
}

/* --- B) Button hover-lock — keine Layout-Shift mehr ------------------------- */
/* Divi fügt beim Hover oft Icon-Padding/Border hinzu — alles fixieren */
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button:hover,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button:focus,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button:active{
  padding:.3em 1em !important;
  border:0 !important;
  border-width:0 !important;
  border-radius:6px !important;
  transform:none !important;
  margin:0 !important;
  line-height:1.7em !important;
  letter-spacing:0 !important;
  font-size:16px !important;
  box-shadow:none !important;
}

/* Outline-Variante: Border bleibt 1px in beiden States (statt 0 → 1) */
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--outline.et_pb_button,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--outline.et_pb_button:hover{
  border:1px solid rgba(255,255,255,.55) !important;
  border-width:1px !important;
  padding:calc(.3em - 1px) calc(1em - 1px) !important;
}
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn--outline.et_pb_button:hover{
  border-color:#ffffff !important;
}

/* Icon-Pseudos in beiden States entfernt */
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button::before,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button::after,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button:hover::before,
.picard-bewerbung-cta-bridge a.picard-bewerbung-cta-btn.et_pb_button:hover::after{
  content:none !important;
  display:none !important;
  width:0 !important;
  margin:0 !important;
  opacity:1 !important;
  transform:none !important;
}


/* ============================================================================
   PICARD SUPREME — PATCH 12 — Cream raus, pures Weiß für Step-Cards & Spine-Halo
   David 2026-04-29
   ============================================================================ */

/* Step-Card Hintergrund: cream → white */
.picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper{
  background:#ffffff !important;
}

/* Step-Dot Halo (war cream) → white. !important ENTFERNT 2026-04-29
   damit supremeDotFill keyframe to{background:#C6041F} beim Scroll einsetzen kann. */
.picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::before{
  background:#ffffff;
  box-shadow:0 0 0 6px #ffffff;
}

/* Aktivierter Dot-Fill bleibt rot, Halo white */
@supports not (animation-timeline:view()){
  .picard-bewerbung-supreme-step.dsm-content-timeline-item-wrapper::before{
    background:#C6041F !important;
    box-shadow:0 0 0 6px #ffffff !important;
  }
}
@keyframes supremeDotFill{
  to{
    background:#C6041F;
    box-shadow:0 0 0 6px #ffffff, 0 0 24px -2px rgba(198,4,31,.55);
  }
}


/* ============================================================================
   NELE-BATCH 2026-06-24  (Bewerbungsprozess)
   ============================================================================ */

/* #8 — Hero: Schraffierung weg + (R2) Parallax aus -> simples Cover-BG, Strasse zentriert (rutscht auf breiten Displays nicht mehr hoch) */
.picard-karriere-hero::after{display:none !important;}
.picard-karriere-hero{background-size:cover !important;background-position:center 35% !important;}
/* schweres dunkles ::before-Overlay -> leichter Verlauf links (Text lesbar) */
.picard-karriere-hero::before{background:linear-gradient(to right,rgba(8,10,14,.5) 0%,rgba(8,10,14,.2) 34%,rgba(8,10,14,0) 60%) !important;}
/* Mobile: Text fast volle Breite -> gleichmaessiger abdunkeln */
@media(max-width:767px){.picard-karriere-hero::before{background:linear-gradient(to bottom,rgba(8,10,14,.5) 0%,rgba(8,10,14,.42) 55%,rgba(8,10,14,.3) 100%) !important;}}

/* #9 — Timeline: "Schritt 0X" IMMER links, Erklaerungs-Karte IMMER rechts.
   Hebt die DSM-Alternierung (nth-child left/right-Insets) auf -> ruhigeres Bild. */
@media(min-width:981px){
  .picard-bewerbung-supreme-step .dsm-content-timeline-date.dsm-desktop{
    left:0 !important; right:auto !important; width:50% !important;
    text-align:right !important; padding-left:0 !important; padding-right:60px !important;
  }
  .picard-bewerbung-supreme-step .dsm-content-timeline-content-wrapper{
    left:50% !important; right:auto !important; width:50% !important;
  }
}

/* #10 — Ansprechpartner: kombinierte Team-Kachel statt 2 Personen-Karten (analog Landing, ohne Tel/Mail) */
.picard-karriere-kontakt-row .picard-karriere-kontakt-left{display:flex !important;flex-direction:column !important;grid-template-columns:none !important;gap:0 !important;align-content:start;}
.kontakt-team-card{background:#F8FAFC;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;position:relative;transition:box-shadow .3s,border-color .3s;margin-top:4px;}
.kontakt-team-card:hover{box-shadow:0 18px 36px -18px rgba(15,23,42,.18);border-color:#fff;}
.kontakt-team-card::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:#C6041F;z-index:2;}
img.ktc-photo{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;}
.ktc-photo-ph{aspect-ratio:16/9;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:#fff;text-align:center;background:linear-gradient(135deg,#cbd2d9 0%,#8a94a0 100%);}
.ktc-photo-ph svg{width:46px;height:46px;opacity:.92;}
.ktc-photo-ph span{font:600 11px/1 "Roboto",sans-serif;letter-spacing:.16em;text-transform:uppercase;opacity:.92;}
.ktc-people{display:grid;grid-template-columns:1fr 1fr;}
.ktc-person{padding:22px 18px;text-align:center;}
.ktc-person + .ktc-person{border-left:1px solid #E5E7EB;}
.ktc-person h4{margin:0 0 6px;font:700 16px/1.2 "Roboto",sans-serif;color:#0F172A;}
.ktc-person .ktc-role{display:block;margin:0;font:700 11px/1.3 "Roboto",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#C6041F;}
@media(max-width:600px){.ktc-people{grid-template-columns:1fr;}.ktc-person + .ktc-person{border-left:0;border-top:1px solid #E5E7EB;}}
/* === ENDE NELE-BATCH 2026-06-24 === */

/* ============================================================================
   MOBILE-FIX BATCH 2026-07-20 (David Safari review)
   Rows inside #picard-bewerbung-supreme are forced to width:100 percent for the
   desktop layout - on mobile that removed all side padding (text touched the
   viewport edges). Give the section itself lateral padding below 980px.
   ============================================================================ */
@media (max-width:980px){
  #picard-bewerbung-supreme{padding-left:24px !important;padding-right:24px !important;}
}
