

.nav { position:sticky; top:0; z-index:50; background:var(--bg);
  color:var(--text); border-bottom:var(--bw) solid var(--line); }
.nav-in { display:flex; align-items:center; gap:clamp(14px,2.4vw,32px);
  padding:13px clamp(20px,4vw,56px); max-width:1140px; margin:0 auto; }

.nav .mark { position:relative; font-size:18.7px; font-weight:200; letter-spacing:-.01em; color:var(--text);
  text-decoration:none; flex:0 0 auto; }
.nav .mark b { font-weight:700; }
.nav .mark i { font-style:normal; font-weight:200; }

.nav .mark::before { content:''; position:absolute; inset:-12px -6px; }
.nav-mid { display:flex; align-items:center; gap:clamp(12px,2vw,26px);
  
  margin-left:auto; min-width:0; }
.nav-mid a { position:relative; font-size:13.5px; font-weight:600; color:var(--muted);
  text-decoration:none; white-space:nowrap; padding-bottom:2px;
  border-bottom:1.5px solid transparent; }
.nav-mid a:hover { color:var(--text); }

.nav-mid a::before { content:''; position:absolute; inset:-12px -5px; }

.nav-mid a[aria-current="page"] { color:var(--text); border-bottom-color:var(--text); }

.nav-login { flex:0 0 auto; font-size:13px; font-weight:600; color:var(--muted);
  text-decoration:none; padding:0 2px; transition:color .2s ease;
  
  line-height:34px; }
.nav-login:hover { color:var(--text); }

.nav-cta { flex:0 0 auto; font-size:13px; font-weight:600; letter-spacing:0;
  display:flex; align-items:center; padding:0 16px; border-radius:12px;
  border:var(--bw) solid var(--ink);
  background:var(--dark); color:var(--bg); box-shadow:var(--shadow);
  text-decoration:none;
  transition:transform .12s ease, box-shadow .12s ease; }
.nav-cta:hover { transform:translate(1px,1px); box-shadow:none; }

.nav-login.bald, .nav-cta.bald {
  background:rgba(20,19,15,.09); color:rgba(20,19,15,.42);
  border:var(--bw) solid rgba(20,19,15,.14); box-shadow:none;
  cursor:default; transform:none; }

.nav-login.bald { display:flex; align-items:center; padding:0 16px;
  border-radius:12px; font-size:13px; font-weight:600; letter-spacing:0;
  text-decoration:none; }
.nav-login.bald:hover, .nav-cta.bald:hover { color:rgba(20,19,15,.42);
  transform:none; box-shadow:none; }

@media (max-width:620px) {
  .nav-login.bald, .nav-cta.bald { padding:0 10px; font-size:12px; border-radius:10px; }
  
  .nav-tools { gap:6px; }
  .nav-lang { gap:4px; }

  .nav-in .nav-tools .nav-menu-btn,
  .nav-in .nav-lang > * { width:31px; height:31px; min-width:31px; flex:0 0 31px; }
}

@media (max-width:379px) { .nav-login.bald { display:none; } }

.bald[data-hinweis] { position:relative; }
.bald[data-hinweis]::after {
  content:attr(data-hinweis); position:absolute; top:calc(100% + 8px);
  right:0; padding:6px 11px 7px; border-radius:9px;
  background:#14130F; color:var(--creme);
  font-size:11px; font-weight:800; letter-spacing:.7px; line-height:1.2;
  text-transform:uppercase; white-space:nowrap;
  opacity:0; pointer-events:none; transition:opacity 140ms ease; }

@media (hover:hover) and (pointer:fine) {
  .bald[data-hinweis]:hover::after { opacity:1; }
}
.bald[data-hinweis]:active::after,
.bald[data-hinweis].hinweis-an::after,
.bald[data-hinweis]:focus-visible::after {
  opacity:1; }

@media (prefers-reduced-motion:reduce) {
  .bald[data-hinweis]::after { transition:none; } }

.nav-bald { flex:0 0 auto; font-size:13px; font-weight:600; letter-spacing:0;
  display:flex; align-items:center; padding:0 14px; border-radius:12px;
  border:var(--bw) solid var(--line); background:none; color:var(--muted);
  white-space:nowrap; cursor:default; }

.nav-bald .kurz { display:none; }

@media (max-width:420px) {
  .nav-bald .lang { display:none; }
  .nav-bald .kurz { display:inline; }
  .nav-bald { padding:0 11px; }
}

@media (max-width:360px) {
  .nav-lang { gap:3px; }
}

body { min-height:100dvh; display:flex; flex-direction:column; }
body > footer.site-foot { margin-top:auto; }

.site-foot { border-top:var(--bw) solid var(--line); }

.site-foot-in { display:grid; grid-template-columns:1fr auto 1fr;
  grid-template-areas:"wm social links"; align-items:center; gap:8px 26px;
  padding:16px clamp(18px,2.6vw,40px) 10px; max-width:none; margin:0;
  line-height:1.25; }
.site-foot .wm { grid-area:wm; }
.foot-social { grid-area:social; }
.foot-links { grid-area:links; justify-self:end; }

.site-foot .wm { font-size:13px; font-weight:200; color:var(--muted);
  letter-spacing:.5px; margin-right:auto; }
.site-foot .wm b { font-weight:700; color:var(--text); }
.site-foot .wm i { font-style:normal; font-weight:200; }
.foot-links { display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; }
.foot-links .dot { color:var(--faint); font-size:11px; }

.site-foot a { font-size:11px; font-weight:500; letter-spacing:.9px; text-transform:uppercase;
  color:var(--muted); text-decoration:none;
  padding:15px 0; margin:-15px 0; display:inline-flex; align-items:center; }
.site-foot a:hover { color:var(--text); }

.foot-social { display:inline-flex; align-items:center; gap:clamp(14px,2.2vw,20px); }
.foot-social a { padding:15px 7px; margin:-15px -7px; }

.foot-social svg { width:17px; height:17px; display:block; }
.foot-social a[aria-label="YouTube"] svg { width:16px; height:16px; }
.foot-social a[aria-label="Instagram"] svg { width:18px; height:18px; }

@media (max-width:700px) {
  .site-foot-in { grid-template-columns:minmax(0,1fr);
    grid-template-areas:"social" "wm" "links"; row-gap:10px;
    justify-items:center; text-align:center; }
  
  .site-foot .wm { white-space:nowrap; margin-right:0; }
  .foot-social { justify-self:center; gap:4px; }
  
  .foot-social a { width:44px; height:44px; padding:0; margin:0;
    justify-content:center; }
  
  .foot-social svg { width:20px; height:20px; }
  .foot-social a[aria-label="YouTube"] svg { width:19px; height:19px; }
  .foot-social a[aria-label="Instagram"] svg { width:22px; height:22px; }
  .foot-links { justify-self:center; justify-content:center; }
}

.nav-menu-btn { display:none; }
.nav-mob-menu { display:none; }
@media (max-width:620px) {
  .nav-mid, .nav-login { display:none; }
  .nav-menu-btn { display:flex; align-items:center; justify-content:center;
    position:relative; width:32px; height:32px; border-radius:999px; padding:0;
    border:var(--bw) solid var(--line); background:none; color:var(--muted);
    cursor:pointer; }
  .nav-menu-btn:hover { border-color:var(--ink); color:var(--text); }
  .nav-menu-btn svg { width:17px; height:17px; }
  
  .nav-menu-btn::before { content:''; position:absolute; inset:-8px; }
  .nav-mob-menu[hidden] { display:none; }

  .nav-mob-menu:not([hidden]) { display:flex; flex-direction:column;
    height:auto;
    position:absolute; left:0; right:0; top:100%; z-index:60;
    background:var(--bg); border-bottom:var(--bw) solid var(--ink);
    box-shadow:var(--shadow); }
  .nav-mob-menu a { display:flex; align-items:center; min-height:44px;
    padding:0 clamp(18px,4vw,56px); font-size:15px; font-weight:600;
    color:var(--muted); text-decoration:none; border-top:var(--bw) solid var(--line); }
  .nav-mob-menu a:first-child { border-top:0; }
  .nav-mob-menu a:hover, .nav-mob-menu a[aria-current="page"] { color:var(--text); }
  .nav-cta { padding:7px 13px 8px; font-size:12px; }
  
  .nav .mark { font-size:16px; }
}

@media (max-width:400px) {
  a.nav-btn[href="#linkedin"] { display:none; }
}
@media (max-width:360px) {
  .nav-in { padding:10px 13px 11px; }
}

.nav-in { max-width:1700px; padding-left:clamp(18px,2.6vw,40px);
  padding-right:clamp(18px,2.6vw,40px); }

.nav-tools { display:flex; align-items:center; gap:8px; flex:0 0 auto;
  margin-left:clamp(14px,2.4vw,32px); }
.nav-tools .nav-bald { margin-left:14px; position:relative; }
.nav-tools .nav-bald::before { content:''; position:absolute; left:-14px;
  top:50%; transform:translateY(-50%); width:var(--bw); height:18px;
  background:var(--line); }

.nav-tools > *, .nav-tools .nav-btn, .nav-tools .nav-bald { height:34px; }

.nav-btn { position:relative; width:34px; height:34px; border-radius:12px; padding:0;
  display:flex; align-items:center; justify-content:center;
  border:var(--bw) solid var(--line); background:none; color:var(--muted);
  font:inherit; font-size:13px; line-height:1; cursor:pointer;
  text-decoration:none; transition:border-color .2s ease, color .2s ease; }
.nav-btn:hover { border-color:var(--ink); color:var(--text); }
.nav-btn svg { width:15px; height:15px; }

.nav-btn::before { content:''; position:absolute; inset:-6px -4px; }

.nav-flag .fl, .nav-menu .fl { font-size:15px; line-height:1;
  filter:grayscale(1) contrast(.9);
  font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif; }
.nav-menu .fl { font-size:14px; flex:0 0 auto; }

.nav-lang { display:none; }
html[lang="de"] .nav-lang { position:relative; display:flex; align-items:center; gap:5px; }

.nav-flagge { display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:9px; flex:0 0 auto; text-decoration:none;
  filter:grayscale(1); transition:opacity .16s ease, box-shadow .16s ease; }
.nav-flagge.jetzt { opacity:1; box-shadow:inset 0 0 0 var(--bw) var(--line); }
.nav-flagge.bald  { opacity:.38; cursor:default; }

a.nav-flagge:not(.jetzt) { opacity:.68; }
a.nav-flagge:not(.jetzt):hover { opacity:1; }
.nav-flagge .fl { font-size:15px; line-height:1; }
.nav-menu { position:absolute; right:0; top:calc(100% + 8px); z-index:60;
  min-width:132px; padding:5px; margin:0; list-style:none;
  background:var(--surface); border:var(--bw) solid var(--ink);
  border-radius:12px; box-shadow:var(--shadow); }
.nav-menu li { margin:0; }
.nav-menu button { display:flex; align-items:center; gap:8px; width:100%;
  padding:7px 9px; border:0; border-radius:8px; background:none; font:inherit;
  font-size:13px; color:var(--text); text-align:left; cursor:pointer; }
.nav-menu button:hover { background:var(--chip); }
.nav-menu [aria-current="true"] { font-weight:700; }

@media (max-width:560px) {
  .nav-menu-btn, .nav-flagge {
    width:36px; height:36px; border-radius:50%;
    border:var(--bw) solid var(--line);
    display:inline-flex; align-items:center; justify-content:center;
    flex:0 0 auto; background:none; }
  .nav-bald { height:36px; min-height:36px; border-radius:999px;
    padding:0 13px; }
  .nav-lang { gap:6px; }
}
@media (max-width:360px) {
  .nav-menu-btn, .nav-flagge { width:32px; height:32px; }
  .nav-bald { height:32px; min-height:32px; padding:0 10px; }
  .nav-lang { gap:4px; }
}

.nav-check { display:none; }
@media (max-width:700px) {
  .nav-bald { display:none; }
  .nav-check { display:inline-flex; align-items:center; flex:0 0 auto;
    position:relative; height:36px; padding:0 13px; border-radius:999px;
    border:var(--bw) solid var(--line); background:var(--chip);
    color:var(--text); font-size:13px; font-weight:600; letter-spacing:0;
    white-space:nowrap; text-decoration:none; }
  .nav-check .kurz { display:none; }
  
  .nav-check::after { content:''; position:absolute; inset:-6px 0; }
  
  .nav-tools .nav-check { margin-left:14px; position:relative; }
  .nav-tools .nav-check::before { content:''; position:absolute; left:-14px;
    top:50%; transform:translateY(-50%); width:var(--bw); height:18px;
    background:var(--line); }
  
  .nav-tools { margin-left:auto; }
}

@media (max-width:420px) {
  .nav-check { padding:0 11px; }
  .nav-tools .nav-check { margin-left:0; }
  .nav-tools .nav-check::before { display:none; }
}

@media (max-width:700px) {
  .nav-check { order:1; }
  .nav-lang { order:2; }
  .nav-login { order:3; }
  .nav-cta { order:4; }
  .nav-menu-btn { order:5; }
  .nav-tools .nav-check { margin-left:0; }
  .nav-tools .nav-check::before { display:none; }
  .nav-tools .nav-lang { margin-left:14px; position:relative; }
  .nav-tools .nav-lang::before { content:''; position:absolute; left:-14px;
    top:50%; transform:translateY(-50%); width:var(--bw); height:18px;
    background:var(--line); }
}

@media (max-width:420px) {
  .nav-tools .nav-lang { margin-left:0; }
  .nav-tools .nav-lang::before { display:none; }
}

@media (max-width:400px) {
  .nav-check { padding:0 9px; }
}

@media (max-width:389px) {
  .nav-check .lang { display:none; }
  .nav-check .kurz { display:inline; }
}
@media (max-width:360px) {
  .nav-check { height:32px; min-height:32px; padding:0 9px; font-size:12px; }
  
  .nav-in { gap:10px; }
  .nav-tools { gap:6px; }
}

a.nav-flagge { position:relative; }
a.nav-flagge::after { content:''; position:absolute; inset:-7px; }
@media (max-width:700px) {
  
  a.nav-flagge::after { inset:-5px; }
}

@media (max-width:700px) {
  .nav-check { display:none; }
}

.home-sitzung { margin-top:clamp(28px,3.4vw,48px);
  padding-top:clamp(22px,2.6vw,34px); border-top:var(--bw) solid var(--line);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,auto);
  gap:clamp(20px,3vw,48px); align-items:center; }

.hs-h { margin:0; font-size:clamp(24px,2.9vw,38px); line-height:1.1;
  font-weight:700; letter-spacing:-.032em; color:var(--text);
  max-width:34ch; text-wrap:balance; }

.hs-p { margin:clamp(10px,1.1vw,14px) 0 0; font-size:clamp(14.5px,1.1vw,16px);
  line-height:1.5; color:var(--muted); max-width:42ch; }
.hs-knopf { display:inline-block; margin-top:clamp(14px,1.6vw,20px);
  font-size:15px; font-weight:600; padding:13px 26px 14px;
  border-radius:999px; border:0; background:var(--dark); color:var(--creme);
  text-decoration:none; transition:opacity .2s ease; }
.hs-knopf:hover { opacity:.82; }
.hs-tueren { display:flex; flex-wrap:wrap; align-items:center;
  gap:clamp(16px,2vw,28px); margin-top:clamp(14px,1.6vw,20px); }
.hs-tueren .hs-knopf { margin-top:0; }

.blog-cta .kurz,
.plattform-tuer .kurz { display:none; }

@media (max-width:620px) {
  .blog-cta .micro, .plattform-tuer .micro,
  .blog-cta .hs-p, .plattform-tuer .hs-p { display:none; }
  
  .blog-cta .hs-tueren, .plattform-tuer .hs-tueren { gap:18px; }
  .blog-cta .home-sitzung,
  .plattform-tuer .home-sitzung { grid-template-columns:minmax(0,1fr);
    row-gap:18px; }
  .blog-cta .home-sitzung > div:first-child,
  .plattform-tuer .home-sitzung > div:first-child { display:contents; }
  
  .blog-cta .hs-h, .plattform-tuer .hs-h { order:1; font-size:26px; }
  .blog-cta .hs-zahl, .plattform-tuer .hs-zahl { order:2; justify-self:end; }
  .blog-cta .hs-tueren, .plattform-tuer .hs-tueren { order:3; margin-top:0; }

  
  .blog-cta .hs-zahl, .plattform-tuer .hs-zahl { justify-self:stretch; }
  .blog-cta .hs-posten, .plattform-tuer .hs-posten { display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    column-gap:12px; row-gap:8px; align-items:baseline; }
  .blog-cta .hs-posten > div, .plattform-tuer .hs-posten > div {
    display:contents; }
  
  .blog-cta .hs-posten > div:first-child .hs-dauer,
  .plattform-tuer .hs-posten > div:first-child .hs-dauer {
    grid-column:1; grid-row:1; }
  .blog-cta .hs-posten > div:first-child .hs-preis,
  .plattform-tuer .hs-posten > div:first-child .hs-preis {
    grid-column:2; grid-row:1; }
  .blog-cta .hs-posten > div:last-child .hs-dauer,
  .plattform-tuer .hs-posten > div:last-child .hs-dauer {
    grid-column:1; grid-row:2; }
  .blog-cta .hs-posten > div:last-child .hs-preis,
  .plattform-tuer .hs-posten > div:last-child .hs-preis {
    grid-column:2; grid-row:2; }
  .blog-cta .hs-posten .hs-preis, .plattform-tuer .hs-posten .hs-preis {
    text-align:right; }
  
  .blog-cta .hs-posten .hs-dauer, .plattform-tuer .hs-posten .hs-dauer {
    text-align:left; }
  
  .blog-cta .hs-preis, .plattform-tuer .hs-preis { font-size:25px;
    flex:0 0 auto; min-width:4.6ch; }
  
  .blog-cta .hs-dauer, .plattform-tuer .hs-dauer { margin:0; font-size:10px;
    white-space:nowrap; }
}

.hs-posten { display:inline-flex; align-items:flex-end; gap:clamp(14px,1.8vw,26px); }
.hs-preis { margin:0; font-size:clamp(26px,3.2vw,48px); font-weight:700;
  letter-spacing:-.04em; line-height:1; color:var(--text); }

.hs-dauer { margin:6px 0 0; font-size:clamp(10px,.85vw,11.5px);
  font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--faint); white-space:nowrap; }
@media (max-width:860px) {
  .home-sitzung { grid-template-columns:minmax(0,1fr); gap:20px; }
  .hs-zahl { justify-self:stretch; }
}
@media (max-width:420px) {
  .hs-posten { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; }
}

.act-wort { display:inline-flex; align-items:center; height:44px;
  font-size:15px; font-weight:700; letter-spacing:-.01em;
  color:var(--text); text-decoration:none;
  border-bottom:2px solid var(--text); padding:0 0 1px; }
.act-wort:hover { color:#000; border-bottom-color:#000; }

.act-wort.home-tuer { margin-top:clamp(22px,2.6vw,34px); }

@media (min-width:861px) { .hs-zahl { text-align:right; } }
.sec-dark .hs-knopf { background:var(--creme); color:#14130F; }
.sec-dark .act-wort { color:var(--dtext); border-bottom-color:var(--dtext); }
.sec-dark .act-wort:hover { color:#fff; border-bottom-color:#fff; }
