/* ===== Self-hosted Schriften (DSGVO: keine Google-Fonts-Verbindung) ===== */
/* latin-ext */
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-display:swap;font-weight:200 800;
 src:url(../fonts/bricolage-grotesque-latin-ext.woff2) format("woff2");
 unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-display:swap;font-weight:200 800;
 src:url(../fonts/bricolage-grotesque-latin.woff2) format("woff2");
 unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-display:swap;font-weight:100 900;
 src:url(../fonts/hanken-grotesk-latin-ext.woff2) format("woff2");
 unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-display:swap;font-weight:100 900;
 src:url(../fonts/hanken-grotesk-latin.woff2) format("woff2");
 unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:100 800;
 src:url(../fonts/jetbrains-mono-latin-ext.woff2) format("woff2");
 unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:100 800;
 src:url(../fonts/jetbrains-mono-latin.woff2) format("woff2");
 unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* =========================================================================
   LSG Lippe-Südost e.V. — Design System
   Konzept: "Die Sicht aus dem Segelflugzeug" — Himmelsblau, Abendgold,
   Cockpit-Instrumente. Signatur: die Horizont-Linie (künstlicher Horizont).
   ========================================================================= */

:root{
  /* Farben — abgeleitet aus dem Vereinslogo (Himmelblau) + Abendstimmung */
  --ink:#0B2A45;        /* tiefes Marineblau — Text & dunkle Flächen        */
  --ink-2:#103456;      /* Variation für dunkle Sektionen                   */
  --horizon:#135E9E;    /* Markenblau — moderne Weiterentwicklung von #1e73be */
  --horizon-deep:#0E4C82;
  --sky:#79C2E8;        /* helles Himmelblau (Logo-Flügel) — Akzente        */
  --sky-soft:#DCEEF8;   /* sehr helles Blau — Karten-Tönung                 */
  --cloud:#F3F7FB;      /* Seitenhintergrund                                */
  --paper:#FFFFFF;
  --slate:#51677A;      /* Sekundärtext                                     */
  --sun:#E7A33E;        /* Abendgold — DAS Signal, sparsam                  */
  --sun-deep:#CA8722;
  --line:#DBE5EE;       /* Haarlinien                                       */
  --line-strong:#C3D3E0;

  --shadow-s:0 1px 2px rgba(11,42,69,.06), 0 2px 8px rgba(11,42,69,.05);
  --shadow-m:0 6px 18px rgba(11,42,69,.10), 0 2px 6px rgba(11,42,69,.06);
  --shadow-l:0 24px 60px rgba(11,42,69,.18);

  --r:14px;             /* Standard-Radius            */
  --r-s:9px;
  --maxw:1200px;
  --pad:clamp(1.15rem, 4vw, 2.5rem);

  --f-display:"Bricolage Grotesque", "Hanken Grotesk", system-ui, sans-serif;
  --f-body:"Hanken Grotesk", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  font-family:var(--f-body);
  font-size:clamp(1rem,.97rem + .15vw,1.075rem);
  line-height:1.65;
  color:var(--ink);
  background:var(--cloud);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;height:auto}
a{color:var(--horizon);text-decoration:none}
a:hover{color:var(--horizon-deep)}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.05;margin:0;color:var(--ink);letter-spacing:-.01em;font-weight:800}
p{margin:0 0 1rem}
::selection{background:var(--sky);color:var(--ink)}

:focus-visible{outline:3px solid var(--sun);outline-offset:2px;border-radius:4px}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
.section{padding-block:clamp(3.5rem,8vw,6.5rem)}
.section--tight{padding-block:clamp(2.5rem,6vw,4rem)}

/* ---- Eyebrow / Kicker (Instrumentensprache: mono, gespreizt) ---------- */
.eyebrow{
  font-family:var(--f-mono);
  font-size:.72rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--horizon);
  font-weight:600;
  display:inline-flex;align-items:center;gap:.6rem;
  margin:0 0 1.1rem;
}
.eyebrow::before{
  content:"";width:26px;height:2px;background:var(--sky);display:inline-block;
}
.eyebrow--light{color:var(--sky)}
.eyebrow--light::before{background:var(--sky)}

/* ======================= HORIZONT-LINIE (Signatur) ===================== */
/* Eine feine Linie mit Teilstrichen — wie die Skala des künstlichen Horizonts */
.horizon{
  --tick:var(--line-strong);
  height:14px;position:relative;width:100%;
  background:
    linear-gradient(to right, transparent, transparent) center/100% 1px no-repeat;
}
.horizon::before{
  content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;
  background:linear-gradient(90deg,transparent,var(--sky) 12%,var(--sky) 88%,transparent);
}
.horizon::after{
  content:"";position:absolute;left:0;right:0;top:calc(50% - 4px);height:9px;
  background-image:repeating-linear-gradient(90deg,var(--tick) 0 1px,transparent 1px 34px);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);
  opacity:.6;
}
.horizon--dark{--tick:rgba(255,255,255,.28)}
.horizon--dark::before{background:linear-gradient(90deg,transparent,rgba(121,194,232,.7) 12%,rgba(121,194,232,.7) 88%,transparent)}

/* ============================ BUTTONS ================================== */
.btn{
  --bg:var(--horizon);--fg:#fff;
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--f-body);font-weight:700;font-size:.98rem;
  padding:.82rem 1.5rem;border-radius:999px;border:1.5px solid transparent;
  background:var(--bg);color:var(--fg);cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  box-shadow:var(--shadow-s);white-space:nowrap;
}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-m);color:#fff}
.btn .ar{transition:transform .18s ease}
.btn:hover .ar{transform:translateX(3px)}
.btn--sun{--bg:var(--sun);--fg:var(--ink)}
.btn--sun:hover{background:var(--sun-deep);color:var(--ink)}
.btn--ghost{--bg:transparent;--fg:#fff;border-color:rgba(255,255,255,.55)}
.btn--ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.btn--outline{--bg:transparent;--fg:var(--horizon);border-color:var(--line-strong)}
.btn--outline:hover{background:var(--paper);border-color:var(--horizon);color:var(--horizon-deep)}

/* ============================ HEADER ================================== */
.site-head{
  position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line);
}
.site-head__bar{display:flex;align-items:center;gap:1.25rem;min-height:74px}
.brand{display:flex;align-items:center;gap:.7rem;margin-right:auto;flex-shrink:0}
.brand img{height:42px;width:auto}
.brand__txt{display:flex;flex-direction:column;line-height:1}
.brand__name{font-family:var(--f-display);font-weight:800;font-size:1.06rem;color:var(--ink);letter-spacing:-.01em}
.brand__sub{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.16em;color:var(--slate);text-transform:uppercase;margin-top:3px}

.nav{display:flex;align-items:center;gap:.2rem}
.nav__item{position:relative}
.nav__link{
  display:inline-flex;align-items:center;gap:.3rem;
  padding:.6rem .78rem;border-radius:9px;color:var(--ink);font-weight:600;font-size:.95rem;
  transition:background .15s, color .15s;
}
.nav__link:hover,.nav__item:focus-within .nav__link{background:var(--sky-soft);color:var(--horizon-deep)}
.nav__link .chev{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.6;transition:transform .2s}
.nav__item:hover .chev,.nav__item:focus-within .chev{transform:rotate(225deg) translateY(-1px)}

.nav__menu{
  position:absolute;top:calc(100% + 8px);left:0;min-width:240px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow-l);padding:.45rem;
  opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none;
  transition:opacity .18s, transform .18s, visibility .18s;
}
.nav__item:hover .nav__menu,.nav__item:focus-within .nav__menu{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.nav__menu a{
  display:block;padding:.55rem .7rem;border-radius:8px;color:var(--ink);font-weight:500;font-size:.93rem;
}
.nav__menu a:hover{background:var(--sky-soft);color:var(--horizon-deep)}
.nav__menu a.is-active{color:var(--horizon);font-weight:700}
.nav__link.is-active{color:var(--horizon);background:var(--sky-soft)}

.head-cta{display:flex;align-items:center;gap:.5rem;flex-shrink:0}
.head-cta .btn{padding:.6rem 1.1rem;font-size:.92rem}
.util-link{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.08em;color:var(--slate);text-transform:uppercase;padding:.4rem .3rem}
.util-link:hover{color:var(--horizon)}

.burger{display:none;width:46px;height:42px;border:1px solid var(--line);border-radius:10px;background:var(--paper);cursor:pointer;flex-shrink:0}
.burger span{display:block;width:20px;height:2px;background:var(--ink);margin:4px auto;border-radius:2px;transition:.25s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ============================ HERO ==================================== */
.hero{position:relative;color:#fff;isolation:isolate;overflow:hidden}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 62%}
.hero__bg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(11,42,69,.55) 0%, rgba(11,42,69,.30) 38%, rgba(11,42,69,.62) 78%, rgba(11,42,69,.88) 100%),
    linear-gradient(90deg, rgba(11,42,69,.55), transparent 70%);
}
.hero__inner{max-width:var(--maxw);margin-inline:auto;padding:clamp(4rem,11vw,8.5rem) var(--pad) 0;
  min-height:min(86vh,820px);display:flex;flex-direction:column;justify-content:center}
.hero__eyebrow{
  font-family:var(--f-mono);font-size:.74rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--sky);font-weight:600;display:flex;align-items:center;gap:.7rem;margin-bottom:1.4rem;
}
.hero__eyebrow::before{content:"";width:34px;height:2px;background:var(--sky)}
.hero h1{
  font-size:clamp(2.6rem,7.5vw,5.4rem);line-height:.98;letter-spacing:-.025em;color:#fff;
  text-shadow:0 2px 30px rgba(11,42,69,.4);max-width:14ch;
}
.hero h1 em{font-style:normal;color:var(--sky)}
.hero__lead{
  font-size:clamp(1.08rem,1.4vw,1.32rem);max-width:54ch;margin:1.6rem 0 0;color:rgba(255,255,255,.92);
  line-height:1.55;text-shadow:0 1px 16px rgba(11,42,69,.5);
}
.hero__pills{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.7rem 0 0}
.pill{
  font-family:var(--f-mono);font-size:.78rem;letter-spacing:.06em;
  padding:.42rem .85rem;border-radius:999px;border:1px solid rgba(255,255,255,.4);
  color:#fff;background:rgba(255,255,255,.08);backdrop-filter:blur(4px);
}
.hero__actions{display:flex;flex-wrap:wrap;gap:.8rem;margin:2.1rem 0 0}

/* Instrumenten-Datenstreifen unten im Hero */
.readout{
  margin-top:clamp(2.5rem,6vw,4.5rem);
  border-top:1px solid rgba(255,255,255,.18);
  display:flex;flex-wrap:wrap;align-items:center;gap:1.5rem 2.2rem;
  padding:1.15rem 0 clamp(1.6rem,4vw,2.4rem);
  font-family:var(--f-mono);
}
.readout__item{display:flex;flex-direction:column;gap:.18rem}
.readout__k{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sky)}
.readout__v{font-size:1rem;color:#fff;letter-spacing:.02em;font-weight:500}
.readout__live{display:inline-flex;align-items:center;gap:.45rem}
.readout__dot{width:8px;height:8px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 0 rgba(231,163,62,.6);animation:ping 2.4s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(231,163,62,.55)}70%{box-shadow:0 0 0 9px rgba(231,163,62,0)}100%{box-shadow:0 0 0 0 rgba(231,163,62,0)}}

/* Driftendes Segelflugzeug auf der Horizontlinie */
.glider-drift{position:relative;height:0}
.glider-drift svg{
  position:absolute;top:-9px;left:0;width:30px;color:var(--sky);
  animation:drift 26s linear infinite;
}
@keyframes drift{
  0%{transform:translateX(-6vw)}
  100%{transform:translateX(102vw)}
}
@media (prefers-reduced-motion:reduce){
  .glider-drift svg,.readout__dot{animation:none}
  .glider-drift svg{left:15%}
}

/* ===================== INTRO / WILLKOMMEN ============================= */
.intro{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.intro__lead{font-family:var(--f-display);font-weight:600;font-size:clamp(1.45rem,2.5vw,2.05rem);line-height:1.22;letter-spacing:-.015em;color:var(--ink)}
.intro__body{color:var(--slate);font-size:1.04rem}
.intro__body p{margin-bottom:1rem}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:.4rem}
.stat{background:var(--paper);padding:1.4rem 1.3rem}
.stat__n{font-family:var(--f-display);font-weight:800;font-size:2.1rem;color:var(--horizon);line-height:1;letter-spacing:-.02em}
.stat__l{font-size:.86rem;color:var(--slate);margin-top:.45rem;line-height:1.35}

/* ===================== SPARTEN-KARTEN ================================= */
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:2.6rem}
.head-row h2{font-size:clamp(1.9rem,3.6vw,2.9rem)}
.head-row p{color:var(--slate);max-width:46ch;margin:.7rem 0 0}

.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.scard{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow-s);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s;
}
.scard:hover{transform:translateY(-5px);box-shadow:var(--shadow-l);border-color:var(--sky)}
.scard__img{aspect-ratio:16/10;overflow:hidden;position:relative}
.scard__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.scard:hover .scard__img img{transform:scale(1.05)}
.scard__tag{position:absolute;top:.8rem;left:.8rem;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(11,42,69,.78);color:var(--sky);padding:.34rem .6rem;border-radius:6px;backdrop-filter:blur(4px)}
.scard__body{padding:1.4rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1}
.scard__body h3{font-size:1.32rem;margin-bottom:.5rem}
.scard__body p{color:var(--slate);font-size:.97rem;margin-bottom:1.1rem}
.scard__more{margin-top:auto;font-weight:700;color:var(--horizon);display:inline-flex;align-items:center;gap:.4rem}
.scard__more .ar{transition:transform .18s}
.scard:hover .scard__more .ar{transform:translateX(4px)}

/* ===================== CTA-BAND (Abendgold) ========================== */
.cta-band{position:relative;color:#fff;overflow:hidden;isolation:isolate}
.cta-band__bg{position:absolute;inset:0;z-index:-2}
.cta-band__bg img{width:100%;height:100%;object-fit:cover;object-position:center 60%}
.cta-band__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(11,42,69,.92) 0%,rgba(11,42,69,.78) 42%,rgba(202,135,34,.34) 100%)}
.cta-band__inner{max-width:var(--maxw);margin-inline:auto;padding:clamp(3.2rem,7vw,5.2rem) var(--pad);display:grid;grid-template-columns:1.3fr .7fr;gap:2.5rem;align-items:center}
.cta-band h2{font-size:clamp(2rem,4vw,3.1rem);color:#fff;max-width:18ch}
.cta-band h2 em{font-style:normal;color:var(--sun)}
.cta-band p{color:rgba(255,255,255,.9);max-width:48ch;margin-top:1rem;font-size:1.08rem}
.cta-band__side{display:flex;flex-direction:column;gap:.8rem;align-items:flex-start}
.cta-band__price{font-family:var(--f-mono);border:1px solid rgba(255,255,255,.3);border-radius:var(--r);padding:1.1rem 1.3rem;width:100%}
.cta-band__price b{font-family:var(--f-display);font-size:2.2rem;color:var(--sun);display:block;line-height:1}
.cta-band__price span{font-size:.84rem;color:rgba(255,255,255,.82);letter-spacing:.04em}
.cta-band .actions{display:flex;flex-direction:column;gap:.7rem;width:100%}
.cta-band .btn{width:100%;justify-content:center}

/* ===================== FLOTTE / FLEET ================================ */
.fleet{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.3rem}
.fcard{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-s);transition:transform .2s, box-shadow .2s}
.fcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-m)}
.fcard__img{aspect-ratio:4/3;background:var(--sky-soft)}
.fcard__img img{width:100%;height:100%;object-fit:cover}
.fcard__body{padding:1.2rem 1.25rem 1.35rem}
.fcard__reg{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;color:var(--horizon);background:var(--sky-soft);padding:.2rem .5rem;border-radius:5px;display:inline-block;margin-bottom:.6rem}
.fcard__body h3{font-size:1.18rem;margin-bottom:.55rem}
.fcard__body p{color:var(--slate);font-size:.92rem;margin-bottom:1rem}
.specs{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;border-top:1px solid var(--line);padding-top:.9rem;font-family:var(--f-mono)}
.specs div{display:flex;flex-direction:column}
.specs dt{font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.specs dd{margin:0;font-size:.92rem;color:var(--ink);font-weight:500}

/* ===================== FEATURE-TRIO ================================= */
.feat-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.feat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.7rem 1.6rem;display:flex;flex-direction:column;box-shadow:var(--shadow-s);transition:transform .2s,box-shadow .2s,border-color .2s}
.feat:hover{transform:translateY(-4px);box-shadow:var(--shadow-m);border-color:var(--sky)}
.feat__ic{width:46px;height:46px;border-radius:11px;background:var(--sky-soft);color:var(--horizon);display:grid;place-items:center;margin-bottom:1.1rem}
.feat__ic svg{width:24px;height:24px}
.feat h3{font-size:1.28rem;margin-bottom:.55rem}
.feat p{color:var(--slate);font-size:.97rem;margin-bottom:1.1rem}
.feat__more{margin-top:auto;font-weight:700;color:var(--horizon);display:inline-flex;gap:.4rem;align-items:center}

/* ===================== STANDORT / KONTAKT =========================== */
.visit{background:var(--ink);color:#fff;border-radius:calc(var(--r) + 6px);overflow:hidden;display:grid;grid-template-columns:1fr 1fr;box-shadow:var(--shadow-l)}
.visit__l{padding:clamp(2rem,4vw,3.2rem)}
.visit__l .eyebrow{color:var(--sky)}
.visit__l .eyebrow::before{background:var(--sky)}
.visit__l h2{color:#fff;font-size:clamp(1.8rem,3vw,2.6rem);margin-bottom:1.4rem}
.contact-list{list-style:none;padding:0;margin:1.6rem 0 0;display:flex;flex-direction:column;gap:1.05rem}
.contact-list li{display:flex;gap:.9rem;align-items:flex-start}
.contact-list svg{width:20px;height:20px;color:var(--sky);flex-shrink:0;margin-top:3px}
.contact-list a{color:#fff;border-bottom:1px solid rgba(121,194,232,.5)}
.contact-list a:hover{color:var(--sky)}
.contact-list .k{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sky);display:block;margin-bottom:.15rem}
.visit__map{position:relative;min-height:330px;background:var(--ink-2)}
.visit__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:saturate(.9)}

/* ===================== PAGE-HERO (Unterseiten) ====================== */
.phero{position:relative;color:#fff;background:var(--ink);overflow:hidden;isolation:isolate}
.phero__bg{position:absolute;inset:0;z-index:-2;opacity:.45}
.phero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 55%}
.phero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,42,69,.6),rgba(11,42,69,.85))}
.phero__inner{max-width:var(--maxw);margin-inline:auto;padding:clamp(3rem,7vw,5rem) var(--pad) clamp(2.4rem,5vw,3.4rem)}
.phero .eyebrow{color:var(--sky)}
.phero .eyebrow::before{background:var(--sky)}
.phero h1{color:#fff;font-size:clamp(2.2rem,5vw,3.7rem);max-width:20ch;letter-spacing:-.02em}
.phero__lead{color:rgba(255,255,255,.9);max-width:62ch;margin-top:1.1rem;font-size:1.1rem}
.crumbs{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;color:var(--sky);margin-bottom:1.2rem;display:flex;gap:.55rem;flex-wrap:wrap;text-transform:uppercase}
.crumbs a{color:rgba(255,255,255,.7)}
.crumbs a:hover{color:#fff}
.crumbs span{color:rgba(255,255,255,.45)}

/* ===================== PROSE / ARTIKEL ============================== */
.layout{display:grid;grid-template-columns:1fr;gap:3rem}
.layout--aside{grid-template-columns:minmax(0,1fr) 300px}
.prose{max-width:72ch}
.prose h2{font-size:clamp(1.5rem,2.6vw,2.05rem);margin:2.6rem 0 1rem;letter-spacing:-.015em}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.3rem;margin:2rem 0 .7rem;color:var(--horizon-deep)}
.prose p{color:#243b50;margin-bottom:1.15rem}
.prose ul,.prose ol{margin:0 0 1.3rem;padding-left:1.3rem;color:#243b50}
.prose li{margin-bottom:.5rem}
.prose ul li::marker{color:var(--sky)}
.prose strong{color:var(--ink)}
.prose .lead{font-family:var(--f-display);font-weight:600;font-size:1.3rem;line-height:1.4;color:var(--ink);margin-bottom:1.6rem}
.prose figure{margin:2rem 0}
.prose figure img{border-radius:var(--r);box-shadow:var(--shadow-m)}
.prose figcaption{font-size:.86rem;color:var(--slate);margin-top:.6rem;font-style:italic}
.prose blockquote{border-left:3px solid var(--sun);background:var(--sky-soft);margin:1.6rem 0;padding:1rem 1.3rem;border-radius:0 var(--r-s) var(--r-s) 0;color:var(--ink)}
.prose blockquote p:last-child{margin:0}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4rem 0}

/* Q&A Block (Segelflug "Was ist, wenn…") */
.qa{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin:1.6rem 0}
.qa details{border-bottom:1px solid var(--line)}
.qa details:last-child{border-bottom:0}
.qa summary{cursor:pointer;list-style:none;padding:1.05rem 1.3rem;font-weight:700;font-family:var(--f-display);color:var(--ink);display:flex;justify-content:space-between;gap:1rem;align-items:center;background:var(--paper);transition:background .15s}
.qa summary:hover{background:var(--sky-soft)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font-family:var(--f-mono);color:var(--horizon);font-size:1.3rem;transition:transform .2s}
.qa details[open] summary::after{transform:rotate(45deg)}
.qa details[open] summary{background:var(--sky-soft)}
.qa__a{padding:0 1.3rem 1.2rem;color:#243b50}

/* Aside / Sidebar */
.aside-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;box-shadow:var(--shadow-s);position:sticky;top:96px}
.aside-card h3{font-size:1.1rem;margin-bottom:1rem}
.aside-card .eyebrow{margin-bottom:.8rem}
.aside-nav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.1rem}
.aside-nav a{display:block;padding:.5rem .65rem;border-radius:8px;color:var(--ink);font-size:.95rem;font-weight:500}
.aside-nav a:hover{background:var(--sky-soft);color:var(--horizon-deep)}
.aside-nav a.is-active{background:var(--horizon);color:#fff}
.aside-card--sun{background:linear-gradient(160deg,var(--ink),var(--ink-2));color:#fff;border-color:transparent}
.aside-card--sun h3{color:#fff}
.aside-card--sun p{color:rgba(255,255,255,.85);font-size:.95rem}

/* ===================== TEAM-GRID ==================================== */
.team{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem}
.tcard{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem;transition:transform .2s,box-shadow .2s,border-color .2s}
.tcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-m);border-color:var(--sky)}
.tcard__av{width:52px;height:52px;border-radius:50%;background:var(--horizon);color:#fff;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:1.15rem;margin-bottom:.9rem}
.tcard h3{font-size:1.08rem;margin-bottom:.3rem}
.tcard .role{color:var(--slate);font-size:.9rem;line-height:1.35}
.tcard .tel{font-family:var(--f-mono);font-size:.82rem;color:var(--horizon);margin-top:.6rem;display:inline-block}

/* ===================== INFO / NOTICE ================================ */
.notice{background:var(--sky-soft);border:1px solid var(--sky);border-radius:var(--r);padding:1.3rem 1.5rem;display:flex;gap:1rem;align-items:flex-start;margin:1.5rem 0}
.notice svg{width:24px;height:24px;color:var(--horizon);flex-shrink:0;margin-top:2px}
.notice p{margin:0;color:var(--ink)}
.notice--sun{background:#FCF3E2;border-color:var(--sun)}
.notice--sun svg{color:var(--sun-deep)}

.doc-link{display:flex;align-items:center;gap:1rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.3rem;box-shadow:var(--shadow-s);transition:border-color .2s,box-shadow .2s;max-width:520px}
.doc-link:hover{border-color:var(--horizon);box-shadow:var(--shadow-m)}
.doc-link .ic{width:42px;height:42px;border-radius:10px;background:var(--horizon);color:#fff;display:grid;place-items:center;flex-shrink:0}
.doc-link b{display:block;color:var(--ink)}
.doc-link span{font-size:.85rem;color:var(--slate)}

/* ===================== KONTAKTFORMULAR ============================== */
.form{display:grid;gap:1.1rem;max-width:560px}
.field{display:flex;flex-direction:column;gap:.4rem}
.field label{font-weight:600;font-size:.92rem;color:var(--ink)}
.field input,.field textarea{
  font-family:var(--f-body);font-size:1rem;padding:.8rem .95rem;border:1.5px solid var(--line-strong);
  border-radius:var(--r-s);background:var(--paper);color:var(--ink);transition:border-color .15s, box-shadow .15s;
}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--horizon);box-shadow:0 0 0 3px rgba(19,94,158,.15)}
.field textarea{min-height:140px;resize:vertical}

/* ===================== FOOTER ====================================== */
.site-foot{background:var(--ink);color:rgba(255,255,255,.78);padding-top:clamp(3rem,6vw,4.5rem)}
.foot-grid{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad);display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.5rem}
.foot-brand img{height:46px;margin-bottom:1rem}
.foot-brand p{font-size:.95rem;color:rgba(255,255,255,.65);max-width:34ch}
.foot-soc{display:flex;gap:.6rem;margin-top:1.1rem}
.foot-soc a{width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;color:#fff;transition:.2s}
.foot-soc a:hover{background:var(--horizon);border-color:var(--horizon);transform:translateY(-2px)}
.foot-soc svg{width:20px;height:20px}
.foot-col h4{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sky);margin-bottom:1.1rem;font-weight:600}
.foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.foot-col a{color:rgba(255,255,255,.74);font-size:.94rem}
.foot-col a:hover{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:clamp(2.5rem,5vw,3.5rem)}
.foot-bottom__in{max-width:var(--maxw);margin-inline:auto;padding:1.4rem var(--pad);display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:rgba(255,255,255,.6)}
.foot-bottom__in .freq{font-family:var(--f-mono);letter-spacing:.06em;color:var(--sky)}

/* ===================== REVEAL-ANIMATION ============================ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ===================== MOBILE NAV ================================== */
.mobile-nav{position:fixed;inset:0;z-index:90;background:var(--ink);color:#fff;
  transform:translateX(100%);transition:transform .3s ease;overflow-y:auto;display:flex;flex-direction:column;visibility:hidden}
.mobile-nav.open{transform:none;visibility:visible}
.mobile-nav__top{display:flex;align-items:center;justify-content:space-between;padding:1.1rem var(--pad);border-bottom:1px solid rgba(255,255,255,.12)}
.mobile-nav__top .brand__name{color:#fff}
.mobile-nav__close{width:44px;height:44px;border:1px solid rgba(255,255,255,.25);border-radius:10px;background:transparent;color:#fff;font-size:1.4rem;cursor:pointer}
.mobile-nav nav{padding:1rem var(--pad) 2rem;display:flex;flex-direction:column}
.mobile-nav .m-group{border-bottom:1px solid rgba(255,255,255,.1)}
.mobile-nav .m-head{font-family:var(--f-display);font-weight:800;font-size:1.15rem;color:#fff;padding:1rem 0 .6rem}
.mobile-nav .m-links{display:flex;flex-direction:column;gap:.1rem;padding-bottom:.9rem}
.mobile-nav .m-links a{color:rgba(255,255,255,.8);padding:.5rem 0 .5rem .9rem;font-size:1rem;border-left:2px solid rgba(255,255,255,.15)}
.mobile-nav .m-links a:hover,.mobile-nav .m-links a.is-active{color:var(--sky);border-left-color:var(--sky)}
.mobile-nav .m-cta{margin-top:1.6rem;display:flex;flex-direction:column;gap:.7rem}
.mobile-nav .btn{justify-content:center}
.no-scroll{overflow:hidden}

/* ===================== PROJEKTE (alternierende Karten) ============= */
.pgrid{display:flex;flex-direction:column;gap:1.4rem;margin-top:2rem}
.pcard{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--shadow-s);transition:box-shadow .2s,transform .2s}
.pcard:hover{box-shadow:var(--shadow-m);transform:translateY(-3px)}
.pcard__img{min-height:240px;background:var(--sky-soft)}
.pcard__img img{width:100%;height:100%;object-fit:cover}
.pcard__txt{padding:clamp(1.5rem,3vw,2.4rem)}
.pcard__txt h3{font-size:clamp(1.3rem,2.2vw,1.65rem);color:var(--horizon-deep);margin-bottom:.8rem}
.pcard__txt p{color:#243b50;margin-bottom:.9rem;font-size:.98rem}
.pcard__txt p:last-child{margin-bottom:0}
.pcard--flip .pcard__img{order:2}

/* ===================== RESPONSIVE ================================== */
@media (max-width:840px){
  .pcard{grid-template-columns:1fr}
  .pcard__img{order:-1;min-height:210px;aspect-ratio:16/10}
  .pcard--flip .pcard__img{order:-1}
}
@media (max-width:1040px){
  .layout--aside{grid-template-columns:1fr}
  .aside-card{position:static}
  .cards-3,.feat-3{grid-template-columns:repeat(2,1fr)}
  .visit{grid-template-columns:1fr}
  .visit__map{min-height:300px;order:-1}
}
@media (max-width:920px){
  .nav,.head-cta .util-link{display:none}
  .head-cta .btn{display:none}
  .burger{display:block}
  .intro{grid-template-columns:1fr;gap:2rem}
  .cta-band__inner{grid-template-columns:1fr;gap:1.8rem}
}
@media (max-width:680px){
  .cards-3,.feat-3,.cards-3{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:1.8rem 1.5rem}
  .foot-brand{grid-column:1/-1}
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero h1{max-width:none}
  .readout{gap:1rem 1.6rem}
}
@media (max-width:460px){
  .foot-grid{grid-template-columns:1fr}
}

/* ===================== PROJEKT-KARTEN (klickbar) ================== */
.pcard__img{display:block;position:relative;text-decoration:none}
.pcard__img img{transition:transform .5s ease}
.pcard:hover .pcard__img img{transform:scale(1.04)}
.pcard__badge{position:absolute;top:12px;left:12px;z-index:2;display:inline-flex;
  align-items:center;gap:.4rem;font:600 .72rem/1 var(--f-mono);letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink);background:rgba(255,255,255,.92);
  padding:.45rem .7rem;border-radius:100px;box-shadow:var(--shadow-s)}
.pcard__txt h3 a{color:inherit;text-decoration:none}
.pcard__txt h3 a:hover{color:var(--horizon)}
.pcard__more{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.1rem;
  font-weight:700;color:var(--horizon-deep);text-decoration:none}
.pcard__more .ar{transition:transform .2s}
.pcard__more:hover{color:var(--sun-deep)}
.pcard__more:hover .ar{transform:translateX(4px)}

/* ===================== PROJEKT-DETAILSEITE ======================== */
.pmeta{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.8rem}
.pmeta__chip{font:600 .8rem/1 var(--f-mono);letter-spacing:.02em;color:var(--horizon-deep);
  background:var(--sky-soft);border:1px solid var(--line);padding:.5rem .8rem;border-radius:100px}
.pfigure{margin:1.8rem 0}
.lb{display:block;width:100%;padding:0;border:0;background:var(--sky-soft);cursor:zoom-in;
  position:relative;border-radius:var(--r);overflow:hidden;line-height:0}
.lb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.lb:hover img{transform:scale(1.03)}
.lb__zoom{position:absolute;right:10px;bottom:10px;width:34px;height:34px;display:grid;
  place-items:center;color:#fff;background:rgba(11,42,69,.6);border-radius:50%;
  opacity:0;transition:opacity .2s}
.lb__zoom svg{width:18px;height:18px}
.lb:hover .lb__zoom,.lb:focus-visible .lb__zoom{opacity:1}
.pfigure .lb{box-shadow:var(--shadow-m)}

.pgallery-block{margin-top:2.6rem}
.pgallery-hint{font-size:.9rem;color:var(--slate);margin-bottom:1.1rem}
.pgallery{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.pgallery__item{aspect-ratio:4/3}
.pgallery__item img{border-radius:var(--r-s)}
.pgallery__item .lb__zoom{width:30px;height:30px}

/* weiter / zurück */
.proj-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;
  margin-top:2.8rem;padding-top:1.6rem;border-top:1px solid var(--line)}
.proj-nav a{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;font-weight:600}
.proj-nav__back{color:var(--slate)}
.proj-nav__back:hover{color:var(--horizon-deep)}
.proj-nav__back svg{width:20px;height:20px}
.proj-nav__next{flex-direction:column;align-items:flex-end;text-align:right;color:var(--horizon-deep);position:relative;padding-right:1.6rem}
.proj-nav__next span{font:600 .76rem/1 var(--f-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--slate)}
.proj-nav__next b{font-family:var(--f-display);font-size:1.15rem}
.proj-nav__next .ar{position:absolute;right:0;top:50%;transform:translateY(-50%);transition:transform .2s}
.proj-nav__next:hover .ar{transform:translate(4px,-50%)}

/* ===================== LIGHTBOX =================================== */
.lightbox{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;
  background:rgba(7,26,43,.92);backdrop-filter:blur(4px);padding:clamp(1rem,4vw,3rem);opacity:0;transition:opacity .2s}
.lightbox.is-open{display:flex;opacity:1}
.lightbox__img{max-width:min(1100px,92vw);max-height:86vh;width:auto;height:auto;
  border-radius:var(--r-s);box-shadow:0 30px 80px rgba(0,0,0,.5);background:#fff}
.lightbox__close,.lightbox__nav{position:absolute;border:0;cursor:pointer;color:#fff;
  background:rgba(255,255,255,.12);border-radius:50%;display:grid;place-items:center;transition:background .2s}
.lightbox__close:hover,.lightbox__nav:hover{background:rgba(255,255,255,.26)}
.lightbox__close{top:18px;right:18px;width:46px;height:46px;font-size:1.7rem;line-height:1}
.lightbox__nav{top:50%;transform:translateY(-50%);width:52px;height:52px;font-size:2rem;line-height:1}
.lightbox__prev{left:18px}
.lightbox__next{right:18px}
.lightbox__count{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);
  font:600 .85rem/1 var(--f-mono);letter-spacing:.05em;color:rgba(255,255,255,.85);
  background:rgba(0,0,0,.35);padding:.5rem .9rem;border-radius:100px}

/* ===================== RESPONSIVE (Projekte) ===================== */
@media (max-width:680px){
  .pgallery{grid-template-columns:repeat(2,1fr)}
  .lightbox__nav{width:42px;height:42px;font-size:1.6rem}
  .lightbox__prev{left:8px}.lightbox__next{right:8px}
}
@media (prefers-reduced-motion:reduce){
  .pcard:hover .pcard__img img,.lb:hover img{transform:none}
}

/* ===================== KARTEN-CONSENT (Zwei-Klick) =============== */
.map-consent{width:100%;height:100%;min-height:300px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 100%);color:var(--sky-soft);
  padding:2rem;text-align:center}
.map-consent__in{max-width:360px}
.map-consent svg{width:38px;height:38px;color:var(--sky);margin-bottom:.8rem}
.map-consent__h{font-family:var(--f-display);font-weight:700;font-size:1.15rem;color:#fff;margin-bottom:.5rem}
.map-consent__t{font-size:.86rem;line-height:1.5;color:rgba(220,238,248,.78);margin-bottom:1.2rem}
.map-consent__btn{cursor:pointer}
.map-consent__alt{margin-top:1rem;font-size:.8rem}
.map-consent__alt a{color:var(--sky);text-decoration:underline}
.map-consent__alt a:hover{color:#fff}
.visit__map iframe{display:block;width:100%;height:100%;min-height:300px;border:0}
