/* Bright Up: gemeinsame Stile aller Seiten (Schriften, Farben, Navigation, Footer).
   Seitenspezifische Stile stehen im <style> der jeweiligen Seite. */

@font-face { font-family:"Sora"; src:url("/assets/fonts/Sora-Variable.ttf") format("truetype-variations"); font-weight:100 800; font-style:normal; font-display:swap; }
@font-face { font-family:"PT Mono"; src:url("/assets/fonts/PTMono-Regular.ttf") format("truetype"); font-weight:400; font-style:normal; font-display:swap; }

:root {
  --bu-orange:#ED5F2A; --bu-anthracite:#1F201E; --bu-white:#FFFFFF;
  --bu-orange-50:#FDECE4; --bu-orange-100:#FBD8C7; --bu-orange-200:#F7B499; --bu-orange-300:#F38F6B; --bu-orange-400:#F0743F;
  --bu-orange-500:#ED5F2A; --bu-orange-600:#D74E1E; --bu-orange-700:#B23E14; --bu-orange-800:#822C0E;
  --bu-ink-950:#141513; --bu-ink-900:#1F201E; --bu-ink-800:#2B2C29; --bu-ink-700:#3A3B38; --bu-ink-600:#565651; --bu-ink-500:#6E6F6A;
  --bu-ink-400:#909089; --bu-ink-300:#B4B4AD; --bu-ink-200:#D6D6D0; --bu-ink-100:#E9E9E4; --bu-ink-50:#F5F5F1;
  --bu-success:#2F9E5B; --bu-warning:#E8A417; --bu-danger:#D63B2F; --bu-info:#2F7DBF;

  --surface-page:var(--bu-white); --surface-page-dark:var(--bu-ink-900); --surface-card:var(--bu-white); --surface-card-dark:var(--bu-ink-800);
  --surface-sunken:var(--bu-ink-50); --surface-inverse:var(--bu-ink-900);
  --text-strong:var(--bu-ink-900); --text-body:var(--bu-ink-700); --text-muted:var(--bu-ink-500); --text-on-dark:var(--bu-white);
  --text-on-dark-muted:var(--bu-ink-300); --text-on-orange:var(--bu-white); --text-accent:var(--bu-orange);
  --border-subtle:var(--bu-ink-100); --border-default:var(--bu-ink-200); --border-strong:var(--bu-ink-900); --border-on-dark:rgba(255,255,255,0.14);
  --action-primary:var(--bu-orange); --action-primary-hover:var(--bu-orange-600); --action-primary-active:var(--bu-orange-700); --focus-ring:var(--bu-orange);

  --font-display:"Sora", system-ui, sans-serif; --font-text:"Sora", system-ui, sans-serif;
  --font-mono:"PT Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --fw-light:300; --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extrabold:800;
  --fs-display-2xl:clamp(3.5rem, 6vw, 6rem); --fs-display-xl:clamp(2.75rem, 5vw, 4.5rem); --fs-display-lg:clamp(2.25rem, 4vw, 3.5rem); --fs-display-md:clamp(1.875rem, 3vw, 2.5rem);
  --fs-xl:1.5rem; --fs-lg:1.25rem; --fs-md:1.125rem; --fs-base:1rem; --fs-sm:0.875rem; --fs-xs:0.75rem;
  --lh-tight:1.02; --lh-snug:1.12; --lh-normal:1.5; --lh-relaxed:1.65;
  --ls-tight:-0.02em; --ls-normal:0; --ls-label:0.08em; --ls-label-wide:0.16em;
  --type-hero-weight:var(--fw-extrabold); --type-heading-weight:var(--fw-bold); --type-kicker-family:var(--font-mono);

  --space-0:0; --space-1:0.25rem; --space-2:0.5rem; --space-3:0.75rem; --space-4:1rem; --space-5:1.5rem;
  --space-6:2rem; --space-7:3rem; --space-8:4rem; --space-9:6rem; --space-10:8rem;
  --radius-none:0; --radius-xs:2px; --radius-sm:4px; --radius-md:6px; --radius-lg:10px; --radius-xl:16px; --radius-pill:999px;
  --border-width:1px; --border-width-strong:2px;
  --shadow-none:none; --shadow-sm:0 1px 2px rgba(20,21,19,0.06); --shadow-md:0 4px 14px rgba(20,21,19,0.08);
  --shadow-lg:0 12px 32px rgba(20,21,19,0.12); --shadow-focus:0 0 0 3px rgba(237,95,42,0.35);
  --ease-standard:cubic-bezier(0.2, 0, 0, 1); --ease-out:cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:120ms; --dur-base:200ms; --dur-slow:360ms;
  --container-max:1200px; --container-wide:1440px; --gutter:clamp(1rem, 4vw, 4rem);
}

html, body { height:100%; margin:0; }
.bu-page { height:100%; position:relative; }
.bu-host { position:relative; }

/* Design-System-Bausteine */
.bu-kicker { display:inline-block; font-family:var(--font-mono); font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--bu-orange); }
.bu-button { display:inline-flex; align-items:center; justify-content:center; font-family:var(--font-text); font-weight:600; line-height:1; letter-spacing:0.06em; text-transform:uppercase; border-radius:4px; cursor:pointer; background:var(--action-primary); color:var(--text-on-orange); border:1px solid transparent; transition:background 120ms cubic-bezier(0.2,0,0,1), transform 120ms cubic-bezier(0.2,0,0,1); }
.bu-button-sm { gap:6px; font-size:13px; padding:8px 14px; }
.bu-button-lg { gap:10px; font-size:17px; padding:15px 28px; }
.bu-button:active, .bu-press:active { transform:translateY(1px); }

/* Bildrahmen (ersetzt image-slot aus Claude Design) */
.bu-slot { display:block; position:relative; width:100%; height:100%; aspect-ratio:3/2; font:13px/1.3 system-ui,-apple-system,sans-serif; }
.bu-slot-frame { position:absolute; inset:0; overflow:hidden; background:rgba(127,127,127,.08); container-type:size; }
/* Bild füllt den Rahmen wie object-fit: cover, zentriert (Breite und Höhe stehen am Bild) */
.bu-slot-frame img { position:absolute; left:50%; top:50%; display:block; max-width:none; transform:translate(-50%,-50%); }

/* Navigation */
.bu-nav { position:sticky; top:0; z-index:100; width:100%; background:transparent; transition:background 200ms cubic-bezier(0.2,0,0,1), border-color 200ms cubic-bezier(0.2,0,0,1); }
.bu-nav.is-scrolled { background:rgba(31,32,30,0.92); backdrop-filter:blur(12px); border-bottom:1px solid rgba(255,255,255,.08); }
.bu-nav-bar { max-width:1440px; margin:0 auto; padding:0 clamp(1rem,4vw,3rem); height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.bu-nav-links { display:flex; align-items:center; gap:8px; flex:1; justify-content:center; }
.bu-nav-links a, .bu-nav-mobile a { font-family:var(--font-mono); letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.82); text-decoration:none; white-space:nowrap; }
.bu-nav-links a { padding:10px 14px; }
.bu-nav-mobile { display:none; padding:8px clamp(1rem,4vw,3rem) 28px; flex-direction:column; gap:2px; background:var(--bu-ink-900); }
.bu-nav-mobile a { padding:14px 4px; border-bottom:1px solid rgba(255,255,255,.1); }
.bu-nav-links a.is-active, .bu-nav-mobile a.is-active { color:#ED5F2A; }
.bu-nav.is-open .bu-nav-mobile { display:flex; }
.bu-nav-cta { display:none; }
.bu-nav-burger { display:none; width:40px; height:40px; align-items:center; justify-content:center; background:transparent; border:1px solid rgba(255,255,255,.2); border-radius:4px; cursor:pointer; }
.bu-nav-burger span { display:block; height:2px; background:#fff; }
.bu-nav-burger span + span { margin-top:5px; }
@media (max-width: 880px) {
  .bu-nav-links { display:none !important; }
  .bu-nav-burger { display:flex !important; }
  .bu-nav-cta { display:none !important; }
}

/* Cookie-Hinweis */
.bu-consent { position:fixed; left:16px; right:16px; bottom:16px; z-index:200; max-width:720px; margin:0 auto; background:var(--bu-ink-900); color:#fff; border:1px solid rgba(255,255,255,.12); border-radius:10px; box-shadow:var(--shadow-lg); padding:20px 22px; display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; }
.bu-consent[hidden] { display:none; }
.bu-consent p { flex:1 1 320px; margin:0; font-family:var(--font-text); font-size:14px; line-height:1.55; color:var(--bu-ink-200); }
.bu-consent p a { color:#fff; }
.bu-consent-actions { display:flex; gap:10px; flex:0 0 auto; }
.bu-consent-actions button { width:140px; font-size:14px; padding:11px 18px; }
/* Beide Buttons gleich gestaltet, damit keine Auswahl hervorgehoben wird */
.bu-consent-actions button { background:transparent; border:1px solid rgba(255,255,255,.55); color:#fff; }
.bu-consent-actions button:hover { background:rgba(255,255,255,.08); }
@media (max-width: 520px) {
  .bu-consent-actions { width:100%; }
  .bu-consent-actions button { flex:1; width:auto; }
}

/* Footer */
.bu-footer { background:var(--bu-ink-950); color:#fff; padding:64px clamp(1rem,4vw,3rem) 32px; }
.bu-footer-grid { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.1); }
.bu-footer-col { display:flex; flex-direction:column; gap:12px; }
.bu-footer-head { font-family:var(--font-mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--bu-ink-400); margin-bottom:4px; }
.bu-footer-link { color:var(--bu-ink-200); font-family:var(--font-mono); font-size:13px; letter-spacing:0.04em; text-decoration:none; }
.bu-footer-contact { color:var(--bu-ink-200); font-family:var(--font-text); font-size:14px; text-decoration:none; }
.bu-footer-contact[data-accent] { color:#ED5F2A; }
.bu-footer-small { font-family:var(--font-mono); font-size:11px; letter-spacing:0.08em; color:var(--bu-ink-500); text-decoration:none; }
@media (max-width: 800px) {
  .bu-footer-grid { grid-template-columns:1fr 1fr !important; }
}
@media (max-width: 520px) {
  .bu-footer-grid { grid-template-columns:1fr !important; }
}