/* Grubmair.at — gemeinsames Designsystem 2026
   Vorschaufassung: live-testing. Inhalt und Funktionen der Einzelseiten bleiben erhalten. */
:root{
  --site-bg:#09111f;--site-bg-2:#0d1729;--site-panel:#111c2f;--site-panel-2:#17243a;
  --site-ink:#eef5ff;--site-muted:#9eacc2;--site-line:#293b56;
  --site-accent:#60a5fa;--site-accent-2:#34d399;--site-warn:#fbbf24;--site-danger:#fb7185;
  --site-shadow:0 20px 65px rgba(0,0,0,.32);--site-radius:22px;--site-radius-lg:30px;
  --site-width:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;color-scheme:dark;overflow-x:hidden}
body.site-redesign{
  margin:0;min-height:100vh;color:var(--site-ink);line-height:1.6;overflow-x:hidden;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    radial-gradient(900px 540px at 86% -8%,color-mix(in srgb,var(--site-accent) 18%,transparent),transparent 62%),
    radial-gradient(760px 480px at 4% 4%,color-mix(in srgb,var(--site-accent-2) 11%,transparent),transparent 64%),
    linear-gradient(180deg,var(--site-bg-2),var(--site-bg) 46%);
}
body.site-redesign::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.22;
  background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 72%);
}
body.site-redesign a{transition:color .2s ease,border-color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease}
body.site-redesign :focus-visible{outline:2px solid var(--site-accent);outline-offset:3px}
body.site-redesign h1,body.site-redesign h2,body.site-redesign h3{color:var(--site-ink);text-wrap:balance}
body.site-redesign h1{letter-spacing:-.055em;line-height:.98}
body.site-redesign h2{letter-spacing:-.035em;line-height:1.08}
body.site-redesign p,body.site-redesign li{max-width:75ch}
body.site-redesign img,body.site-redesign video{max-width:100%;height:auto}

/* Kleine, gemeinsame Seitennavigation für ältere Einzelseiten */
.global-nav{width:min(calc(100% - 40px),var(--site-width));margin:18px auto 0;display:flex;align-items:center;justify-content:space-between;gap:16px;position:relative;z-index:40}
.global-nav .wordmark{color:var(--site-ink);font-weight:950;letter-spacing:.09em;text-decoration:none;font-size:.84rem;text-transform:uppercase}
.global-nav .wordmark i{font-style:normal;color:var(--site-accent)}
.global-nav .navlinks{display:flex;gap:8px;flex-wrap:wrap}
.global-nav .navlinks a{color:var(--site-muted);text-decoration:none;border:1px solid var(--site-line);background:rgba(255,255,255,.025);padding:8px 12px;border-radius:999px;font-size:.86rem}
.global-nav .navlinks a:hover{color:var(--site-ink);border-color:var(--site-accent);background:color-mix(in srgb,var(--site-accent) 9%,transparent)}

/* Gemeinsame Oberflächen — auch für die bereits neuen Projektseiten */
body.site-redesign .hero,
body.site-redesign .card,
body.site-redesign .panel,
body.site-redesign .slide,
body.site-redesign .section,
body.site-redesign .critical,
body.site-redesign .warning,
body.site-redesign .okay,
body.site-redesign .good,
body.site-redesign .location-card,
body.site-redesign .status-card{
  border-color:var(--site-line);box-shadow:0 12px 38px rgba(0,0,0,.16)
}
body.site-redesign .hero{box-shadow:var(--site-shadow)}
body.site-redesign .card:hover,body.site-redesign .panel:hover,body.site-redesign .location-card:hover{
  border-color:color-mix(in srgb,var(--site-accent) 70%,var(--site-line));box-shadow:0 20px 55px rgba(0,0,0,.25);transform:translateY(-3px)
}
body.site-redesign .btn,body.site-redesign button,body.site-redesign .back-link,body.site-redesign .back{
  min-height:44px;border-radius:12px;font-weight:800;text-decoration:none
}
body.site-redesign .btn-primary{
  color:#07111f;background:linear-gradient(135deg,var(--site-accent),color-mix(in srgb,var(--site-accent) 58%,var(--site-accent-2)));border-color:transparent;box-shadow:0 10px 28px color-mix(in srgb,var(--site-accent) 22%,transparent)
}
body.site-redesign .btn-secondary,body.site-redesign .back-link,body.site-redesign .back{
  color:var(--site-muted);background:rgba(255,255,255,.025);border:1px solid var(--site-line)
}
body.site-redesign .btn:hover,body.site-redesign button:hover,body.site-redesign .back-link:hover,body.site-redesign .back:hover{transform:translateY(-2px);border-color:var(--site-accent);color:var(--site-ink)}
body.site-redesign footer{color:#73849e;border-color:var(--site-line)}

/* Themenfarben */
.page-index{--site-accent:#57c7ff;--site-accent-2:#5ee6a8}
.page-projekte,.page-projekte-backup{--site-accent:#72a7ff;--site-accent-2:#8b7cff}
.page-bier-jagt{--site-accent:#fbbf24;--site-accent-2:#fb923c}
.page-bms-soc-manager{--site-accent:#4ade80;--site-accent-2:#22d3ee}
.page-kfz-praesentation{--site-accent:#5ca9ff;--site-accent-2:#34d399}
.page-mammotion-yuka-ble-proxy{--site-accent:#8bd450;--site-accent-2:#49d7b1}
.page-mx5-smart-lock{--site-accent:#fb923c;--site-accent-2:#facc15}
.page-oemag{--site-accent:#facc15;--site-accent-2:#4ade80}
.page-reifen-liste{--site-accent:#38bdf8;--site-accent-2:#fbbf24}
body.page-urlaub{--site-accent:#43d17b;--site-accent-2:#a7f3d0}
body.page-urlaub .task{background:linear-gradient(145deg,rgba(9,17,31,.74),rgba(17,31,52,.92));border:1px solid var(--site-line);border-left:5px solid var(--site-accent);color:var(--site-ink);box-shadow:0 10px 24px rgba(0,0,0,.12)}
body.page-urlaub .task strong{color:#fff}
body.page-urlaub .time{color:var(--site-accent)}
body.page-urlaub .note{background:linear-gradient(145deg,rgba(255,193,7,.08),rgba(17,31,52,.92));border-color:rgba(255,193,7,.28);color:var(--site-ink)}
body.page-urlaub .note h2{color:#ffd166;border-bottom-color:rgba(255,209,102,.28)}
.page-impressum{--site-accent:#94a3b8;--site-accent-2:#60a5fa}
body.page-grillfeier,body.page-7658{--site-accent:#a78bfa;--site-accent-2:#f472b6}
.page-pool-pumpenschutz{--site-accent:#45d4e8;--site-accent-2:#5aa7ff}
.page-pv-systemsteine-winterstrom{--site-accent:#ffd34f;--site-accent-2:#96d66d;--site-bg:#15140d;--site-bg-2:#1a180d;--site-panel:#201f15;--site-panel-2:#292719;--site-line:#45412b;--site-ink:#fff9dc;--site-muted:#c9c2a0}
.page-netzgebuehr-2027-peak-shaving,.page-netzgebuehr-2027-messungen,.page-netzgebuehr-2027-regelwerk,.page-netzgebuehr-2027-umsetzung{--site-accent:#60a5fa;--site-accent-2:#34d399}

/* Startseite und Projektübersichten */
.page-index,.page-projekte,.page-projekte-backup{display:block!important;padding:0!important}
.page-index .bg-glow,.page-projekte .bg-glow,.page-projekte-backup .bg-glow{display:none}
.page-index .container,.page-projekte .container,.page-projekte-backup .container{
  max-width:var(--site-width)!important;margin:0 auto!important;padding:34px 20px 70px!important;display:flex!important;text-align:left!important;align-items:stretch!important
}
.page-index .container>h1,.page-projekte .container>h1,.page-projekte-backup .container>h1{
  color:var(--site-ink)!important;-webkit-text-fill-color:initial!important;background:none!important;font-size:clamp(3rem,9vw,6.5rem)!important;line-height:.9!important;letter-spacing:-.07em!important;margin:34px 0 18px!important;max-width:930px
}
.page-index .subtitle,.page-projekte .subtitle,.page-projekte-backup .subtitle{
  color:var(--site-muted)!important;font-size:clamp(1.08rem,2.2vw,1.35rem)!important;font-weight:450!important;margin:0 0 48px!important;max-width:740px
}
.page-index .grid,.page-index .locations-grid,.page-projekte .grid,.page-projekte-backup .grid{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important;width:100%!important;margin-bottom:54px!important
}
.page-index .card,.page-index .location-card,.page-projekte .card,.page-projekte-backup .card{
  background:rgba(17,28,47,.82)!important;border:1px solid var(--site-line)!important;border-radius:var(--site-radius)!important;padding:25px!important;backdrop-filter:blur(10px);min-height:0!important;text-align:left!important;justify-content:flex-start!important
}
.page-index .card h3,.page-index .location-card h4,.page-projekte .card h3,.page-projekte-backup .card h3{color:var(--site-accent)!important;margin:0 0 10px!important}
.page-index .card p,.page-index .location-card p,.page-projekte .card p,.page-projekte .card li,.page-projekte-backup .card p,.page-projekte-backup .card li{color:var(--site-muted)!important}
.page-index .container>h2{font-size:clamp(1.65rem,3vw,2.35rem)!important;color:var(--site-ink)!important;margin:0 0 18px!important}
.page-index .contact-area{align-items:flex-start!important;margin:0 0 55px!important;flex-direction:row!important;flex-wrap:wrap}
.page-index .btn{width:auto!important;max-width:none!important;padding:13px 22px!important}
.page-projekte .tech-tag,.page-projekte-backup .tech-tag{background:color-mix(in srgb,var(--site-accent) 11%,transparent)!important;color:var(--site-accent)!important;border:1px solid color-mix(in srgb,var(--site-accent) 25%,transparent)}
.page-projekte .card-icon,.page-projekte-backup .card-icon{font-size:1.65rem!important;filter:saturate(.75)}
.page-projekte .button-row,.page-projekte-backup .button-row{justify-content:flex-start!important}
.page-index footer,.page-projekte footer,.page-projekte-backup footer{width:100%;text-align:left!important;border-top:1px solid var(--site-line);padding-top:22px!important}

/* Tabellen-/Dashboard-Seiten */
.page-bier-jagt,.page-bms-soc-manager,.page-kfz-praesentation,.page-reifen-liste{display:block!important;padding:0!important}
.page-bier-jagt .container,.page-bms-soc-manager .container,.page-kfz-praesentation .container,.page-reifen-liste .container{
  max-width:var(--site-width)!important;margin:0 auto!important;padding:28px 20px 70px!important
}
.page-bier-jagt header,.page-bms-soc-manager .page-header,.page-kfz-praesentation .header,.page-reifen-liste .header{
  background:rgba(17,28,47,.84)!important;border:1px solid var(--site-line)!important;border-radius:var(--site-radius-lg)!important;padding:clamp(25px,5vw,46px)!important;box-shadow:var(--site-shadow)!important;text-align:left!important;margin:16px 0 32px!important
}
.page-bier-jagt h1,.page-bms-soc-manager h1,.page-kfz-praesentation h1,.page-reifen-liste h1{
  color:var(--site-ink)!important;-webkit-text-fill-color:initial!important;background:none!important;font-size:clamp(2.3rem,6vw,4.6rem)!important;line-height:.96!important;letter-spacing:-.055em!important
}
.page-bier-jagt .subtitle,.page-bms-soc-manager .subtitle,.page-kfz-praesentation .subtitle,.page-reifen-liste .subtitle{color:var(--site-muted)!important}
.page-bier-jagt .card,.page-bier-jagt .status-card,.page-bms-soc-manager .code-block,.page-kfz-praesentation .slide,.page-reifen-liste .section,.page-reifen-liste .summary,.page-reifen-liste .critical,.page-reifen-liste .warning,.page-reifen-liste .okay,.page-reifen-liste .good{
  background:rgba(17,28,47,.82)!important;border:1px solid var(--site-line)!important;border-radius:var(--site-radius)!important;color:var(--site-ink)!important
}
body.site-redesign table{width:100%;border-collapse:separate!important;border-spacing:0!important;overflow:hidden;background:rgba(13,23,41,.7);border:1px solid var(--site-line);border-radius:16px}
body.site-redesign th{background:var(--site-panel-2)!important;color:var(--site-accent)!important;text-transform:uppercase;font-size:.75rem;letter-spacing:.075em}
body.site-redesign th,body.site-redesign td{padding:13px 14px!important;border-color:var(--site-line)!important}
body.site-redesign tr:nth-child(even) td{background:rgba(255,255,255,.018)}
body.site-redesign tr:hover td{background:color-mix(in srgb,var(--site-accent) 7%,transparent)}
.page-bier-jagt .best-deal,.page-bier-jagt .alert{border-radius:18px!important;border-color:color-mix(in srgb,var(--site-accent) 50%,var(--site-line))!important}
.page-kfz-praesentation .slide{padding:clamp(22px,4vw,38px)!important;margin-bottom:18px!important}
.page-bms-soc-manager .tech-tag{border-radius:999px!important;background:color-mix(in srgb,var(--site-accent) 11%,transparent)!important;border:1px solid color-mix(in srgb,var(--site-accent) 30%,transparent)!important;color:var(--site-accent)!important}

/* OeMAG */
.page-oemag main{max-width:var(--site-width)!important;margin:0 auto!important;padding:34px 20px 70px!important}
.page-oemag main>header,.page-oemag main>h1:first-child{margin-top:20px}
.page-oemag h1{font-size:clamp(2.4rem,6vw,4.8rem)!important;color:var(--site-ink)!important;max-width:900px}
.page-oemag .sub{color:var(--site-muted)!important;font-size:1.12rem!important;margin-bottom:36px!important}
.page-oemag .card,.page-oemag section{background:rgba(17,28,47,.82)!important;border:1px solid var(--site-line)!important;border-radius:var(--site-radius)!important;padding:22px!important;max-width:100%}
.page-oemag main>section{overflow-x:auto}.page-oemag main>section:not(.chart) table{min-width:620px}
.page-oemag .cards{gap:16px!important}.page-oemag .big,.page-oemag .amount{color:var(--site-accent)!important}
.page-oemag .bar{background:linear-gradient(90deg,var(--site-accent),var(--site-accent-2))!important;border-radius:7px}

/* Impressum / einfache Textseite */
.page-impressum{display:block!important;padding:0!important}
.page-impressum>.card{max-width:760px!important;margin:34px auto 70px!important;background:rgba(17,28,47,.86)!important;border:1px solid var(--site-line)!important;border-radius:var(--site-radius-lg)!important;padding:clamp(26px,6vw,54px)!important;box-shadow:var(--site-shadow)!important}
.page-impressum h1{font-size:clamp(2.5rem,7vw,4.6rem)!important;margin-top:0!important}.page-impressum p{color:var(--site-muted)!important}

/* Nur Vorschau: Hub zu allen Seiten, wird nicht nach live übernommen */
.page-design-review .review-wrap{width:min(calc(100% - 40px),var(--site-width));margin:42px auto 80px}
.page-design-review .review-wrap>h1{font-size:clamp(2.8rem,7vw,5.5rem);margin:24px 0 12px}.page-design-review .review-lead{color:var(--site-muted);font-size:1.15rem;margin-bottom:34px}
.page-design-review .review-group{margin-top:42px}.page-design-review .review-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.page-design-review .review-card{display:block;padding:22px;border:1px solid var(--site-line);border-radius:var(--site-radius);background:rgba(17,28,47,.82);color:var(--site-ink);text-decoration:none;box-shadow:0 12px 34px rgba(0,0,0,.14)}
.page-design-review .review-card:hover{transform:translateY(-3px);border-color:var(--site-accent)}.page-design-review .review-card span{display:block;color:var(--site-muted);font-size:.84rem;margin-top:5px}

/* Urlaub: kompakt und mobil, aber dieselbe visuelle Sprache */
.page-urlaub{display:block!important;padding:0!important}
.page-urlaub>header,.page-urlaub>main,.page-urlaub>footer{width:min(calc(100% - 40px),880px);margin-inline:auto}
.page-urlaub>header{background:rgba(17,28,47,.86)!important;border:1px solid var(--site-line)!important;border-radius:var(--site-radius-lg)!important;padding:clamp(25px,6vw,48px)!important;margin-top:28px!important;box-shadow:var(--site-shadow)}
.page-urlaub h1{font-size:clamp(2.3rem,7vw,4.5rem)!important;margin:.1em 0!important}.page-urlaub>header p{color:var(--site-muted)}
.page-urlaub section{background:rgba(17,28,47,.82)!important;border:1px solid var(--site-line)!important;border-radius:var(--site-radius)!important;padding:22px!important;margin:15px 0!important}
.page-urlaub .time{color:var(--site-accent)!important}.page-urlaub .note{border-color:var(--site-warn)!important;background:rgba(251,191,36,.08)!important}

/* Mammotion: vorhandene gute Struktur nur ans gemeinsame System binden */
.page-mammotion-yuka-ble-proxy .topbar,.page-mammotion-yuka-ble-proxy .wrap{max-width:var(--site-width)!important}
.page-mammotion-yuka-ble-proxy .hero,.page-mammotion-yuka-ble-proxy .panel,.page-mammotion-yuka-ble-proxy .step,.page-mammotion-yuka-ble-proxy .fact{background:rgba(17,28,47,.82)!important;border-color:var(--site-line)!important}
.page-mammotion-yuka-ble-proxy .eyebrow,.page-mammotion-yuka-ble-proxy .section-title,.page-mammotion-yuka-ble-proxy .status{color:var(--site-accent)!important}

/* MX-5 Präsentation: Logik und Slides nicht verändern, nur Oberflächen */
.page-mx5-smart-lock{--bg-primary:var(--site-bg)!important;--bg-secondary:var(--site-panel)!important;--bg-card:var(--site-panel-2)!important;--accent-orange:var(--site-accent)!important;--accent-blue:var(--site-accent-2)!important}
.page-mx5-smart-lock .nav-bar{background:rgba(9,17,31,.88)!important;border-color:var(--site-line)!important;backdrop-filter:blur(16px)}
.page-mx5-smart-lock .slide{border:0!important;box-shadow:none!important;background:transparent!important}
.page-mx5-smart-lock .mini-card,.page-mx5-smart-lock .feature-item,.page-mx5-smart-lock .schematic,.page-mx5-smart-lock .app-mockup{background:rgba(17,28,47,.84)!important;border-color:var(--site-line)!important;border-radius:var(--site-radius)!important}
.page-mx5-smart-lock audio{width:min(100%,660px)}

/* Referenz-Projektseiten: konsistente Tokens ohne ihren Charakter zu zerstören */
.page-pool-pumpenschutz,.page-pv-systemsteine-winterstrom,.page-netzgebuehr-2027-peak-shaving,.page-netzgebuehr-2027-messungen,.page-netzgebuehr-2027-regelwerk,.page-netzgebuehr-2027-umsetzung{background-color:var(--site-bg)}
.page-pool-pumpenschutz .wrap,.page-pv-systemsteine-winterstrom .wrap,.page-netzgebuehr-2027-peak-shaving .wrap,.page-netzgebuehr-2027-messungen .wrap,.page-netzgebuehr-2027-regelwerk .wrap,.page-netzgebuehr-2027-umsetzung .wrap{max-width:var(--site-width);width:100%;min-width:0}
.page-netzgebuehr-2027-peak-shaving .grid>*,.page-netzgebuehr-2027-messungen .grid>*,.page-netzgebuehr-2027-regelwerk .grid>*,.page-netzgebuehr-2027-umsetzung .grid>*{min-width:0}
.page-netzgebuehr-2027-peak-shaving .nav,.page-netzgebuehr-2027-messungen .nav,.page-netzgebuehr-2027-regelwerk .nav,.page-netzgebuehr-2027-umsetzung .nav{max-width:100vw;overflow:hidden}

/* Party bleibt expressiver, erhält aber saubere gemeinsame Grundwerte */
.page-grillfeier,.page-7658{--site-accent:#facc15;--site-accent-2:#f472b6;background:#07070a!important;overflow-x:hidden!important}
.page-grillfeier .hero-bg,.page-7658 .hero-bg{background:linear-gradient(135deg,#07111f 0%,#17122f 34%,#42104f 67%,#111827 100%)!important;background-size:260% 260%!important}
.page-grillfeier nav,.page-7658 nav{border-color:rgba(255,255,255,.12)!important;max-width:100vw;overflow:hidden}
.page-grillfeier .glass,.page-7658 .glass{border:1px solid rgba(255,255,255,.18)!important;box-shadow:var(--site-shadow)}

@media(max-width:820px){
  .page-index .grid,.page-index .locations-grid,.page-projekte .grid,.page-projekte-backup .grid,.page-design-review .review-grid{grid-template-columns:1fr!important}
  .page-index .container,.page-projekte .container,.page-projekte-backup .container{padding-inline:15px!important}
  .page-design-review .review-wrap{width:min(calc(100% - 28px),var(--site-width))}
  .global-nav{width:calc(100% - 30px)}
  body.site-redesign table{font-size:.86rem}
}
@media(max-width:600px){
  .global-nav{align-items:flex-start}.global-nav .navlinks{justify-content:flex-end}
  .page-index .contact-area{flex-direction:column!important;align-items:stretch!important}.page-index .btn{width:100%!important;text-align:center}
  body.site-redesign th,body.site-redesign td{padding:10px 9px!important}
}
@media print{
  body.site-redesign{background:#fff!important;color:#111!important}
  body.site-redesign::before,.global-nav{display:none!important}
  body.site-redesign h1,body.site-redesign h2,body.site-redesign h3,body.site-redesign p,body.site-redesign li,body.site-redesign strong{color:#111!important}
  body.page-urlaub .task,body.page-urlaub .note,body.page-urlaub section{background:#fff!important;color:#111!important;box-shadow:none!important;border-color:#bbb!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
