/* =========================================================
   Alu-Windows24.com — Design System
   Minimalistisch · elegant · ruhig  (Apple-inspiriert)
   ========================================================= */

/* ---------- Design Tokens ---------- */
:root {
  color-scheme: light;

  /* Farben — Hell */
  --bg:            #ffffff;
  --bg-soft:       #f5f5f7;
  --bg-elevated:   #ffffff;
  --surface:       #ffffff;
  --surface-2:     #fafafa;
  --text:          #1d1d1f;
  --text-soft:     #6e6e73;
  --text-faint:    #86868b;
  --border:        rgba(0,0,0,0.10);
  --border-strong: rgba(0,0,0,0.16);
  --shadow:        0 1px 3px rgba(0,0,0,.06), 0 8px 30px rgba(0,0,0,.06);
  --shadow-lg:     0 4px 12px rgba(0,0,0,.08), 0 24px 60px rgba(0,0,0,.10);

  /* Markenfarben (aus dem Logo) */
  --accent:        #1e87c9;   /* Logo-Blau   */
  --accent-strong: #0f6fa8;
  --accent-2:      #7ac143;   /* Logo-Grün   */
  --accent-grad:   linear-gradient(120deg, #1e87c9 0%, #34a0d6 45%, #7ac143 100%);
  --accent-soft:   rgba(30,135,201,0.10);

  /* Typografie */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
          "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* Maße */
  --maxw: 1180px;
  --radius: 18px;
  --radius-sm: 12px;
  --radius-lg: 28px;
  --nav-h: 60px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

[data-theme="dark"] {
  color-scheme: dark;
  --bg:            #0b0b0d;
  --bg-soft:       #141417;
  --bg-elevated:   #1c1c1f;
  --surface:       #161618;
  --surface-2:     #1c1c20;
  --text:          #f5f5f7;
  --text-soft:     #a1a1a6;
  --text-faint:    #86868b;
  --border:        rgba(255,255,255,0.12);
  --border-strong: rgba(255,255,255,0.20);
  --shadow:        0 1px 3px rgba(0,0,0,.4), 0 8px 30px rgba(0,0,0,.5);
  --shadow-lg:     0 4px 12px rgba(0,0,0,.5), 0 24px 60px rgba(0,0,0,.6);
  --accent:        #4aa9e0;
  --accent-strong: #6cbcec;
  --accent-2:      #8bd14f;
  --accent-grad:   linear-gradient(120deg, #4aa9e0 0%, #5bb4e3 45%, #8bd14f 100%);
  --accent-soft:   rgba(74,169,224,0.14);
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.55;
  font-size: 17px;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background .4s var(--ease), color .4s var(--ease);
  overflow-x: hidden;
}

/* Silberner Schimmer nur auf der Unterseite Aluminium-Fenster */
body.fenster-page {
  background:
    radial-gradient(circle at 18% 12%, rgba(255,255,255,.92) 0, rgba(255,255,255,0) 34%),
    radial-gradient(circle at 82% 68%, rgba(255,255,255,.58) 0, rgba(255,255,255,0) 30%),
    linear-gradient(118deg, #c9ced3 0%, #f5f6f7 22%, #d8dce0 43%, #fbfbfc 58%, #c3c8cd 78%, #eef0f2 100%);
  background-size: 170% 170%, 180% 180%, 240% 240%;
  animation: fenster-silver-shimmer 18s ease-in-out infinite alternate;
}
.fenster-page .section:not(.section--soft),
.fenster-page .pagehero { background: transparent; }
.fenster-page .section--soft {
  background: rgba(240,242,244,.72);
  border-block: 1px solid rgba(105,112,119,.12);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
[data-theme="dark"] body.fenster-page {
  background:
    radial-gradient(circle at 18% 12%, rgba(255,255,255,.11) 0, rgba(255,255,255,0) 34%),
    radial-gradient(circle at 82% 68%, rgba(255,255,255,.07) 0, rgba(255,255,255,0) 30%),
    linear-gradient(118deg, #17191b 0%, #303438 24%, #1c1f22 45%, #3b4045 60%, #151719 82%, #292d31 100%);
  background-size: 170% 170%, 180% 180%, 240% 240%;
}
[data-theme="dark"] .fenster-page .section--soft {
  background: rgba(24,27,30,.78);
  border-color: rgba(255,255,255,.1);
}
.fenster-page .section.fenster-ral-session,
.fenster-page .pagehero.fenster-ral-session {
  position: relative;
  background: linear-gradient(145deg,
    color-mix(in srgb, var(--ral-tone, #c5c7c4) 13%, rgba(255,255,255,.78)),
    color-mix(in srgb, var(--ral-tone, #c5c7c4) 7%, rgba(255,255,255,.56)));
  border-block: 0;
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
.fenster-page .fenster-ral-session::after {
  content: "";
  position: absolute; left: 6%; right: 6%; bottom: 0; height: 3px;
  background: linear-gradient(90deg, transparent,
    color-mix(in srgb, var(--ral-tone, #c5c7c4) 58%, transparent) 18%,
    color-mix(in srgb, var(--ral-tone, #c5c7c4) 58%, transparent) 82%, transparent);
  pointer-events: none;
}
.fenster-page .fenster-ral-continuation::after { display: none; }
.fenster-page .ral-9016 { --ral-tone: #f1f0ea; } /* RAL 9016 Verkehrsweiß */
.fenster-page .ral-7035 { --ral-tone: #c5c7c4; } /* RAL 7035 Lichtgrau */
.fenster-page .ral-7044 { --ral-tone: #cac4b0; } /* RAL 7044 Seidengrau */
.fenster-page .ral-6021 { --ral-tone: #87a180; } /* RAL 6021 Blassgrün */
.fenster-page .ral-9007 { --ral-tone: #8f8f88; } /* RAL 9007 Graualuminium */
.fenster-page .ral-1013 { --ral-tone: #e9e5ce; } /* RAL 1013 Perlweiß */
[data-theme="dark"] .fenster-page .section.fenster-ral-session,
[data-theme="dark"] .fenster-page .pagehero.fenster-ral-session {
  background: linear-gradient(145deg,
    color-mix(in srgb, var(--ral-tone, #c5c7c4) 10%, rgba(18,20,22,.9)),
    color-mix(in srgb, var(--ral-tone, #c5c7c4) 6%, rgba(11,12,14,.84)));
}
@keyframes fenster-silver-shimmer {
  0% { background-position: 0% 0%, 100% 100%, 0% 50%; }
  50% { background-position: 45% 22%, 55% 72%, 55% 50%; }
  100% { background-position: 100% 35%, 0% 45%, 100% 50%; }
}
@media (prefers-reduced-motion: reduce) {
  body.fenster-page { animation: none; background-position: 50% 50%; }
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

/* ---------- Typografie ---------- */
h1, h2, h3, h4 { line-height: 1.08; letter-spacing: -0.03em; font-weight: 600; }
h1 { font-size: clamp(2.4rem, 6vw, 4.2rem); font-weight: 650; }
h2 { font-size: clamp(1.8rem, 4vw, 3rem); }
h3 { font-size: clamp(1.25rem, 2.2vw, 1.6rem); }
h4 { font-size: 1.1rem; }
p  { color: var(--text-soft); }
.lead { font-size: clamp(1.1rem, 2vw, 1.4rem); color: var(--text-soft); font-weight: 400; letter-spacing: -0.02em; }
.eyebrow {
  display: inline-block; font-size: .8rem; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--accent);
  margin-bottom: 1rem;
}
.text-grad {
  background: var(--accent-grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.ral-gradient-text {
  position: relative; display: inline-block; isolation: isolate;
  padding: .06em .08em;
  /* RAL 1000 → 1023 → 2004 → 3020 → 4006 → 5015 → 6018 → 7016 → 8019 → 9005 → 9007 */
  background-image: none;
  background-color: #bebd7f;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  -webkit-text-stroke: .35px rgba(0,0,0,.22);
  font-size: clamp(1.5rem, 2.7vw, 2rem);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -0.025em;
  filter: drop-shadow(0 0 6px rgba(40,116,178,.24)) drop-shadow(0 0 14px rgba(144,51,115,.16));
  animation: ral-color-cycle 24s linear infinite, ral-glow 2.8s ease-in-out infinite;
  will-change: background-color, transform, filter;
}
.ral-rainbow-heading {
  display:block; width:fit-content; margin-top:1rem;
  background-image:linear-gradient(90deg,
    #bebd7f 0%, #fad201 6.25%, #f44611 12.5%, #cc0605 18.75%,
    #903373 25%, #2874b2 31.25%, #57a639 37.5%, #383e42 43.75%, #8f8f88 47%, #bebd7f 50%,
    #fad201 56.25%, #f44611 62.5%, #cc0605 68.75%, #903373 75%,
    #2874b2 81.25%, #57a639 87.5%, #383e42 93.75%, #8f8f88 97%, #bebd7f 100%);
  background-size:200% 100%; background-position:0 50%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  -webkit-text-stroke:.35px rgba(20,24,28,.2);
  filter:drop-shadow(0 4px 12px rgba(40,116,178,.18));
  animation:ral-rainbow-flow 12s linear infinite;
}
@keyframes ral-rainbow-flow {
  to { background-position:200% 50%; }
}
[data-theme="dark"] .ral-gradient-text {
  -webkit-text-stroke-color: rgba(255,255,255,.46);
}
@keyframes ral-color-cycle {
  0%, 7%   { background-color: #bebd7f; } /* RAL 1000 Grünbeige */
  10%, 16% { background-color: #fad201; } /* RAL 1023 Verkehrsgelb */
  19%, 25% { background-color: #f44611; } /* RAL 2004 Reinorange */
  28%, 34% { background-color: #cc0605; } /* RAL 3020 Verkehrsrot */
  37%, 43% { background-color: #903373; } /* RAL 4006 Verkehrspurpur */
  46%, 52% { background-color: #2874b2; } /* RAL 5015 Himmelblau */
  55%, 61% { background-color: #57a639; } /* RAL 6018 Gelbgrün */
  64%, 70% { background-color: #383e42; } /* RAL 7016 Anthrazitgrau */
  73%, 79% { background-color: #403a3a; } /* RAL 8019 Graubraun */
  82%, 88% { background-color: #0a0a0d; } /* RAL 9005 Tiefschwarz */
  92%, 100% { background-color: #8f8f88; } /* RAL 9007 Graualuminium */
}
@keyframes ral-glow {
  0%, 100% {
    transform: translateY(0) scale(1);
    filter: drop-shadow(0 0 5px rgba(40,116,178,.20)) drop-shadow(0 0 12px rgba(144,51,115,.12));
  }
  50% {
    transform: translateY(-1px) scale(1.035);
    filter: drop-shadow(0 0 10px rgba(40,116,178,.40)) drop-shadow(0 0 22px rgba(144,51,115,.26));
  }
}
@media (prefers-reduced-motion: reduce) {
  .ral-gradient-text { animation: none; background-color: #8f8f88; }
  .ral-rainbow-heading { animation:none; background-position:45% 50%; }
}

/* ---------- Layout ---------- */
.container { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
.section { padding: clamp(64px, 10vw, 130px) 0; }
.section--soft { background: var(--bg-soft); }
.center { text-align: center; }
.narrow { max-width: 760px; margin-inline: auto; }
.grid { display: grid; gap: 28px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) {
  .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
}

/* ---------- Navigation ---------- */
.nav {
  position: sticky; top: 0; z-index: 100;
  height: var(--nav-h);
  display: flex; align-items: center;
  background: color-mix(in srgb, var(--bg) 72%, transparent);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--border);
  transition: background .4s var(--ease), border-color .4s var(--ease);
}
.nav__inner { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 24px;
  display: flex; align-items: center; gap: 24px; }
.brand { display: flex; align-items: center; gap: 11px; font-weight: 600; flex-shrink: 0; }
.brand .logo-ic { height: 34px; width: auto; }
.brand-txt { font-size: 1.18rem; font-weight: 600; letter-spacing: -0.03em; color: var(--text); }
.nav .brand .logo-ic { height: 40px; }
.nav .brand-txt { font-size: 1.25rem; }
.brand-txt b { font-weight: 600; background: var(--accent-grad);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.footer__brand .brand-txt { font-size: 1.25rem; }
.nav__links { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.nav__links a {
  position: relative; padding: 8px 14px; border-radius: 10px;
  font-size: .95rem; color: var(--text-soft); font-weight: 450;
  white-space: nowrap; transition: color .2s, background .2s;
}
.nav__links a:hover { color: var(--text); background: var(--bg-soft); }
.nav__links a.active { color: var(--text); }

/* Dropdown */
.has-drop { position: relative; }
.drop {
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px);
  background: var(--bg-elevated); border: 1px solid var(--border);
  border-radius: var(--radius-sm); box-shadow: var(--shadow-lg);
  min-width: 240px; padding: 8px; opacity: 0; visibility: hidden;
  transition: opacity .22s var(--ease), transform .22s var(--ease);
}
.has-drop:hover .drop { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.drop a { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 8px; }
.drop a span { font-size: .8rem; color: var(--text-faint); }
.drop a:hover { background: var(--accent-soft); color: var(--text); }

.nav__tools { display: flex; align-items: center; gap: 8px; }
.icon-btn {
  width: 38px; height: 38px; display: grid; place-items: center;
  border: 1px solid var(--border); border-radius: 50%;
  background: transparent; color: var(--text); transition: background .2s, border-color .2s;
}
.icon-btn:hover { background: var(--bg-soft); border-color: var(--border-strong); }
.icon-btn svg { width: 18px; height: 18px; }
[data-theme="dark"] .sun { display: block; }
[data-theme="dark"] .moon { display: none; }
.sun { display: none; }
.moon { display: block; }

.nav__burger { display: none; }
@media (max-width: 1100px) {
  .nav__links { display: none; }
  .nav__burger { display: grid; }
}
@media (max-width: 600px) {
  .nav__inner { padding-inline: 12px; gap: 10px; }
  .nav .brand { min-width: 0; gap: 7px; }
  .nav .brand .logo-ic { height: 34px; }
  .nav .brand-txt { font-size: 1rem; white-space: nowrap; }
  .nav__tools { margin-left: auto; gap: 6px; flex-shrink: 0; }
  .nav__tools > .btn { display: none; }
  .nav__tools .icon-btn { width: 34px; height: 34px; }
}
@media (max-width: 360px) {
  .container { padding-inline: 16px; }
  .nav__inner { padding-inline: 10px; gap: 8px; }
  .nav .brand .logo-ic { height: 30px; }
  .nav .brand-txt { font-size: .92rem; }
  .nav__tools { gap: 4px; }
  .nav__tools .icon-btn { width: 32px; height: 32px; }
  .win-demo, .win-card { min-width: 0; }
  .win-card { padding: 18px; }
  .win-card .slide-stage, .win-card .fold-stage { width: 100%; max-width: 280px; }
  .stat { min-width: 0; padding-inline: 6px; }
}

/* Mobile menu */
.mobile-menu {
  position: fixed; inset: var(--nav-h) 0 0 0; z-index: 99;
  background: var(--bg); padding: 24px;
  transform: translateY(-12px); opacity: 0; visibility: hidden;
  transition: opacity .3s var(--ease), transform .3s var(--ease);
  overflow-y: auto;
}
.mobile-menu.open { opacity: 1; visibility: visible; transform: translateY(0); }
.mobile-menu a { display: block; padding: 14px 4px; font-size: 1.3rem; font-weight: 500;
  border-bottom: 1px solid var(--border); }
.mobile-menu .sub { font-size: 1rem; color: var(--text-soft); padding-left: 16px; }

/* ---------- Fenstersystem-Auswahl ---------- */
.window-system-modal { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:24px; opacity:0; visibility:hidden; transition:opacity .28s ease,visibility .28s; }
.window-system-modal.open { opacity:1; visibility:visible; }
.window-system-modal__backdrop { position:absolute; inset:0; background:rgba(12,18,23,.64); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.window-system-modal__dialog { position:relative; width:min(900px,100%); max-height:min(760px,calc(100vh - 40px)); overflow:auto; padding:clamp(28px,5vw,54px);
  border:1px solid color-mix(in srgb,var(--border) 72%,transparent); border-radius:32px; background:color-mix(in srgb,var(--surface) 96%,transparent);
  box-shadow:0 34px 100px rgba(0,0,0,.32); transform:translateY(20px) scale(.97); transition:transform .38s var(--ease); }
.window-system-modal.open .window-system-modal__dialog { transform:translateY(0) scale(1); }
.window-system-modal__close { position:absolute; right:20px; top:20px; width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--border);
  border-radius:50%; background:var(--bg); color:var(--text); font-size:1.25rem; transition:background .2s,transform .2s; }
.window-system-modal__close:hover { background:var(--bg-soft); transform:rotate(6deg); }
.window-system-modal__intro { max-width:650px; }
.window-system-modal__intro h2 { margin-top:8px; font-size:clamp(2rem,5vw,3.25rem); }
.window-system-modal__intro p { margin-top:12px; font-size:1.05rem; }
.window-system-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:32px; }
.window-system-choice { position:relative; min-height:220px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; gap:7px; padding:24px;
  overflow:hidden; border:1px solid var(--border); border-radius:22px; background:linear-gradient(145deg,var(--surface),var(--bg-soft)); color:var(--text); text-align:left;
  box-shadow:var(--shadow); transition:transform .25s var(--ease),border-color .25s,box-shadow .25s,background .25s; }
.window-system-choice::before { content:""; position:absolute; width:150px; height:150px; right:-52px; top:-54px; border-radius:50%; background:var(--accent-grad); opacity:.12; }
.window-system-choice__logo { position:absolute; left:50%; top:22px; width:150px; height:72px; display:grid; place-items:center; overflow:visible;
  border:0; border-radius:0; background:transparent; box-shadow:none; }
.window-system-choice__logo { transform:translateX(-50%); }
.window-system-choice__logo img { width:100%; height:100%; object-fit:contain; display:block; }
.window-system-choice[data-window-system-choice="schueco"] .window-system-choice__logo img { mix-blend-mode:multiply; }
[data-theme="dark"] .window-system-choice[data-window-system-choice="schueco"] .window-system-choice__logo img { filter:invert(1); mix-blend-mode:screen; }
.window-system-choice strong { font-size:1.4rem; letter-spacing:-.03em; }
.window-system-choice small { color:var(--text-faint); font-size:.83rem; }
.window-system-choice i { position:absolute; right:22px; bottom:22px; color:var(--accent); font-size:1.35rem; font-style:normal; }
.window-system-choice:hover,.window-system-choice.selected { transform:translateY(-5px); border-color:var(--accent); box-shadow:var(--shadow-lg); }
.window-system-choice.selected { background:color-mix(in srgb,var(--accent-soft) 62%,var(--surface)); }
.window-system-modal__footer { min-height:48px; margin-top:26px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.window-system-modal__selection { color:var(--text-faint); font-size:.9rem; }
.window-system-modal__continue[aria-disabled="true"] { opacity:.4; pointer-events:none; }
@media (max-width:700px){
  .window-system-modal { padding:12px; }
  .window-system-modal__dialog { max-height:calc(100vh - 24px); padding:28px 20px 22px; border-radius:24px; }
  .window-system-modal__close { right:14px; top:14px; }
  .window-system-choices { grid-template-columns:1fr; gap:10px; margin-top:22px; }
  .window-system-choice { min-height:170px; padding:92px 58px 18px 18px; justify-content:flex-end; }
  .window-system-choice__logo { left:50%; top:16px; transform:translateX(-50%); width:130px; height:62px; }
  .window-system-choice i { right:18px; bottom:50%; transform:translateY(50%); }
  .window-system-modal__footer { align-items:stretch; flex-direction:column; }
  .window-system-modal__continue { justify-content:center; }
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 13px 26px; border-radius: 980px; border: 1px solid transparent;
  font-size: .98rem; font-weight: 500; letter-spacing: -0.01em;
  transition: transform .15s var(--ease), background .2s, box-shadow .2s, opacity .2s;
  white-space: nowrap;
}
.btn:active { transform: scale(.97); }
.btn--primary { background: var(--accent); color: #fff; }
.btn--primary:hover { background: var(--accent-strong); box-shadow: 0 8px 24px var(--accent-soft); }
.btn--ghost { background: transparent; border-color: var(--border-strong); color: var(--text); }
.btn--ghost:hover { background: var(--bg-soft); }
.btn--light { background: rgba(255,255,255,.14); color:#fff; backdrop-filter: blur(8px); border:1px solid rgba(255,255,255,.25);}
.btn--light:hover { background: rgba(255,255,255,.24); }
.btn--lg { padding: 16px 34px; font-size: 1.05rem; }
.btn-row { display: flex; gap: 14px; flex-wrap: wrap; }
.btn-row.center { justify-content: center; }

/* ---------- Hero ---------- */
.hero {
  position: relative; min-height: clamp(560px, 86vh, 860px);
  display: flex; align-items: center;
  color: #fff; overflow: hidden;
}
.hero__bg { position: absolute; inset: 0; z-index: -2; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.34) 45%, rgba(0,0,0,.05) 100%);
}
.hero__inner { max-width: 680px; padding: 40px 0; }
.hero h1, .hero h2 { color: #fff; }
.hero .lead { color: rgba(255,255,255,.9); margin-top: 18px; }
.hero .btn-row { margin-top: 34px; }
.hero .eyebrow { color: #9fe0ff; }
.hero .ticks li { color: rgba(255,255,255,.95); }
.hero h2.hero-sub { font-size: clamp(1.3rem, 2.6vw, 1.9rem); font-weight: 500; margin-top: 14px; color: rgba(255,255,255,.92); }
.pagehero-title { font-size: clamp(2.4rem, 6vw, 4.2rem); font-weight: 650; letter-spacing: -0.03em; line-height: 1.08; }
.feature h4 { font-size: 1.15rem; letter-spacing: -0.01em; }
.feature__ic b { font-size: 1.1rem; }

/* ---------- Bild-Thumbnail + Lightbox ---------- */
.thumb { display: block; width: 100%; margin-top: 16px; padding: 0; position: relative;
  border: 1px solid var(--border); border-radius: 12px; overflow: hidden; background: #fff;
  cursor: zoom-in; transition: border-color .2s, box-shadow .25s var(--ease), transform .25s var(--ease); }
.thumb:hover { border-color: var(--accent); box-shadow: var(--shadow); transform: translateY(-2px); }
.thumb img { width: 100%; display: block; aspect-ratio: 16 / 10; object-fit: contain; background: #fff; }
.thumb__zoom { position: absolute; right: 8px; bottom: 8px; width: 30px; height: 30px; border-radius: 8px;
  background: rgba(0,0,0,.55); color: #fff; display: grid; place-items: center; backdrop-filter: blur(4px); }
.thumb__zoom svg { width: 16px; height: 16px; }

.lightbox { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center;
  padding: 32px; background: rgba(0,0,0,.85); backdrop-filter: blur(4px);
  opacity: 0; visibility: hidden; transition: opacity .25s var(--ease), visibility .25s; }
.lightbox.open { opacity: 1; visibility: visible; }
.lightbox figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.lightbox img { max-width: min(1120px, 92vw); max-height: 84vh; border-radius: 12px;
  box-shadow: 0 30px 80px rgba(0,0,0,.6); transform: scale(.96); transition: transform .25s var(--ease); }
.lightbox.open img { transform: none; }
.lightbox figcaption { color: rgba(255,255,255,.88); font-size: .92rem; max-width: 80vw; text-align: center; }
.lightbox__close { position: absolute; top: 20px; right: 24px; width: 44px; height: 44px; border-radius: 50%;
  border: none; background: rgba(255,255,255,.15); color: #fff; display: grid; place-items: center; cursor: pointer;
  transition: background .2s; }
.lightbox__close:hover { background: rgba(255,255,255,.3); }
.lightbox__close svg { width: 22px; height: 22px; }

/* ---------- NY-Skyline Fenster-Feature (Vollflächiges, realistisches Alu-Fenster) ---------- */
.ny-feature {
  position: relative; min-height: clamp(600px, 92vh, 920px);
  display: flex; align-items: flex-end; color: #fff; overflow: hidden; background: #0b1017;
}
.ny-feature__bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.ny-feature__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 42%;
  transform: scale(1.08); transition: transform 4.4s cubic-bezier(.65,0,.35,1) .35s; }
.ny-feature.is-open .ny-feature__bg img { transform: scale(1); }

/* Fenster füllt die GESAMTE Fläche → Stadt vorab verdeckt */
.ny-window { position: absolute; inset: 0; z-index: 1; perspective: 2400px; pointer-events: none; }

/* Blendrahmen (außen) – gebürstetes Aluminium mit Fase */
.ny-window__bar { position: absolute; z-index: 4;
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 28%),
    linear-gradient(135deg, #26282b 0%, #090a0b 38%, #17191b 67%, #020303 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -2px 5px rgba(0,0,0,.7), 0 0 3px rgba(0,0,0,.75);
}
[data-theme="dark"] .ny-window__bar {
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 28%),
    linear-gradient(135deg, #26282b 0%, #090a0b 38%, #17191b 67%, #020303 100%);
}
.ny-window__bar--t, .ny-window__bar--b { left: 0; right: 0; height: 26px; }
.ny-window__bar--t { top: 0; } .ny-window__bar--b { bottom: 0; }
.ny-window__bar--l, .ny-window__bar--r { top: 0; bottom: 0; width: 26px; }
.ny-window__bar--l { left: 0; } .ny-window__bar--r { right: 0; }
/* fester Mittelpfosten (Stulp) */
.ny-window__bar--mid { top: 0; bottom: 0; left: 50%; width: 22px; transform: translateX(-50%); z-index: 5;
  transition: opacity 1.8s var(--ease) .6s; }
.ny-feature.is-open .ny-window__bar--mid { opacity: 0; }

/* Flügel – deckendes getöntes Spiegelglas (Hochhaus-Optik), verbirgt die Stadt */
.ny-sash {
  position: absolute; top: 26px; bottom: 26px; width: calc(50% - 26px); z-index: 3;
  transform-style: preserve-3d; backface-visibility: hidden; will-change: transform, box-shadow;
  transition: transform 4.4s cubic-bezier(.65,0,.35,1), box-shadow 4.4s cubic-bezier(.65,0,.35,1);
  border: 13px solid; border-image: linear-gradient(135deg, #2a2c2f, #050606 55%, #1a1c1e) 1;
  box-shadow: 0 0 0 1px rgba(0,0,0,.28), inset 0 0 0 1px rgba(0,0,0,.18);
  background:
    linear-gradient(122deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.03) 16%, rgba(150,180,205,.12) 34%, rgba(255,255,255,.02) 52%, rgba(120,150,178,.14) 70%, rgba(255,255,255,.20) 86%, rgba(255,255,255,.03) 100%),
    linear-gradient(160deg, #3a5470 0%, #25384c 38%, #2e4a64 62%, #18283800 100%),
    linear-gradient(160deg, #34506b, #1a2a3a);
}
.ny-sash::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(118deg, transparent 40%, rgba(255,255,255,.32) 47%, rgba(255,255,255,.06) 51%, transparent 58%);
}
/* Fenstergriff (Olive) am Stulp */
.ny-sash__handle { position: absolute; top: 50%; width: 11px; height: 66px; transform: translateY(-50%);
  border-radius: 6px; background: linear-gradient(135deg, #292b2e, #020303 60%, #151719);
  box-shadow: 0 3px 9px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.2); z-index: 2; }
.ny-sash--l { left: 26px; transform-origin: left center; }
.ny-sash--r { right: 26px; transform-origin: right center; }
.ny-sash--l .ny-sash__handle { right: 4px; }
.ny-sash--r .ny-sash__handle { left: 4px; }
.ny-feature.is-open .ny-sash--l { transform: rotateY(-84deg); box-shadow: -34px 0 60px rgba(0,0,0,.55); }
.ny-feature.is-open .ny-sash--r { transform: rotateY(84deg); box-shadow: 34px 0 60px rgba(0,0,0,.55); }

/* Text-Schleier: erscheint beim Öffnen über der hellen Stadt für Lesbarkeit */
.ny-feature::after {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, transparent 50%, rgba(6,10,16,.55) 84%, rgba(4,7,12,.8) 100%);
  opacity: 0; transition: opacity 2.5s var(--ease) 1.2s;
}
.ny-feature.is-open::after { opacity: 1; }
.ny-feature.is-resetting .ny-sash,
.ny-feature.is-resetting .ny-feature__bg img,
.ny-feature.is-resetting .ny-window__bar--mid,
.ny-feature.is-resetting::after { transition: none; }

.ny-feature__content { position: relative; z-index: 6; padding: 0 0 clamp(40px,7vh,76px); max-width: 640px; }
.ny-feature__content h1, .ny-feature__content h2 { color: #fff; }
.ny-feature__content .lead { color: rgba(255,255,255,.9); margin-top: 16px; }
.ny-feature__content .eyebrow { color: #9fe0ff; }
.ny-feature__content .btn-row { margin-top: 34px; }
@media (max-width: 720px) {
  .ny-window__bar--t, .ny-window__bar--b { height: 18px; }
  .ny-window__bar--l, .ny-window__bar--r { width: 18px; }
  .ny-sash { top: 18px; bottom: 18px; width: calc(50% - 18px); border-width: 9px; }
  .ny-sash--l { left: 18px; } .ny-sash--r { right: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .ny-sash, .ny-feature__bg img, .ny-window__bar--mid, .ny-feature::after { transition: none; }
}

/* Page hero (kleiner, für Unterseiten) */
.pagehero { position: relative; padding: calc(var(--nav-h) + 30px) 0 0; }
.pagehero__media {
  position: relative; height: clamp(320px, 52vh, 520px); border-radius: var(--radius-lg);
  overflow: hidden; box-shadow: var(--shadow-lg); margin-top: 26px;
}
.pagehero__media img { width: 100%; height: 100%; object-fit: cover; }
.pagehero__media::after { content:""; position:absolute; inset:0;
  background: linear-gradient(0deg, rgba(0,0,0,.45), rgba(0,0,0,.05) 60%); }
.pagehero__cap { position: absolute; left: 28px; bottom: 24px; right: 28px; color:#fff; z-index:2;}
.breadcrumb { font-size: .9rem; color: var(--text-faint); display: flex; gap: 8px; align-items: center; }
.breadcrumb a:hover { color: var(--accent); }
.fenster-page .pagehero__media { width:100vw; height:clamp(420px,65vh,680px);
  margin-left:calc(50% - 50vw); border-radius:0; box-shadow:none; }
.fenster-page .pagehero__cap { left:max(24px,calc((100vw - var(--maxw))/2 + 24px));
  right:max(24px,calc((100vw - var(--maxw))/2 + 24px)); bottom:32px; }

/* ---------- Cards ---------- */
.card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s;
  display: flex; flex-direction: column;
}
.card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: var(--border-strong); }
.card__media { aspect-ratio: 4/3; overflow: hidden; background: var(--bg-soft); }
.card__media img { width:100%; height:100%; object-fit: cover; transition: transform .6s var(--ease); }
.card:hover .card__media img { transform: scale(1.05); }
.card__body { padding: 22px 22px 26px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.card__body h3 { letter-spacing: -0.02em; }
.card__body p { font-size: .96rem; }
.card__link { margin-top: auto; padding-top: 12px; color: var(--accent); font-weight: 500; font-size: .95rem;
  display: inline-flex; align-items: center; gap: 6px; }
.card:hover .card__link svg { transform: translateX(4px); }
.card__link svg { transition: transform .25s var(--ease); width: 16px; height: 16px; }

/* Feature tiles */
.feature { display: flex; flex-direction: column; gap: 12px; padding: 28px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); height: 100%; }
.feature__ic { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center;
  background: var(--accent-soft); color: var(--accent); }
.feature__ic svg { width: 24px; height: 24px; }
.feature h3 { font-size: 1.2rem; }
.feature p { font-size: .96rem; }

/* Split content */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px,5vw,64px); align-items: center; }
.split--rev .split__media { order: 2; }
.split__media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); width:100%; }
.split__media.framed { border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-lg);}
@media (max-width: 820px) { .split { grid-template-columns: 1fr; } .split--rev .split__media { order: 0; } }

/* Full-width benefits image banner */
.benefits-banner {
  position: relative; min-height: clamp(560px, 72vh, 780px);
  display: flex; align-items: center; overflow: hidden; color: #fff;
}
.benefits-banner__media {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 56%;
}
.benefits-banner::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(5,10,12,.82) 0%, rgba(5,10,12,.62) 35%, rgba(5,10,12,.18) 72%, rgba(5,10,12,.08) 100%);
}
.benefits-banner__inner { position: relative; z-index: 1; width: 100%; }
.benefits-banner__content { max-width: 620px; padding: clamp(72px, 9vw, 130px) 0; }
.benefits-banner .eyebrow { color: #9fe0ff; }
.benefits-banner h2 { color: #fff; }
.benefits-banner .ticks li { color: rgba(255,255,255,.96); }
@media (max-width: 720px) {
  .benefits-banner { min-height: 680px; align-items: flex-end; }
  .benefits-banner__media { object-position: 58% center; }
  .benefits-banner::after {
    background: linear-gradient(0deg, rgba(5,10,12,.90) 0%, rgba(5,10,12,.68) 60%, rgba(5,10,12,.18) 100%);
  }
  .benefits-banner__content { padding: 82px 0 64px; }
}

/* List ticks */
.ticks { list-style: none; display: flex; flex-direction: column; gap: 14px; margin-top: 22px; }
.ticks li { display: flex; gap: 12px; align-items: flex-start; color: var(--text); }
.ticks li::before {
  content: ""; flex-shrink: 0; width: 22px; height: 22px; margin-top: 2px;
  border-radius: 50%; background: var(--accent-2);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/16px no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/16px no-repeat;
}

/* Stats */
.stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.stat { text-align: center; padding: 18px; }
.stat__num { font-size: clamp(2.2rem,5vw,3.4rem); font-weight: 650; letter-spacing: -0.04em;
  background: var(--accent-grad); -webkit-background-clip: text; background-clip:text; -webkit-text-fill-color: transparent; }
.stat__lbl { color: var(--text-soft); font-size: .95rem; margin-top: 4px; }
@media (max-width: 720px) { .stats { grid-template-columns: repeat(2,1fr); } }

/* Brand logos strip */
.brands { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(28px,6vw,72px); }
.brand-pill { font-weight: 600; font-size: 1.25rem; letter-spacing: -0.02em; color: var(--text-soft);
  opacity: .8; transition: opacity .2s, color .2s; }
.brand-pill:hover { opacity: 1; color: var(--text); }
.brand-pill small { display:block; font-size:.7rem; font-weight:500; letter-spacing:.04em; color: var(--text-faint); text-transform: uppercase;}

/* ---------- Fenster-Animation (CSS) ---------- */
.win-demo { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
@media (max-width: 1020px){ .win-demo { grid-template-columns: repeat(2,1fr); max-width:760px; margin-inline:auto; } }
@media (max-width: 640px){ .win-demo { grid-template-columns: 1fr; max-width:380px; } }
.win-card { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius);
  padding: 26px; text-align:center; }
.win-stage { perspective: 900px; width: 170px; height: 200px; margin: 6px auto 18px; position: relative; }
.win-frame {
  position: absolute; inset: 0; border-radius: 8px;
  background: linear-gradient(135deg, var(--bg-soft), var(--surface-2));
  border: 7px solid #c7ccd1; box-shadow: inset 0 0 0 2px rgba(0,0,0,.04);
}
[data-theme="dark"] .win-frame { border-color: #3a3f45; }
.win-sash {
  position: absolute; inset: 9px; border-radius: 5px;
  border: 6px solid #d7dbe0;
  background: linear-gradient(135deg, rgba(120,190,235,.45), rgba(170,215,245,.25) 40%, rgba(255,255,255,.12));
  backdrop-filter: none; -webkit-backdrop-filter: none;
  transform-style: preserve-3d;
  transition: transform 1.6s var(--ease);
  box-shadow: 0 6px 14px rgba(0,0,0,.12);
}
[data-theme="dark"] .win-sash { border-color:#4b5159;
  background: linear-gradient(135deg, rgba(74,169,224,.4), rgba(74,169,224,.16) 40%, rgba(255,255,255,.05)); }
.win-sash::after { /* Griff */
  content:""; position:absolute; top:50%; right:-3px; width:5px; height:26px; transform: translateY(-50%);
  border-radius: 3px; background: #8a9099;
}
.win-handle-right .win-sash::after { right:auto; left:-3px; }
/* Dreh (an linker Kante) */
.win-stage.is-open .win-sash { transform: rotateY(-42deg); }
.win-handle-right .win-sash { transform-origin: right center; }
.win-handle-right.is-open .win-sash { transform: rotateY(42deg); }
.win-handle-left .win-sash { transform-origin: left center; }
/* Dreh nach außen (Schwenk vom Betrachter weg) */
.win-out .win-sash { transform-origin: right center; }
.win-out.is-open .win-sash { transform: rotateY(-38deg); }
.win-out .win-sash::after { right:auto; left:-3px; }
.win-out .win-sash { z-index:2; }
.win-out-sun { position:absolute; z-index:1; top:20px; right:18px; width:35px; height:35px;
  color:#f3ac18; pointer-events:none;
  transition:transform 1.6s var(--ease), color 1.2s var(--ease); }
.win-out.is-open .win-out-sun { transform:scale(1.16) rotate(18deg); color:#f7b928; }
.win-out-tag { position:absolute; top:8px; right:8px; width:26px; height:26px; border-radius:50%;
  background: var(--accent-soft); color: var(--accent); display:grid; place-items:center; z-index:2; }
.win-out-tag svg { width:15px; height:15px; }
/* Zweiflüglige Fenster */
.win-stage--double { width:230px; }
.win-stage--double .win-sash { inset:auto; top:9px; bottom:9px; width:calc(50% - 9px); }
.win-stage--double .win-sash--left { left:9px; transform-origin:left center; }
.win-stage--double .win-sash--right { right:9px; transform-origin:right center; }
.win-stage--double .win-sash--left::after { right:-3px; left:auto; }
.win-stage--double .win-sash--right::after { right:auto; left:-3px; }
.win-stage--double.is-open .win-sash--left { transform:rotateY(-48deg); }
.win-stage--double.is-open .win-sash--right { transform:rotateY(48deg); }
.win-with-mullion .win-sash { width:calc(50% - 14px); }
.win-mullion { position:absolute; z-index:3; top:7px; bottom:7px; left:50%; width:11px;
  transform:translateX(-50%); border-radius:3px;
  background:linear-gradient(90deg,#b7bdc4,#e0e4e8 48%,#aeb5bd);
  box-shadow:0 0 0 1px rgba(0,0,0,.08), 0 3px 8px rgba(0,0,0,.12); }
[data-theme="dark"] .win-mullion { background:linear-gradient(90deg,#30353b,#555c65 48%,#292e34); }
/* Kipp (an unterer Kante) */
.win-tilt .win-sash { transform-origin: bottom center; }
.win-tilt.is-open .win-sash { transform: rotateX(-28deg); }
.win-tilt .win-sash::after { top:-3px; left:50%; right:auto; transform:translateX(-50%); width:26px; height:5px; }
/* Kipp nach außen (Klappflügel/Ausstellfenster — an oberer Kante, Schwenk vom Betrachter weg) */
.win-tilt-out .win-sash { transform-origin: top center; }
.win-tilt-out.is-open .win-sash { transform: rotateX(-26deg); }
.win-tilt-out .win-sash::after { top:auto; bottom:-3px; left:50%; right:auto; transform:translateX(-50%); width:26px; height:5px; }
/* Dreh-Kipp kombiniert nutzt JS-Klassen */
.win-dk .win-sash { transform-origin:right center; }
.win-dk .win-sash::after { top:50%; right:auto; left:-4px; width:6px; height:28px;
  transform-origin:50% 3px; transform:translateY(-3px) rotate(0deg);
  background:linear-gradient(90deg,#747b84,#aeb4bb 48%,#626973);
  box-shadow:0 1px 3px rgba(0,0,0,.28); transition:transform .55s var(--ease); }
.win-dk.is-open .win-sash { transform-origin:right center; transform:rotateY(48deg); }
.win-dk.is-open .win-sash::after { transform:translateY(-3px) rotate(-90deg); }
.win-dk.is-tilt .win-sash { transform-origin:bottom center; transform:rotateX(-28deg); }
.win-dk.is-tilt .win-sash::after { transform:translateY(-3px) rotate(180deg); }
.win-dk-state { display:inline-flex; align-items:center; justify-content:center; gap:9px;
  min-height:28px; margin:-8px auto 10px; padding:5px 11px; border-radius:999px;
  background:var(--accent-soft); color:var(--text-soft); font-size:.76rem; font-weight:600; }
.win-dk-state i { position:relative; display:block; width:5px; height:17px; border-radius:3px;
  background:#838a93; transform-origin:50% 2px; transition:transform .55s var(--ease); }
.win-dk-state[data-state="open"] i { transform:rotate(-90deg); }
.win-dk-state[data-state="tilt"] i { transform:rotate(180deg); }
.win-dk-actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:14px; }
.win-dk-toggle { padding-inline:14px; }
.win-dk-toggle[aria-pressed="true"] { color:#fff; border-color:var(--accent); background:var(--accent); }
.win-name { font-weight: 600; font-size: 1.05rem; }
.win-desc { font-size: .9rem; color: var(--text-soft); margin-top: 4px; min-height: 2.6em; }
.win-toggle { margin-top: 14px; }

/* Schiebe-Animation */
.slide-stage { width: 260px; height: 170px; margin: 0 auto 18px; position: relative;
  border: 7px solid #c7ccd1; border-radius: 8px; overflow: hidden; background: linear-gradient(135deg,#cfe6f5,#eef6fb);}
[data-theme="dark"] .slide-stage { border-color:#3a3f45; background: linear-gradient(135deg,#1d2a33,#11161a);}
.slide-pane { position:absolute; top:0; bottom:0; width:50%;
  border:5px solid #d7dbe0; border-radius:4px;
  background: linear-gradient(135deg, rgba(120,190,235,.4), rgba(255,255,255,.12));
  transition: transform 1.6s var(--ease); }
[data-theme="dark"] .slide-pane { border-color:#4b5159; }
.slide-pane.fixed { left:0; }
.slide-pane.moving { left:50%; z-index:2; }
.slide-stage.is-open .slide-pane.moving { transform: translateX(-48%); }

/* ---------- Aufbau-Animation (Fenster-Querschnitt) ---------- */
.aufbau { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(28px,4vw,56px); align-items: center; }
@media (max-width: 880px){ .aufbau { grid-template-columns: 1fr; } }
.tech-explorer { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr); gap:28px; align-items:start; }
.tech-diagram { position:relative; min-height:0; aspect-ratio:1697/1080; overflow:hidden; border:1px solid rgba(87,96,105,.18);
  border-radius:30px; background:
    radial-gradient(circle at 50% 44%, rgba(255,255,255,.96), rgba(235,239,242,.76) 52%, rgba(197,203,208,.56)),
    linear-gradient(145deg,rgba(255,255,255,.84),rgba(191,198,204,.48));
  box-shadow:0 28px 70px rgba(48,56,64,.14), inset 0 1px 0 rgba(255,255,255,.9); }
[data-theme="dark"] .tech-diagram { background:radial-gradient(circle at 50% 44%,#2c3237,#171b1f 64%,#101316); }
.tech-diagram__grid { position:absolute; inset:0; opacity:.28; pointer-events:none;
  background-image:linear-gradient(rgba(86,100,112,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(86,100,112,.12) 1px,transparent 1px);
  background-size:32px 32px; mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent); }
.tech-diagram__zoom { position:absolute; inset:0; transform-origin:var(--focus-x,31%) var(--focus-y,40%);
  transform:scale(1.62); transition:transform .9s var(--ease),transform-origin .15s linear; }
.tech-explorer.is-overview .tech-diagram__zoom { transform:scale(1); transform-origin:50% 50%; }
.tech-real-image { width:100%; height:100%; object-fit:contain; display:block; }
.tech-window-model { position:absolute; left:50%; top:50%; width:300px; height:390px; transform:translate(-50%,-50%); }
.tech-model__outer { position:absolute; inset:0; border:26px solid transparent; border-radius:18px;
  background:linear-gradient(135deg,#f6f7f8 0%,#858e96 20%,#d8dde1 44%,#727c85 68%,#eef1f3 100%) border-box;
  mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0); mask-composite:exclude;
  box-shadow:0 20px 34px rgba(29,35,40,.18); }
.tech-model__thermal { position:absolute; inset:19px; border:8px solid #27343d; border-radius:12px; opacity:.92; }
.tech-model__sash { position:absolute; inset:32px; border:18px solid transparent; border-radius:11px;
  background:linear-gradient(135deg,#e9edf0,#6e7882 26%,#dfe3e6 53%,#747e87 76%,#f4f5f6) border-box;
  mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0); mask-composite:exclude; }
.tech-model__gasket { position:absolute; inset:45px; border:5px solid #151c21; border-radius:7px; }
.tech-model__glass { position:absolute; inset:53px; overflow:hidden; border-radius:4px;
  background:linear-gradient(135deg,rgba(194,230,249,.92),rgba(238,249,255,.58) 45%,rgba(132,192,225,.34));
  box-shadow:inset 0 0 34px rgba(255,255,255,.72); }
.tech-model__glass i { position:absolute; top:0; bottom:0; width:3px; background:rgba(255,255,255,.94); box-shadow:1px 0 0 rgba(62,116,145,.28); }
.tech-model__glass i:nth-child(1){left:18%}.tech-model__glass i:nth-child(2){left:50%}.tech-model__glass i:nth-child(3){left:82%}
.tech-model__warm-edge { position:absolute; left:51px; right:51px; bottom:49px; height:9px; border-radius:3px; background:#20292f; }
.tech-model__handle { position:absolute; right:37px; top:47%; width:9px; height:55px; border-radius:6px;
  background:linear-gradient(90deg,#5d6670,#d6dadd 48%,#59626b); box-shadow:0 3px 8px rgba(0,0,0,.2); }
.tech-model__chambers { position:absolute; left:18px; right:18px; bottom:8px; height:30px; display:grid; grid-template-columns:repeat(4,1fr); gap:5px; padding:5px;
  border-radius:7px; background:linear-gradient(180deg,#8d969e,#d9dde0); box-shadow:inset 0 0 0 2px rgba(255,255,255,.5); }
.tech-model__chambers i { border-radius:3px; background:#3b474f; box-shadow:inset 0 2px 5px rgba(0,0,0,.3); }
.tech-pin { position:absolute; z-index:5; left:var(--px); top:var(--py); width:42px; height:42px; padding:0;
  transform:translate(-50%,-50%); border-radius:50%; border:2px solid rgba(255,255,255,.96);
  background:#1e87c9; color:#fff; font-size:.72rem; font-weight:750; letter-spacing:.03em;
  box-shadow:0 0 0 1px rgba(16,83,126,.35),0 8px 22px rgba(30,135,201,.28);
  transition:transform .25s var(--ease),opacity .25s,background .25s; }
.tech-pin::after { content:""; position:absolute; left:50%; bottom:-10px; transform:translateX(-50%);
  border-left:6px solid transparent; border-right:6px solid transparent; border-top:9px solid #1e87c9; }
.tech-pin:hover,.tech-pin.active { transform:translate(-50%,-50%) scale(1.18); background:#7ac143; }
.tech-pin.active::after { border-top-color:#7ac143; }
.tech-explorer:not(.is-overview) .tech-pin:not(.active) { opacity:.3; }
.tech-zoom-badge { position:absolute; z-index:4; left:20px; top:20px; display:flex; align-items:center; gap:9px;
  padding:8px 13px; border-radius:999px; background:rgba(255,255,255,.86); border:1px solid rgba(0,0,0,.08);
  color:#30363b; font-size:.78rem; box-shadow:0 8px 24px rgba(0,0,0,.08); }
.tech-zoom-badge span { color:#1e87c9; font-weight:800; }.tech-zoom-badge b { font-weight:650; }
.tech-detail { display:flex; flex-direction:column; padding:clamp(26px,4vw,44px); border:1px solid var(--border);
  border-radius:30px; background:color-mix(in srgb,var(--surface) 88%,transparent); box-shadow:var(--shadow-lg); }
.tech-detail__top { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:28px; }
.tech-detail__top span { color:var(--accent); font-size:.75rem; font-weight:750; letter-spacing:.11em; }
.tech-detail__top button { border:0; background:transparent; color:var(--text-faint); font-size:.8rem; padding:5px 0; }
.tech-detail__top button:hover { color:var(--accent); }
.tech-detail h3 { font-size:clamp(1.6rem,3vw,2.35rem); margin-bottom:14px; }
.tech-detail > p { font-size:1.03rem; line-height:1.65; min-height:8em; }
.tech-specs { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 28px; }
.tech-specs span { padding:7px 12px; border-radius:999px; background:var(--accent-soft); color:var(--text); font-size:.78rem; font-weight:650; }
.tech-part-list { margin-top:auto; display:grid; grid-template-columns:1fr; gap:7px; }
.tech-part-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; }
.tech-part-list button { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px; width:100%;
  padding:10px 12px; border:1px solid transparent; border-radius:12px; background:transparent; color:var(--text); text-align:left;
  transition:background .2s,border-color .2s,transform .2s; }
.tech-part-list button:hover { background:var(--bg-soft); transform:translateX(3px); }
.tech-part-list button.active { background:var(--accent-soft); border-color:color-mix(in srgb,var(--accent) 28%,transparent); }
.tech-part-list button b { color:var(--accent); font-size:.72rem; }.tech-part-list button span { font-size:.9rem; font-weight:580; }
.tech-part-list button i { color:var(--accent); font-style:normal; font-size:1.1rem; }
.tech-more { display:inline-flex; align-items:center; justify-content:center; min-width:52px; padding:7px 10px; border:1px solid color-mix(in srgb,var(--accent) 32%,var(--border));
  border-radius:999px; background:var(--accent-soft); color:var(--accent); font-size:.74rem; font-weight:700; transition:transform .2s,background .2s,color .2s; }
.tech-more:hover { transform:translateX(2px); background:var(--accent); color:#fff; }
@media (max-width:900px){ .tech-explorer { grid-template-columns:1fr; }.tech-detail > p { min-height:0; } }
@media (max-width:520px){ .tech-diagram { border-radius:22px }.tech-pin { width:34px;height:34px }.tech-detail { border-radius:22px;padding:24px 18px }.tech-part-list button { padding:9px 8px;gap:7px }.tech-more { min-width:48px;padding:7px 8px } }
.aw-figure { position: relative; background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 18px; box-shadow: var(--shadow); }
.aw-svg { width: 100%; height: auto; display: block; border-radius: var(--radius); }
.aw-svg .alu-out { fill: url(#awAlu); }
.aw-svg text { font-family: var(--font); }

/* Bauteil-Gruppen */
.awpart { cursor: pointer; }
.awpart__hl { fill: transparent; stroke: var(--accent); stroke-width: 3.5; stroke-dasharray: 5 5;
  opacity: 0; transition: opacity .35s var(--ease); rx: 7; }
.awpart.active .awpart__hl { opacity: 1; animation: awdash 14s linear infinite; }
@keyframes awdash { to { stroke-dashoffset: -200; } }
.awpart .shape { transition: opacity .35s var(--ease); }
.aw-figure.has-active .awpart:not(.active) .shape { opacity: .45; }
.awpart__dot circle { fill: var(--bg-elevated); stroke: var(--accent); stroke-width: 2.5;
  transition: transform .3s var(--ease), fill .3s; transform-origin: center; transform-box: fill-box; }
.awpart__dot text { fill: var(--accent); font-size: 15px; font-weight: 700; transition: fill .3s; }
.awpart:hover .awpart__dot circle { fill: var(--accent-soft); }
.awpart.active .awpart__dot circle { fill: var(--accent); transform: scale(1.28); }
.awpart.active .awpart__dot text { fill: #fff; }

/* Stepper-Panel */
.aw-step__eyebrow { display: flex; align-items: center; gap: 10px; color: var(--accent);
  font-weight: 600; font-size: .85rem; letter-spacing: .04em; }
.aw-step__num { width: 30px; height: 30px; border-radius: 50%; background: var(--accent); color:#fff;
  display: grid; place-items: center; font-size: .95rem; font-weight: 700; }
.aw-step h3 { margin: 14px 0 8px; min-height: 2.2em; }
.aw-step p { font-size: 1.02rem; min-height: 4.6em; }
.aw-dots { display: flex; gap: 8px; margin-top: 18px; }
.aw-dots button { width: 30px; height: 6px; border-radius: 99px; border: none; background: var(--border-strong);
  cursor: pointer; transition: background .3s, width .3s; padding: 0; }
.aw-dots button.on { background: var(--accent); width: 44px; }
.aw-step__ctrl { display: flex; align-items: center; gap: 10px; margin-top: 22px; }
.aw-step__ctrl button { display: grid; place-items: center; }
.aw-ctrl-ic { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--border-strong);
  background: var(--surface); color: var(--text); }
.aw-ctrl-ic:hover { background: var(--bg-soft); }
.aw-ctrl-ic svg { width: 18px; height: 18px; }
.aw-play { padding: 0 18px; height: 42px; border-radius: 99px; border: none; background: var(--accent); color:#fff;
  font-weight: 500; font-size: .92rem; display: inline-flex; align-items: center; gap: 8px; }
.aw-play:hover { background: var(--accent-strong); }
.aw-play svg { width: 15px; height: 15px; }

/* ---------- Scrollytelling: echtes Fenster-Profil ---------- */
.scrolly__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px,5vw,72px); align-items: start; }
.scrolly__stage-wrap { position: sticky; top: 0; height: 100vh; display: flex; align-items: center; }
.scrolly__stage { position: relative; width: 100%; aspect-ratio: 1/1; max-height: 78vh;
  overflow: hidden;
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 68%, transparent 100%);
          mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 68%, transparent 100%); }
.scrolly__img { position: absolute; inset: 0; background-size: cover; background-position: center;
  background-repeat: no-repeat; transform-origin: 0 0; transition: transform 1.05s var(--ease);
  will-change: transform; }
[data-theme="dark"] .scrolly__img { filter: brightness(.86) contrast(1.05); }
.scrolly__focus { position: absolute; left: 50%; top: 50%; width: clamp(90px,16vw,150px); height: clamp(90px,16vw,150px);
  transform: translate(-50%,-50%); border-radius: 50%; pointer-events: none;
  opacity: 0; transition: opacity .6s var(--ease); }
.scrolly__focus::before, .scrolly__focus::after { content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid var(--accent); }
.scrolly__focus::after { animation: focusPulse 2.4s var(--ease) infinite; }
@keyframes focusPulse { 0% { transform: scale(.7); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } }
.scrolly__stage.zoom .scrolly__focus { opacity: 1; }
.scrolly__badge { position: absolute; left: 16px; top: 16px; z-index: 2;
  background: color-mix(in srgb, var(--bg-elevated) 80%, transparent); backdrop-filter: blur(8px);
  border: 1px solid var(--border); border-radius: 999px; padding: 7px 15px; font-size: .82rem; font-weight: 600;
  color: var(--text); display: flex; align-items: center; gap: 8px; }
.scrolly__badge b { color: var(--accent); }
.scrolly__hint { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 2;
  font-size: .78rem; color: var(--text-soft); background: color-mix(in srgb, var(--bg-elevated) 80%, transparent);
  backdrop-filter: blur(8px); border: 1px solid var(--border); border-radius: 999px; padding: 6px 14px;
  display: flex; align-items: center; gap: 7px; transition: opacity .4s; }
.scrolly__hint svg { width: 14px; height: 14px; animation: hintBob 1.6s ease-in-out infinite; }
@keyframes hintBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(4px); } }
.scrolly__stage.zoom .scrolly__hint { opacity: 0; }

.scrolly__steps { display: flex; flex-direction: column; padding: 30vh 0; }
.scrolly__step { min-height: 78vh; display: flex; flex-direction: column; justify-content: center; gap: 14px;
  opacity: .28; transform: translateY(8px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.scrolly__step.active { opacity: 1; transform: none; }
.scrolly__step .num { font-size: .82rem; font-weight: 700; color: var(--accent); letter-spacing: .12em; }
.scrolly__step h3 { font-size: clamp(1.5rem,3vw,2.3rem); }
.scrolly__step p { font-size: clamp(1rem,1.6vw,1.15rem); max-width: 36ch; }
.scrolly__step .spec { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px;
  font-size: .85rem; font-weight: 600; color: var(--text); background: var(--accent-soft);
  border-radius: 999px; padding: 6px 14px; align-self: flex-start; }

@media (max-width: 880px) {
  .scrolly__grid { grid-template-columns: 1fr; gap: 0; }
  .scrolly__stage-wrap { position: sticky; top: calc(var(--nav-h) + 10px); height: auto; z-index: 5;
    margin-bottom: 10px; }
  .scrolly__stage { aspect-ratio: 16/11; max-height: 42vh; }
  .scrolly__steps { padding: 6vh 0 20vh; }
  .scrolly__step { min-height: 72vh; }
}
@media (prefers-reduced-motion: reduce) { .scrolly__img { transition: none; } }

/* Falt-Animation (Faltanlage) */
.win-demo.cols2 { grid-template-columns: repeat(2, 1fr); max-width: 860px; margin-inline: auto; }
@media (max-width: 680px){ .win-demo.cols2 { grid-template-columns: 1fr; max-width: 380px; } }
.fold-stage { width: 280px; height: 170px; margin: 0 auto 18px; position: relative;
  border: 7px solid #c7ccd1; border-radius: 8px; overflow: hidden;
  background: linear-gradient(135deg, #cfe6f5, #eef6fb); perspective: 800px; }
[data-theme="dark"] .fold-stage { border-color: #3a3f45; background: linear-gradient(135deg, #1d2a33, #11161a); }
.fold-track { display: flex; height: 100%; width: 100%; transform-style: preserve-3d;
  transition: width 1.6s var(--ease); }
.fold-pane { flex: 1 0 0; height: 100%; box-sizing: border-box;
  border: 4px solid #d7dbe0; border-radius: 3px;
  background: linear-gradient(135deg, rgba(120,190,235,.45), rgba(255,255,255,.12));
  transition: transform 1.6s var(--ease); backface-visibility: hidden; }
[data-theme="dark"] .fold-pane { border-color: #4b5159;
  background: linear-gradient(135deg, rgba(74,169,224,.4), rgba(255,255,255,.05)); }
.fold-pane:nth-child(odd)  { transform-origin: left center; }
.fold-pane:nth-child(even) { transform-origin: right center; }
.fold-stage.is-open .fold-track { width: 26%; }
.fold-stage.is-open .fold-pane:nth-child(odd)  { transform: rotateY(-62deg); }
.fold-stage.is-open .fold-pane:nth-child(even) { transform: rotateY(62deg); }

/* ---------- Vergleich Alu vs Holz ---------- */
.compare { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width:760px){ .compare { grid-template-columns:1fr; } }
.compare__col { border:1px solid var(--border); border-radius: var(--radius); padding: 30px; background: var(--surface); }
.compare__col.win { border-color: color-mix(in srgb, var(--accent-2) 50%, var(--border)); }
.compare__col.win::before { content:"Empfohlen"; display:inline-block; font-size:.72rem; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; color:#fff; background: var(--accent-2);
  padding: 4px 10px; border-radius: 999px; margin-bottom: 14px; }
.compare__col h3 { margin-bottom: 6px; }
.compare__col .row { display:flex; gap:10px; padding: 11px 0; border-bottom: 1px solid var(--border); font-size:.96rem; }
.compare__col .row:last-child { border-bottom: 0; }
.compare__col .row .ic { flex-shrink:0; width:20px; height:20px; }
.ic-yes { color: var(--accent-2); } .ic-no { color: #d06a6a; }

/* ---------- Farb-Swatches ---------- */
.swatches { display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:24px; }
.swatch { position:relative; min-width:0; border:2px solid var(--border); border-radius:18px; overflow:visible; background:var(--surface);
  box-shadow: var(--shadow); transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.swatch:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--border-strong); }
.swatch.is-magnifying { z-index:10; }
.swatch__media { position:relative; aspect-ratio:1/1; padding:14px; overflow:visible; border-radius:16px;
  cursor:zoom-in; touch-action:pan-y; background:color-mix(in srgb, var(--bg-soft) 82%, transparent);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.34); }
.swatch__media::before { content:""; position:absolute; z-index:2; left:18%; right:18%; top:15%; height:43%;
  pointer-events:none; border-radius:7px;
  background-image:url("../img/feinstruktur.svg"),
    linear-gradient(125deg, rgba(255,255,255,.15), transparent 48%, rgba(0,0,0,.12));
  background-size:96px 96px, 100% 100%; background-position:0 0;
  background-blend-mode:soft-light, normal; mix-blend-mode:soft-light;
  opacity:.68; box-shadow:inset 0 0 14px rgba(255,255,255,.09); }
.swatch img { width:100%; height:100%; object-fit:contain; border-radius:12px; transition:transform .45s var(--ease); }
.swatch.is-magnifying img { transform:scale(1.035); }
.swatch__loupe { position:absolute; left:50%; top:50%; z-index:3; width:230px; height:230px;
  border:6px solid rgba(245,247,249,.98); border-radius:50%; pointer-events:none;
  background-repeat:repeat, no-repeat; background-size:96px 96px, 440% 440%;
  background-blend-mode:soft-light, normal; background-color:var(--surface);
  box-shadow:0 22px 48px rgba(0,0,0,.32), 0 0 0 2px rgba(35,39,43,.7),
    inset 0 0 22px rgba(255,255,255,.2);
  opacity:0; transform:translate(-50%,-50%) scale(.7);
  transition:opacity .16s ease, transform .3s var(--ease); }
.swatch__loupe::before { content:none; }
.swatch__loupe::after { content:""; position:absolute; z-index:-1; width:78px; height:17px;
  right:-59px; bottom:3px; border:2px solid rgba(35,39,43,.72); border-radius:999px;
  background:linear-gradient(90deg, #aeb5bb, #f2f4f5 48%, #7c858d);
  box-shadow:0 8px 18px rgba(0,0,0,.28); transform:rotate(45deg); transform-origin:left center; }
.swatch.is-magnifying .swatch__loupe { opacity:1; transform:translate(-50%,-50%) scale(1); }
.fenster-page .swatch { border:0; border-radius:0; background:transparent; box-shadow:none; }
.fenster-page .swatch:hover { transform:none; border-color:transparent; box-shadow:none; }
.fenster-page .swatch__media { padding:0; border-radius:0; background:transparent; box-shadow:none; }
.fenster-page .swatch__media::before { left:14%; right:14%; top:10.5%; height:48.5%; }
.fenster-page .swatch img { border-radius:0; }
@media (max-width:900px){ .swatches { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){
  .swatches { grid-template-columns:1fr; gap:18px; }
  .swatch__media { padding:12px; }
  .fenster-page .swatch__media { padding:0; }
  .swatch__loupe { width:180px; height:180px; border-width:5px; background-size:96px 96px, 440% 440%; }
  .swatch__loupe::after { width:62px; height:14px; right:-48px; bottom:1px; }
}

/* ---------- CTA band ---------- */
.cta-band { background: var(--accent-grad); border-radius: var(--radius-lg); padding: clamp(40px,7vw,72px);
  text-align:center; color:#fff; box-shadow: var(--shadow-lg); }
.cta-band h2 { color:#fff; }
.cta-band p { color: rgba(255,255,255,.92); }
.cta-band .btn-row { margin-top: 28px; justify-content:center; }

/* ---------- Informationen ---------- */
.info-page .pagehero__media { height:clamp(360px,55vw,620px); }
.info-page .pagehero__cap { max-width:760px; }
.info-page .pagehero__cap h1 { max-width:820px; }
.info-topic-nav { position:sticky; top:var(--nav-h); z-index:30; border-bottom:1px solid var(--border); background:color-mix(in srgb,var(--bg) 88%,transparent); backdrop-filter:blur(18px); }
.info-topic-nav__inner { display:flex; align-items:center; gap:8px; padding-block:12px; overflow-x:auto; scrollbar-width:none; }
.info-topic-nav__inner::-webkit-scrollbar { display:none; }
.info-topic-nav a { flex:0 0 auto; padding:9px 15px; border:1px solid var(--border); border-radius:999px; color:var(--text-soft); font-size:.86rem; font-weight:600; }
.info-topic-nav a:hover,.info-topic-nav a.active { background:var(--accent); border-color:var(--accent); color:#fff; }
.info-overview-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; }
.info-card { position:relative; min-height:330px; overflow:hidden; border-radius:var(--radius-lg); box-shadow:var(--shadow); color:#fff; }
.info-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.info-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,18,24,.04) 22%,rgba(10,18,24,.86) 100%); }
.info-card__body { position:absolute; z-index:2; inset:auto 28px 26px; }
.info-card__body h2,.info-card__body p { color:#fff; }
.info-card__body p { margin-top:7px; color:rgba(255,255,255,.82); }
.info-card__link { display:inline-flex; align-items:center; gap:8px; margin-top:17px; padding:10px 15px; border-radius:999px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.26); backdrop-filter:blur(12px); font-size:.86rem; font-weight:700; }
.info-card:hover img { transform:scale(1.055); }
.info-card:hover .info-card__link { background:#fff; color:#1f2529; }
.info-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:36px; }
.info-fact { padding:26px; border:1px solid var(--border); border-radius:20px; background:var(--surface); }
.info-fact b { display:block; color:var(--accent); font-size:clamp(1.55rem,3vw,2.4rem); letter-spacing:-.04em; margin-bottom:7px; }
.info-fact span { color:var(--text-soft); font-size:.92rem; }
.info-callout { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr); gap:clamp(30px,5vw,70px); align-items:center; padding:clamp(28px,5vw,60px); border:1px solid var(--border); border-radius:var(--radius-lg); background:linear-gradient(135deg,var(--surface),var(--bg-soft)); box-shadow:var(--shadow); }
.info-callout__media img { width:100%; border-radius:22px; box-shadow:var(--shadow-lg); }
.info-checks { display:grid; gap:13px; margin-top:24px; }
.info-checks li { position:relative; padding-left:30px; color:var(--text-soft); }
.info-checks li::before { content:"✓"; position:absolute; left:0; top:-1px; width:20px; height:20px; display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:.75rem; font-weight:800; }
.color-library__head { display:flex; align-items:end; justify-content:space-between; gap:34px; }
.color-library__head > div:first-child { max-width:780px; }
.color-library__hint { flex:0 0 auto; min-width:178px; display:grid; grid-template-columns:42px 1fr; align-items:center; gap:2px 12px; padding:15px 18px; border:1px solid var(--border); border-radius:18px; background:var(--surface); box-shadow:var(--shadow); }
.color-library__hint > span { grid-row:1 / 3; width:42px; height:42px; display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:1.45rem; }
.color-library__hint strong { align-self:end; font-size:.88rem; }
.color-library__hint small { align-self:start; color:var(--text-faint); font-size:.72rem; }
.color-library__hint--metal > span { background:linear-gradient(135deg,#f6e8bd,#8d7551); color:#443522; }
.info-color-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-top:38px; }
.info-color-grid--anodized { grid-template-columns:repeat(3,minmax(0,1fr)); }
.info-color { position:relative; isolation:isolate; min-height:192px; display:flex; align-items:flex-end; padding:20px; overflow:hidden; appearance:none; border:1px solid rgba(255,255,255,.2); border-radius:22px; background:linear-gradient(138deg,rgba(255,255,255,.17),transparent 34%,rgba(255,255,255,.035) 62%,rgba(0,0,0,.13)),var(--tone); color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(0,0,0,.18),inset 0 0 32px rgba(255,255,255,.035),var(--shadow); text-align:left; text-shadow:0 1px 7px rgba(0,0,0,.5); cursor:zoom-in; transition:transform .28s var(--ease),box-shadow .28s,border-color .28s; }
.info-color::before { content:""; position:absolute; z-index:-1; inset:-3%; background-image:radial-gradient(circle,rgba(255,255,255,.38) 0 .38px,transparent .72px),radial-gradient(circle,rgba(0,0,0,.3) 0 .46px,transparent .82px),radial-gradient(ellipse,rgba(255,255,255,.16) 0 .55px,transparent .95px); background-position:0 0,1px 2px,3px 1px; background-size:3px 3px,4px 4px,7px 9px; opacity:.58; filter:contrast(1.08); mix-blend-mode:soft-light; transform:scale(1); transition:opacity .28s,transform .55s var(--ease),background-position .55s var(--ease); }
.info-color::after { content:""; position:absolute; z-index:-1; inset:46% 0 0; background:linear-gradient(0deg,rgba(0,0,0,.46),transparent); }
.info-color:hover,.info-color:focus-visible { transform:translateY(-7px) scale(1.015); border-color:rgba(255,255,255,.7); box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.2),0 24px 54px color-mix(in srgb,var(--tone) 30%,rgba(0,0,0,.24)); }
.info-color:hover::before,.info-color:focus-visible::before { opacity:.78; transform:scale(1.045); background-position:1px 1px,3px 4px,5px 2px; }
.info-color--light { color:#171b1e; text-shadow:0 1px 6px rgba(255,255,255,.5); }
.info-color--light::after { background:linear-gradient(0deg,rgba(255,255,255,.42),transparent); }
.info-color__label { position:relative; z-index:2; display:grid; gap:3px; }
.info-color__label strong { font-size:.98rem; letter-spacing:.01em; }
.info-color__label small { font-size:.74rem; font-weight:650; opacity:.88; }
.info-color__zoom { position:absolute; z-index:3; right:16px; top:16px; width:40px; height:40px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.34); border-radius:50%; background:rgba(5,12,18,.24); color:#fff; font-size:1.1rem; font-weight:400; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); transition:transform .24s,background .24s; }
.info-color--light .info-color__zoom { border-color:rgba(20,28,32,.18); background:rgba(255,255,255,.4); color:#20272b; }
.info-color:hover .info-color__zoom,.info-color:focus-visible .info-color__zoom { transform:scale(1.12) rotate(90deg); background:rgba(255,255,255,.92); color:#162027; }
.info-color--anodized { background:linear-gradient(110deg,rgba(255,255,255,.5),transparent 20%,rgba(255,255,255,.17) 46%,transparent 70%,rgba(0,0,0,.22)),repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,rgba(0,0,0,.035) 1px 2px),var(--tone); }
.info-color--anodized::before { background:repeating-linear-gradient(0deg,rgba(255,255,255,.06) 0 1px,rgba(0,0,0,.045) 1px 3px); opacity:.5; mix-blend-mode:overlay; }
.color-screen-note { margin-top:20px; padding:15px 18px; border-left:3px solid var(--accent); border-radius:0 14px 14px 0; background:var(--bg-soft); color:var(--text-faint); font-size:.82rem; }
.color-screen-note strong { color:var(--text); }

.surface-compare-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:42px; }
.surface-compare-card { position:relative; min-height:390px; padding:34px; overflow:hidden; border:1px solid var(--border); border-radius:28px; background:var(--surface); box-shadow:var(--shadow); }
.surface-compare-card::before { content:""; position:absolute; right:-70px; top:-80px; width:230px; height:230px; border-radius:50%; opacity:.18; }
.surface-compare-card--ral::before { background:conic-gradient(#701f29,#1d2b44,#0f4336,#c2b078,#701f29); }
.surface-compare-card--eloxal::before { background:conic-gradient(#f0e4c4,#9e835f,#34312e,#b7b9b5,#f0e4c4); }
.surface-compare-card__mark { position:relative; z-index:1; display:inline-flex; margin-bottom:48px; padding:7px 11px; border:1px solid var(--border); border-radius:999px; color:var(--accent); font-size:.7rem; font-weight:850; letter-spacing:.12em; }
.surface-compare-card h3 { position:relative; z-index:1; font-size:clamp(1.7rem,3vw,2.3rem); }
.surface-compare-card p { position:relative; z-index:1; margin-top:14px; }
.surface-compare-card ul { position:relative; z-index:1; display:grid; gap:11px; margin-top:24px; }
.surface-compare-card li { position:relative; padding-left:24px; color:var(--text-soft); font-size:.9rem; }
.surface-compare-card li::before { content:""; position:absolute; left:0; top:.55em; width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 5px var(--accent-soft); }

.coastal-protection { display:grid; grid-template-columns:minmax(300px,.85fr) minmax(0,1.15fr); gap:clamp(34px,6vw,76px); align-items:center; }
.coastal-protection__visual { position:relative; min-height:540px; overflow:hidden; border-radius:30px; background:linear-gradient(#8bd4ef 0 46%,#e9d8ab 46% 62%,#1580a4 62%); box-shadow:var(--shadow-lg); }
.coastal-protection__visual::before { content:""; position:absolute; inset:62% 0 0; background:repeating-radial-gradient(ellipse at 50% 0,rgba(255,255,255,.5) 0 2px,transparent 3px 18px); opacity:.55; }
.coastal-protection__sun { position:absolute; right:13%; top:12%; width:84px; height:84px; border-radius:50%; background:#fff3bf; box-shadow:0 0 55px rgba(255,238,168,.85); }
.coastal-protection__sea { position:absolute; left:-8%; right:-8%; top:54%; height:90px; border-radius:50%; background:rgba(255,255,255,.28); transform:rotate(-3deg); }
.coastal-protection__profile { position:absolute; left:12%; bottom:-7%; width:40%; height:68%; border:18px solid #2b3338; border-bottom:0; box-shadow:inset 0 0 0 3px rgba(255,255,255,.14),10px 12px 30px rgba(0,0,0,.22); transform:skewY(-3deg); }
.coastal-protection__visual i { position:absolute; color:rgba(255,255,255,.9); font-size:.68rem; font-style:normal; font-weight:800; letter-spacing:.08em; text-shadow:0 2px 8px rgba(0,0,0,.28); animation:salt-drift 5s ease-in-out infinite; }
.coastal-protection__visual i:nth-of-type(1) { left:16%; top:20%; }
.coastal-protection__visual i:nth-of-type(2) { right:22%; top:39%; animation-delay:-1.7s; }
.coastal-protection__visual i:nth-of-type(3) { left:48%; top:52%; animation-delay:-3.4s; }
@keyframes salt-drift { 0%,100% { transform:translate(0,0) rotate(-7deg); opacity:.45; } 50% { transform:translate(16px,24px) rotate(6deg); opacity:1; } }
.coastal-protection__content > p + p { margin-top:18px; }
.coastal-protection__recommendation { display:grid; gap:7px; margin-top:24px; padding:20px 22px; border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border)); border-radius:18px; background:color-mix(in srgb,var(--accent-soft) 58%,var(--surface)); }
.coastal-protection__recommendation strong { color:var(--accent); font-size:.82rem; letter-spacing:.04em; text-transform:uppercase; }
.coastal-protection__recommendation span { color:var(--text-soft); font-size:.9rem; line-height:1.6; }

.color-modal-open { overflow:hidden; }
.color-zoom-modal[hidden] { display:none; }
.color-zoom-modal { position:fixed; z-index:1200; inset:0; display:grid; place-items:center; padding:clamp(14px,4vw,44px); opacity:0; visibility:hidden; transition:opacity .22s ease,visibility .22s; }
.color-zoom-modal.open { opacity:1; visibility:visible; }
.color-zoom-modal__backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; background:rgba(5,12,18,.78); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); cursor:zoom-out; }
.color-zoom-modal__dialog { position:relative; width:min(1080px,100%); max-height:calc(100vh - 32px); display:grid; grid-template-columns:minmax(0,1.45fr) minmax(270px,.55fr); gap:clamp(24px,4vw,48px); align-items:center; padding:clamp(22px,3vw,38px); overflow:auto; border:1px solid rgba(255,255,255,.2); border-radius:32px; background:var(--surface); box-shadow:0 36px 110px rgba(0,0,0,.42); transform:translateY(18px) scale(.97); transition:transform .32s var(--ease); }
.color-zoom-modal.open .color-zoom-modal__dialog { transform:translateY(0) scale(1); }
.color-zoom-modal__close { position:absolute; z-index:5; right:18px; top:18px; width:44px; height:44px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.32); border-radius:50%; background:rgba(10,18,23,.42); color:#fff; font-size:1.35rem; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.color-zoom-modal__swatch { --tone:#383e42; position:relative; isolation:isolate; min-height:min(64vh,620px); overflow:hidden; border-radius:24px; background:linear-gradient(138deg,rgba(255,255,255,.18),transparent 34%,rgba(255,255,255,.04) 62%,rgba(0,0,0,.15)),var(--tone); box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.2),inset 0 0 54px rgba(255,255,255,.04),0 24px 55px color-mix(in srgb,var(--tone) 34%,rgba(0,0,0,.28)); }
.color-zoom-modal__swatch::before { content:""; position:absolute; inset:-2%; background-image:radial-gradient(circle,rgba(255,255,255,.4) 0 .45px,transparent .8px),radial-gradient(circle,rgba(0,0,0,.32) 0 .52px,transparent .9px),radial-gradient(ellipse,rgba(255,255,255,.17) 0 .62px,transparent 1px); background-position:0 0,2px 3px,4px 1px; background-size:4px 4px,5px 5px,8px 10px; opacity:.62; filter:contrast(1.1); mix-blend-mode:soft-light; }
.color-zoom-modal__swatch.is-anodized { background:linear-gradient(110deg,rgba(255,255,255,.58),transparent 18%,rgba(255,255,255,.2) 47%,transparent 72%,rgba(0,0,0,.25)),repeating-linear-gradient(90deg,rgba(255,255,255,.055) 0 1px,rgba(0,0,0,.04) 1px 3px),var(--tone); }
.color-zoom-modal__swatch.is-anodized::before { background:repeating-linear-gradient(0deg,rgba(255,255,255,.08) 0 1px,rgba(0,0,0,.045) 1px 4px); opacity:.54; mix-blend-mode:overlay; }
.color-zoom-modal__swatch > span { position:absolute; z-index:2; left:20px; bottom:20px; padding:9px 12px; border:1px solid rgba(255,255,255,.3); border-radius:999px; background:rgba(5,12,18,.34); color:#fff; font-size:.72rem; font-weight:750; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.color-zoom-modal__swatch.is-light > span { background:rgba(255,255,255,.45); border-color:rgba(10,18,23,.16); color:#1c2428; }
.color-zoom-modal__content h2 { margin-top:8px; font-size:clamp(2rem,4.2vw,3.6rem); line-height:1; }
.color-zoom-modal__content > p { margin-top:20px; }
.color-zoom-modal__note { display:grid; gap:7px; margin-top:28px; padding-top:22px; border-top:1px solid var(--border); }
.color-zoom-modal__note strong { font-size:.86rem; }
.color-zoom-modal__note span { color:var(--text-faint); font-size:.82rem; line-height:1.55; }
.info-steps { counter-reset:info-step; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:34px; }
.info-step { counter-increment:info-step; position:relative; padding:30px 28px 28px 78px; border:1px solid var(--border); border-radius:20px; background:var(--surface); }
.info-step::before { content:counter(info-step,decimal-leading-zero); position:absolute; left:24px; top:26px; color:var(--accent); font-size:1.05rem; font-weight:800; }
.info-step h3 { font-size:1.12rem; margin-bottom:8px; }
.info-step p { font-size:.94rem; }
/* === Sicherheit: RC-Klassen, Beschläge, Systemanbieter === */
.rc-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:40px; }
.rc-card { display:flex; flex-direction:column; padding:30px 28px; border:1px solid var(--border); border-radius:var(--radius-lg); background:linear-gradient(162deg,var(--surface),var(--bg-soft)); box-shadow:var(--shadow); }
.rc-card--hl { border-color:color-mix(in srgb,var(--accent) 42%,var(--border)); box-shadow:0 26px 64px color-mix(in srgb,var(--accent) 20%,transparent); }
.rc-card__head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.rc-card__badge { display:inline-flex; padding:8px 15px; border-radius:999px; background:var(--accent-soft); color:var(--accent); font-weight:800; letter-spacing:.02em; font-size:1.05rem; }
.rc-card--hl .rc-card__badge { background:var(--accent); color:#fff; }
.rc-card__tag { font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; color:var(--text-soft); }
.rc-card--hl .rc-card__tag { color:var(--accent); }
.rc-card h3 { margin-top:18px; font-size:1.16rem; letter-spacing:-.01em; }
.rc-card__lead { margin-top:9px; color:var(--text-soft); font-size:.94rem; }
.rc-card__specs { margin-top:20px; display:grid; gap:13px; padding-top:18px; border-top:1px solid var(--border); }
.rc-card__spec b { display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-soft); font-weight:700; margin-bottom:2px; }
.rc-card__spec span { font-size:.93rem; font-weight:600; }
.rc-card__rec { margin-top:auto; margin-top:22px; padding:12px 15px; border-radius:14px; background:var(--bg-soft); border:1px solid var(--border); font-size:.86rem; color:var(--text-soft); }
.beschlag-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:38px; }
.beschlag-card { display:flex; flex-direction:column; padding:20px 20px 26px; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow); }
.beschlag-card .thumb { margin-top:0; }
.beschlag-card__rc { align-self:flex-start; margin:18px 0 10px; padding:5px 12px; border-radius:999px; background:var(--accent-soft); color:var(--accent); font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.beschlag-card h3 { font-size:1.08rem; letter-spacing:-.01em; }
.beschlag-card p { margin-top:8px; font-size:.92rem; color:var(--text-soft); }
.maker-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:36px; }
.maker-card { padding:32px 30px; border:1px solid var(--border); border-radius:var(--radius-lg); background:linear-gradient(162deg,var(--surface),var(--bg-soft)); box-shadow:var(--shadow); }
.maker-card__name { font-size:1.4rem; font-weight:800; letter-spacing:-.02em; }
.maker-card__rc { display:flex; flex-wrap:wrap; gap:7px; margin:15px 0 4px; }
.maker-card__rc span { padding:5px 12px; border-radius:9px; background:var(--accent-soft); color:var(--accent); font-size:.8rem; font-weight:800; }
.maker-card p { margin-top:13px; color:var(--text-soft); font-size:.95rem; }
.maker-card ul { margin-top:16px; display:grid; gap:10px; }
.maker-card li { position:relative; padding-left:24px; color:var(--text-soft); font-size:.92rem; }
.maker-card li::before { content:"›"; position:absolute; left:7px; top:-1px; color:var(--accent); font-weight:800; font-size:1.05rem; }
.rc-note { margin-top:26px; font-size:.82rem; color:var(--text-soft); }
@media (max-width:900px){ .rc-grid,.beschlag-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px){ .rc-grid,.beschlag-grid,.maker-grid { grid-template-columns:1fr; } }
/* === Sicherheit: Vollbreiten-Simulator RC1–RC3 === */
.rc-sim { position:relative; overflow:hidden; color:#fff; padding:calc(var(--nav-h) + clamp(30px,4.5vw,58px)) 0 clamp(46px,7vw,88px); background:radial-gradient(130% 120% at 12% 0%,#103049 0%,#0a1c2b 52%,#050f19 100%); }
.rc-sim::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 84% 26%,rgba(35,160,224,.22),transparent 46%); }
.rc-sim__inner { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.08fr); gap:clamp(28px,5vw,60px); align-items:center; }
.rc-sim__copy .eyebrow { color:#8edcff; }
.rc-sim__crumb { margin-bottom:20px; font-size:.85rem; color:rgba(255,255,255,.55); }
.rc-sim__crumb a { color:rgba(255,255,255,.8); }
.rc-sim__crumb a:hover { color:#fff; }
.rc-sim__copy h1 { margin-top:8px; font-size:clamp(1.9rem,3.7vw,3rem); line-height:1.03; letter-spacing:-.03em; }
.rc-sim__copy p { margin-top:16px; max-width:46ch; color:rgba(255,255,255,.8); font-size:1.02rem; }
.rc-sim__tabs { display:flex; gap:9px; margin-top:26px; }
.rc-sim__tab { padding:9px 17px; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.05); color:#fff; font-weight:800; letter-spacing:.02em; cursor:pointer; transition:border-color .25s,background .25s,box-shadow .25s; }
.rc-sim__tab:hover { border-color:#8edcff; }
.rc-sim[data-phase="1"] .rc-sim__tab[data-go="1"],.rc-sim[data-phase="2"] .rc-sim__tab[data-go="2"],.rc-sim[data-phase="3"] .rc-sim__tab[data-go="3"] { background:#23a0e0; border-color:#23a0e0; box-shadow:0 10px 26px rgba(35,160,224,.42); }
.rc-sim__stage { position:relative; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(140px,.7fr); gap:clamp(14px,3vw,34px); align-items:center; }
.rc-sim__viewport { position:relative; width:100%; max-width:420px; margin-inline:auto; aspect-ratio:1; border-radius:18px; overflow:hidden; background:linear-gradient(158deg,#eef1f4 0%,#dfe3e6 58%,#cdd4da 100%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 32px 74px rgba(0,0,0,.5); }
.rc-win { position:absolute; inset:0; transform-origin:center; }
.rc-win>img { width:100%; height:100%; object-fit:cover; display:block; }
.rc-win__dots,.rc-sim__attack { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
@keyframes rcShake1 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-1.1px,0)} }
@keyframes rcShake2 { 0%,100%{transform:translate(0,0)} 30%{transform:translate(-2.4px,.5px) rotate(-.22deg)} 70%{transform:translate(1.8px,-.4px) rotate(.16deg)} }
@keyframes rcShake3 { 0%,100%{transform:translate(0,0)} 22%{transform:translate(-3.6px,1px) rotate(-.4deg)} 62%{transform:translate(3px,-.7px) rotate(.32deg)} }
.rc-sim[data-phase="1"] .rc-win { animation:rcShake1 .5s steps(4) infinite; }
.rc-sim[data-phase="2"] .rc-win { animation:rcShake2 .32s steps(5) infinite; }
.rc-sim[data-phase="3"] .rc-win { animation:rcShake3 .26s steps(6) infinite; }
.rc-bolt { fill:#5b6b7a; stroke:#fff; stroke-width:2; transition:fill .35s; }
@keyframes rcPulse { 0%,100%{ filter:drop-shadow(0 0 3px rgba(126,231,135,.65)); } 50%{ filter:drop-shadow(0 0 8px rgba(126,231,135,1)); } }
.rc-sim[data-phase="1"] .rc-bolt.b1,.rc-sim[data-phase="2"] .rc-bolt.b1,.rc-sim[data-phase="2"] .rc-bolt.b2,.rc-sim[data-phase="3"] .rc-bolt { fill:#7ee787; animation:rcPulse 1.3s ease-in-out infinite; }
.rc-tool { opacity:0; transition:opacity .3s; transform-box:fill-box; transform-origin:center; }
@keyframes rcJab { 0%,100%{transform:translate(0,0)} 50%{transform:translate(7px,-2px)} }
.rc-sim[data-phase="1"] .rc-tool--hand { opacity:1; animation:rcJab .5s ease-in-out infinite; }
.rc-sim[data-phase="2"] .rc-tool--driver { opacity:1; animation:rcJab .34s ease-in-out infinite; }
.rc-sim[data-phase="3"] .rc-tool--crow { opacity:1; animation:rcJab .28s ease-in-out infinite; }
.rc-spark { opacity:0; }
.rc-sim[data-phase="2"] .rc-spark,.rc-sim[data-phase="3"] .rc-spark { animation:rcSpark .34s steps(2) infinite; }
@keyframes rcSpark { 0%,100%{opacity:0; transform:scale(.6)} 50%{opacity:1; transform:scale(1.05)} }
.rc-hud { display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.rc-hud__badge { font-size:clamp(2.1rem,4.4vw,3.3rem); font-weight:900; letter-spacing:-.03em; line-height:1; transition:color .35s; }
.rc-sim[data-phase="1"] .rc-hud__badge { color:#aeb9c4; }
.rc-sim[data-phase="2"] .rc-hud__badge { color:#8edcff; }
.rc-sim[data-phase="3"] .rc-hud__badge { color:#7ee787; }
.rc-hud__ring { position:relative; width:min(44vw,148px); }
.rc-hud__ring svg { width:100%; height:auto; transform:rotate(-90deg); }
.rc-hud__prog { stroke:#23a0e0; transition:stroke-dashoffset .6s ease,stroke .4s; }
.rc-sim[data-phase="1"] .rc-hud__prog { stroke:#9fb0bf; }
.rc-sim[data-phase="3"] .rc-hud__prog { stroke:#7ee787; }
.rc-hud__time { position:absolute; inset:0; display:grid; place-items:center; font-size:1.5rem; font-weight:800; }
.rc-hud__label { font-size:.7rem; text-transform:uppercase; letter-spacing:.09em; color:rgba(255,255,255,.55); font-weight:700; }
.rc-hud__tool { font-size:.9rem; color:rgba(255,255,255,.78); max-width:210px; min-height:2.6em; }
.rc-hud__status { display:inline-flex; align-items:center; gap:7px; margin-top:2px; padding:6px 13px; border-radius:999px; background:rgba(126,231,135,.15); color:#7ee787; font-weight:800; font-size:.82rem; }
@media (max-width:860px){ .rc-sim__inner { grid-template-columns:1fr; } .rc-sim__copy p { max-width:none; } }
@media (max-width:520px){ .rc-sim__stage { grid-template-columns:1fr; justify-items:center; } .rc-sim__win { max-width:290px; } }
@media (prefers-reduced-motion:reduce){ .rc-win,.rc-tool,.rc-bolt,.rc-spark { animation:none !important; } }
@media (max-width:980px){ .coastal-protection { grid-template-columns:1fr; }.coastal-protection__visual { min-height:420px; }.color-zoom-modal__dialog { grid-template-columns:1fr; }.color-zoom-modal__swatch { min-height:min(52vh,480px); }.surface-compare-card { min-height:0; } }
@media (max-width:760px){ .info-overview-grid,.info-callout,.info-facts,.info-steps,.surface-compare-grid { grid-template-columns:1fr; }.color-library__head { align-items:start; flex-direction:column; }.color-library__hint { width:100%; }.info-color-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.info-color { min-height:164px; }.info-card { min-height:300px; }.coastal-protection__visual { min-height:360px; }.color-zoom-modal__dialog { padding:18px; border-radius:24px; }.color-zoom-modal__swatch { min-height:42vh; }.color-zoom-modal__close { right:12px; top:12px; } }
@media (max-width:420px){ .info-color-grid { grid-template-columns:1fr; }.info-color { min-height:148px; }.surface-compare-card { padding:26px 22px; }.coastal-protection__visual { min-height:310px; }.color-zoom-modal__swatch { min-height:36vh; } }

/* ---------- Isolierglas-Aufbauten ---------- */
.glass-info-page [id] { scroll-margin-top:calc(var(--nav-h) + 96px); }
.glass-pagehero .pagehero__cap { max-width:880px; }
.glass-pagehero .pagehero__cap p { max-width:680px; margin-top:14px; color:rgba(255,255,255,.86); font-size:clamp(1.05rem,2vw,1.32rem); }
.glass-intro__layout { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr); gap:clamp(34px,6vw,82px); align-items:end; }
.glass-intro__facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.glass-intro__facts > div { min-height:116px; display:flex; flex-direction:column; justify-content:space-between; padding:20px; border:1px solid var(--border); border-radius:18px; background:var(--surface); box-shadow:var(--shadow); }
.glass-intro__facts strong { color:var(--accent); font-size:clamp(1.35rem,2.5vw,2rem); letter-spacing:-.04em; }
.glass-intro__facts span { color:var(--text-soft); font-size:.8rem; }
.glass-toc { margin-top:48px; padding:clamp(24px,4vw,38px); border:1px solid var(--border); border-radius:28px; background:linear-gradient(145deg,var(--surface),var(--bg-soft)); box-shadow:var(--shadow); }
.glass-toc__head { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:24px; }
.glass-toc__head span { font-size:1.12rem; font-weight:780; }
.glass-toc__head small { color:var(--text-faint); }
.glass-toc__links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.glass-toc__links a { min-height:54px; display:flex; align-items:center; gap:11px; padding:11px 13px; border:1px solid var(--border); border-radius:14px; background:var(--bg); color:var(--text-soft); font-size:.8rem; font-weight:650; transition:transform .2s,border-color .2s,color .2s,background .2s; }
.glass-toc__links a b { width:28px; height:28px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:.65rem; }
.glass-toc__links a:hover { transform:translateY(-2px); border-color:var(--accent); background:var(--surface); color:var(--text); }

.glass-build-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:46px; }
.glass-build-card { position:relative; display:flex; flex-direction:column; min-height:740px; padding:28px; overflow:hidden; border:1px solid var(--border); border-radius:28px; background:var(--surface); box-shadow:var(--shadow); }
.glass-build-card--featured { border-color:color-mix(in srgb,var(--accent) 48%,var(--border)); background:linear-gradient(155deg,color-mix(in srgb,var(--accent-soft) 42%,var(--surface)),var(--surface) 48%); box-shadow:0 24px 65px color-mix(in srgb,var(--accent) 13%,transparent); }
.glass-build-card__top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.glass-build-card__num { color:var(--accent); font-size:.76rem; font-weight:850; letter-spacing:.1em; }
.glass-build-card__status { padding:6px 9px; border-radius:999px; background:var(--accent-soft); color:var(--accent); font-size:.62rem; font-weight:800; }
.glass-build-card__status--muted { background:var(--bg-soft); color:var(--text-faint); }
.glass-stack { position:relative; height:170px; display:flex; align-items:stretch; justify-content:center; gap:8px; margin:28px 0 30px; padding:18px; overflow:hidden; border:1px solid color-mix(in srgb,var(--accent) 22%,var(--border)); border-radius:20px; background:linear-gradient(180deg,rgba(133,212,244,.13),rgba(255,255,255,.03)); perspective:700px; }
.glass-stack::before { content:""; position:absolute; width:230px; height:230px; left:-80px; top:-120px; border-radius:50%; background:rgba(105,203,239,.18); filter:blur(12px); }
.glass-stack > span { position:relative; z-index:1; display:grid; place-items:center; border-radius:7px; }
.glass-pane { width:31px; border:1px solid rgba(97,192,231,.58); background:linear-gradient(90deg,rgba(255,255,255,.8),rgba(107,206,243,.22) 42%,rgba(255,255,255,.72)); box-shadow:inset 0 0 12px rgba(255,255,255,.62),4px 5px 16px rgba(35,144,187,.12); transform:skewY(-3deg); }
.glass-pane i,.glass-cavity i { color:#276c87; font-size:.56rem; font-style:normal; font-weight:800; writing-mode:vertical-rl; letter-spacing:.06em; }
.glass-cavity { width:48px; border-top:1px dashed rgba(35,160,224,.34); border-bottom:1px dashed rgba(35,160,224,.34); background:linear-gradient(90deg,rgba(35,160,224,.02),rgba(35,160,224,.11),rgba(35,160,224,.02)); }
.glass-cavity::before,.glass-cavity::after { content:""; position:absolute; left:5px; right:5px; height:5px; border-radius:3px; background:#3a454b; }
.glass-cavity::before { top:0; }.glass-cavity::after { bottom:0; }
.glass-stack--single .glass-pane { width:46px; }
.glass-build-card h3 { font-size:clamp(1.45rem,2.3vw,2rem); }
.glass-build-card > p { margin-top:12px; font-size:.9rem; }
.glass-build-card__split { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:24px; }
.glass-build-card__split--single { grid-template-columns:1fr; }
.glass-build-card__split > div { padding:16px; border:1px solid var(--border); border-radius:16px; background:var(--bg-soft); }
.glass-build-card__split strong { display:block; margin-bottom:11px; font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; }
.glass-list { display:grid; gap:8px; }
.glass-list li { position:relative; padding-left:20px; color:var(--text-soft); font-size:.82rem; line-height:1.45; }
.glass-list li::before { position:absolute; left:0; top:.05em; font-weight:850; }
.glass-list--plus li::before { content:"+"; color:#52a63b; }.glass-list--minus li::before { content:"–"; color:#d26767; }
.glass-use { display:flex; flex-wrap:wrap; gap:7px; margin-top:auto; padding-top:24px; }
.glass-use strong { flex-basis:100%; margin-bottom:2px; color:var(--text-faint); font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; }
.glass-use span { padding:6px 9px; border:1px solid var(--border); border-radius:999px; background:var(--bg); color:var(--text-soft); font-size:.68rem; font-weight:650; }

.glass-function-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:46px; }
.glass-function-card { position:relative; min-height:540px; display:flex; flex-direction:column; padding:clamp(26px,4vw,38px); overflow:hidden; border:1px solid var(--border); border-radius:28px; background:var(--surface); box-shadow:var(--shadow); }
.glass-function-card::before { content:""; position:absolute; right:-80px; top:-90px; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--accent) 18%,transparent),transparent 68%); }
.glass-function-card--wide { grid-column:span 2; min-height:0; }
.glass-function-card__num { position:absolute; right:26px; top:24px; color:var(--text-faint); font-size:.72rem; font-weight:850; letter-spacing:.12em; }
.glass-function-card__icon { position:relative; z-index:1; width:94px; height:94px; display:grid; place-items:center; margin-bottom:46px; border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border)); border-radius:25px; background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 62%,var(--surface)),var(--surface)); box-shadow:inset 0 1px rgba(255,255,255,.4); }
.glass-function-card__icon span { color:var(--accent); font-size:1.75rem; font-weight:500; }
.glass-function-card__icon i { position:absolute; left:50%; bottom:8px; transform:translateX(-50%); color:var(--text-faint); font-size:.52rem; font-style:normal; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.glass-function-card h3 { position:relative; z-index:1; font-size:clamp(1.75rem,3vw,2.45rem); }
.glass-function-card > p { position:relative; z-index:1; max-width:760px; margin-top:14px; }
.glass-function-card > .glass-list { position:relative; z-index:1; margin-top:26px; }
.glass-function-card .glass-use { position:relative; z-index:1; }
.glass-function-card--sun { background:linear-gradient(145deg,rgba(255,210,86,.11),var(--surface) 42%); }
.glass-function-card--sun .glass-function-card__icon { border-color:rgba(237,178,29,.28); background:linear-gradient(145deg,rgba(255,220,111,.22),var(--surface)); }
.glass-function-card--sun .glass-function-card__icon span { color:#d49700; }
.glass-function-card--sound { background:linear-gradient(145deg,rgba(91,111,180,.1),var(--surface) 42%); }
.glass-function-card--sound .glass-function-card__icon span { color:#6b79bd; font-size:1.35rem; font-weight:800; }
.safety-glass-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:28px; }
.safety-glass-grid > div { padding:22px; border:1px solid var(--border); border-radius:19px; background:var(--bg-soft); }
.safety-glass-grid strong { display:block; margin-bottom:10px; color:var(--text); font-size:.88rem; }
.safety-glass-grid p { margin-bottom:17px; font-size:.82rem; }
.safety-glass-grid span { display:inline-flex; margin:4px 3px 0 0; padding:5px 8px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--text-soft); font-size:.65rem; }
.glass-list--inline { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:22px !important; padding:16px 18px; border-radius:16px; background:color-mix(in srgb,var(--accent-soft) 48%,var(--surface)); }
.glass-combinations { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.glass-combinations span { padding:10px 13px; border:1px solid color-mix(in srgb,var(--accent) 26%,var(--border)); border-radius:999px; background:color-mix(in srgb,var(--accent-soft) 52%,var(--surface)); color:var(--text); font-size:.78rem; font-weight:700; }
.glass-function-card__benefit { position:relative; z-index:1; display:grid; grid-template-columns:130px 1fr; gap:18px; margin-top:28px; padding-top:24px; border-top:1px solid var(--border); }
.glass-function-card__benefit strong { color:var(--accent); }
.glass-function-card__benefit p { font-size:.9rem; }

.vacuum-glass { display:grid; grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr); gap:clamp(36px,7vw,88px); align-items:center; }
.vacuum-glass__visual { position:relative; min-height:480px; display:flex; align-items:stretch; justify-content:center; gap:18px; padding:70px 24px; overflow:hidden; border:1px solid rgba(134,205,233,.28); border-radius:32px; background:radial-gradient(circle at 50% 30%,rgba(128,214,247,.26),transparent 42%),linear-gradient(160deg,#10202b,#07131c); box-shadow:0 28px 70px rgba(0,0,0,.26); }
.vacuum-glass__visual::before { content:""; position:absolute; inset:0; background:linear-gradient(115deg,transparent 45%,rgba(255,255,255,.08) 45.4%,transparent 46%); }
.vacuum-glass__pane { position:relative; z-index:1; width:42px; border:1px solid rgba(151,224,249,.75); border-radius:8px; background:linear-gradient(90deg,rgba(255,255,255,.78),rgba(96,205,242,.22),rgba(255,255,255,.7)); box-shadow:inset 0 0 18px rgba(255,255,255,.6),0 0 28px rgba(78,191,234,.18); transform:skewY(-2deg); }
.vacuum-glass__gap { position:relative; z-index:1; width:56px; display:grid; grid-template-columns:repeat(2,1fr); align-content:space-around; justify-items:center; }
.vacuum-glass__gap i { width:5px; height:5px; border-radius:50%; background:#afc5cf; box-shadow:0 0 0 3px rgba(255,255,255,.04); }
.vacuum-glass__visual b { position:absolute; z-index:2; left:50%; bottom:28px; transform:translateX(-50%); padding:8px 12px; border:1px solid rgba(255,255,255,.15); border-radius:999px; color:#a8deef; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; }
.vacuum-glass__uses { display:flex; flex-wrap:wrap; gap:9px; margin-top:26px; }
.vacuum-glass__uses span { padding:8px 11px; border-radius:999px; background:var(--accent-soft); color:var(--accent); font-size:.72rem; font-weight:750; }

.special-glass { padding:clamp(30px,5vw,54px); border:1px solid var(--border); border-radius:30px; background:linear-gradient(145deg,var(--surface),var(--bg-soft)); box-shadow:var(--shadow); }
.special-glass__head { display:flex; align-items:end; justify-content:space-between; gap:34px; }
.special-glass__head > div:first-child { max-width:790px; }
.special-glass__count { flex:0 0 auto; color:var(--accent); font-size:clamp(3rem,6vw,5rem); font-weight:820; letter-spacing:-.07em; line-height:.75; }
.special-glass__count small { display:block; margin-top:13px; color:var(--text-faint); font-size:.65rem; letter-spacing:.08em; text-align:right; text-transform:uppercase; }
.special-glass__chips { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:38px; }
.special-glass__chips span { min-height:70px; display:flex; align-items:center; padding:16px 18px; border:1px solid var(--border); border-radius:16px; background:var(--bg); color:var(--text-soft); font-size:.84rem; font-weight:700; }
.special-glass__chips span::before { content:"+"; width:28px; height:28px; flex:0 0 auto; display:grid; place-items:center; margin-right:12px; border-radius:50%; background:var(--accent-soft); color:var(--accent); }

.glass-choice-table { margin-top:42px; overflow:hidden; border:1px solid var(--border); border-radius:24px; background:var(--surface); box-shadow:var(--shadow); }
.glass-choice-table__row { display:grid; grid-template-columns:1.05fr .8fr 1.15fr; }
.glass-choice-table__row + .glass-choice-table__row { border-top:1px solid var(--border); }
.glass-choice-table__row > span { min-height:78px; display:flex; flex-direction:column; justify-content:center; padding:15px 20px; color:var(--text-soft); font-size:.82rem; }
.glass-choice-table__row > span + span { border-left:1px solid var(--border); }
.glass-choice-table__row b { color:var(--text); font-size:.84rem; }
.glass-choice-table__row small { margin-top:3px; color:var(--text-faint); font-size:.7rem; }
.glass-choice-table__head { background:linear-gradient(90deg,var(--accent),#137fae); }
.glass-choice-table__head > span { min-height:54px; color:#fff; font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.glass-choice-table__head > span + span { border-left-color:rgba(255,255,255,.17); }
.glass-choice-note { display:grid; grid-template-columns:220px 1fr; gap:22px; margin-top:20px; padding:22px 24px; border-left:3px solid var(--accent); border-radius:0 16px 16px 0; background:var(--surface); }
.glass-choice-note strong { color:var(--accent); }
.glass-choice-note p { font-size:.88rem; }

@media (max-width:1080px){ .glass-build-grid { grid-template-columns:1fr; }.glass-build-card { min-height:0; }.glass-build-card .glass-use { margin-top:24px; }.glass-stack { height:190px; }.glass-intro__layout { grid-template-columns:1fr; }.glass-intro__facts { max-width:680px; } }
@media (max-width:860px){ .glass-toc__links { grid-template-columns:repeat(2,minmax(0,1fr)); }.glass-function-grid { grid-template-columns:1fr; }.glass-function-card--wide { grid-column:auto; }.glass-list--inline { grid-template-columns:repeat(2,minmax(0,1fr)); }.vacuum-glass { grid-template-columns:1fr; }.vacuum-glass__visual { min-height:400px; }.special-glass__chips { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px){ .glass-toc__head,.special-glass__head { align-items:flex-start; flex-direction:column; }.glass-toc__links { grid-template-columns:1fr; }.glass-build-card { padding:22px; border-radius:22px; }.glass-build-card__split,.safety-glass-grid { grid-template-columns:1fr; }.glass-function-card { min-height:0; padding:24px 21px; border-radius:22px; }.glass-function-card__icon { margin-bottom:30px; }.glass-list--inline { grid-template-columns:1fr; }.glass-function-card__benefit { grid-template-columns:1fr; gap:7px; }.vacuum-glass__visual { min-height:330px; }.special-glass { padding:24px 20px; }.special-glass__chips { grid-template-columns:1fr; }.special-glass__count small { text-align:left; }.glass-choice-table { border-radius:18px; }.glass-choice-table__head { display:none; }.glass-choice-table__row { grid-template-columns:1fr; padding:15px 18px; }.glass-choice-table__row > span { min-height:0; padding:8px 0; }.glass-choice-table__row > span + span { border-left:0; }.glass-choice-table__row:not(.glass-choice-table__head) > span:nth-child(2)::before,.glass-choice-table__row:not(.glass-choice-table__head) > span:nth-child(3)::before { display:block; margin-bottom:3px; color:var(--text-faint); font-size:.6rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.glass-choice-table__row:not(.glass-choice-table__head) > span:nth-child(2)::before { content:"Empfehlung"; }.glass-choice-table__row:not(.glass-choice-table__head) > span:nth-child(3)::before { content:"Nutzen"; }.glass-choice-note { grid-template-columns:1fr; gap:8px; }.glass-intro__facts { grid-template-columns:1fr 1fr; }.glass-intro__facts > div { min-height:100px; padding:16px; } }

/* ---------- Reynaers Fenstersysteme ---------- */
.reynaers-page .pagehero__media { width:100vw; height:clamp(430px,62vw,680px); margin-left:calc(50% - 50vw); border-radius:0; box-shadow:none; }
.reynaers-page .pagehero__media img { filter:saturate(.78) contrast(1.03); }
.reynaers-page .pagehero__cap { left:max(24px,calc((100vw - var(--maxw))/2 + 24px)); right:max(24px,calc((100vw - var(--maxw))/2 + 24px)); max-width:860px; }
.reynaers-page .pagehero__cap h1 { max-width:850px; }
.reynaers-hero__claim { max-width:760px; margin-top:20px; color:rgba(255,255,255,.88); font-size:clamp(1.08rem,2vw,1.38rem); font-weight:520; line-height:1.45; letter-spacing:-.015em; text-wrap:balance; }
.reynaers-identity { display:flex; align-items:center; justify-content:center; margin-bottom:28px; }
.reynaers-identity img { width:min(290px,68vw); height:auto; }
.reynaers-catalog-head { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:46px; }
.reynaers-catalog-head > div { max-width:760px; }
.reynaers-catalog-count { flex:0 0 auto; color:var(--accent); font-size:clamp(3rem,8vw,6.2rem); font-weight:750; letter-spacing:-.07em; line-height:.8; }
.reynaers-catalog-count small { display:block; margin-top:15px; color:var(--text-faint); font-size:.72rem; letter-spacing:.12em; text-align:right; text-transform:uppercase; }
.reynaers-system-list { display:grid; gap:18px; }
.reynaers-system { position:relative; display:grid; grid-template-columns:84px minmax(0,1fr) 220px; gap:clamp(22px,4vw,54px); align-items:start;
  padding:clamp(28px,5vw,54px); overflow:hidden; border:1px solid var(--border); border-radius:28px; background:linear-gradient(135deg,var(--surface),var(--bg-soft)); box-shadow:var(--shadow); }
.reynaers-system::after { content:""; position:absolute; right:-90px; top:-115px; width:270px; height:270px; border-radius:50%; background:var(--accent-grad); opacity:.055; pointer-events:none; }
.reynaers-system:nth-of-type(even) { background:linear-gradient(135deg,color-mix(in srgb,var(--accent-soft) 24%,var(--surface)),var(--surface)); }
.reynaers-system__num { color:var(--accent); font-size:1rem; font-weight:800; letter-spacing:.08em; }
.reynaers-system__main { position:relative; z-index:1; }
.reynaers-system__main h2 { margin:5px 0 8px; font-size:clamp(2rem,4.5vw,3.7rem); letter-spacing:-.045em; }
.reynaers-system__tagline { color:var(--text); font-size:1.12rem; font-weight:650; }
.reynaers-system__main > p:last-of-type { max-width:720px; margin-top:16px; }
.reynaers-system__features { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.reynaers-system__features span { padding:7px 11px; border-radius:999px; background:var(--accent-soft); color:var(--text); font-size:.78rem; font-weight:650; }
.reynaers-system__side { position:relative; z-index:1; display:flex; min-height:100%; flex-direction:column; align-items:flex-end; justify-content:space-between; gap:24px; text-align:right; }
.reynaers-system__type { color:var(--text-faint); font-size:.74rem; font-weight:750; letter-spacing:.1em; text-transform:uppercase; }
.reynaers-system__product-zoom { position:relative; display:grid; place-items:center; width:min(190px,100%); height:170px; margin:-6px 0 -4px; padding:0; border:0; border-radius:20px; background:transparent; }
.reynaers-system__product-image { display:block; width:100%; height:100%; object-fit:contain; object-position:center; filter:drop-shadow(0 18px 18px rgba(12,30,44,.18)); transition:transform .35s var(--ease),filter .35s var(--ease); }
.reynaers-system__product-zoom:hover .reynaers-system__product-image,.reynaers-system__product-zoom:focus-visible .reynaers-system__product-image { transform:translateY(-4px) scale(1.055); filter:drop-shadow(0 22px 23px rgba(12,30,44,.23)); }
.reynaers-system__zoom-icon { position:absolute; right:2px; bottom:5px; display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--border-strong); border-radius:50%; background:color-mix(in srgb,var(--surface) 92%,transparent); color:var(--accent); box-shadow:var(--shadow); transition:transform .22s var(--ease),background .22s,color .22s; }
.reynaers-system__zoom-icon svg { width:19px; height:19px; }
.reynaers-system__product-zoom:hover .reynaers-system__zoom-icon,.reynaers-system__product-zoom:focus-visible .reynaers-system__zoom-icon { transform:scale(1.08); background:var(--accent); color:#fff; }
.reynaers-system__link { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; border:1px solid var(--border-strong); border-radius:999px; color:var(--text); font-size:.82rem; font-weight:700; white-space:nowrap; }
.reynaers-system__link:hover { border-color:var(--accent); background:var(--accent); color:#fff; }
.reynaers-system__link[aria-expanded="true"] { border-color:var(--accent); background:var(--accent); color:#fff; box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 28%,transparent); }
.reynaers-system__link [aria-hidden="true"] { font-size:1.05rem; line-height:1; }

/* Reynaers Profilbild — Großansicht */
.reynaers-modal-open { overflow:hidden; }
.reynaers-image-modal[hidden] { display:none; }
.reynaers-image-modal { position:fixed; z-index:600; inset:0; display:grid; place-items:center; padding:clamp(16px,4vw,44px); background:rgba(5,12,18,.76); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); animation:reynaers-modal-fade .24s ease both; }
.reynaers-image-modal__card { position:relative; width:min(900px,100%); max-height:calc(100vh - 32px); display:grid; grid-template-columns:minmax(240px,.62fr) minmax(360px,1fr); gap:clamp(20px,4vw,46px); align-items:center; padding:clamp(24px,4vw,46px); overflow:auto; border:1px solid rgba(255,255,255,.2); border-radius:30px; background:var(--surface); box-shadow:0 35px 100px rgba(0,0,0,.34); animation:reynaers-modal-card .36s var(--ease) both; }
.reynaers-image-modal__copy h2 { margin:8px 0 12px; font-size:clamp(2rem,4vw,3.8rem); letter-spacing:-.05em; line-height:.98; }
.reynaers-image-modal__copy p { color:var(--text-soft); }
.reynaers-image-modal__stage { min-height:min(560px,68vh); display:grid; place-items:center; overflow:hidden; border:1px solid var(--border); border-radius:24px; background:radial-gradient(circle at 50% 45%,var(--surface) 0%,var(--bg-soft) 72%); }
.reynaers-image-modal__stage img { display:block; width:min(520px,100%); height:min(560px,68vh); padding:22px; object-fit:contain; filter:drop-shadow(0 26px 25px rgba(10,28,40,.22)); }
.reynaers-image-modal__close { position:absolute; z-index:2; right:18px; top:18px; display:grid; place-items:center; width:42px; height:42px; padding:0; border:1px solid var(--border); border-radius:50%; background:color-mix(in srgb,var(--surface) 92%,transparent); color:var(--text); font-size:1.55rem; line-height:1; box-shadow:var(--shadow); }
.reynaers-image-modal__close:hover { background:var(--accent); color:#fff; }
@keyframes reynaers-modal-fade { from { opacity:0; } }
@keyframes reynaers-modal-card { from { opacity:0; transform:translateY(16px) scale(.975); } }
@media (max-width:720px){
  .reynaers-image-modal__card { grid-template-columns:1fr; gap:18px; padding:28px 18px 18px; border-radius:24px; }
  .reynaers-image-modal__copy { padding:0 38px 0 4px; }
  .reynaers-image-modal__copy h2 { margin-top:6px; }
  .reynaers-image-modal__stage { min-height:52vh; }
  .reynaers-image-modal__stage img { height:52vh; padding:12px; }
  .reynaers-image-modal__close { right:12px; top:12px; }
}

/* MasterLine 10 — technische Detailansicht */
.reynaers-details { position:relative; isolation:isolate; margin:4px 0 20px; padding:clamp(30px,5vw,58px); overflow:hidden; border:1px solid color-mix(in srgb,var(--accent) 23%,var(--border)); border-radius:30px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 92%,var(--accent-soft)),var(--surface) 56%,color-mix(in srgb,var(--bg-soft) 86%,var(--accent-soft))); box-shadow:0 26px 70px rgba(12,35,54,.12); }
.reynaers-details::before { content:""; position:absolute; z-index:-1; width:430px; height:430px; top:-285px; right:-120px; border-radius:50%; background:var(--accent-grad); opacity:.12; filter:blur(2px); }
.reynaers-details::after { content:""; position:absolute; z-index:-1; inset:0 auto 0 0; width:4px; background:var(--accent-grad); opacity:.9; }
.reynaers-details:not([hidden]) { animation:reynaers-details-in .5s var(--ease) both; }
@keyframes reynaers-details-in { from { opacity:0; transform:translateY(-12px) scale(.992); } to { opacity:1; transform:none; } }
.reynaers-details__head { display:flex; align-items:flex-start; justify-content:space-between; gap:30px; padding-bottom:28px; border-bottom:1px solid var(--border); }
.reynaers-details__head > div { max-width:760px; }
.reynaers-details__head h3 { margin:7px 0 10px; font-size:clamp(2rem,4vw,3.4rem); letter-spacing:-.045em; line-height:1; }
.reynaers-details__head p { max-width:650px; color:var(--text-soft); }
.reynaers-details__badge { flex:0 0 auto; display:grid; place-items:center; width:82px; aspect-ratio:1; border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border)); border-radius:50%;
  background:color-mix(in srgb,var(--accent-soft) 58%,var(--surface)); color:var(--accent); font-size:.8rem; font-weight:800; letter-spacing:.12em; box-shadow:inset 0 0 0 8px color-mix(in srgb,var(--surface) 60%,transparent); }
.reynaers-details__highlights { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:28px 0 18px; }
.reynaers-details__highlights > div { position:relative; isolation:isolate; min-width:0; padding:19px 20px; overflow:hidden; border:1px solid rgba(255,255,255,.24); border-radius:18px; color:#fff;
  background:var(--metric-gradient); box-shadow:0 11px 28px var(--metric-shadow); transition:transform .25s var(--ease),box-shadow .25s var(--ease); }
.reynaers-details__highlights > div::before { content:""; position:absolute; z-index:-1; width:100px; height:100px; right:-42px; top:-50px; border:16px solid rgba(255,255,255,.12); border-radius:50%; }
.reynaers-details__highlights > div::after { content:""; position:absolute; z-index:-1; inset:auto -28px -48px auto; width:110px; height:110px; border-radius:50%; background:rgba(255,255,255,.09); }
.reynaers-details__highlights > div:hover { transform:translateY(-4px); box-shadow:0 17px 36px var(--metric-shadow); }
.reynaers-details__highlights > div:nth-child(1) { --metric-gradient:linear-gradient(135deg,#126da8 0%,#1e87c9 52%,#36a5d7 100%); --metric-shadow:rgba(30,135,201,.28); }
.reynaers-details__highlights > div:nth-child(2) { --metric-gradient:linear-gradient(135deg,#1688b8 0%,#2fa4c7 50%,#58b88b 100%); --metric-shadow:rgba(47,164,199,.26); }
.reynaers-details__highlights > div:nth-child(3) { --metric-gradient:linear-gradient(135deg,#2d9b75 0%,#55af61 52%,#7ac143 100%); --metric-shadow:rgba(85,175,97,.27); }
.reynaers-details__highlights > div:nth-child(4) { --metric-gradient:linear-gradient(135deg,#1e78ae 0%,#419c91 48%,#7ac143 100%); --metric-shadow:rgba(65,156,145,.27); }
.reynaers-details__highlights small { display:block; margin-bottom:8px; color:rgba(255,255,255,.78); font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.reynaers-details__highlights strong { color:#fff; font-size:clamp(1.55rem,3vw,2.3rem); font-weight:740; letter-spacing:-.04em; line-height:1; text-shadow:0 1px 10px rgba(0,0,0,.08); }
.reynaers-details__highlights span { margin-left:5px; color:rgba(255,255,255,.78); font-size:.72rem; }
.reynaers-details__grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:14px; counter-reset:reynaers-spec; }
.reynaers-spec { grid-column:span 6; min-width:0; padding:26px; border:1px solid var(--border); border-radius:22px; background:color-mix(in srgb,var(--surface) 91%,transparent); box-shadow:0 10px 34px rgba(15,42,62,.05); counter-increment:reynaers-spec; transition:transform .25s var(--ease),border-color .25s,box-shadow .25s; }
.reynaers-spec:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--accent) 34%,var(--border)); box-shadow:0 16px 40px rgba(15,42,62,.09); }
.reynaers-spec:nth-child(1) { grid-column:span 5; }
.reynaers-spec:nth-child(2) { grid-column:span 7; }
.reynaers-spec:nth-child(3) { grid-column:span 4; background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 50%,var(--surface)),var(--surface)); }
.reynaers-spec:nth-child(4) { grid-column:span 8; }
.reynaers-spec:nth-child(5) { grid-column:span 7; }
.reynaers-spec:nth-child(6) { grid-column:span 5; }
.reynaers-spec h4 { display:flex; align-items:center; gap:11px; margin:0 0 19px; color:var(--text); font-size:1.05rem; letter-spacing:-.01em; }
.reynaers-spec h4::before { content:"0" counter(reynaers-spec); display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:var(--accent-soft); color:var(--accent); font-size:.66rem; font-weight:800; letter-spacing:.05em; }
.reynaers-spec dl { margin:0; }
.reynaers-spec dl > div { display:flex; align-items:baseline; justify-content:space-between; gap:22px; padding:11px 0; border-top:1px solid color-mix(in srgb,var(--border) 80%,transparent); }
.reynaers-spec dl > div:first-child { padding-top:0; border-top:0; }
.reynaers-spec dt { color:var(--text-soft); font-size:.83rem; line-height:1.45; }
.reynaers-spec dd { flex:0 1 58%; min-width:0; margin:0; color:var(--text); font-size:.88rem; font-weight:720; line-height:1.45; overflow-wrap:anywhere; text-align:right; }
.reynaers-spec__wide { align-items:flex-start !important; flex-direction:column; gap:6px !important; }
.reynaers-spec__wide dd { max-width:none; color:var(--text-soft); font-weight:500; text-align:left; }
.reynaers-spec:first-child dl > div:nth-child(-n+2) dd { color:var(--accent); font-size:1.1rem; }
.reynaers-details__note { display:flex; align-items:flex-start; gap:10px; margin:18px 0 0; padding:15px 18px; border-radius:16px; background:color-mix(in srgb,var(--accent-soft) 48%,var(--surface)); color:var(--text-soft); font-size:.78rem; }
.reynaers-details__note::before { content:"i"; flex:0 0 auto; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:var(--accent); color:#fff; font-size:.7rem; font-weight:800; font-style:normal; }
.reynaers-source { margin-top:26px; color:var(--text-faint); font-size:.82rem; text-align:right; }
@media (max-width:820px){
  .reynaers-catalog-head { align-items:start; flex-direction:column; }
  .reynaers-catalog-count small { text-align:left; }
  .reynaers-system { grid-template-columns:50px minmax(0,1fr); }
  .reynaers-system__side { grid-column:2; min-height:0; align-items:flex-start; flex-direction:row; text-align:left; }
  .reynaers-system__product-zoom { width:145px; height:118px; margin:-18px 0; }
  .reynaers-details__highlights { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .reynaers-spec,.reynaers-spec:nth-child(n) { grid-column:span 12; }
}
@media (max-width:560px){
  .reynaers-system { grid-template-columns:1fr; gap:12px; border-radius:22px; }
  .reynaers-system__side { grid-column:1; align-items:flex-start; flex-direction:column; gap:14px; }
  .reynaers-system__side--visual { align-items:center; text-align:center; }
  .reynaers-system__side--visual .reynaers-system__type { align-self:flex-start; }
  .reynaers-system__side--visual .reynaers-system__link { align-self:flex-start; }
  .reynaers-system__product-zoom { width:min(210px,72vw); height:175px; margin:-2px auto 2px; }
  .reynaers-system__main h2 { margin-top:0; }
  .reynaers-details { padding:25px 18px; border-radius:23px; }
  .reynaers-details__head { gap:18px; }
  .reynaers-details__badge { width:60px; }
  .reynaers-details__highlights > div { padding:15px; }
  .reynaers-details__highlights strong { display:block; }
  .reynaers-details__highlights span { display:block; margin:5px 0 0; }
  .reynaers-spec { padding:21px 18px; border-radius:18px; }
  .reynaers-spec dl > div { align-items:flex-start; flex-direction:column; gap:4px; }
  .reynaers-spec dd { text-align:left; }
}

/* ---------- Footer ---------- */
.footer { background: var(--bg-soft); border-top:1px solid var(--border); padding: 64px 0 36px; }
.footer__grid { display:grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 32px; }
@media (max-width: 820px){ .footer__grid { grid-template-columns: 1fr 1fr; gap:28px;} }
@media (max-width: 480px){ .footer__grid { grid-template-columns: 1fr; } }
.footer h4 { font-size:.82rem; text-transform:uppercase; letter-spacing:.08em; color: var(--text-faint); margin-bottom:14px; font-weight:600; }
.footer a { color: var(--text-soft); font-size:.95rem; display:block; padding:5px 0; transition:color .2s; }
.footer a:hover { color: var(--accent); }
.footer__brand p { font-size:.92rem; margin-top:14px; max-width: 280px; }
.footer__bottom { margin-top: 48px; padding-top: 24px; border-top:1px solid var(--border);
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.85rem; color: var(--text-faint); }

/* ---------- Reveal on scroll ---------- */
.reveal { opacity:0; transform: translateY(26px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal { opacity:1; transform:none; } * { scroll-behavior:auto !important; } }

/* ---------- Chatbot ---------- */
.chat-fab {
  position: fixed; right: 22px; bottom: 22px; z-index: 200;
  height: 58px; padding: 0 22px 0 18px; border-radius: 999px; border:none;
  background: var(--accent-grad); color:#fff; font-weight:600; font-size:.98rem;
  display:flex; align-items:center; gap:10px; box-shadow: 0 10px 30px rgba(30,135,201,.4);
  transition: transform .2s var(--ease), box-shadow .2s;
}
.chat-fab:hover { transform: translateY(-2px); box-shadow: 0 14px 38px rgba(30,135,201,.5); }
.chat-fab svg { width: 22px; height:22px; }
.chat-fab .pulse { width:9px; height:9px; border-radius:50%; background:#8bd14f; box-shadow:0 0 0 0 rgba(139,209,79,.6);
  animation: pulse 2s infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(139,209,79,.5);} 70%{box-shadow:0 0 0 9px rgba(139,209,79,0);} 100%{box-shadow:0 0 0 0 rgba(139,209,79,0);} }
@media (max-width: 600px) {
  .chat-fab {
    right: 14px; bottom: 14px; width: 56px; height: 56px; padding: 0;
    border-radius: 50%; justify-content: center; gap: 5px; font-size: 0;
  }
  .chat-fab .pulse { width: 8px; height: 8px; flex: 0 0 auto; }
  .chat-fab svg { width: 21px; height: 21px; flex: 0 0 auto; }
}

.chat-panel {
  position: fixed; right: 22px; bottom: 22px; z-index: 201;
  width: min(400px, calc(100vw - 32px)); height: min(620px, calc(100vh - 40px));
  background: var(--bg-elevated); border:1px solid var(--border); border-radius: 22px;
  box-shadow: var(--shadow-lg); display:flex; flex-direction:column; overflow:hidden;
  opacity:0; visibility:hidden; transform: translateY(20px) scale(.96); transform-origin: bottom right;
  transition: opacity .28s var(--ease), transform .28s var(--ease), visibility .28s;
}
.chat-panel.open { opacity:1; visibility:visible; transform:none; }
.chat-head { padding: 16px 18px; display:flex; align-items:center; gap:12px;
  background: var(--accent-grad); color:#fff; }
.chat-head .avatar { width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.18);
  display:grid; place-items:center; }
.chat-head .avatar svg { width:22px; height:22px; }
.chat-head .t { font-weight:600; line-height:1.2; }
.chat-head .s { font-size:.78rem; opacity:.9; display:flex; align-items:center; gap:6px;}
.chat-head .s::before { content:""; width:7px; height:7px; border-radius:50%; background:#8bd14f; }
.chat-head .x { margin-left:auto; background:rgba(255,255,255,.16); border:none; color:#fff;
  width:32px; height:32px; border-radius:50%; display:grid; place-items:center; }
.chat-head .x:hover { background:rgba(255,255,255,.28); }

.chat-body { flex:1; overflow-y:auto; padding: 18px; display:flex; flex-direction:column; gap:12px;
  background: var(--surface); scroll-behavior:smooth; }
.msg { max-width: 82%; padding: 11px 15px; border-radius: 16px; font-size:.95rem; line-height:1.45; }
.msg.bot { background: var(--bg-soft); color: var(--text); align-self:flex-start; border-bottom-left-radius:5px; }
.msg.user { background: var(--accent); color:#fff; align-self:flex-end; border-bottom-right-radius:5px; }
.msg.bot strong { color: var(--text); }
.chat-typing { align-self:flex-start; display:flex; gap:4px; padding: 12px 16px; background: var(--bg-soft); border-radius:16px; }
.chat-typing span { width:7px;height:7px;border-radius:50%;background:var(--text-faint); animation: blink 1.2s infinite; }
.chat-typing span:nth-child(2){ animation-delay:.2s;} .chat-typing span:nth-child(3){ animation-delay:.4s;}
@keyframes blink { 0%,60%,100%{opacity:.3;} 30%{opacity:1;} }

.chat-foot { border-top:1px solid var(--border); padding: 14px; background: var(--bg-elevated); }
.chips { display:flex; flex-wrap:wrap; gap:8px; }
.chip { padding: 9px 15px; border-radius: 999px; border:1px solid var(--border-strong);
  background: var(--surface); color: var(--text); font-size:.9rem; font-weight:500; transition: all .18s; }
.chip:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.chip.primary { background: var(--accent); color:#fff; border-color: var(--accent); }
.chat-input { display:flex; gap:8px; }
.chat-input input, .chat-input select, .chat-input textarea {
  flex:1; padding: 11px 14px; border-radius: 12px; border:1px solid var(--border-strong);
  background: var(--surface); color: var(--text); font-size:.95rem; font-family:inherit; }
.chat-input input:focus, .chat-input select:focus, .chat-input textarea:focus { outline:none; border-color: var(--accent); }
.chat-send { width:44px; height:44px; flex-shrink:0; border:none; border-radius:12px; background: var(--accent); color:#fff;
  display:grid; place-items:center; }
.chat-send:hover { background: var(--accent-strong); }
.chat-send svg { width:18px;height:18px; }
.chat-progress { height:3px; background: var(--bg-soft); }
.chat-progress i { display:block; height:100%; background: var(--accent-grad); width:0; transition: width .4s var(--ease); }
.field-label { font-size:.78rem; color: var(--text-faint); margin: 0 0 6px 2px; }

/* utility */
.mt-0{margin-top:0}.mt-1{margin-top:14px}.mt-2{margin-top:28px}.mt-3{margin-top:48px}
.mb-1{margin-bottom:14px}.mb-2{margin-bottom:28px}
.maxw-680{max-width:680px}
.tag { display:inline-block; padding:5px 12px; border-radius:999px; background: var(--accent-soft); color: var(--accent);
  font-size:.8rem; font-weight:600; }
.muted { color: var(--text-faint); }
hr.sep { border:none; border-top:1px solid var(--border); margin: 0; }

/* ---------- Schüco Fenstersysteme ---------- */
.schueco-page { background:var(--bg); }
.schueco-hero { position:relative; isolation:isolate; min-height:clamp(600px,78vh,820px); display:grid; align-items:center; padding:calc(var(--nav-h) + 72px) 0 82px; overflow:hidden; color:#fff; background:linear-gradient(135deg,#08131c 0%,#102b3a 52%,#0b5a74 100%); }
.schueco-hero::before { content:""; position:absolute; z-index:-2; inset:0; opacity:.72; background:radial-gradient(circle at 78% 28%,rgba(35,160,224,.38),transparent 34%),linear-gradient(115deg,transparent 48%,rgba(255,255,255,.08) 48.2%,transparent 48.7%); }
.schueco-hero__bg { position:absolute; z-index:-1; inset:0; overflow:hidden; }
.schueco-hero__bg img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.schueco-hero__bg::after { content:""; position:absolute; inset:0; background:linear-gradient(112deg,rgba(6,15,22,.94) 0%,rgba(9,26,37,.86) 34%,rgba(11,45,64,.6) 68%,rgba(12,66,92,.34) 100%); }
.schueco-hero__content { position:relative; z-index:1; max-width:720px; }
.schueco-hero__logo { width:min(290px,65vw); height:80px; display:flex; align-items:center; margin-bottom:42px; padding:16px 22px; border:1px solid rgba(255,255,255,.22); border-radius:18px; background:rgba(255,255,255,.96); box-shadow:0 20px 50px rgba(0,0,0,.18); }
.schueco-hero__logo img { display:block; width:100%; height:100%; object-fit:contain; }
.schueco-hero__location { width:max-content; max-width:min(560px,92vw); display:flex; align-items:center; gap:13px; margin-bottom:42px; padding:12px 18px; border:1px solid rgba(255,255,255,.3); border-radius:999px; background:rgba(5,16,25,.48); color:#fff; text-decoration:none; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:0 18px 44px rgba(0,0,0,.24); cursor:pointer; transition:transform .2s,border-color .2s,background .2s; }
.schueco-hero__location span { flex:0 0 auto; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:rgba(35,160,224,.2); color:#8edcff; font-size:1.05rem; }
.schueco-hero__location strong { color:#fff; font-size:clamp(.9rem,1.5vw,1.08rem); font-weight:720; letter-spacing:.01em; }
.schueco-hero__location:hover,.schueco-hero__location:focus-visible { transform:translateY(-2px); border-color:#8edcff; background:rgba(5,16,25,.68); }
@media (max-width:560px) { .schueco-hero__location { width:100%; border-radius:24px; } }
.schueco-hero h1 { max-width:670px; font-size:clamp(3rem,7vw,6.5rem); line-height:.93; letter-spacing:-.065em; }
.schueco-hero__claim { max-width:720px; margin-top:24px; color:rgba(255,255,255,.84); font-size:clamp(1.12rem,2vw,1.42rem); font-weight:520; line-height:1.45; letter-spacing:-.015em; text-wrap:balance; }
.schueco-hero .breadcrumb { margin-bottom:34px; color:rgba(255,255,255,.64); }
.schueco-hero .breadcrumb a:hover { color:#fff; }
.schueco-catalog { padding:clamp(76px,10vw,132px) 0; }
.schueco-catalog__head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:end; margin-bottom:48px; }
.schueco-catalog__head > div:first-child { max-width:780px; }
.schueco-catalog__mark { width:112px; height:112px; display:grid; place-items:center; border-radius:26px; color:#fff; background:linear-gradient(145deg,#23a0e0,#0a6f96); font-size:2.6rem; font-weight:780; letter-spacing:-.06em; box-shadow:0 20px 44px rgba(10,111,150,.24); }
.schueco-system-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.schueco-system-card { position:relative; min-height:330px; display:flex; flex-direction:column; padding:clamp(30px,4vw,46px); overflow:hidden; border:1px solid var(--border); border-radius:28px; background:linear-gradient(145deg,var(--surface),var(--bg-soft)); box-shadow:var(--shadow); transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s ease; }
.schueco-system-card::after { content:""; position:absolute; width:190px; height:190px; right:-70px; bottom:-85px; border:18px solid color-mix(in srgb,var(--accent) 16%,transparent); transform:rotate(12deg); }
.schueco-system-card:hover { transform:translateY(-6px); border-color:color-mix(in srgb,var(--accent) 38%,var(--border)); box-shadow:var(--shadow-lg); }
.schueco-system-card__num { color:var(--accent); font-size:.78rem; font-weight:800; letter-spacing:.14em; }
.schueco-system-card h2 { margin-top:24px; font-size:clamp(2rem,4vw,3.4rem); letter-spacing:-.055em; }
.schueco-system-card p { max-width:520px; margin-top:14px; color:var(--text-soft); }
.schueco-system-card__footer { position:relative; z-index:1; margin-top:auto; padding-top:32px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.schueco-system-card__status { display:inline-flex; align-items:center; gap:9px; color:var(--text-faint); font-size:.82rem; font-weight:700; }
.schueco-system-card__status::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 5px var(--accent-soft); }
.schueco-system-card__add { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--border); border-radius:50%; color:var(--accent); font-size:1.45rem; background:var(--surface); }
.schueco-ready { padding:0 0 clamp(76px,10vw,126px); }
.schueco-ready__panel { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:30px; align-items:center; padding:clamp(34px,5vw,58px); border:1px solid var(--border); border-radius:30px; background:var(--surface); box-shadow:var(--shadow); }
.schueco-ready__panel p { max-width:700px; margin-top:10px; }
@media (max-width:760px) {
  .schueco-hero { min-height:620px; padding-bottom:68px; }
  .schueco-hero__bg::after { background:linear-gradient(160deg,rgba(6,15,22,.9) 0%,rgba(9,26,37,.82) 45%,rgba(11,45,64,.6) 100%); }
  .schueco-catalog__head,.schueco-ready__panel { grid-template-columns:1fr; }
  .schueco-catalog__mark { width:82px; height:82px; border-radius:20px; font-size:2rem; }
  .schueco-system-grid { grid-template-columns:1fr; }
  .schueco-system-card { min-height:300px; }
}

/* ---------- Einheitlicher schwebender Glas-Header ---------- */
.nav {
  position: fixed;
  top: 14px;
  left: 50%;
  width: min(calc(100% - 32px), 1220px);
  height: 64px;
  transform: translateX(-50%);
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 22px;
  background: rgba(255,255,255,.18);
  -webkit-backdrop-filter: saturate(175%) blur(22px);
  backdrop-filter: saturate(175%) blur(22px);
  box-shadow: 0 18px 55px rgba(5,15,25,.16), inset 0 1px 0 rgba(255,255,255,.3);
}
.nav__inner { padding-inline: 18px; }
.nav .brand .logo-ic {
  filter: saturate(1.4) contrast(1.24) drop-shadow(0 3px 7px rgba(0,0,0,.24));
}
.nav .brand-txt {
  color: rgba(8,18,26,.96);
  font-weight: 680;
  text-shadow: 0 1px 1px rgba(255,255,255,.62), 0 2px 8px rgba(0,0,0,.12);
}
.nav .brand-txt b {
  background: linear-gradient(90deg,#087fbd 0%,#159f94 52%,#559f25 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 780;
  text-shadow: none;
  filter: saturate(1.25) contrast(1.18) drop-shadow(0 1px 1px rgba(0,0,0,.18));
}
.nav__links a { color: rgba(22,31,39,.76); }
.nav__links a:hover { background: rgba(255,255,255,.3); }
.nav .icon-btn { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.42); }
[data-theme="dark"] .nav {
  background: rgba(8,16,24,.2);
  border-color: rgba(255,255,255,.2);
  box-shadow: 0 18px 55px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.12);
}
[data-theme="dark"] .nav__links a { color: rgba(255,255,255,.8); }
[data-theme="dark"] .nav .brand-txt { color: rgba(255,255,255,.96); text-shadow: 0 2px 8px rgba(0,0,0,.44); }

.nav .drop {
  top: calc(100% + 10px);
  min-width: 270px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 18px;
  background: linear-gradient(145deg,rgba(255,255,255,.38),rgba(255,255,255,.16));
  -webkit-backdrop-filter: saturate(180%) blur(26px);
  backdrop-filter: saturate(180%) blur(26px);
  box-shadow: 0 22px 60px rgba(5,15,25,.22), inset 0 1px 0 rgba(255,255,255,.38);
}
.nav .drop::before {
  content: "";
  position: absolute;
  top: -12px;
  left: 0;
  right: 0;
  height: 12px;
}
.nav .drop a {
  color: rgba(8,18,26,.92);
  border: 1px solid transparent;
  border-radius: 12px;
}
.nav .drop a span { color: rgba(28,43,54,.66); }
.nav .drop a:hover {
  color: rgba(4,14,22,.98);
  border-color: rgba(255,255,255,.32);
  background: rgba(255,255,255,.28);
}
[data-theme="dark"] .nav .drop {
  border-color: rgba(255,255,255,.2);
  background: linear-gradient(145deg,rgba(15,29,42,.62),rgba(7,16,25,.34));
  box-shadow: 0 24px 65px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.12);
}
[data-theme="dark"] .nav .drop a { color: rgba(255,255,255,.9); }
[data-theme="dark"] .nav .drop a span { color: rgba(255,255,255,.58); }
[data-theme="dark"] .nav .drop a:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.12); }

.mobile-menu {
  inset: 92px 16px auto;
  max-height: calc(100vh - 108px);
  max-height: calc(100dvh - 108px);
  overflow-y: auto;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  padding-bottom: max(24px, env(safe-area-inset-bottom));
  border-radius: 22px;
}
body:has(.mobile-menu.open) { overflow: hidden; }
.ny-feature { min-height: 100svh; }
.info-topic-nav { top: calc(var(--nav-h) + 20px); }
.scrolly__stage-wrap { top: calc(var(--nav-h) + 30px); }

@media (max-width: 600px) {
  .nav { top: 9px; width: calc(100% - 18px); height: 58px; border-radius: 18px; }
  .nav__inner { padding-inline: 11px; }
  .mobile-menu {
    inset: 77px 9px auto;
    max-height: calc(100vh - 86px);
    max-height: calc(100dvh - 86px);
  }
}

/* ---------- Vollflächige Einstiegsbilder auf allen Unterseiten ---------- */
.pagehero {
  padding: 0 !important;
  overflow: hidden;
  isolation: isolate;
}
.pagehero > .container {
  width: 100%;
  max-width: none;
  padding-inline: 0;
}
.pagehero__media,
.fenster-page .pagehero__media,
.reynaers-page .pagehero__media,
.info-page .pagehero__media {
  width: 100vw;
  height: clamp(560px, 82svh, 860px);
  margin: 0;
  border-radius: 0;
  box-shadow: none;
}
.pagehero__media::after {
  background:
    linear-gradient(180deg, rgba(3,10,16,.34) 0%, rgba(3,10,16,.06) 38%, rgba(3,10,16,.68) 100%);
}
.pagehero .breadcrumb {
  position: absolute;
  z-index: 4;
  top: calc(var(--nav-h) + 34px);
  left: max(24px, calc((100vw - var(--maxw)) / 2 + 24px));
  right: max(24px, calc((100vw - var(--maxw)) / 2 + 24px));
  width: max-content;
  max-width: calc(100vw - 48px);
  color: rgba(255,255,255,.78);
  text-shadow: 0 2px 14px rgba(0,0,0,.52);
}
.pagehero .breadcrumb a:hover { color: #fff; }
.pagehero__cap,
.fenster-page .pagehero__cap,
.reynaers-page .pagehero__cap {
  left: max(24px, calc((100vw - var(--maxw)) / 2 + 24px));
  right: max(24px, calc((100vw - var(--maxw)) / 2 + 24px));
  bottom: clamp(34px, 7vh, 72px);
}

/* Breadcrumb-only intro on Sonnenschutz: image hero starts directly at y=0. */
.pagehero:not(:has(.pagehero__media)) {
  position: absolute;
  z-index: 3;
  inset: 0 0 auto;
  overflow: visible;
  pointer-events: none;
}
.pagehero:not(:has(.pagehero__media)) .breadcrumb { pointer-events: auto; }

@media (max-width: 600px) {
  .pagehero__media,
  .fenster-page .pagehero__media,
  .reynaers-page .pagehero__media,
  .info-page .pagehero__media {
    height: clamp(560px, 86svh, 760px);
  }
  .pagehero .breadcrumb {
    top: 88px;
    left: 20px;
    right: 20px;
    max-width: calc(100vw - 40px);
    font-size: .78rem;
  }
  .pagehero__cap,
  .fenster-page .pagehero__cap,
  .reynaers-page .pagehero__cap {
    left: 20px;
    right: 20px;
    bottom: 34px;
  }
}

/* ---------- Zentrale Navigation der Informationsrubriken ---------- */
.info-topic-nav__inner {
  justify-content: center;
}

@media (max-width: 600px) {
  .info-topic-nav__inner {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    overflow: visible;
  }
  .info-topic-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding-inline: 10px;
    text-align: center;
  }
}

/* Themen-Navigation auf der Sicherheit-Seite nutzt den Standard-Stil (heller Streifen) wie die übrigen Info-Seiten. */

/* ---------- Aluminium-Fenster · Wissensseite 2026 ---------- */
.aw-window-hero{position:relative;min-height:clamp(720px,100svh,980px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;background:#07131c;color:#fff}
.aw-window-hero__image,.aw-window-hero__shade{position:absolute;inset:0;width:100%;height:100%}
.aw-window-hero__image{z-index:-3;object-fit:cover;object-position:center 48%;transform:scale(1.015)}
.aw-window-hero__shade{z-index:-2;background:linear-gradient(90deg,rgba(4,13,21,.9) 0%,rgba(5,17,27,.7) 42%,rgba(5,17,27,.22) 73%,rgba(5,17,27,.38) 100%),linear-gradient(0deg,rgba(4,13,21,.75),transparent 55%)}
.aw-window-hero__content{position:relative;padding-top:148px;padding-bottom:58px}
.aw-window-hero .breadcrumb{position:absolute;top:112px;left:24px;color:rgba(255,255,255,.68)}
.aw-window-hero .breadcrumb a{color:rgba(255,255,255,.78)}
.aw-window-hero__copy{max-width:800px;padding-bottom:84px}
.aw-window-hero__copy .eyebrow{color:#8ed8ff}
.aw-window-hero__copy h1{max-width:760px;margin-top:18px;font-size:clamp(4rem,8.4vw,8rem);line-height:.86;letter-spacing:-.075em;color:#fff}
.aw-window-hero__copy h1 span{color:rgba(255,255,255,.64);font-weight:520}
.aw-window-hero__copy p{max-width:720px;margin-top:32px;color:rgba(255,255,255,.78);font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.55}
.aw-window-hero .btn-row{margin-top:30px}
.btn--glass{color:#fff;border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.btn--glass:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.5)}
.aw-window-hero__facts{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.22)}
.aw-window-hero__facts span{display:flex;align-items:center;gap:13px;padding:24px 22px 0 0;color:rgba(255,255,255,.72);font-size:.92rem}
.aw-window-hero__facts span+span{padding-left:24px;border-left:1px solid rgba(255,255,255,.18)}
.aw-window-hero__facts b{color:#8ed8ff;font-size:.72rem;letter-spacing:.13em}
.aw-window-intro,.aw-window-anatomy,.aw-tech-section{background:#f4f6f7!important;color:#17212a}
.aw-window-intro{padding-top:clamp(90px,12vw,160px)}
.aw-section-head,.aw-window-intro__head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.8fr);gap:clamp(40px,8vw,120px);align-items:end;margin-bottom:clamp(48px,7vw,82px)}
.aw-section-head h2,.aw-window-intro__head h2{max-width:760px;margin-top:14px;font-size:clamp(2.7rem,5.5vw,5.2rem);line-height:.94;letter-spacing:-.065em}
.aw-section-head>p,.aw-window-intro__head>p{max-width:610px;color:#5d6871}
.aw-window-principles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;border:1px solid rgba(15,33,46,.12);border-radius:28px;overflow:hidden;background:rgba(15,33,46,.12)}
.aw-window-principles article{min-height:270px;padding:clamp(30px,5vw,58px);background:rgba(255,255,255,.84);transition:background .3s}
.aw-window-principles article:hover{background:#fff}
.aw-window-principles article>span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#102a3c;color:#9fe0ff;font-size:.72rem;font-weight:800;letter-spacing:.08em}
.aw-window-principles h3{margin-top:42px;font-size:clamp(1.35rem,2.2vw,2rem);letter-spacing:-.035em}
.aw-window-principles p{max-width:520px;margin-top:12px;color:#68737b}
.aw-window-anatomy{padding-top:clamp(80px,10vw,140px)}
.aw-anatomy-flow{border-top:1px solid rgba(15,33,46,.15)}
.aw-anatomy-flow article{display:grid;grid-template-columns:92px minmax(0,1fr);gap:28px;padding:32px 0;border-bottom:1px solid rgba(15,33,46,.15);transition:padding-left .35s,background .35s}
.aw-anatomy-flow article:hover{padding-left:18px;background:linear-gradient(90deg,rgba(35,160,224,.07),transparent 65%)}
.aw-anatomy-flow b{color:#168cc7;font-size:.78rem;letter-spacing:.14em;padding-top:5px}
.aw-anatomy-flow article>div{display:grid;grid-template-columns:minmax(220px,.45fr) minmax(300px,1fr);gap:46px}
.aw-anatomy-flow h3{font-size:clamp(1.25rem,2vw,1.7rem)}
.aw-anatomy-flow p{color:#66717a}
.aw-performance-lab,.aw-planning-path{position:relative;overflow:hidden;background:radial-gradient(90% 100% at 100% 0%,#163c54 0%,#0b2232 45%,#06131e 100%)!important;color:#fff}
.aw-performance-lab::before,.aw-planning-path::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,#000,transparent 82%)}
.aw-section-head--light{position:relative}
.aw-section-head--light h2{color:#fff}
.aw-section-head--light .eyebrow{color:#8ed8ff}
.aw-section-head--light>p{color:rgba(255,255,255,.65)}
.aw-metric-grid{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.aw-metric-grid article{min-height:330px;padding:32px;border:1px solid rgba(255,255,255,.13);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:transform .3s,border-color .3s,background .3s}
.aw-metric-grid article:hover{transform:translateY(-5px);border-color:rgba(142,216,255,.4);background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.05))}
.aw-metric-symbol{display:flex;align-items:center;height:70px;color:#8ed8ff;font-size:clamp(2.1rem,3vw,3rem);font-weight:760;letter-spacing:-.055em}
.aw-metric-grid h3{margin-top:24px;color:#fff;font-size:1.18rem}
.aw-metric-grid p{margin-top:12px;color:rgba(255,255,255,.65);font-size:.95rem}
.aw-metric-grid small{display:block;margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);color:rgba(158,224,255,.68);font-size:.76rem}
.aw-performance-note{position:relative;display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;margin-top:18px;padding:28px 32px;border-radius:20px;background:#8ed8ff;color:#082031}
.aw-performance-note b{text-transform:uppercase;letter-spacing:.12em;font-size:.74rem}
.aw-performance-note p{max-width:850px}
.aw-tech-section .tech-explorer{margin-top:12px;border-radius:30px;box-shadow:0 28px 80px rgba(9,30,45,.14)}
.aw-window-life{background:#fff!important}
.aw-life-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.aw-life-grid article{min-height:300px;padding:30px;border:1px solid rgba(15,33,46,.1);border-radius:22px;background:linear-gradient(145deg,#fff,#f4f6f7);box-shadow:0 18px 55px rgba(18,37,51,.06)}
.aw-life-grid i{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#102a3c;color:#9fe0ff;font-size:1.35rem;font-style:normal}
.aw-life-grid h3{margin-top:52px;font-size:1.25rem;letter-spacing:-.03em}
.aw-life-grid p{margin-top:12px;color:#6c757c;font-size:.95rem}
.aw-surface-section{background:linear-gradient(145deg,#d8dcdf,#f7f8f8 48%,#ccd1d5)!important}
.aw-surface-section .swatches{margin-top:14px}
.aw-surface-actions{display:flex;justify-content:flex-end;margin-top:28px}
.aw-surface-actions .btn{max-width:100%;white-space:normal;text-align:center}
.aw-planning-steps{position:relative;list-style:none;border-top:1px solid rgba(255,255,255,.16)}
.aw-planning-steps li{display:grid;grid-template-columns:110px minmax(0,1fr);gap:30px;padding:30px 0;border-bottom:1px solid rgba(255,255,255,.16)}
.aw-planning-steps b{color:#8ed8ff;font-size:.8rem;letter-spacing:.14em;padding-top:6px}
.aw-planning-steps li>div{display:grid;grid-template-columns:minmax(220px,.45fr) minmax(300px,1fr);gap:48px}
.aw-planning-steps h3{color:#fff;font-size:1.45rem}
.aw-planning-steps p{color:rgba(255,255,255,.62)}
.aw-window-cta{padding-block:clamp(70px,10vw,130px);background:#eef1f3!important}
.aw-window-cta__panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end;padding:clamp(38px,6vw,74px);border-radius:32px;color:#fff;background:linear-gradient(125deg,#0b2638,#1479ad 64%,#38a895);box-shadow:0 30px 90px rgba(8,37,55,.24)}
.aw-window-cta__panel .eyebrow{color:#b9ecff}
.aw-window-cta__panel h2{max-width:800px;margin-top:14px;color:#fff;font-size:clamp(2.4rem,5vw,4.8rem);line-height:.96;letter-spacing:-.06em}
.aw-window-cta__panel p{max-width:760px;margin-top:20px;color:rgba(255,255,255,.74)}
.aw-window-cta__panel .btn-row{justify-content:flex-end}
@media(max-width:1000px){.aw-section-head,.aw-window-intro__head{grid-template-columns:1fr;gap:28px}.aw-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.aw-life-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.aw-window-cta__panel{grid-template-columns:1fr;align-items:start}.aw-window-cta__panel .btn-row{justify-content:flex-start}}
@media(max-width:700px){
  .aw-window-hero{min-height:760px}.aw-window-hero__shade{background:linear-gradient(0deg,rgba(4,13,21,.94) 0%,rgba(5,17,27,.72) 64%,rgba(5,17,27,.4) 100%)}.aw-window-hero__content{padding-top:112px;padding-bottom:34px}.aw-window-hero .breadcrumb{top:86px;left:16px}.aw-window-hero__copy{padding-bottom:52px}.aw-window-hero__copy h1{font-size:clamp(3.6rem,17vw,5.2rem)}
  .aw-window-hero__facts{grid-template-columns:1fr}.aw-window-hero__facts span{padding:13px 0;border-top:1px solid rgba(255,255,255,.12)}.aw-window-hero__facts span+span{padding-left:0;border-left:0}
  .aw-window-principles,.aw-metric-grid,.aw-life-grid{grid-template-columns:1fr}.aw-window-principles article,.aw-metric-grid article,.aw-life-grid article{min-height:0}
  .aw-anatomy-flow article,.aw-planning-steps li{grid-template-columns:54px minmax(0,1fr);gap:16px}.aw-anatomy-flow article>div,.aw-planning-steps li>div{grid-template-columns:1fr;gap:10px}.aw-performance-note{grid-template-columns:1fr;gap:8px}.aw-window-cta__panel{padding:32px 24px;border-radius:24px}.aw-surface-actions{justify-content:flex-start}
}

/* ================= FAQ page (informationen/faq.html) ================= */
.faq-wrap { max-width:880px; margin-inline:auto; }
.faq-group { margin-top:clamp(34px,5vw,60px); }
.faq-group__label { display:block; font-size:.76rem; letter-spacing:.09em; text-transform:uppercase; color:var(--accent); font-weight:800; margin-bottom:5px; }
.faq-group > h2 { font-size:clamp(1.32rem,2.4vw,1.72rem); letter-spacing:-.02em; }
.faq-list { margin-top:14px; border-top:1px solid var(--border); }
.faq-item { border-bottom:1px solid var(--border); }
.faq-item > summary { list-style:none; cursor:pointer; display:flex; gap:18px; align-items:flex-start; justify-content:space-between; padding:20px 2px; font-size:1.07rem; font-weight:650; letter-spacing:-.01em; color:var(--text); transition:color .2s; }
.faq-item > summary::-webkit-details-marker { display:none; }
.faq-item > summary:hover { color:var(--accent); }
.faq-item__icon { flex:0 0 auto; width:26px; height:26px; margin-top:1px; border-radius:50%; border:1.5px solid var(--border); display:grid; place-items:center; position:relative; color:var(--text-soft); transition:border-color .2s,color .2s; }
.faq-item__icon::before,.faq-item__icon::after { content:""; position:absolute; background:currentColor; border-radius:2px; }
.faq-item__icon::before { width:11px; height:2px; }
.faq-item__icon::after { width:2px; height:11px; transition:opacity .25s,transform .25s; }
.faq-item[open] .faq-item__icon { border-color:var(--accent); color:var(--accent); }
.faq-item[open] .faq-item__icon::after { opacity:0; transform:scaleY(0); }
.faq-item__body { padding:2px 44px 22px 2px; color:var(--text-soft); line-height:1.72; font-size:1rem; }
.faq-item__body a { color:var(--accent); font-weight:600; }
.faq-item__body strong { color:var(--text); font-weight:700; }
.faq-cta { margin-top:clamp(40px,6vw,72px); }
@media (max-width:560px){ .faq-item__body { padding-right:2px; } }

/* ================= Schüco Sliding Glass Door Systems ================= */
.schueco-sliding-page{background:var(--bg)}
.sliding-systems-hero{position:relative;isolation:isolate;min-height:min(920px,100svh);overflow:hidden;color:#fff}
.sliding-systems-hero>img{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 58%;filter:saturate(.9) contrast(1.05)}
.sliding-systems-hero__shade{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgba(3,12,20,.94) 0%,rgba(4,16,26,.77) 42%,rgba(4,16,26,.24) 72%,rgba(4,16,26,.18) 100%)}
.sliding-systems-hero__shade::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,12,20,.82) 0%,transparent 42%,rgba(3,12,20,.18) 100%)}
.sliding-systems-hero__content{min-height:min(920px,100svh);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-top:150px;padding-bottom:70px}
.sliding-systems-hero .breadcrumb{margin-bottom:clamp(38px,7vh,78px);color:rgba(255,255,255,.68)}
.sliding-systems-hero .breadcrumb a{color:rgba(255,255,255,.72)}
.sliding-systems-hero .eyebrow{color:#86d7ff}
.sliding-systems-hero h1{max-width:980px;margin:12px 0 24px;color:#fff;font-size:clamp(4rem,8.7vw,8.6rem);letter-spacing:-.075em;line-height:.82;text-wrap:balance}
.sliding-systems-hero h1 span{color:rgba(255,255,255,.62)}
.sliding-systems-hero__content>p{max-width:740px;color:rgba(255,255,255,.84);font-size:clamp(1.05rem,1.5vw,1.28rem);line-height:1.65}
.sliding-systems-hero .btn-row{margin-top:32px}
.sliding-systems-hero__facts{width:min(100%,1040px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:clamp(48px,8vh,92px);border-top:1px solid rgba(255,255,255,.26)}
.sliding-systems-hero__facts span{padding:21px 24px 4px 0;color:rgba(255,255,255,.68);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}
.sliding-systems-hero__facts span+span{padding-left:28px;border-left:1px solid rgba(255,255,255,.2)}
.sliding-systems-hero__facts b{display:block;margin-bottom:5px;color:#fff;font-size:1.25rem;letter-spacing:-.02em;text-transform:none}
.sliding-intro{padding-block:clamp(84px,11vw,150px)}
.sliding-section-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.72fr);gap:clamp(34px,8vw,110px);align-items:end;margin-bottom:clamp(44px,7vw,78px)}
.sliding-section-head h2{margin-top:10px;font-size:clamp(2.7rem,5.5vw,5.2rem);letter-spacing:-.062em;line-height:.95}
.sliding-section-head .lead{max-width:640px}
.sliding-family-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sliding-family-grid article{position:relative;min-height:340px;padding:clamp(28px,3.2vw,44px);overflow:hidden;border:1px solid var(--border);border-radius:26px;background:linear-gradient(150deg,var(--surface),color-mix(in srgb,var(--accent-soft) 35%,var(--surface)));box-shadow:0 18px 55px rgba(10,33,49,.07)}
.sliding-family-grid article::after{content:"";position:absolute;width:170px;height:170px;right:-90px;bottom:-95px;border:30px solid color-mix(in srgb,var(--accent) 12%,transparent);border-radius:50%}
.sliding-family-grid article>span{display:grid;place-items:center;width:40px;height:40px;margin-bottom:52px;border:1px solid color-mix(in srgb,var(--accent) 26%,var(--border));border-radius:50%;color:var(--accent);font-size:.75rem;font-weight:800}
.sliding-family-grid h3{font-size:clamp(1.45rem,2.3vw,2.1rem);letter-spacing:-.035em}
.sliding-family-grid p{margin-top:12px;color:var(--text-soft)}
.sliding-family-grid b{display:block;margin-top:22px;color:var(--accent);font-size:.72rem;line-height:1.4;text-transform:uppercase;letter-spacing:.08em}
.sliding-catalog{padding-block:clamp(84px,11vw,148px);background:color-mix(in srgb,var(--surface) 42%,var(--bg))}
.sliding-product-list{display:grid;gap:16px}
.sliding-product{display:grid;grid-template-columns:72px minmax(0,1fr);gap:clamp(18px,4vw,48px);padding:clamp(28px,4.6vw,64px);border:1px solid var(--border);border-radius:30px;background:var(--surface);box-shadow:0 20px 60px rgba(8,27,41,.07);scroll-margin-top:110px}
.sliding-product:nth-child(even){background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--accent-soft) 42%,var(--surface)))}
.sliding-product__num{padding-top:5px;color:var(--accent);font-size:.88rem;font-weight:850;letter-spacing:.12em}
.sliding-product__copy h2{margin:5px 0 12px;font-size:clamp(2.6rem,5.5vw,5.1rem);letter-spacing:-.06em;line-height:.92}
.sliding-product__tagline{max-width:850px;color:var(--text);font-size:clamp(1.05rem,1.5vw,1.28rem);font-weight:720;letter-spacing:-.015em}
.sliding-product__copy>p:not(.sliding-product__tagline){max-width:850px;margin-top:16px;color:var(--text-soft);font-size:1.02rem;line-height:1.75}
.sliding-product__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.sliding-product__chips span{padding:8px 12px;border:1px solid color-mix(in srgb,var(--accent) 19%,var(--border));border-radius:999px;background:var(--accent-soft);color:var(--text);font-size:.76rem;font-weight:700}
.sliding-product__details{grid-column:2;margin-top:10px;border-top:1px solid var(--border)}
.sliding-product__details>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 2px 3px;color:var(--text);font-size:.9rem;font-weight:760;letter-spacing:.02em;cursor:pointer}
.sliding-product__details>summary::-webkit-details-marker{display:none}
.sliding-product__details>summary span{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--border-strong);border-radius:50%;color:var(--accent);font-size:1.12rem;transition:transform .3s var(--ease),background .3s,color .3s}
.sliding-product__details[open]>summary span{transform:rotate(45deg);background:var(--accent);color:#fff}
.sliding-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:24px;animation:sliding-detail-in .42s var(--ease) both}
@keyframes sliding-detail-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.sliding-detail-grid section{padding:clamp(22px,3vw,32px);border:1px solid var(--border);border-radius:20px;background:color-mix(in srgb,var(--bg) 35%,var(--surface))}
.sliding-detail-grid h3{margin-bottom:12px;color:var(--text);font-size:1rem;letter-spacing:.01em}
.sliding-detail-grid p,.sliding-detail-grid li{color:var(--text-soft);font-size:.91rem;line-height:1.65}
.sliding-detail-grid ul{display:grid;gap:8px;padding:0;list-style:none}
.sliding-detail-grid li{position:relative;padding-left:18px}
.sliding-detail-grid li::before{content:"";position:absolute;left:0;top:.68em;width:7px;height:7px;border-radius:50%;background:var(--accent-grad)}
.sliding-source-note{max-width:920px;margin:28px auto 0;padding:16px 20px;border-radius:16px;background:var(--accent-soft);color:var(--text-soft);font-size:.8rem;line-height:1.6;text-align:center}
.sliding-usa{position:relative;isolation:isolate;padding-block:clamp(92px,12vw,160px);overflow:hidden;background:#081a29;color:#fff}
.sliding-usa::before{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent)}
.sliding-section-head--light h2{color:#fff}.sliding-section-head--light .lead{color:rgba(255,255,255,.7)}.sliding-section-head--light .eyebrow{color:#75d0ff}
.sliding-usa-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.18);border-left:1px solid rgba(255,255,255,.18)}
.sliding-usa-grid article{min-height:260px;padding:clamp(25px,3vw,38px);border-right:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18)}
.sliding-usa-grid b{display:block;margin-bottom:45px;color:#72cfff;font-size:.75rem;letter-spacing:.12em}
.sliding-usa-grid h3{color:#fff;font-size:1.35rem}
.sliding-usa-grid p{margin-top:11px;color:rgba(255,255,255,.65);line-height:1.7}
.sliding-faq{padding-block:clamp(90px,11vw,150px)}
.sliding-faq-list{max-width:1000px;margin-inline:auto;border-top:1px solid var(--border)}
.sliding-faq-list details{border-bottom:1px solid var(--border)}
.sliding-faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:25px 2px;color:var(--text);font-size:clamp(1.04rem,1.6vw,1.24rem);font-weight:680;cursor:pointer}
.sliding-faq-list summary::-webkit-details-marker{display:none}
.sliding-faq-list summary span{color:var(--accent);font-size:1.3rem;transition:transform .3s var(--ease)}
.sliding-faq-list details[open] summary span{transform:rotate(45deg)}
.sliding-faq-list p{max-width:830px;padding:0 48px 26px 2px;color:var(--text-soft);font-size:1rem;line-height:1.75}
.sliding-final-cta{padding-top:0;padding-bottom:clamp(84px,10vw,140px)}
.sliding-final-cta__panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;padding:clamp(34px,6vw,72px);border-radius:30px;background:linear-gradient(120deg,#0b3752,#0d698c 48%,#279d87 100%);color:#fff;box-shadow:0 28px 80px rgba(8,45,67,.22)}
.sliding-final-cta__panel h2{margin-top:8px;color:#fff;font-size:clamp(2.5rem,4.8vw,4.5rem);letter-spacing:-.055em;line-height:.96}
.sliding-final-cta__panel p{max-width:720px;margin-top:16px;color:rgba(255,255,255,.78)}
.sliding-final-cta__panel .eyebrow{color:#b4edff}
@media(max-width:980px){.sliding-section-head{grid-template-columns:1fr;gap:26px}.sliding-family-grid{grid-template-columns:1fr}.sliding-family-grid article{min-height:0}.sliding-family-grid article>span{margin-bottom:34px}.sliding-usa-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sliding-final-cta__panel{grid-template-columns:1fr;justify-items:start}}
@media(max-width:700px){.sliding-systems-hero{min-height:900px}.sliding-systems-hero__content{min-height:900px;padding-top:112px;padding-bottom:32px}.sliding-systems-hero__shade{background:linear-gradient(0deg,rgba(3,12,20,.95),rgba(4,16,26,.72) 70%,rgba(4,16,26,.48))}.sliding-systems-hero .breadcrumb{margin-bottom:44px}.sliding-systems-hero h1{font-size:clamp(3.55rem,18vw,5.2rem)}.sliding-systems-hero__facts{grid-template-columns:1fr;margin-top:48px}.sliding-systems-hero__facts span{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.14)}.sliding-systems-hero__facts span+span{padding-left:0;border-left:0}.sliding-product{grid-template-columns:1fr;gap:11px;padding:28px 20px;border-radius:23px}.sliding-product__details{grid-column:1}.sliding-detail-grid{grid-template-columns:1fr}.sliding-usa-grid{grid-template-columns:1fr}.sliding-usa-grid article{min-height:0}.sliding-usa-grid b{margin-bottom:30px}.sliding-final-cta__panel{padding:32px 23px;border-radius:24px}.sliding-faq-list p{padding-right:2px}}

/* ================= Schüco Bifold Door Systems ================= */
.schueco-bifold-page .bifold-hero>img{object-position:center}
.schueco-bifold-page .bifold-hero .sliding-systems-hero__shade{background:linear-gradient(90deg,rgba(3,12,20,.95) 0%,rgba(4,16,26,.8) 43%,rgba(4,16,26,.32) 72%,rgba(4,16,26,.22) 100%)}
.bifold-comparison{padding-top:0;padding-bottom:clamp(84px,11vw,150px)}
.bifold-compare-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.bifold-compare-grid article{position:relative;isolation:isolate;padding:clamp(30px,5vw,60px);overflow:hidden;border:1px solid var(--border);border-radius:28px;background:var(--surface);box-shadow:0 20px 60px rgba(8,27,41,.08)}
.bifold-compare-grid article::after{content:"";position:absolute;z-index:-1;width:260px;height:260px;right:-140px;top:-150px;border:40px solid color-mix(in srgb,var(--accent) 11%,transparent);border-radius:50%}
.bifold-compare-grid__featured{background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 48%,var(--surface)),var(--surface))!important}
.bifold-compare-grid article>span{display:inline-flex;padding:7px 11px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.bifold-compare-grid h3{margin:26px 0 12px;font-size:clamp(2rem,3.8vw,3.5rem);letter-spacing:-.052em}
.bifold-compare-grid p{max-width:650px;color:var(--text-soft);line-height:1.7}
.bifold-compare-grid ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 18px;margin:27px 0 30px;padding:0;list-style:none}
.bifold-compare-grid li{position:relative;padding-left:18px;color:var(--text);font-size:.88rem;font-weight:650}
.bifold-compare-grid li::before{content:"";position:absolute;left:0;top:.48em;width:8px;height:8px;border-radius:50%;background:var(--accent-grad)}
.bifold-compare-grid a{color:var(--accent);font-size:.88rem;font-weight:760}
@media(max-width:760px){.schueco-bifold-page .bifold-hero .sliding-systems-hero__shade{background:linear-gradient(0deg,rgba(3,12,20,.96),rgba(4,16,26,.72) 72%,rgba(4,16,26,.5))}.bifold-compare-grid{grid-template-columns:1fr}.bifold-compare-grid ul{grid-template-columns:1fr}}

/* ---------- Schüco Bifold Doors · Image gallery ---------- */
.bifold-gallery-section{position:relative;isolation:isolate;padding-top:clamp(82px,10vw,138px);overflow:hidden;background:linear-gradient(180deg,var(--bg) 0%,color-mix(in srgb,var(--accent-soft) 22%,var(--bg)) 100%)}
.bifold-gallery-section::before{content:"";position:absolute;z-index:-1;right:-15vw;top:5%;width:55vw;height:55vw;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 10%,transparent),transparent 68%);pointer-events:none}
.bifold-gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(210px,23vw,320px);gap:clamp(10px,1.4vw,18px);margin-top:clamp(38px,6vw,70px)}
.bifold-gallery-card{position:relative;grid-column:span 5;min-width:0;padding:0;overflow:hidden;border:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent);border-radius:clamp(20px,2.2vw,30px);background:#0b1720;color:#fff;box-shadow:0 22px 58px rgba(8,27,41,.11);cursor:zoom-in;text-align:left;isolation:isolate;transition:transform .38s var(--ease),box-shadow .38s var(--ease),border-color .38s var(--ease)}
.bifold-gallery-card--feature{grid-column:span 7;grid-row:span 2}
.bifold-gallery-card:nth-child(n+4){grid-column:span 4}
.bifold-gallery-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .75s cubic-bezier(.2,.7,.2,1),filter .5s ease}
.bifold-gallery-card--feature img{object-position:center}
.bifold-gallery-card--technical{background:#eef3f5}
.bifold-gallery-card--technical img{object-fit:cover;object-position:center}
.bifold-gallery-card__shade{position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(4,12,18,.2) 58%,rgba(4,12,18,.88) 100%);transition:background .38s ease}
.bifold-gallery-card__copy{position:absolute;z-index:2;left:clamp(20px,2.5vw,34px);right:70px;bottom:clamp(18px,2.4vw,30px);display:grid;gap:6px;transform:translateY(3px);transition:transform .38s var(--ease)}
.bifold-gallery-card__copy small{color:rgba(255,255,255,.72);font-size:.69rem;font-weight:760;letter-spacing:.12em;text-transform:uppercase}
.bifold-gallery-card__copy strong{font-size:clamp(1.05rem,1.7vw,1.55rem);font-weight:670;line-height:1.16;letter-spacing:-.025em}
.bifold-gallery-card__zoom{position:absolute;z-index:3;right:clamp(16px,2vw,26px);bottom:clamp(16px,2vw,26px);width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.36);border-radius:50%;background:rgba(7,18,26,.32);font-size:1.2rem;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform .35s var(--ease),background .35s ease,color .35s ease}
.bifold-gallery-card:hover,.bifold-gallery-card:focus-visible{transform:translateY(-6px);border-color:color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 30px 72px rgba(8,27,41,.18)}
.bifold-gallery-card:hover img,.bifold-gallery-card:focus-visible img{transform:scale(1.045);filter:saturate(1.05) contrast(1.02)}
.bifold-gallery-card:hover .bifold-gallery-card__copy,.bifold-gallery-card:focus-visible .bifold-gallery-card__copy{transform:translateY(0)}
.bifold-gallery-card:hover .bifold-gallery-card__zoom,.bifold-gallery-card:focus-visible .bifold-gallery-card__zoom{transform:rotate(45deg);background:#fff;color:#102536}
.bifold-gallery-card:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 55%,transparent);outline-offset:3px}
.bifold-gallery-note{display:flex;align-items:center;gap:10px;margin-top:18px;color:var(--text-faint);font-size:.8rem}
.bifold-gallery-note span{width:24px;height:24px;display:grid;place-items:center;border:1px solid var(--border-strong);border-radius:50%;color:var(--accent);font-weight:800}
@media(max-width:900px){.bifold-gallery{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:280px}.bifold-gallery-card,.bifold-gallery-card:nth-child(n+4){grid-column:span 1}.bifold-gallery-card--feature{grid-column:span 2;grid-row:span 1}.bifold-gallery-card--feature img{object-position:center 58%}}
@media(max-width:620px){.bifold-gallery{grid-template-columns:1fr;grid-auto-rows:clamp(245px,78vw,360px)}.bifold-gallery-card,.bifold-gallery-card:nth-child(n+4),.bifold-gallery-card--feature{grid-column:1;grid-row:span 1}.bifold-gallery-card__copy{right:64px}.bifold-gallery-card__zoom{width:40px;height:40px}.bifold-gallery-note{align-items:flex-start}}
.system-gallery--five>.bifold-gallery-card:nth-child(n+4){grid-column:span 6}
.system-gallery--seven>.bifold-gallery-card:nth-child(n+4){grid-column:span 3}
.sliding-gallery-section{background:linear-gradient(180deg,var(--bg) 0%,color-mix(in srgb,#0d7196 7%,var(--bg)) 100%)}
.curtain-gallery-section{background:linear-gradient(180deg,var(--bg) 0%,color-mix(in srgb,#24465d 8%,var(--bg)) 100%)}
@media(max-width:900px){.system-gallery--five>.bifold-gallery-card:nth-child(n+4),.system-gallery--seven>.bifold-gallery-card:nth-child(n+4){grid-column:span 1}}
@media(max-width:620px){.system-gallery--five>.bifold-gallery-card:nth-child(n+4),.system-gallery--seven>.bifold-gallery-card:nth-child(n+4){grid-column:1}}