/* Karriere / Stellenanzeige – Blumen ERIC (2026-10-19) */
:root{--er-red:#E00421;--er-red-dark:#b8031b;--er-ink:#2b2b2b;--er-rose:#fdeef0}

/* Button im Hero */
.job-hero-cta{display:inline-flex;align-items:center;gap:.6em;margin:28px auto 0;padding:14px 28px;border-radius:999px;background:var(--er-red);color:#fff!important;font-family:Quicksand,sans-serif;font-weight:700;font-size:1.15rem;line-height:1.2;text-decoration:none;box-shadow:0 8px 24px rgba(224,4,33,.45);position:relative;transition:transform .2s ease,background .2s ease}
.job-hero-cta:hover,.job-hero-cta:focus-visible{background:var(--er-red-dark);transform:translateY(-2px)}
.job-hero-cta:focus-visible{outline:3px solid #fff;outline-offset:3px}
.job-hero-cta::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(224,4,33,.6);animation:job-pulse 2.4s ease-out infinite}
.job-hero-cta svg{width:22px;height:22px;flex:none}
.job-hero-cta-wrap{display:flex;justify-content:center}
@keyframes job-pulse{0%{box-shadow:0 0 0 0 rgba(224,4,33,.55)}70%{box-shadow:0 0 0 16px rgba(224,4,33,0)}100%{box-shadow:0 0 0 0 rgba(224,4,33,0)}}
@media (prefers-reduced-motion:reduce){.job-hero-cta::after{animation:none}}
@media (max-width:750px){.job-hero-cta{font-size:1rem;padding:12px 22px;margin-top:18px}}

/* Teaser-Sektion Startseite */
.job-teaser{background:var(--er-rose);padding:70px 20px;overflow:hidden}
.job-teaser-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:56px;align-items:center}
.job-teaser-flyer{display:block;position:relative;transform:rotate(-2.5deg);transition:transform .3s ease}
.job-teaser-flyer:hover{transform:rotate(0) scale(1.02)}
.job-teaser-flyer img{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.18);border:8px solid #fff;box-sizing:border-box}
.job-badge{position:absolute;top:-16px;right:-12px;background:var(--er-red);color:#fff;font-family:Quicksand,sans-serif;font-weight:700;font-size:.9rem;padding:8px 14px;border-radius:999px;transform:rotate(6deg);box-shadow:0 6px 16px rgba(224,4,33,.35)}
.job-kicker{display:inline-block;font-family:Quicksand,sans-serif;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;color:var(--er-red);margin:0 0 10px}
.job-teaser h2{font-family:Quicksand,sans-serif;font-weight:700;color:var(--er-ink);font-size:2.1rem;line-height:1.2;margin:0 0 16px}
.job-teaser p{font-family:Quicksand,sans-serif;color:var(--er-ink);font-size:1.08rem;line-height:1.6;margin:0 0 14px}
.job-facts{list-style:none;padding:0;margin:18px 0 26px;display:flex;flex-wrap:wrap;gap:10px}
.job-facts li{background:#fff;border:1px solid #f4c3ca;border-radius:999px;padding:7px 14px;font-family:Quicksand,sans-serif;font-size:.95rem;color:var(--er-ink)}
.job-btn{display:inline-flex;align-items:center;gap:.5em;padding:14px 28px;border-radius:999px;background:var(--er-red);color:#fff!important;font-family:Quicksand,sans-serif;font-weight:700;font-size:1.05rem;text-decoration:none;transition:background .2s ease,transform .2s ease}
.job-btn:hover,.job-btn:focus-visible{background:var(--er-red-dark);transform:translateY(-2px)}
.job-btn-outline{background:#fff;color:var(--er-red)!important;border:2px solid var(--er-red)}
.job-btn-outline:hover,.job-btn-outline:focus-visible{background:var(--er-rose)}
@media (max-width:850px){
  .job-teaser{padding:48px 20px}
  .job-teaser-inner{grid-template-columns:1fr;gap:34px}
  .job-teaser-flyer{max-width:440px;margin:0 auto;transform:rotate(-1.5deg)}
  .job-teaser h2{font-size:1.65rem}
  .job-btn{width:100%;justify-content:center;box-sizing:border-box}
}

/* Karriere-Unterseite */
.job-page-hero{background:var(--er-rose);padding:60px 20px 70px}
.job-page-hero-inner{max-width:1150px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:center}
.job-page-hero h1{font-family:Quicksand,sans-serif;font-weight:700;color:var(--er-red);font-size:2.6rem;line-height:1.15;margin:0 0 16px}
.job-lead{font-family:Quicksand,sans-serif;font-weight:700;color:var(--er-ink);font-size:1.45rem;line-height:1.35;margin:0 0 16px}
.job-page-hero p{font-family:Quicksand,sans-serif;color:var(--er-ink);font-size:1.1rem;line-height:1.6;margin:0 0 14px}
.job-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.job-body{background:#fff;padding:70px 20px}
.job-body-inner{max-width:1150px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:48px;align-items:start}
.job-body h2{font-family:Quicksand,sans-serif;font-weight:700;color:var(--er-ink);font-size:1.6rem;margin:0 0 18px}
.job-highlight{font-family:Quicksand,sans-serif;color:var(--er-ink);font-size:1.12rem;line-height:1.6;border-left:4px solid var(--er-red);padding:4px 0 4px 16px;margin:0 0 26px}
.job-list{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:12px}
.job-list li{position:relative;padding:12px 16px 12px 50px;background:#fafafa;border-radius:12px;font-family:Quicksand,sans-serif;color:var(--er-ink);font-size:1.05rem;line-height:1.5}
.job-list li::before{content:"";position:absolute;left:16px;top:14px;width:22px;height:22px;border-radius:50%;background:var(--er-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}
.job-closing{font-family:Quicksand,sans-serif;font-weight:700;color:var(--er-red);font-size:1.45rem;line-height:1.3;margin:0 0 10px}
.job-body p{font-family:Quicksand,sans-serif;color:var(--er-ink);font-size:1.08rem;line-height:1.6}
.job-card{position:sticky;top:110px;background:var(--er-rose);border-radius:18px;padding:28px;font-family:Quicksand,sans-serif;color:var(--er-ink)}
.job-card h3{font-size:1.3rem;font-weight:700;margin:0 0 6px;color:var(--er-ink)}
.job-card p{margin:0 0 14px;font-size:1.02rem}
.job-card a.job-contact{display:flex;align-items:center;gap:12px;padding:12px 14px;margin:0 0 10px;background:#fff;border-radius:12px;color:var(--er-ink);text-decoration:none;font-weight:700;transition:box-shadow .2s ease}
.job-card a.job-contact:hover,.job-card a.job-contact:focus-visible{box-shadow:0 4px 14px rgba(224,4,33,.2)}
.job-card a.job-contact svg{width:24px;height:24px;flex:none;color:var(--er-red)}
.job-card a.job-contact small{display:block;font-weight:400;font-size:.85rem;color:#666}
.job-sign{margin-top:18px;padding-top:16px;border-top:1px solid #f4c3ca;font-size:1rem;line-height:1.5}
.job-card .job-btn{width:100%;justify-content:center;box-sizing:border-box;margin-top:6px}
@media (max-width:900px){
  .job-page-hero{padding:36px 20px 44px}
  .job-page-hero-inner,.job-body-inner{grid-template-columns:1fr;gap:30px}
  .job-page-hero .job-teaser-flyer{order:-1;max-width:420px;margin:0 auto}
  .job-page-hero h1{font-size:1.95rem}
  .job-lead{font-size:1.2rem}
  .job-body{padding:44px 20px}
  .job-card{position:static}
  .job-actions .job-btn{flex:1 1 100%;justify-content:center}
}

/* Feinschliff */
.job-btn svg{width:20px;height:20px;flex:none}
.job-page-hero p.job-kicker,.job-teaser p.job-kicker{font-size:.85rem;font-weight:700;color:var(--er-red);margin:0 0 10px}
.job-page-hero p.job-lead{font-size:1.45rem;font-weight:700;line-height:1.35}
.job-body p.job-highlight{font-size:1.12rem}
.job-body p.job-closing{font-size:1.45rem;font-weight:700;color:var(--er-red);line-height:1.3;margin:10px 0 8px}
.job-body p.job-closing + p{margin:0 0 22px}
.job-badge{right:auto;left:-12px;transform:rotate(-6deg)}
/* Hero ist auf max. 500px begrenzt (overflow hidden) → mobil weniger Abstand unten, damit die H1 sichtbar bleibt */
@media (max-width:750px){.home-hero .hero-copy:has(.job-hero-cta){margin-bottom:28px}}
@media (max-width:900px){.job-page-hero p.job-lead{font-size:1.2rem}.job-body p.job-closing{font-size:1.25rem}}
/* Abstand zwischen Abschlusstext und Bewerbungs-Button */
.job-body p.job-closing ~ p{margin:0 0 14px}
.job-body p.job-closing ~ p:last-of-type{margin-bottom:26px}