/* =====================================================================
   ExposéFlow · ExposéFlow-Design – gemeinsame Basis für alle Seiten
   Schrift: Archivo (Variable) + Cormorant Garamond · Akzent: Kobalt
   ===================================================================== */
@font-face{font-family:"Archivo";src:url(fonts/archivo-var.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(fonts/cormorant-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(fonts/cormorant-600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  --kalk:#E7E9E4; --kalk-tief:#DCDFD8; --papier:#FFFFFF;
  --tusche:#18202B; --graphit:#555D67; --linie:#C6CAC3;
  --kobalt:#2639C9; --kobalt-tief:#1A2894; --nacht:#141B26;
  --sans:"Archivo", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --ef-wrap:1240px; --ef-gutter:clamp(16px,4vw,40px);
  --ef-ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- Button ---------- */
.ef-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;white-space:nowrap;
  padding:.72em 1.1em;border-radius:5px;border:0;cursor:pointer;text-decoration:none;
  font-family:var(--sans);font-weight:600;font-stretch:108%;font-size:.95rem;line-height:1.1;
  background:var(--kobalt);color:#fff;transition:background-color .18s var(--ef-ease),transform .18s var(--ef-ease);
}
.ef-btn:hover{background:var(--kobalt-tief);color:#fff}
.ef-btn:active{transform:translateY(1px)}

/* ---------- Logo ---------- */
.ef-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap;
  font-family:var(--sans);font-stretch:118%;font-size:1.12rem;letter-spacing:-.01em;color:var(--tusche)}
.ef-brand b{font-weight:720}
.ef-brand span span{font-weight:420}
.ef-brand svg{flex:none}

/* ---------- Header ---------- */
.ef-hd{position:sticky;top:0;z-index:80;font-family:var(--sans);
  transition:background-color .25s var(--ef-ease),box-shadow .25s var(--ef-ease)}
.ef-hd.is-scrolled,.ef-hd.is-open{background:var(--kalk);
  -webkit-backdrop-filter:saturate(1.2) blur(12px);backdrop-filter:saturate(1.2) blur(12px);box-shadow:0 1px 0 var(--linie)}
.ef-hd-in{max-width:var(--ef-wrap);margin:0 auto;padding:0 var(--ef-gutter);height:72px;display:flex;align-items:center;gap:26px}
.ef-hd-links{display:flex;gap:24px;margin:0 0 0 auto;padding:0;list-style:none}
.ef-hd-links a{text-decoration:none;font-size:.95rem;font-weight:500;color:var(--graphit);transition:color .15s}
.ef-hd-links a:hover,.ef-hd-links a[aria-current="page"]{color:var(--tusche)}
.ef-hd-login{text-decoration:none;font-size:.95rem;font-weight:600;color:var(--tusche)}
.ef-hd-login:hover{color:var(--kobalt)}
.ef-hd .ef-btn .s{display:none}
.ef-burger{display:none;width:42px;height:42px;margin-right:-8px;border:0;background:transparent;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.ef-burger span{display:block;width:22px;height:2px;background:var(--tusche);border-radius:2px;transition:transform .25s var(--ef-ease),opacity .2s}
.ef-hd.is-open .ef-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.ef-hd.is-open .ef-burger span:nth-child(2){opacity:0}
.ef-hd.is-open .ef-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.ef-hd-menu{display:none}
@media (max-width:1020px){
  .ef-hd-links{display:none}
  .ef-hd-login{margin-left:auto}
  .ef-burger{display:flex}
  .ef-hd-menu{display:block;position:absolute;left:0;right:0;top:72px;background:var(--kalk);box-shadow:0 1px 0 var(--linie),0 24px 40px -24px rgba(24,32,43,.35);
    padding:6px var(--ef-gutter) 22px;max-height:0;overflow:hidden;opacity:0;visibility:hidden;transition:max-height .35s var(--ef-ease),opacity .2s,visibility .2s}
  .ef-hd.is-open .ef-hd-menu{max-height:80vh;opacity:1;visibility:visible;overflow:auto}
  .ef-hd-menu a{display:block;padding:14px 0;border-bottom:1px solid var(--linie);text-decoration:none;font-size:1.05rem;font-weight:600;color:var(--tusche)}
  .ef-hd-menu .ef-btn{display:flex;margin-top:18px;border-bottom:0;padding:1em;font-size:1rem}
}
@media (max-width:560px){
  .ef-hd-in{gap:12px}
  .ef-hd .ef-btn .l{display:none}
  .ef-hd .ef-btn .s{display:inline}
  .ef-hd-login{display:none}
  .ef-hd .ef-hd-in > .ef-btn{margin-left:auto}
  .ef-hd .ef-hd-in > .ef-btn{padding:.7em .9em;font-size:.9rem}
}

/* ---------- Footer ---------- */
.ef-ft{background:var(--nacht);color:#9AA3AE;font-family:var(--sans);font-size:.95rem;line-height:1.55;padding:clamp(56px,7vw,88px) 0 28px}
.ef-ft a{color:inherit;text-decoration:none;transition:color .15s}
.ef-ft a:hover{color:#fff}
.ef-ft-in{max-width:var(--ef-wrap);margin:0 auto;padding:0 var(--ef-gutter)}
.ef-ft-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px clamp(28px,4vw,64px)}
.ef-ft .ef-brand{color:#fff}
.ef-ft-claim{margin:18px 0 22px;max-width:22em;color:#B9C0CA}
.ef-ft-h{margin:0 0 14px;font-size:.78rem;font-weight:600;font-stretch:110%;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.ef-ft-list{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ef-ft-list address{font-style:normal}
.ef-ft-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px;margin-top:clamp(44px,5vw,64px);padding-top:22px;border-top:1px solid rgba(255,255,255,.1);font-size:.86rem}
.ef-ft-legal{display:flex;flex-wrap:wrap;gap:8px 22px}
@media (max-width:900px){.ef-ft-grid{grid-template-columns:1fr 1fr}.ef-ft-brandcol{grid-column:1/-1}}
@media (max-width:480px){.ef-ft-grid{grid-template-columns:1fr}.ef-ft-bottom{flex-direction:column}}
.ef-hd-menu .ef-btn{color:#fff}
@media (max-width:360px){
  .ef-hd .ef-brand{font-size:1rem;gap:8px}
  .ef-hd .ef-brand svg{width:24px;height:24px}
  .ef-hd .ef-hd-in > .ef-btn{padding:.65em .7em;font-size:.82rem}
  .ef-hd-in{gap:8px}
}
@media (max-width:360px){.ef-hd .ef-hd-in > .ef-btn{display:none}.ef-burger{margin-left:auto}}
.ef-ft .ef-btn{color:#fff}
/* Logo: alte Wortmarke (Montserrat 900) – „Exposé“ dunkel, „Flow“ Kobalt */
@font-face{font-family:"EF Logo";src:url(fonts/montserrat-logo.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF}
.ef-brand .ef-logo{font-family:"EF Logo","Montserrat",var(--sans);font-weight:900;font-size:1.3rem;letter-spacing:-.03em;font-stretch:100%;color:var(--tusche);line-height:1}
.ef-brand .ef-logo span{color:var(--kobalt);font-weight:900}
.ef-ft .ef-brand .ef-logo{color:#fff}
.ef-ft .ef-brand .ef-logo span{color:var(--kobalt)}
@media (max-width:360px){.ef-hd .ef-brand .ef-logo{font-size:1.12rem}}
