/* latin-ext */
@font-face {
  font-family: 'Archivo Black';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/archivo-black-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Archivo Black';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/archivo-black-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/space-grotesk-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/space-grotesk-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/space-grotesk-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/space-grotesk-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/space-grotesk-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/space-grotesk-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/space-grotesk-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/space-grotesk-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/space-grotesk-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


    :root { --sd-word: url("assets/wortmarke.png"); }
    :root { --sd-logo: url("assets/logo-schrift.png"); }
    @media (max-width: 760px) { .nav-logo { height: 30px !important; width: 95px !important; } }
    html { scroll-behavior: smooth; }
    /* Lenis (weicher Scroll): wenn aktiv, übernimmt es das Scrollen selbst */
    html.lenis, html.lenis body { height: auto; }
    .lenis.lenis-smooth { scroll-behavior: auto !important; }
    body { margin: 0; background: #111111; color: #f4f0ea; font-family: 'Space Grotesk', sans-serif; overflow-x: hidden; }
    a { color: #f4f0ea; text-decoration: none; }
    a:hover { color: #f59e4c; }
    ::selection { background: #e8506b; color: #fff; }
    @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    @keyframes marqueeR { from { transform: translateX(-50%); } to { transform: translateX(0); } }
    @keyframes rise { from { opacity: 0; transform: translateY(70px); } to { opacity: 1; transform: none; } }
    @keyframes growbar { from { transform: scaleX(0); } to { transform: scaleX(1); } }
    @keyframes blink { 0%,100% { opacity: 1; } 50% { opacity: .2; } }
    @keyframes flicker { 0%, 97% { opacity: 1; } 97.5% { opacity: .4; } 98% { opacity: 1; } 98.7% { opacity: .2; } 99.2% { opacity: 1; } }
    @keyframes eq { 0%,100% { transform: scaleY(.15); } 50% { transform: scaleY(1); } }
    @keyframes sweep { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
    @keyframes pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(232,80,107,.5); } 60% { box-shadow: 0 0 0 18px rgba(232,80,107,0); } }
    @keyframes loaderWave { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    @keyframes loaderText { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
    .reveal { animation: rise .8s cubic-bezier(.2,.7,.2,1) both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
    .slideout { animation: rise .8s cubic-bezier(.2,.7,.2,1) both reverse; }
    @media (max-width: 760px) {
      .m-hide { display: none !important; }
      .m-stack { grid-template-columns: 1fr !important; }
      .m-ig { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
      .m-wrap { flex-wrap: wrap !important; }
      .m-footer { flex-direction: column !important; justify-content: center !important; text-align: center; gap: 18px !important; padding-top: 28px !important; padding-bottom: 28px !important; }
      .m-footer-brand { flex-direction: column !important; gap: 10px !important; }
      .m-footer-brand > span { justify-items: center !important; }
      .m-footer-links { justify-content: center !important; }
      .m-footer-logo { height: 48px !important; }
      .m-credit { display: block !important; }
    }
    .gridbg { background-image: linear-gradient(rgba(244,240,234,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(244,240,234,.04) 1px, transparent 1px); background-size: 64px 64px; }

    /* ── Mobile-Feinschliff (Cowork) ── */
    @media (max-width: 760px) {
      /* Nav: kein Umbruch, keine Überlappung mit dem Logo */
      nav { gap: 12px !important; }
      nav > a { min-width: 0 !important; }
      nav > a > span { font-size: 12px !important; letter-spacing: .06em !important; white-space: nowrap !important; }
      nav > div { gap: 14px !important; flex: 0 0 auto !important; }
      nav > div > a:last-child { white-space: nowrap !important; padding: 8px 14px !important; font-size: 11px !important; }

      /* Hero-Statuszeile: linksbündig umbrechen statt auseinanderziehen */
      header .m-wrap { justify-content: flex-start !important; gap: 6px 14px !important; letter-spacing: .16em !important; }
      header .m-wrap > span { flex-wrap: wrap !important; white-space: normal !important; min-width: 0 !important; }

      /* Countdown-Leiste: Label darf umbrechen, CTA über die volle Breite */
      header div[style*="backdrop-filter: blur(6px)"] { gap: 16px !important; padding-top: 18px !important; padding-bottom: 22px !important; }
      header div[style*="backdrop-filter: blur(6px)"] > div > span:first-child { letter-spacing: .14em !important; white-space: normal !important; }
      header div[style*="backdrop-filter: blur(6px)"] > a { justify-self: stretch !important; text-align: center !important; padding: 15px 20px !important; }

      /* Cookie-Hinweis: gestapelt, Button volle Breite */
      div[style*="padding: 12px 4vw"] { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; }
      div[style*="padding: 12px 4vw"] > button { width: 100% !important; padding: 13px 22px !important; }
    }
    @media (max-width: 420px) {
      header h1 { font-size: 11.5vw !important; }
      nav > a > span { font-size: 11px !important; }
    }

    /* ── Mobile-Härtung (Cowork, Runde 2) ── */
    html, body { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
    @media (max-width: 760px) {
      /* Nichts im oberen Bereich darf breiter werden als der Bildschirm */
      header *, nav * { min-width: 0 !important; }
      header > div, header > div > div { max-width: 100% !important; }

      /* Statuszeile: kein Flex-Row mit Textknoten, sondern normaler Textfluss */
      header .m-wrap { display: block !important; }
      header .m-wrap > span { display: block !important; white-space: normal !important; overflow-wrap: break-word !important; line-height: 1.6 !important; }
      header .m-wrap > span > span { display: inline-block !important; vertical-align: middle !important; margin-right: 8px !important; }
      /* "CLUB & COMMUNITYSPACE" auf eigene Zeile unter der Öffnungszeit */
      header .m-wrap .m-sep { display: none !important; }
      header .m-wrap .m-line2 { display: block !important; margin-right: 0 !important; margin-top: 2px !important; }

      /* Countdown-Leiste: genau eine Spalte, alles umbruchfähig */
      header div[style*="backdrop-filter: blur(6px)"] { grid-template-columns: minmax(0, 1fr) !important; }
      header div[style*="backdrop-filter: blur(6px)"] span { white-space: normal !important; text-overflow: clip !important; overflow: visible !important; }
      header div[style*="backdrop-filter: blur(6px)"] > a { width: 100% !important; box-sizing: border-box !important; white-space: nowrap !important; }
    }

/* Hover-Zustaende (aus style-hover uebernommen)
   !important noetig: die Elemente tragen ihre Grundfarben als inline style,
   ohne !important greift der Hover-Zustand nicht. */
.hv1:hover{color: #111111 !important; background: #e8506b !important;}
.hv2:hover{background: #f59e4c !important; color: #111111 !important;}
.hv3:hover{background: #101010 !important; color: #f4f0ea !important; transform: translateY(-8px);}
.hv4:hover{color: #f59e4c !important;}
.hv5:hover{transform: scale(1.05) rotate(-1deg); filter: saturate(1.4);}
.hv6:hover{color: inherit;}
.hv7:hover{color: #f59e4c !important;}
.hv8:hover{color: #f59e4c !important;}
.hv9:hover{color: inherit;}
.hv10:hover{border-color: #f59e4c !important; color: #f59e4c !important;}
.hv11:hover{filter: brightness(1.12);}
/* Archivo 500 (Wortmarke Hero) – latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/archivo-500-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Archivo 500 (Wortmarke Hero) – latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/archivo-500-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}