/* fitnesstrainer.de – gemeinsame Designbasis, Stand 02.10.2026 */
:root{
  --ft-navy:#173454;
  --ft-blue:#015AAC;
  --ft-orange:#F46F20;
  --ft-text:#334455;
  --ft-muted:#6f7f8d;
  --ft-line:#e5edf2;
  --ft-soft:#f7fafc;
}

/* Verhindert das seitliche Springen, wenn die Scrollbar zwischen Seiten erscheint/verschwindet. */
html{scrollbar-gutter:stable;}
body{
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Einheitlicher Kopf: Logo und Navigation stehen auf jeder sichtbaren Seite an derselben Stelle. */
body.site-page header{
  min-height:74px;
}
body.site-page header .container.nav,
body.site-page header .container.header-inner,
body.site-page header .container.topbar,
body.site-page header > .container{
  width:min(1200px,calc(100% - 36px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
body.site-page header .nav,
body.site-page header .header-inner,
body.site-page header .topbar{
  min-height:74px !important;
  height:74px;
  align-items:center;
}
body.site-page header .brand{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  font-size:1.16rem !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:-.025em !important;
  white-space:nowrap !important;
  color:var(--ft-navy) !important;
}
body.site-page header .brand-logo,
body.site-page header .brand img{
  width:52px !important;
  height:38px !important;
  object-fit:contain !important;
  flex:0 0 auto !important;
}
body.site-page header .brand-text{color:var(--ft-navy) !important;}
body.site-page header .brand-text > span{color:var(--ft-blue) !important;}

/* Das aktive Menüelement wird nur farblich markiert. Kein Fettdruck-Wechsel = kein Verrutschen. */
body.site-main .site-navlinks{
  display:flex;
  align-items:stretch;
  gap:16px !important;
  height:74px;
  font-size:.88rem !important;
  font-weight:700 !important;
  white-space:nowrap;
  color:var(--ft-navy) !important;
}
body.site-main .site-navlinks a{
  position:relative;
  display:flex;
  align-items:center;
  height:74px;
  padding:0;
  color:var(--ft-navy) !important;
  font-weight:700 !important;
  line-height:1;
  text-decoration:none !important;
}
body.site-main .site-navlinks a:hover,
body.site-main .site-navlinks a[aria-current="page"]{
  color:var(--ft-blue) !important;
  font-weight:700 !important;
}
body.site-main .site-navlinks a[aria-current="page"]::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  border-radius:3px 3px 0 0;
  background:var(--ft-blue);
}
body.site-main .site-start{
  min-width:116px;
  min-height:42px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:10px 16px !important;
  border-radius:999px !important;
  background:var(--ft-orange) !important;
  color:#fff !important;
  font-size:.9rem !important;
  font-weight:800 !important;
  line-height:1 !important;
  white-space:nowrap;
}

/* Inhaltsseiten: gleiche Textkante und dieselbe typografische Hierarchie. */
body.site-content .container{
  width:min(1080px,calc(100% - 36px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
body.site-content header .container.nav,
body.site-content header .container.header-inner,
body.site-content header .container.topbar,
body.site-content header > .container{
  width:min(1200px,calc(100% - 36px)) !important;
}
body.site-content .hero{
  padding-top:68px !important;
  padding-bottom:48px !important;
}
body.site-content .hero h1{
  font-size:clamp(2.15rem,4vw,3.55rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.035em !important;
  margin-top:0 !important;
  margin-bottom:20px !important;
}
body.site-content .hero .lead{
  max-width:850px !important;
  font-size:1.16rem !important;
  line-height:1.62 !important;
}
body.site-content h2{
  font-size:clamp(1.55rem,3vw,2.10rem);
  line-height:1.15;
}
body.site-content h3{
  font-size:1.10rem;
  line-height:1.3;
}
body.site-content .eyebrow{
  font-size:.76rem !important;
  letter-spacing:.14em !important;
  line-height:1.3 !important;
  margin-bottom:12px !important;
}

/* Startseite darf bewusst eigenständiger bleiben; nur Kopf und ruhige Seitenbreite werden vereinheitlicht. */
body.site-home .container{margin-left:auto;margin-right:auto;}
body.site-home header .container.nav{width:min(1200px,calc(100% - 36px)) !important;}

/* Fokussierte Seiten behalten ihre reduzierte Navigation, aber Logo/Kopf springen nicht mehr. */
body.site-focused header{min-height:74px !important;}
body.site-focused main{scroll-margin-top:74px;}
body.site-focused h1{line-height:1.08;}
body.site-focused h2{line-height:1.15;}

/* Interner Bereich: gleiches Logo und gleiche Grundschrift, etwas breiter für Arbeitsinhalte. */
body.site-portal .container{
  width:min(1160px,calc(100% - 36px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
body.site-portal header .container,
body.site-portal header .topbar{
  width:min(1200px,calc(100% - 36px)) !important;
}
body.site-portal main{padding-top:36px;}
body.site-portal h1{letter-spacing:-.035em;}
body.site-portal h2{font-size:clamp(1.5rem,3vw,2.05rem);line-height:1.15;}

@media(max-width:1040px){
  body.site-main .site-navlinks{display:none !important;}
}
@media(max-width:760px){
  body.site-page header .container.nav,
  body.site-page header .container.header-inner,
  body.site-page header .container.topbar,
  body.site-page header > .container{
    width:min(100% - 28px,1200px) !important;
  }
  body.site-page header .brand{font-size:1.08rem !important;gap:7px !important;}
  body.site-page header .brand-logo,
  body.site-page header .brand img{width:48px !important;height:35px !important;}
  body.site-content .container,
  body.site-portal .container{width:min(100% - 28px,1080px) !important;}
  body.site-content .hero{padding-top:54px !important;padding-bottom:40px !important;}
  body.site-content .hero h1{font-size:clamp(2rem,8vw,2.9rem) !important;white-space:normal !important;}
  body.site-content .hero .lead{font-size:1.08rem !important;}
}