/* ===================================================================
   EliteCare – gemeinsame Kopf- und Fusszeile fuer ALLE Seiten
   (site-shell.css, Stand 01.10.2026)

   Die Website hat zwei Stylesheets: home-seo-v1.css (Startseite und
   die Seiten mit Formular/Rechner) und leistungen.css (Fachseiten).
   Beide setzen Typselektoren auf nav, footer und section. Deshalb:
   - eigener Namensraum .gx-
   - Kopf und Fuss sind <div> mit role=banner/contentinfo, damit
     "nav{position:fixed}" und "footer{padding…}" nicht greifen
   - Schriften und Farben stehen hier fest, nicht ueber die
     Variablen der jeweiligen Seite (die heissen dort verschieden).
   =================================================================== */

.gx-head,.gx-head *,.gx-foot,.gx-foot *,.gx-pagehead,.gx-pagehead *,.gx-cta-band,.gx-cta-band *{box-sizing:border-box}

.gx-head,.gx-foot,.gx-pagehead,.gx-cta-band{
  --gx-navy:#0a1128;
  --gx-navy-2:#121b36;
  --gx-gold:#c28135;
  --gx-gold-hi:#dca65d;
  --gx-gold-text:#946325;
  --gx-ink:#0a1128;
  --gx-gray:#515c6e;
  --gx-line:#e6e9ef;
  --gx-serif:Georgia,'Times New Roman',serif;
  --gx-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --gx-h:76px;
}

/* ---------- Kopfzeile ---------- */
.gx-head{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(255,255,255,.97);
  -webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);
  font-family:var(--gx-sans);
  transition:box-shadow .3s ease}
.gx-head.gx-scrolled{box-shadow:0 8px 28px rgba(10,17,40,.07)}
.gx-head::after{ /* die vier Zonenfarben als Markenlinie */
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,#c34d44 0 25%,#c79a35 25% 50%,#45689c 50% 75%,#468468 75% 100%)}
.gx-spacer{height:var(--gx-h,76px)}

.gx-bar{
  max-width:1440px;margin:0 auto;height:var(--gx-h);
  display:flex;align-items:center;gap:20px;
  padding:0 clamp(18px,3.2vw,48px)}

.gx-logo{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none;color:var(--gx-navy)}
.gx-logo-icon{
  width:30px;height:30px;flex:none;position:relative;
  background:linear-gradient(135deg,#c28135 0,#e6a756 100%);
  clip-path:polygon(50% 0%,100% 35%,82% 100%,18% 100%,0% 35%);
  display:flex;align-items:center;justify-content:center}
.gx-logo-icon::after{content:"";width:10px;height:10px;background:#fff;clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}
.gx-logo-text{font-family:var(--gx-serif);font-size:1.38rem;font-weight:600;letter-spacing:1px;text-transform:uppercase;line-height:1;color:var(--gx-navy)}
.gx-logo-text span{color:var(--gx-gold-text);font-weight:400;font-style:italic;text-transform:lowercase;font-size:1.48rem;letter-spacing:0;margin-left:2px}

.gx-nav{flex:1;display:flex;justify-content:center;min-width:0}
.gx-menu{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:clamp(14px,1.9vw,30px)}
.gx-menu>li{position:static;margin:0;padding:0}
.gx-link{
  display:inline-flex;align-items:center;gap:6px;height:var(--gx-h);
  font-size:.74rem;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--gx-navy);text-decoration:none;position:relative;white-space:nowrap;
  background:none;border:0;padding:0;cursor:pointer;font-family:var(--gx-sans)}
.gx-link::after{
  content:"";position:absolute;left:0;right:0;bottom:22px;height:1px;
  background:var(--gx-gold);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.gx-link:hover::after,.gx-link[aria-current="page"]::after,.gx-mega-open>.gx-link-wrap .gx-link::after{transform:scaleX(1)}
.gx-link[aria-current="page"]{color:var(--gx-gold-text)}
.gx-link-wrap{display:flex;align-items:center;gap:2px}
.gx-mega-toggle{
  width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;
  background:none;border:0;padding:0;cursor:pointer;color:var(--gx-navy);border-radius:4px}
.gx-mega-toggle svg{width:12px;height:12px;transition:transform .25s ease}
.gx-mega-open .gx-mega-toggle svg{transform:rotate(180deg)}

/* Mega-Menue Leistungen (Desktop) */
.gx-mega{
  position:absolute;left:0;right:0;top:100%;
  background:#fff;border-top:1px solid var(--gx-line);
  box-shadow:0 26px 50px rgba(10,17,40,.10);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
.gx-mega-open .gx-mega{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .2s ease}
.gx-mega-inner{
  max-width:1240px;margin:0 auto;padding:34px clamp(18px,3.2vw,48px) 36px;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.1fr);gap:34px}
.gx-mega-col p{margin:0 0 12px;font-size:.66rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--gx-gray)}
.gx-mega-col ul{list-style:none;margin:0;padding:0}
.gx-mega-col li{margin:0}
.gx-mega-col a{display:block;padding:7px 0;font-size:.95rem;color:var(--gx-navy);text-decoration:none;line-height:1.35}
.gx-mega-col a:hover{color:var(--gx-gold-text)}
.gx-mega-feature{background:#f7f4ee;border-radius:12px;padding:22px 24px;display:flex;flex-direction:column;gap:10px}
.gx-mega-feature strong{font-family:var(--gx-serif);font-weight:400;font-size:1.25rem;line-height:1.3;color:var(--gx-navy)}
.gx-mega-feature span{font-size:.88rem;line-height:1.6;color:var(--gx-gray)}
.gx-mega-feature a{margin-top:auto;font-size:.78rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--gx-navy);text-decoration:none}
.gx-mega-feature a:hover{color:var(--gx-gold-text)}

.gx-actions{display:flex;align-items:center;gap:18px;flex:none}
.gx-portal{display:inline-flex;align-items:center;gap:7px;font-size:.74rem;font-weight:600;letter-spacing:1px;color:var(--gx-navy);text-decoration:none;white-space:nowrap}
.gx-portal svg{width:16px;height:16px}
.gx-portal:hover{color:var(--gx-gold-text)}
.gx-cta{
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:0 22px;border-radius:999px;white-space:nowrap;
  background:linear-gradient(135deg,var(--gx-gold-hi),var(--gx-gold));
  color:var(--gx-navy);font-size:.72rem;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;text-decoration:none;
  box-shadow:0 8px 20px rgba(194,129,53,.28);transition:transform .25s ease,box-shadow .25s ease}
.gx-cta:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(194,129,53,.36)}
.gx-tel{display:none}
.gx-burger{display:none}
.gx-mobile-only{display:none}

.gx-head a:focus-visible,.gx-head button:focus-visible{outline:3px solid var(--gx-gold);outline-offset:3px;border-radius:4px}

/* Zwischenbreiten: Portal-Link zuerst weglassen */
@media (max-width:1320px){.gx-portal{display:none}}
@media (max-width:1240px){.gx-menu{gap:14px}.gx-link{letter-spacing:1px;font-size:.7rem}}

/* ---------- Mobil / Tablet ---------- */
@media (max-width:1180px){
  .gx-head,.gx-foot,.gx-pagehead,.gx-cta-band{--gx-h:64px}
  /* A filtered ancestor constrains fixed descendants to the 64px header. */
  #gx-head{-webkit-backdrop-filter:none;backdrop-filter:none;background:#faf9f6}
  .gx-burger{flex:none;touch-action:manipulation}
  .gx-nav,.gx-nav .gx-menu{text-align:left}
  .gx-spacer{height:64px}
  .gx-bar{gap:10px}
  .gx-logo-text{font-size:1.2rem}
  .gx-logo-text span{font-size:1.3rem}
  .gx-logo-icon{width:26px;height:26px}
  .gx-actions{margin-left:auto;gap:8px}
  .gx-cta{display:none}
  .gx-tel,.gx-burger{
    display:inline-flex;align-items:center;justify-content:center;
    width:44px;height:44px;border-radius:50%;border:1px solid var(--gx-line);
    background:#fff;color:var(--gx-navy);cursor:pointer;padding:0}
  .gx-tel svg{width:18px;height:18px}
  .gx-burger span,.gx-burger span::before,.gx-burger span::after{
    display:block;width:18px;height:2px;background:var(--gx-navy);border-radius:2px;position:relative;transition:transform .25s ease,background .25s ease}
  .gx-burger span::before,.gx-burger span::after{content:"";position:absolute;left:0}
  .gx-burger span::before{top:-6px}
  .gx-burger span::after{top:6px}
  .gx-open .gx-burger span{background:transparent}
  .gx-open .gx-burger span::before{transform:translateY(6px) rotate(45deg)}
  .gx-open .gx-burger span::after{transform:translateY(-6px) rotate(-45deg)}

  .gx-nav{
    position:fixed;left:0;right:0;top:64px;bottom:auto;
    height:calc(100vh - 64px);height:calc(100dvh - 64px);
    display:block;background:var(--gx-navy);color:#fff;
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    padding:18px 22px calc(28px + env(safe-area-inset-bottom));
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s}
  .gx-open .gx-nav{opacity:1;visibility:visible;transform:none;transition:opacity .22s ease,transform .22s ease}
  .gx-menu{display:block}
  .gx-menu>li{border-bottom:1px solid rgba(255,255,255,.09)}
  .gx-link{
    height:auto;width:100%;padding:16px 0;color:#fff;
    font-family:var(--gx-serif);font-size:1.45rem;font-weight:400;letter-spacing:0;text-transform:none}
  .gx-link::after{display:none}
  .gx-link[aria-current="page"]{color:var(--gx-gold-hi)}
  .gx-link-wrap{justify-content:space-between}
  .gx-link-wrap .gx-link{width:auto}
  .gx-mega-toggle{width:44px;height:44px;color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:50%}
  .gx-mega-toggle svg{width:14px;height:14px}
  .gx-mega{
    position:static;box-shadow:none;border:0;background:transparent;transform:none;
    display:none;opacity:1;visibility:visible;transition:none}
  .gx-mega-open .gx-mega{display:block}
  .gx-mega-inner{display:block;padding:0 0 14px}
  .gx-mega-col{margin-bottom:14px}
  .gx-mega-col p{color:rgba(255,255,255,.55);margin:8px 0 4px}
  .gx-mega-col a{color:rgba(255,255,255,.9);padding:9px 0;font-size:1rem}
  .gx-mega-feature{display:none}
  .gx-mobile-only{display:block}
  .gx-mobile-extra{margin-top:24px;display:grid;gap:12px}
  .gx-mobile-extra a{
    display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border-radius:999px;
    font-size:.82rem;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;text-decoration:none}
  .gx-mobile-extra .gx-m-cta{background:linear-gradient(135deg,var(--gx-gold-hi),var(--gx-gold));color:var(--gx-navy)}
  .gx-mobile-extra .gx-m-tel{border:1px solid rgba(220,166,93,.6);color:var(--gx-gold-hi)}
  .gx-mobile-extra .gx-m-portal{border:1px solid rgba(255,255,255,.2);color:#fff}
  .gx-mobile-extra svg{width:17px;height:17px}
}
@media (max-width:380px){
  .gx-logo-text{font-size:1.08rem}
  .gx-logo-text span{font-size:1.16rem}
  .gx-bar{padding:0 14px}
}

/* Waehrend das Mobilmenue offen ist: Seite nicht scrollen und
   schwebende Knoepfe (WhatsApp, Chat, Aktionsleiste) ausblenden. */
html.gx-menu-open,html.gx-menu-open body{overflow:hidden!important}
html.gx-menu-open .whatsapp-float,
html.gx-menu-open .concierge-trigger,
html.gx-menu-open .aktionsleiste,
html.gx-menu-open #cookie-banner{display:none!important}

/* ---------- Seitenkopf fuer Unterseiten mit Startseiten-Stil ---------- */
.gx-pagehead{
  position:relative;overflow:hidden;
  padding:96px 6% 76px;
  background:radial-gradient(70% 120% at 50% 0,rgba(194,129,53,.16),transparent 62%),var(--gx-navy);
  color:#fff;text-align:center;font-family:var(--gx-sans)}
.gx-pagehead-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.22;filter:grayscale(20%)}
.gx-pagehead-inner{position:relative;z-index:2;max-width:880px;margin:0 auto}
.gx-crumbs{font-size:.78rem;letter-spacing:.4px;color:rgba(255,255,255,.62);margin:0 0 22px}
.gx-crumbs a{color:var(--gx-gold-hi);text-decoration:none}
.gx-crumbs a:hover{text-decoration:underline}
.gx-crumbs span[aria-current]{color:rgba(255,255,255,.88)}
.gx-eyebrow{display:inline-block;margin:0 0 18px;font-size:.72rem;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gx-gold-hi)}
.gx-pagehead h1{
  margin:0 0 20px;font-family:var(--gx-serif);font-weight:400;
  font-size:clamp(2rem,4.6vw,3.2rem);line-height:1.15;letter-spacing:-.5px;color:#fff;text-wrap:balance}
.gx-pagehead h1 em{color:var(--gx-gold-hi);font-style:italic}
.gx-lead{margin:0 auto;max-width:660px;font-size:1.05rem;font-weight:300;line-height:1.75;color:rgba(255,255,255,.84)}
.gx-head-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:30px}
.gx-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 26px;
  border-radius:6px;font-family:var(--gx-sans);font-size:.76rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  text-decoration:none;transition:transform .25s ease,box-shadow .25s ease,background .25s ease,color .25s ease}
.gx-btn-gold{background:linear-gradient(135deg,var(--gx-gold-hi),var(--gx-gold));color:var(--gx-navy);box-shadow:0 10px 24px rgba(194,129,53,.3)}
.gx-btn-gold:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(194,129,53,.4)}
.gx-btn-line{border:1px solid rgba(220,166,93,.7);color:var(--gx-gold-hi)}
.gx-btn-line:hover{background:rgba(220,166,93,.12)}
.gx-btn-navy{background:var(--gx-navy);color:#fff}
.gx-btn-navy:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(10,17,40,.25)}
.gx-btn:focus-visible{outline:3px solid var(--gx-gold-hi);outline-offset:3px}
@media (max-width:700px){
  .gx-pagehead{padding:64px 5% 52px}
  .gx-lead{font-size:1rem}
  .gx-head-actions .gx-btn{width:100%}
}

/* ---------- Abschluss-Band (Kontakt) ---------- */
.gx-cta-band{
  background:radial-gradient(60% 140% at 85% 0,rgba(194,129,53,.18),transparent 60%),var(--gx-navy);
  color:#fff;padding:76px 6%;font-family:var(--gx-sans)}
.gx-cta-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:36px;flex-wrap:wrap}
.gx-cta-copy{max-width:640px}
.gx-cta-kicker{display:block;margin:0 0 12px;font-size:.7rem;font-weight:700;letter-spacing:2.6px;text-transform:uppercase;color:var(--gx-gold-hi)}
.gx-cta-title{display:block;margin:0 0 12px;font-family:var(--gx-serif);font-weight:400;font-size:clamp(1.7rem,3.2vw,2.5rem);line-height:1.2;color:#fff}
.gx-cta-text{margin:0;font-size:1rem;font-weight:300;line-height:1.7;color:rgba(255,255,255,.8)}
.gx-cta-buttons{display:flex;gap:14px;flex-wrap:wrap}
@media (max-width:700px){
  .gx-cta-band{padding:56px 5%}
  .gx-cta-buttons{width:100%}
  .gx-cta-buttons .gx-btn{width:100%}
}

/* ---------- Fusszeile ---------- */
.gx-foot{
  background:var(--gx-navy);color:rgba(255,255,255,.66);
  border-top:3px solid var(--gx-gold);
  font-family:var(--gx-sans);font-size:.88rem;line-height:1.7;
  padding:72px clamp(18px,6vw,90px) 0}
.gx-foot a{color:rgba(255,255,255,.8);text-decoration:none;transition:color .2s ease}
.gx-foot a:hover{color:var(--gx-gold-hi)}
.gx-foot a:focus-visible,.gx-foot button:focus-visible{outline:3px solid var(--gx-gold-hi);outline-offset:3px}
.gx-foot-grid{
  max-width:1280px;margin:0 auto;
  display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:44px}
.gx-foot .gx-logo{margin-bottom:18px}
.gx-foot .gx-logo-text{color:#fff}
.gx-foot .gx-logo-text span{color:var(--gx-gold-hi)}
.gx-foot-brand p{margin:0 0 16px;max-width:340px}
.gx-foot-contact{list-style:none;margin:0 0 18px;padding:0}
.gx-foot-contact li{margin:0 0 6px}
.gx-foot-social{display:flex;gap:10px;flex-wrap:wrap}
.gx-foot-social a{
  display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;
  border:1px solid rgba(255,255,255,.16);border-radius:999px;font-size:.76rem;font-weight:600;letter-spacing:.6px}
.gx-foot-social svg{width:16px;height:16px}
.gx-foot-title{margin:0 0 16px;font-size:.68rem;font-weight:700;letter-spacing:2.2px;text-transform:uppercase;color:var(--gx-gold-hi)}
.gx-foot-col ul{list-style:none;margin:0;padding:0}
.gx-foot-col li{margin:0}
.gx-foot-col a{display:inline-block;padding:5px 0}
.gx-foot-note{margin:16px 0 0;font-size:.78rem;line-height:1.7;color:rgba(255,255,255,.55)}
.gx-foot-bottom{
  max-width:1280px;margin:56px auto 0;padding:24px 0 30px;
  border-top:1px solid rgba(255,255,255,.1);
  display:flex;justify-content:space-between;align-items:center;gap:16px 28px;flex-wrap:wrap;
  font-size:.76rem;color:rgba(255,255,255,.55)}
.gx-foot-legal{display:flex;gap:8px 22px;flex-wrap:wrap;align-items:center}
.gx-foot-legal a,.gx-foot-legal button{
  font-size:.74rem;letter-spacing:.8px;text-transform:uppercase;color:rgba(255,255,255,.7);
  background:none;border:0;padding:6px 0;cursor:pointer;font-family:var(--gx-sans);text-decoration:none}
.gx-foot-legal button:hover{color:var(--gx-gold-hi)}
@media (max-width:1000px){.gx-foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){
  .gx-foot{padding-top:52px}
  .gx-foot-grid{grid-template-columns:1fr;gap:34px}
  .gx-foot-bottom{flex-direction:column;align-items:flex-start;padding-bottom:calc(96px + env(safe-area-inset-bottom))}
}

@media (prefers-reduced-motion:reduce){
  .gx-head *,.gx-cta,.gx-btn,.gx-nav,.gx-mega{transition:none!important}
}
@media print{.gx-head,.gx-spacer,.gx-cta-band{display:none}}

/* Bereich aktiv (z. B. eine Fachseite unter "Leistungen") */
.gx-link.gx-in{color:var(--gx-gold-text)}
.gx-link.gx-in::after{transform:scaleX(1)}
@media (max-width:1180px){.gx-link.gx-in{color:var(--gx-gold-hi)}}