@font-face { font-family:'Genesis Brand'; src:url('/assets/fonts/genesis-brand.otf') format('opentype'); font-weight:100 900; font-display:swap; }
html { scroll-behavior:smooth; }
body { margin:0; background:#f7f4ee; font-family:'Genesis Brand',Bahnschrift,'Segoe UI',Arial,sans-serif; color:#1a1a1a; -webkit-font-smoothing:antialiased; }
a { color:#1a1a1a; text-decoration:none; } a:hover { color:#a66523; }
@keyframes fadeUp { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }
@keyframes drawX { from { transform:scaleX(0); } to { transform:scaleX(1); } }
a:focus-visible, button:focus-visible, input:focus-visible { outline:2px solid #a66523; outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; } }
@media (max-width: 1180px) {
  header nav#primary-nav { gap:18px !important; font-size:12px !important; letter-spacing:.09em !important; }
  header [data-dc-style*="padding:18px 48px"] { padding-left:26px !important; padding-right:26px !important; gap:16px !important; }
}
.nav-burger { display:none; }
.nav-backdrop { display:none; }
.nav-close { display:none; }
.nav-mob-cta { display:none !important; }
@media (max-width: 1024px) {
  .nav-burger { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-width:44px; font-size:23px; line-height:1; cursor:pointer; color:#1a1a1a; background:transparent; border:1px solid rgba(26,26,26,.22); order:6; }
  header .hdr-cta { display:none !important; }
  header nav#primary-nav { position:fixed !important; top:0; right:0; bottom:0; width:min(84vw, 360px); background:#f7f4ee; flex-direction:column !important; align-items:stretch !important; gap:0 !important; padding:84px 26px 30px !important; transform:translateX(106%); visibility:hidden; pointer-events:none; transition:transform .32s cubic-bezier(.22,.61,.2,1), visibility .32s; z-index:60; box-shadow:-24px 0 70px rgba(12,10,9,.24); font-size:16px !important; letter-spacing:.05em !important; overflow-y:auto; }
  .nav-burger:focus-visible { outline:2px solid #a66523; outline-offset:2px; }
  header nav#primary-nav a { padding:14px 2px !important; border-bottom:1px solid rgba(138,131,120,.18); border-bottom-width:1px !important; min-height:44px; display:flex; align-items:center; }
  .nav-backdrop { position:fixed; inset:0; background:rgba(12,10,9,.46); z-index:55; }
  .nav-close { display:inline-flex; align-items:center; justify-content:center; position:absolute; top:20px; right:22px; width:44px; height:44px; font-size:28px; line-height:1; cursor:pointer; color:#1a1a1a; border:none; background:transparent; }
  .nav-mob-cta { display:flex !important; margin-top:16px; background:#a66523; color:#fff !important; justify-content:center; text-align:center; border-bottom:none !important; padding:15px !important; letter-spacing:.14em; }
}

/* === gg-fixpack 31.07.2026 === */
@media (max-width: 1180px) {
  [data-dc-style*="max-width:1480px"] { padding-left:22px !important; padding-right:22px !important; }
  header [data-dc-style*="padding:18px 48px"] { padding-left:26px !important; padding-right:26px !important; gap:16px !important; }
  footer [data-dc-style*="display:flex; gap:64px"] { flex-direction:column !important; gap:28px !important; }
}
@media (max-width: 1024px) {
  header { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:#f7f4ee !important; }
  header nav#primary-nav { overscroll-behavior:contain; }
  .nav-backdrop { overscroll-behavior:contain; touch-action:none; }
}
@media (max-width: 560px) {
  header [data-dc-style*="padding:18px 48px"] { padding-left:16px !important; padding-right:16px !important; gap:10px !important; }
  footer [data-dc-style*="padding:56px 48px 36px"] { padding-left:22px !important; padding-right:22px !important; }
}

/* === gg-fixpack2 01.08.2026: page grids/rows (no-space selectors) === */
@media (max-width: 1180px) {
  [data-dc-style*="grid-template-columns:repeat(3, 1fr)"] { grid-template-columns:1fr 1fr !important; }
  [data-dc-style*="display:flex; gap:64px"] { flex-direction:column !important; gap:32px !important; }
  [data-dc-style*="display:flex; gap:48px"] { flex-wrap:wrap !important; }
  [data-dc-style*="text-align:right"] { text-align:left !important; }
  [data-dc-style*="padding:88px 48px"] { padding-top:56px !important; padding-bottom:56px !important; }
  [data-dc-style*="padding:64px 48px"] { padding-top:44px !important; }
}
@media (max-width: 560px) {
  [data-dc-style*="grid-template-columns:repeat(3, 1fr)"] { grid-template-columns:1fr !important; }
}
/* The runtime wraps the page in .sc-host, sized to the viewport rather than to
   the content. position:sticky only sticks inside its containing block, so the
   header came unpinned one screen down on every page. Letting the host size to
   its content restores it. Nothing moves: the content already painted outside
   that box. */
.sc-host, .sc-host > div { height: auto !important; }
/* The closed mobile drawer is parked off the right edge with translateX(106%).
   Chrome counts a fixed box that sits outside the viewport as scrollable width,
   so the page could be swiped sideways into blank space. clip on the host stops
   that. clip rather than hidden: hidden would turn the host into a scroll
   container and take window scrolling, sticky and in-page anchors with it.
   The drawer, the marquee and the Legal tab strip all still behave as before. */
@media (max-width: 1024px) { .sc-host { overflow-x: clip; } }

.skip-link { position:fixed; top:8px; left:8px; z-index:200; padding:11px 15px; background:#0e0c0a; color:#f7f4ee; transform:translateY(-150%); transition:transform .16s; }
.skip-link:focus { color:#f7f4ee; transform:translateY(0); }
html.nav-open, html.nav-open body { overflow:hidden !important; }
.career-areas-grid, .career-area-card { min-width:0; box-sizing:border-box; }
@media (max-width: 1024px) {
  header nav#primary-nav.is-open { transform:translateX(0); visibility:visible; pointer-events:auto; }
  .nav-backdrop.is-open { display:block; }
}
@media (max-width: 768px) {
  .career-areas-grid { grid-template-columns:1fr !important; overflow:visible !important; height:auto !important; }
  .career-area-card { display:block; width:100%; height:auto; overflow:visible; }
}
