@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 rise { from { transform:translateY(115%); } to { transform:translateY(0); } }
@keyframes fadeUp { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }
@keyframes drawX { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes slide1 { 0%,27% { opacity:1; } 33%,94% { opacity:0; } 100% { opacity:1; } }
@keyframes slide2 { 0%,27% { opacity:0; } 33%,60% { opacity:1; } 66%,100% { opacity:0; } }
@keyframes slide3 { 0%,60% { opacity:0; } 66%,94% { opacity:1; } 100% { opacity:0; } }
.hero-poster { display:block; background:radial-gradient(120% 90% at 82% 18%, rgba(166,101,35,.30) 0%, rgba(166,101,35,0) 58%), linear-gradient(158deg, #12100e 0%, #1b1613 46%, #0c0a09 100%); }
/* keeps the left-aligned hero copy legible over a busy frame */
.hero-scrim { position:absolute; inset:0; background:
  linear-gradient(90deg, rgba(12,10,9,.88) 0%, rgba(12,10,9,.74) 38%, rgba(12,10,9,.30) 72%, rgba(12,10,9,.44) 100%),
  linear-gradient(180deg, rgba(12,10,9,.46) 0%, rgba(12,10,9,.04) 32%, rgba(12,10,9,.48) 100%); }
/* below this width the copy spans most of the viewport, so a vertical wash
   protects it better than the left-to-right one used on wide screens */
@media (max-width: 1100px) { .hero-scrim { background:
  linear-gradient(180deg, rgba(12,10,9,.70) 0%, rgba(12,10,9,.72) 34%, rgba(12,10,9,.76) 62%, rgba(12,10,9,.82) 100%); } }


/* gg-responsive */
@media (max-width: 1180px) {
  [data-dc-style*="max-width:1480px"] { padding-left:22px !important; padding-right:22px !important; }
  .dir-row { flex-direction:column !important; height:auto !important; }
  .dir-tile { height:230px !important; flex-grow:1 !important; }
  [data-dc-style*="display:flex; gap:2px; margin-top:36px"] { flex-direction:column !important; }
  [data-dc-style*="display:flex; gap:64px"] { flex-direction:column !important; gap:32px !important; }
  [data-dc-style*="display:flex; gap:72px"] { flex-direction:column !important; gap:28px !important; }
  [data-dc-style*="padding:96px 48px 104px"] { padding-top:56px !important; padding-bottom:60px !important; }
  [data-dc-style*="padding:64px 48px"] { padding-top:44px !important; padding-bottom:44px !important; }
}
@media (max-width: 560px) {
  h1 { font-size:clamp(30px,8vw,38px) !important; }
  a[data-dc-style*="padding:17px 30px"], a[data-dc-style*="padding:16px 30px"] { flex:1 1 auto !important; text-align:center !important; }
  [data-dc-style*="display:flex; gap:18px; margin-top:34px"] { flex-wrap:wrap !important; }
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid #a66523; outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { .logo-marquee > div { animation:none !important; } *,*::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:72px"] { flex-direction:column !important; gap:28px !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:64px 48px 40px"] { 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(4, 1fr)"] { grid-template-columns:repeat(2, 1fr) !important; }
  [data-dc-style*="display:flex; gap:64px"] { flex-direction:column !important; gap:32px !important; }
  [data-dc-style*="display:flex; gap:72px"] { flex-direction:column !important; gap:28px !important; }
  [data-dc-style*="margin-top:52px; height:460px"] { flex-direction:column !important; height:auto !important; }
  a[data-dc-style*="transition:flex-grow"] { height:230px !important; flex-grow:1 !important; }
  [data-dc-style*="padding:96px 48px"] { padding-top:56px !important; padding-bottom:60px !important; }
  [data-dc-style*="padding:92px 48px"] { padding-top:56px !important; padding-bottom:60px !important; }
  [data-dc-style*="padding:64px 48px"] { padding-top:44px !important; }
}
@media (max-width: 560px) {
  a[data-dc-style*="padding:17px 30px"], a[data-dc-style*="padding:16px 30px"] { flex:1 1 auto !important; text-align:center !important; }
  [data-dc-style*="display:flex; gap:18px"] { flex-wrap:wrap !important; }
  [data-dc-style*="display:flex; gap:44px"] { flex-wrap:wrap !important; gap:24px !important; }
}

/* === gg-fixpack4: form rows === */
@media (max-width: 560px) {
  input, select, textarea { min-width:0; max-width:100%; }
  [data-dc-style*="display:flex; gap:8px"] { flex-wrap:wrap !important; }
  [data-dc-style*="display:flex; gap:8px"] > input { min-width:0 !important; flex:1 1 140px !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; } }

/* Keyboard-first page entry and mobile navigation. */
.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, html:has(dialog[data-inquiry-dialog][open]), html:has(dialog[data-inquiry-dialog][open]) body { overflow:hidden !important; }
dialog[data-inquiry-dialog]::backdrop { background:rgba(12,10,9,.72); backdrop-filter:blur(5px); }
.phone-row > input { min-width:0; }
@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: 560px) {
  [data-inquiry-dialog] { box-sizing:border-box; margin:12px auto !important; padding:64px 20px 24px !important; max-height:calc(100svh - 24px) !important; }
  [data-inquiry-dialog] form > div:first-child { flex-direction:column !important; }
  .phone-row { flex-direction:column; }
  .phone-code { flex:1 1 auto !important; width:100%; }
  .phone-row > input {
    flex: 0 0 auto !important;
    width: 100%;
  }
}