/* Kanzlei Kapitonov – Premium-Prototyp
   Konzept: ruhiges, typografisches Gerüst (Serif auf Navy, Haarlinien in Teal), ohne Dekor.
   Keine externen Ressourcen. Schriften lokal (OFL): Source Serif 4 (Display/Lead), Inter (Text/UI). */

/* ---------- Fonts (self-hosted WOFF2, SIL OFL: Inter, Source Serif 4) ---------- */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-latin-400-normal.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-latin-500-normal.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-latin-600-normal.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/source-serif-4-latin-300-normal.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/source-serif-4-latin-300-italic.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-latin-400-normal.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-latin-400-italic.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-latin-ext-400-normal.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:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-latin-ext-500-normal.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:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-latin-ext-600-normal.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:"Source Serif 4";font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/source-serif-4-latin-ext-300-normal.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:"Source Serif 4";font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/source-serif-4-latin-ext-300-italic.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:"Source Serif 4";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-latin-ext-400-normal.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:"Source Serif 4";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-latin-ext-400-italic.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}

/* ---------- Tokens ---------- */
:root{
  --navy:#092f57; --navy-deep:#061f3a; --slate:#2f3b47; --slate-2:#404e5a;
  --steel:#7890a6; --steel-text:#56708a; --teal:#81cad3; --teal-ink:#2c7480;
  --mist:#eef1f4; --mist-2:#f2f4f6; --paper:#f7f8f9; --white:#fff;
  --ink:#16202a; --ink-2:#44505c; --line:rgba(9,47,87,.16);
  --serif:"Source Serif 4","Source Serif Pro",Georgia,"Times New Roman",serif;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ease:cubic-bezier(.22,.8,.24,1); --ease-soft:cubic-bezier(.32,.72,0,1);
  --gutter:clamp(20px,5vw,80px); --max:1360px;
  --sp:clamp(88px,12vw,176px);
  --head-h:88px;
  --focus:#092f57;
  --arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12'%3E%3Cpath d='M0 6h18M13 1l5 5-5 5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E");
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:104px}
body{margin:0;font:400 1.0625rem/1.7 var(--sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;hyphens:none;text-rendering:optimizeLegibility}
@media (max-width:767px){body{hyphens:auto;-webkit-hyphens:auto}}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
h1,h2,h3,h4,blockquote{text-wrap:balance}
p,dd,li{text-wrap:pretty}
ul,ol{padding:0;list-style:none}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
::selection{background:var(--teal);color:var(--navy-deep)}
:focus-visible{outline:2px solid var(--focus);outline-offset:4px;border-radius:2px}
.on-dark{--focus:#81cad3}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:fixed;left:16px;top:-80px;z-index:200;background:var(--white);color:var(--navy);padding:.8rem 1.2rem;font-weight:600;border-radius:4px;transition:top .3s var(--ease)}
.skip-link:focus{top:16px}

.wrap{width:100%;max-width:calc(var(--max) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter);padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px)}

/* ---------- Header ---------- */
/* Liquid glass bar, full width like apple.com, always visible. No rim, no gloss: a light veil, blur and
   (Chromium) an SVG displacement lens along the bottom edge built in main.js (html.lg-lens), plus one soft shadow.
   Tint follows the section underneath (.is-over-dark from main.js). */
.site-header{position:fixed;inset:0 0 auto 0;z-index:100;color:#fff;--focus:#81cad3}
.site-header::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:0;
  background-color:rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.7) brightness(1.06);backdrop-filter:blur(14px) saturate(1.7) brightness(1.06);
  box-shadow:0 8px 24px -16px rgba(4,19,38,.28);
  opacity:0;transition:opacity .4s var(--ease),background-color .4s var(--ease),box-shadow .4s var(--ease)}
.lg-lens .site-header::before{-webkit-backdrop-filter:url(#kk-lens-head) blur(6px) saturate(1.7) brightness(1.06);backdrop-filter:url(#kk-lens-head) blur(6px) saturate(1.7) brightness(1.06);background-color:rgba(255,255,255,.36)}
.site-header.is-solid{color:var(--navy);--focus:#092f57;--head-h:64px}
.site-header.is-solid::before{opacity:1;transform:none}
.site-header.is-solid.is-over-dark{color:#fff;--focus:#81cad3}
.site-header.is-solid.is-over-dark::before{background-color:rgba(8,30,56,.3);box-shadow:0 8px 24px -16px rgba(0,0,0,.45)}
.lg-lens .site-header.is-solid.is-over-dark::before{background-color:rgba(8,30,56,.34)}
.site-header__bar{display:flex;align-items:center;justify-content:space-between;height:var(--head-h);transition:height .5s var(--ease)}
.brand{position:relative;z-index:3;display:block;width:clamp(96px,8vw,112px);aspect-ratio:235/140;flex:none;transform-origin:left center;transition:transform .5s var(--ease)}
.site-header.is-solid .brand{transform:scale(.74)}
.nav-open .site-header .brand{transform:none}
.brand img{position:absolute;inset:0;width:100%;height:100%;transition:opacity .4s var(--ease)}
.brand .brand__c{opacity:0}
.site-header.is-solid .brand__w{opacity:0}
.site-header.is-solid .brand__c{opacity:1}
.site-header.is-solid.is-over-dark .brand__w{opacity:1}
.site-header.is-solid.is-over-dark .brand__c{opacity:0}
.site-nav ul{display:flex;align-items:center;gap:clamp(22px,2.8vw,44px)}
.site-nav a{position:relative;display:inline-block;padding:.5rem 0;font-size:.9375rem;font-weight:500;letter-spacing:.005em;opacity:.86;transition:opacity .3s var(--ease),color .3s var(--ease),background-color .3s var(--ease)}
.site-nav a::after{content:"";position:absolute;left:0;right:0;bottom:.2rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.site-nav a:hover,.site-nav a:focus-visible,.site-nav a[aria-current="page"]{opacity:1}
.site-nav a[aria-current="page"]::after{transform:scaleX(1);background:var(--teal)}
.site-header.is-solid .site-nav a[aria-current="page"]::after{background:var(--teal-ink)}
.site-header.is-solid.is-over-dark .site-nav a[aria-current="page"]::after{background:var(--teal)}
@media (min-width:900px){
  /* "Kontakt" styled like the site's .btn: white outline on dark (fills white on hover), navy solid on light glass. */
  .site-nav li:last-child a{padding:.62rem 1.2rem;border:1px solid rgba(255,255,255,.7);border-radius:2px;font-weight:600;letter-spacing:.01em;opacity:1;transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease)}
  .site-nav li:last-child a:hover,.site-nav li:last-child a:focus-visible,.site-nav li:last-child a[aria-current="page"]{background:#fff;border-color:#fff;color:var(--navy)}
  .site-header.is-solid:not(.is-over-dark) .site-nav li:last-child a{background:var(--navy);border-color:var(--navy);color:#fff}
  .site-header.is-solid:not(.is-over-dark) .site-nav li:last-child a:hover,.site-header.is-solid:not(.is-over-dark) .site-nav li:last-child a:focus-visible,.site-header.is-solid:not(.is-over-dark) .site-nav li:last-child a[aria-current="page"]{background:var(--navy-deep);border-color:var(--navy-deep)}
  .site-nav li:last-child a::after{display:none}
}
.site-nav__foot{display:none}
.nav-toggle{display:none;align-items:center;gap:.8rem;height:44px;padding:0 2px;font-size:.9375rem;letter-spacing:.02em}
.nav-toggle__icon{position:relative;width:26px;height:12px;display:block}
.nav-toggle__icon i{position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .6s var(--ease-soft),top .6s var(--ease-soft)}
.nav-toggle__icon i:first-child{top:0}.nav-toggle__icon i:last-child{top:11px}
.nav-open .nav-toggle__icon i:first-child{top:5.5px;transform:rotate(45deg)}
.nav-open .nav-toggle__icon i:last-child{top:5.5px;transform:rotate(-45deg)}

@media (max-width:899px){
  .nav-toggle{display:inline-flex;position:relative;z-index:3}
  .site-nav{position:fixed;inset:0;z-index:2;background:var(--navy-deep);color:#fff;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--head-h) + 24px) var(--gutter) 40px;visibility:hidden;opacity:0;transition:opacity .6s var(--ease-soft),visibility 0s linear .6s;--focus:#81cad3}
  .nav-open .site-nav{visibility:visible;opacity:1;transition:opacity .6s var(--ease-soft),visibility 0s}
  .site-nav ul{flex-direction:column;align-items:stretch;gap:0;border-top:1px solid rgba(255,255,255,.14)}
  .site-nav li{border-bottom:1px solid rgba(255,255,255,.14);overflow:hidden}
  .site-nav a{display:block;padding:.9rem 0;font:300 clamp(2rem,9vw,3rem)/1.15 var(--serif);opacity:1;transform:translateY(100%);transition:transform .9s var(--ease-soft)}
  .site-nav a::after{display:none}
  .nav-open .site-nav a{transform:none}
  .nav-open .site-nav li:nth-child(1) a{transition-delay:.12s}.nav-open .site-nav li:nth-child(2) a{transition-delay:.18s}
  .nav-open .site-nav li:nth-child(3) a{transition-delay:.24s}.nav-open .site-nav li:nth-child(4) a{transition-delay:.30s}
  .site-nav a[aria-current="page"]{color:var(--teal)}
  .site-nav__foot{display:block;margin-top:2.2rem;font-size:.9375rem;line-height:1.7;color:rgba(255,255,255,.78)}
  .site-nav__foot a{display:inline;font:inherit;padding:0;transform:none;border-bottom:1px solid rgba(255,255,255,.35)}
  .nav-open .site-header{color:#fff;--focus:#81cad3}
  .nav-open .site-header::before{opacity:0}
  .nav-open .brand__w{opacity:1!important}.nav-open .brand__c{opacity:0!important}
  .nav-open .site-header__bar{position:relative;z-index:3}
  .site-header,.site-header__bar{--head-h:72px}
  .site-header.is-solid{--head-h:56px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.site-header::before,.to-top{background-color:rgba(255,255,255,.94)}.site-header.is-solid.is-over-dark::before,.to-top.is-over-dark{background-color:rgba(8,30,56,.94)}}
/* The owner wants the glass even with Windows "transparency effects" off (that maps to this query): only a slightly denser veil. */
@media (prefers-reduced-transparency:reduce){.site-header::before,.to-top{background-color:rgba(255,255,255,.46)}.site-header.is-solid.is-over-dark::before,.to-top.is-over-dark{background-color:rgba(8,30,56,.42)}}

/* ---------- Back to top (created in main.js) ---------- */
/* Same glass as the header; docked in the viewport corner inside the side gutter; teal ring = scroll progress (--p). */
.to-top{position:fixed;right:calc(max(14px,calc((var(--gutter) - 54px) / 2)) + env(safe-area-inset-right));bottom:calc(max(18px,calc((var(--gutter) - 54px) / 2 + 12px)) + env(safe-area-inset-bottom));z-index:90;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:var(--navy);--ring:var(--teal-ink);
  background-color:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(14px) saturate(1.7) brightness(1.06);backdrop-filter:blur(14px) saturate(1.7) brightness(1.06);
  box-shadow:0 10px 26px -12px rgba(4,19,38,.36),0 2px 6px -2px rgba(4,19,38,.1);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .35s var(--ease),transform .45s var(--ease),visibility 0s linear .45s,background-color .3s var(--ease),color .3s var(--ease)}
.lg-lens .to-top{-webkit-backdrop-filter:url(#kk-lens-top) blur(5px) saturate(1.7) brightness(1.06);backdrop-filter:url(#kk-lens-top) blur(5px) saturate(1.7) brightness(1.06);background-color:rgba(255,255,255,.36)}
.to-top.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .35s var(--ease),transform .45s var(--ease),visibility 0s,background-color .3s var(--ease),color .3s var(--ease)}
.to-top:hover{background-color:rgba(255,255,255,.5)}
.to-top.is-over-dark{color:#fff;--ring:var(--teal);background-color:rgba(8,30,56,.3);box-shadow:0 10px 26px -12px rgba(0,0,0,.5),0 2px 6px -2px rgba(0,0,0,.2)}
.lg-lens .to-top.is-over-dark{background-color:rgba(8,30,56,.34)}
.to-top.is-over-dark:hover{background-color:rgba(8,30,56,.5)}
.to-top svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.to-top__arrow{grid-area:1/1;width:19px;height:19px;stroke-width:1.5;transition:transform .25s var(--ease)}
.to-top:hover .to-top__arrow,.to-top:focus-visible .to-top__arrow{transform:translateY(-2px)}
.to-top__ring{grid-area:1/1;width:100%;height:100%;transform:rotate(-90deg)}
.to-top__track{stroke:rgba(9,47,87,.12);stroke-width:1.5}
.to-top.is-over-dark .to-top__track{stroke:rgba(255,255,255,.16)}
.to-top__bar{stroke:var(--ring);stroke-width:1.75;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--p,0));transition:stroke-dashoffset .2s linear}
.nav-open .to-top{opacity:0;visibility:hidden}
@media (max-width:899px){.to-top{width:50px;height:50px}}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;color:#fff;background:var(--navy-deep);overflow:hidden;--focus:#81cad3}
.hero__media{position:absolute;inset:0;z-index:-2;overflow:hidden;isolation:isolate;background:var(--navy-deep)}
.hero__media img,.hero__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 30%;filter:grayscale(.55) contrast(1.08) brightness(1.08) saturate(.9)}
.hero__media video{opacity:0;transition:opacity 1.6s var(--ease-soft)}
.hero.is-playing .hero__media video{opacity:1}
.hero__grade{position:absolute;inset:0;mix-blend-mode:multiply;background:linear-gradient(118deg,#123f6e 0%,#2f6a9e 48%,#a9c6dd 100%)}
.hero__shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(4,19,38,.74) 0%,rgba(4,19,38,.5) 36%,rgba(4,19,38,.24) 70%,rgba(4,19,38,.3) 100%),
  linear-gradient(0deg,rgba(4,19,38,.88) 0%,rgba(4,19,38,.72) 34%,rgba(4,19,38,.4) 58%,rgba(4,19,38,0) 76%),
  linear-gradient(180deg,rgba(4,19,38,.55) 0%,rgba(4,19,38,0) 22%)}
.hero__vignette{position:absolute;inset:0;background:radial-gradient(ellipse 85% 80% at 62% 42%,rgba(3,14,28,0) 55%,rgba(3,14,28,.45) 100%)}
.hero__dip{position:absolute;inset:0;background:var(--navy-deep);opacity:0;transition:opacity .55s var(--ease-soft)}
.hero.is-dipping .hero__dip{opacity:1}
.hero__inner{position:relative;min-height:inherit;display:flex;align-items:flex-end;padding-top:calc(var(--head-h) + 40px);padding-bottom:clamp(88px,15vh,150px)}
.hero__grid{width:100%;align-items:end}
.hero__title{grid-column:1/9;font:300 clamp(3.6rem,9vw,8.75rem)/.94 var(--serif);letter-spacing:-.022em;color:#fff}
.hero__title .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.hero__title .ln>span{display:block}
.hero__side{grid-column:9/13;padding-bottom:.9rem}
.hero__rule{display:block;height:1px;width:min(100%,260px);background:var(--teal);margin-bottom:1.5rem;transform-origin:left}
.hero__label{font-size:1.0625rem;font-weight:600;letter-spacing:.01em;line-height:1.6;color:#fff}
.hero__role{font-size:1.0625rem;line-height:1.6;color:rgba(255,255,255,.92);max-width:30ch}
.hero__tag{margin-top:1.1rem;font:300 1.55rem/1.3 var(--serif);color:#fff;max-width:20ch}
.hero__cta{margin-top:2rem;display:flex;flex-wrap:wrap;align-items:center;gap:.9rem 1.6rem}
.hero__tel{font-size:.9375rem;font-weight:500;letter-spacing:.01em;color:#fff;padding:.5rem 0;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;text-decoration-color:rgba(255,255,255,.45);transition:text-decoration-color .25s var(--ease)}
.hero__tel:hover,.hero__tel:focus-visible{text-decoration-color:#fff}
.hero__toggle{position:absolute;right:calc(var(--gutter) + env(safe-area-inset-right));bottom:clamp(28px,5vh,44px);width:46px;height:46px;border:1px solid rgba(255,255,255,.55);border-radius:50%;display:grid;place-items:center;color:#fff;transition:background-color .25s var(--ease),border-color .25s var(--ease)}
.hero__toggle:hover{background:rgba(255,255,255,.14);border-color:#fff}
.hero__toggle[hidden]{display:none}
.hero__toggle svg{width:14px;height:14px;fill:currentColor}
.hero__toggle .i-play{display:none}.hero__toggle.is-paused .i-play{display:block}.hero__toggle.is-paused .i-pause{display:none}
.hero__scroll{position:absolute;left:var(--gutter);bottom:0;display:flex;flex-direction:column;align-items:flex-start;gap:.75rem;color:rgba(255,255,255,.92);font-size:.8125rem;letter-spacing:.04em;padding-bottom:0}
.hero__scroll::after{content:"";display:block;width:1px;height:clamp(40px,7vh,64px);background:linear-gradient(180deg,var(--teal),rgba(129,202,211,0));transform-origin:top}
.hero__scroll:hover{color:#fff}

/* page-load choreography (only with JS, only without reduced motion) */
@media (prefers-reduced-motion:no-preference){
  .js .hero__title .ln>span{transform:translateY(108%);animation:rise 1.5s var(--ease) forwards}
  .js .hero__title .ln:nth-child(1)>span{animation-delay:.3s}
  .js .hero__title .ln:nth-child(2)>span{animation-delay:.44s}
  .js .hero__rule{transform:scaleX(0);animation:draw 1.6s var(--ease) 1s forwards}
  .js .hero__fade{opacity:0;transform:translateY(12px);animation:fadeup 1.4s var(--ease) 1.2s forwards}
  .js .hero__scroll::after{animation:cue 2.8s var(--ease-soft) 2.4s infinite}
}
@keyframes rise{to{transform:none}}
@keyframes draw{to{transform:scaleX(1)}}
@keyframes fadeup{to{opacity:1;transform:none}}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

@media (max-width:899px){
  .hero__title{grid-column:1/-1;font-size:clamp(3.4rem,17vw,6.6rem)}
  .hero__side{grid-column:1/-1;margin-top:2.2rem;padding-bottom:3.4rem}
  .hero__inner{padding-bottom:84px}
  .hero__tag{font-size:1.4rem}
  .hero__scroll{display:none}
  .hero__media img{object-position:56% 20%}
}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.95rem 1.7rem;border:1px solid rgba(255,255,255,.7);border-radius:2px;color:#fff;font-size:.9375rem;font-weight:600;letter-spacing:.01em;line-height:1.2;transition:border-color .25s var(--ease),background-color .25s var(--ease),color .25s var(--ease)}
.btn:hover,.btn:focus-visible{background:#fff;border-color:#fff;color:var(--navy)}
.btn--solid{background:var(--navy);border-color:var(--navy);color:#fff}
.btn--solid:hover,.btn--solid:focus-visible{background:var(--navy-deep);border-color:var(--navy-deep);color:#fff}

/* Secondary action: outline button with an arrow (so it reads as clickable). */
.link{display:inline-flex;align-items:center;gap:.8rem;padding:.85rem 1.2rem .85rem 1.4rem;border:1px solid rgba(9,47,87,.32);border-radius:2px;font-weight:600;font-size:.9375rem;line-height:1.2;color:var(--navy);transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease)}
.link::after,.area__go,.proj-list a::after{content:"";flex:none;width:18px;height:11px;background:currentColor;-webkit-mask:var(--arrow) no-repeat center/contain;mask:var(--arrow) no-repeat center/contain;transition:transform .25s var(--ease)}
.link:hover,.link:focus-visible{background:var(--navy);border-color:var(--navy);color:#fff}
.link:hover::after,.link:focus-visible::after{transform:translateX(3px)}
.on-dark .link{color:#fff;border-color:rgba(255,255,255,.5)}
.on-dark .link:hover,.on-dark .link:focus-visible{background:#fff;border-color:#fff;color:var(--navy)}

/* ---------- Sections ---------- */
.section{padding-block:var(--sp);position:relative}
.section--white{background:var(--white)}
.section--mist{background:var(--mist-2)}
.content{grid-column:1/10}
.display{font:300 clamp(1.9rem,2.8vw,2.7rem)/1.18 var(--serif);letter-spacing:-.014em;color:var(--navy);max-width:34ch;text-wrap:balance}
.lead-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);margin-top:clamp(36px,4vw,56px);max-width:62rem}
.lead-cols p{color:var(--ink-2);max-width:36rem}

/* Rechtsgebiete */
/* Gapless panel grid: shared hairlines, white panels, navy bar + arrow on hover. */
.areas{margin-top:clamp(72px,9vw,128px);display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.area{position:relative;display:flex;flex-direction:column;padding:clamp(28px,2.6vw,40px) clamp(22px,2.2vw,34px) clamp(24px,2.2vw,32px);background:var(--white);border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background-color .25s var(--ease)}
.area::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:var(--navy);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.area h3{font:400 clamp(1.45rem,1.9vw,1.75rem)/1.15 var(--serif);color:var(--navy);letter-spacing:-.005em;min-height:2.3em;text-wrap:balance;transition:color .25s var(--ease)}
.area p{margin-top:1rem;font-size:.9688rem;line-height:1.65;color:var(--ink-2)}
.area__go{margin-top:auto;width:22px;height:13px;color:var(--teal-ink)}
.area p{margin-bottom:clamp(36px,3.4vw,48px)}
.area:hover,.area:focus-visible{background:#fbfcfd}
.area:hover::before,.area:focus-visible::before{transform:scaleX(1)}
.area:hover h3,.area:focus-visible h3{color:var(--teal-ink)}
.area:hover .area__go,.area:focus-visible .area__go{transform:translateX(5px)}
.area:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
@media (max-width:1099px){.areas{grid-template-columns:1fr 1fr}.area h3{min-height:0}}
@media (max-width:640px){.areas{grid-template-columns:1fr}}

/* Qualifikationen (home) */
.qual{align-items:center}
.qual__photo{grid-column:1/6}
.qual__photo picture,.qual__photo img{width:100%}
.qual__photo img{aspect-ratio:4/5;object-fit:cover;object-position:56% 30%;filter:saturate(.82) contrast(1.02)}
.qual__body{grid-column:7/13}
.qual__body .display{font-size:clamp(1.6rem,2.2vw,2.1rem);max-width:none}
/* Chromium balances at most 6 lines; longer headings fall back to "pretty" so no single word is left on the last line. */
@media (max-width:1279px){.qual__body .display{text-wrap:pretty}}
@media (max-width:599px){.proj-head .display{text-wrap:pretty}}
.qual__body p.txt{margin-top:1.6rem;color:var(--ink-2);max-width:34rem}
.timeline{margin-top:clamp(32px,4vw,48px);border-top:1px solid var(--line)}
.timeline div{display:grid;grid-template-columns:4.2rem 1fr;gap:1.2rem;align-items:baseline;padding:1.15rem 0;border-bottom:1px solid var(--line)}
.timeline dt{font:300 1.6rem/1 var(--serif);color:var(--steel-text)}
.timeline dd{max-width:36rem;font-size:.9688rem;line-height:1.6;color:var(--ink)}
.qual__body .link{margin-top:2rem}
@media (max-width:899px){
  .qual__photo{grid-column:1/-1;margin-bottom:clamp(40px,8vw,64px)}
  .qual__photo img{aspect-ratio:5/4;object-position:56% 25%}
  .qual__body{grid-column:1/-1}
}

/* Statement band */
.statement{background:var(--navy-deep);color:#fff;overflow:hidden;--focus:#81cad3}
.statement__inner{position:relative;max-width:68rem}
.statement blockquote{font:italic 300 clamp(1.9rem,3.6vw,3.2rem)/1.2 var(--serif);letter-spacing:-.01em;max-width:26ch}
.statement blockquote p{hanging-punctuation:first;text-wrap:balance}
.statement__by{margin-top:clamp(28px,3.4vw,44px)}
.statement__by span{font-size:.9375rem;color:rgba(255,255,255,.88)}
.statement__more{margin-top:1.6rem;max-width:36rem;color:rgba(255,255,255,.82);font-size:1rem}

/* Projekte (home) */
.proj-head{margin-bottom:clamp(40px,5vw,72px)}
.proj-list{border-top:1px solid var(--line)}
.proj-list li{border-bottom:1px solid var(--line)}
.proj-list a{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) 22px;gap:clamp(16px,3vw,48px);align-items:center;padding:clamp(22px,2.6vw,34px) 0}
.proj-list a::after{width:22px;height:13px;color:var(--teal-ink)}
.proj-list a:hover::after,.proj-list a:focus-visible::after{transform:translateX(5px)}
.proj-list h3{font:400 clamp(1.45rem,2.1vw,1.9rem)/1.18 var(--serif);color:var(--navy);transition:color .25s var(--ease)}
.proj-list a:hover h3,.proj-list a:focus-visible h3{color:var(--teal-ink)}
.proj-list p{font-size:.9688rem;line-height:1.6;color:var(--ink-2)}
.proj-more{margin-top:clamp(32px,4vw,52px)}
@media (max-width:799px){
  .proj-list a{grid-template-columns:minmax(0,1fr) 22px;row-gap:.6rem}
  .proj-list p{grid-column:1}
  .proj-list a::after{grid-row:1;grid-column:2;align-self:start;margin-top:.5em}
}

/* Kontakt (home) */
.contact{background:var(--navy-deep);color:#fff;overflow:hidden;--focus:#81cad3}
.contact .display{color:#fff;max-width:30ch}
.contact__sub{margin-top:1.4rem;font:300 clamp(1.5rem,2.2vw,2rem)/1.3 var(--serif);color:var(--teal)}
.contact__grid{margin-top:clamp(48px,6vw,88px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:start;max-width:62rem}
.facts{border-top:1px solid rgba(255,255,255,.2)}
.facts div{display:grid;grid-template-columns:6rem 1fr;gap:1rem;padding:.9rem 0;border-bottom:1px solid rgba(255,255,255,.2)}
.facts dt{font-size:.8125rem;font-weight:600;letter-spacing:0;color:rgba(255,255,255,.72);padding-top:.35rem}
.facts dd{font-size:1.0625rem;line-height:1.55}
.facts a{border-bottom:1px solid rgba(255,255,255,.3);transition:border-color .25s var(--ease),color .25s var(--ease)}
.facts a:hover{border-color:var(--teal);color:var(--teal)}
.contact__cta{padding-top:.3rem}
.contact__cta p{color:rgba(255,255,255,.82);max-width:26rem;margin-bottom:1.8rem}
@media (max-width:1099px){.contact__grid{grid-template-columns:1fr}}

/* shared collapse */
@media (max-width:899px){
  .content{grid-column:1/-1}
  .lead-cols{grid-template-columns:1fr}
}

/* ---------- Footer ---------- */
.site-footer{background:var(--mist);border-top:1px solid var(--line);padding-top:clamp(56px,7vw,88px);color:var(--ink)}
/* Four even columns: brand | Anschrift | Kontakt | Kanzlei; legal links and © on one baseline below. */
.footer__grid{display:grid;grid-template-columns:1.35fr 1fr 1.25fr .8fr;gap:clamp(32px,4vw,64px);align-items:start}
.footer__logo{width:164px;height:auto;aspect-ratio:235/140;margin-bottom:1.4rem}
.footer__claim{font-size:.875rem;line-height:1.6;color:var(--ink-2);max-width:17rem}
.footer address,.footer__contact{font-style:normal;font-size:.9688rem;line-height:1.75;color:var(--ink)}
.footer__contact a{border-bottom:1px solid rgba(9,47,87,.3);transition:border-color .25s var(--ease)}
.footer__contact a:hover{border-color:var(--navy)}
.footer__col,.footer__nav{padding-top:.4rem}
.footer__h{display:block;font-size:.8125rem;font-weight:600;letter-spacing:0;color:var(--ink-2);margin-bottom:1.3rem}
.footer__nav li+li{margin-top:.2rem}
.footer__nav a{display:inline-block;padding:.25rem 0;font-size:.9688rem;color:var(--ink);transition:color .25s var(--ease)}
.footer__nav a:hover{color:var(--navy)}
.footer__legal{margin-top:clamp(48px,6vw,80px);padding-block:1.4rem 2rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 2rem;font-size:.875rem}
.footer__links{display:flex;flex-wrap:wrap;gap:.4rem 2rem}
.footer__copy{color:var(--ink-2);font-size:.8125rem}
.footer__legal a,.footer__legal button{color:var(--ink);padding:.3rem 0;border-bottom:1px solid transparent;transition:border-color .25s var(--ease)}
.footer__legal a:hover,.footer__legal button:hover{border-color:var(--ink)}
@media (max-width:1099px){.footer__grid{grid-template-columns:1fr 1fr;row-gap:40px}}
@media (max-width:599px){.footer__grid{grid-template-columns:1fr;row-gap:32px}}

.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:150;transform:translate(-50%,24px);opacity:0;pointer-events:none;background:var(--navy-deep);color:#fff;font-size:.9375rem;padding:.9rem 1.4rem;border-radius:2px;max-width:calc(100vw - 32px);text-align:center;transition:opacity .5s var(--ease),transform .6s var(--ease)}
.toast.is-on{opacity:1;transform:translate(-50%,0)}

/* ---------- Reveal ---------- */
.js [data-reveal]{opacity:0;transform:translate3d(0,14px,0);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal].is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js [data-reveal]{opacity:1;transform:none;transition:none}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---------- Inner pages ---------- */
.page-head{position:relative;isolation:isolate;background:var(--navy-deep);color:#fff;padding-top:calc(var(--head-h) + clamp(56px,7vw,104px));padding-bottom:clamp(64px,7vw,104px);overflow:hidden;--focus:#81cad3}
.page-head h1{font:300 clamp(2.5rem,4.6vw,4.4rem)/1.04 var(--serif);letter-spacing:-.018em;max-width:16ch;overflow-wrap:anywhere;hyphens:auto;-webkit-hyphens:auto;text-wrap:balance}
.page-head h1::after{content:"";display:block;width:64px;height:1px;margin-top:clamp(22px,2.4vw,32px);background:var(--teal);transform-origin:left}
.page-head--legal h1{font-size:clamp(2.1rem,4vw,3.6rem);max-width:none}
.page-head__lead{margin-top:clamp(22px,2.4vw,32px);max-width:38rem;font:400 clamp(1rem,1.15vw,1.125rem)/1.7 var(--sans);color:rgba(255,255,255,.86);text-wrap:pretty}
.page-head__lead p+p{margin-top:1rem}

/* Subpage head with the page photo: same navy duotone as the home video, plus a glass contact card. */
.page-head--media{min-height:min(84vh,760px);display:flex;align-items:flex-end}
.page-head__inner{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);align-items:end}
.page-head__text{grid-column:1/7}
.page-head__media{position:absolute;inset:0 0 0 36%;z-index:-1;overflow:hidden}
.page-head__media picture,.page-head__media img{display:block;width:100%;height:100%}
.page-head__media img{object-fit:cover;object-position:50% 28%;filter:grayscale(1) contrast(1.08) brightness(.92)}
.page-head__media::before,.page-head__media::after{content:"";position:absolute;inset:0;pointer-events:none}
.page-head__media::before{mix-blend-mode:multiply;background:linear-gradient(118deg,#123f6e 0%,#2f6a9e 52%,#a9c6dd 100%)}
.page-head__media::after{background:linear-gradient(90deg,var(--navy-deep) 0%,rgba(6,31,58,.6) 26%,rgba(6,31,58,.12) 62%,rgba(6,31,58,.2) 100%),linear-gradient(0deg,rgba(6,31,58,.7) 0%,rgba(6,31,58,0) 42%),linear-gradient(180deg,rgba(6,31,58,.72) 0%,rgba(6,31,58,0) 24%)}
.page-head__card{position:relative;grid-column:9/13;justify-self:end;width:100%;max-width:21rem;padding:1.4rem 1.6rem 1.5rem;border-radius:2px;color:#fff;
  background-color:rgba(6,31,58,.62);-webkit-backdrop-filter:saturate(1.4) blur(20px);backdrop-filter:saturate(1.4) blur(20px)}
.page-head__name{font:400 1.375rem/1.2 var(--serif)}
.page-head__role{margin-top:.5rem;font-size:.875rem;line-height:1.55;color:rgba(255,255,255,.84)}
.page-head__tel{display:inline-block;margin-top:1rem;font-size:.9375rem;font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;text-decoration-color:rgba(255,255,255,.45);transition:text-decoration-color .25s var(--ease)}
.page-head__tel:hover,.page-head__tel:focus-visible{text-decoration-color:#fff}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.page-head__card{background-color:rgba(8,34,64,.9)}}
@media (prefers-reduced-transparency:reduce),(prefers-contrast:more){.page-head__card{background-color:var(--navy-deep)}}
@media (prefers-reduced-motion:no-preference){
  .js .page-head h1::after{transform:scaleX(0);animation:draw 1.2s var(--ease) .35s forwards}
  .js .page-head__media img{transform:scale(1.07);animation:settle 2.6s var(--ease) forwards}
  .js .page-head__lead,.js .page-head__card{opacity:0;transform:translateY(12px);animation:fadeup 1.1s var(--ease) .5s forwards}
  .js .page-head__card{animation-delay:.75s}
}
@keyframes settle{to{transform:none}}
@media (max-width:899px){
  .page-head--media{min-height:0}
  .page-head__media{inset:0}
  .page-head__media::after{background:linear-gradient(180deg,rgba(6,31,58,.7) 0%,rgba(6,31,58,.86) 55%,rgba(6,31,58,.94) 100%)}
  .page-head__text,.page-head__card{grid-column:1/-1}
  .page-head__card{justify-self:start;margin-top:clamp(32px,7vw,48px)}
}

.doc{padding-block:0 var(--sp)}
.doc__body{margin-top:clamp(64px,8vw,112px)}
.doc--legal .doc__body{margin-top:clamp(48px,6vw,88px)}
.doc--legal .article{grid-column:4/12}
.toc{grid-column:1/4;align-self:start;position:sticky;top:112px}
.toc__h{font-size:.8125rem;font-weight:600;letter-spacing:0;color:var(--ink-2);padding-bottom:1rem;border-bottom:1px solid var(--line);margin-bottom:.4rem}
.toc ol{counter-reset:none}
.toc a{position:relative;display:block;padding:.62rem 0 .62rem 1.4rem;font-size:.9375rem;line-height:1.4;color:var(--ink-2);border-bottom:1px solid var(--line);transition:color .25s var(--ease)}
.toc a::before{content:"";position:absolute;left:0;top:50%;width:0;height:1px;background:var(--teal-ink);transition:width .25s var(--ease)}
.toc a:hover{color:var(--navy)}
.toc a.is-current{color:var(--navy);font-weight:600}
.toc a.is-current::before{width:.9rem}
.article{grid-column:4/12;min-width:0}
.article>*{max-width:68ch}
.article h2{position:relative;overflow-wrap:anywhere;margin-top:clamp(56px,6vw,88px);font:400 clamp(1.7rem,3.1vw,2.9rem)/1.12 var(--serif);letter-spacing:-.01em;color:var(--navy);scroll-margin-top:104px;max-width:24ch}
.article h2:first-child{margin-top:0}
.article p{margin-top:1.25rem;font-size:1.125rem;line-height:1.78;color:var(--ink)}
.article h2+p{margin-top:1.4rem}
.article ul{margin-top:1.4rem}
.article li{position:relative;padding:.55rem 0 .55rem 1.9rem;font-size:1.125rem;line-height:1.7;border-bottom:1px solid var(--line)}
.article li:first-child{border-top:1px solid var(--line)}
.article li::before{content:"";position:absolute;left:0;top:1.55rem;width:.9rem;height:1px;background:var(--teal-ink)}
.article a{border-bottom:1px solid rgba(9,47,87,.35);transition:border-color .25s var(--ease)}
.article a:hover{border-color:var(--navy)}
.article strong{font-weight:600}
@media (max-width:899px){
  .doc__fig{grid-column:1/-1}
  .toc{grid-column:1/-1;position:static;margin-bottom:clamp(40px,8vw,64px)}
  .article,.doc--legal .article{grid-column:1/-1}
}
.pager{margin-top:clamp(64px,8vw,112px);padding-top:2rem;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.pager a{display:block;max-width:22rem;border:0}
.pager small{display:block;font-size:.8125rem;font-weight:600;letter-spacing:0;color:var(--ink-2);margin-bottom:.4rem}
.pager span{font:400 1.9rem/1.15 var(--serif);color:var(--navy);transition:color .25s var(--ease)}
.pager a:hover span{color:var(--teal-ink)}
.pager .pager__next{text-align:right;margin-left:auto}

/* Kontakt */
.kontakt{padding-block:clamp(72px,9vw,136px) var(--sp);background:var(--paper)}
.kontakt__info{grid-column:1/6}
.kontakt__form{grid-column:7/13}
.kontakt .facts{border-color:var(--line)}
.kontakt .facts div{border-color:var(--line);grid-template-columns:7rem 1fr}
.kontakt .facts dt{color:var(--ink-2)}
.kontakt .facts dd{font-size:1.125rem}
.kontakt .facts a{border-color:rgba(9,47,87,.3)}
.kontakt .facts a:hover{border-color:var(--navy);color:var(--navy)}
.kontakt__h{font:400 clamp(1.9rem,2.8vw,2.6rem)/1.12 var(--serif);color:var(--navy);margin-bottom:1.6rem}
.kontakt__fig{margin-top:clamp(32px,4vw,56px)}
.kontakt__fig img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:56% 25%;filter:saturate(.8)}
.kontakt__note{margin-top:2rem;font-size:.9688rem;color:var(--ink-2);max-width:30rem}
.form{display:grid;gap:1.7rem}
.field{display:grid;gap:.4rem}
.field label{font-size:.8125rem;font-weight:600;letter-spacing:0;color:var(--ink-2)}
.field input,.field textarea{width:100%;font:400 1.125rem/1.5 var(--sans);color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--steel);border-radius:0;padding:.7rem 0 .75rem;transition:border-color .25s var(--ease),box-shadow .25s var(--ease);outline-offset:6px}
.field textarea{min-height:9.5rem;resize:vertical;line-height:1.6}
.field input:hover,.field textarea:hover{border-color:var(--navy)}
.field input:focus,.field textarea:focus{border-color:var(--navy);box-shadow:0 1px 0 0 var(--navy)}
.form__legend{font-size:.9375rem;color:var(--ink-2)}
.form__hint{font-size:.9375rem;line-height:1.65;color:var(--ink-2);max-width:36rem}
.form__hint a{border-bottom:1px solid rgba(9,47,87,.35)}
.form__hint a:hover{border-color:var(--navy)}
/* Required privacy checkbox: custom square in the site's navy, label wraps beside it. */
.consent{display:grid;grid-template-columns:24px 1fr;column-gap:.9rem;align-items:start;max-width:36rem}
.consent input{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin:.1rem 0 0;border:1.5px solid var(--steel);border-radius:2px;background:#fff center/14px 14px no-repeat;cursor:pointer;transition:background-color .2s var(--ease),border-color .2s var(--ease)}
.consent input:hover{border-color:var(--navy)}
.consent input:checked{background-color:var(--navy);border-color:var(--navy);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 7.4l2.9 2.8L11.5 4' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.consent input:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.consent input[aria-invalid="true"]{border-color:#b3261e}
.consent label{font-size:.9375rem;line-height:1.6;color:var(--ink-2);cursor:pointer}
.consent label a{color:var(--navy);border-bottom:1px solid rgba(9,47,87,.35)}
.consent label a:hover{border-color:var(--navy)}
.consent__error{grid-column:2;margin-top:.4rem;font-size:.875rem;font-weight:600;color:#b3261e}
.form__status{min-height:1.5rem;font-size:.9375rem;color:var(--teal-ink);font-weight:600}
@media (max-width:899px){.kontakt__info,.kontakt__form{grid-column:1/-1}.kontakt__form{margin-top:clamp(48px,9vw,72px)}}

.cta-band{background:var(--navy-deep);color:#fff;padding-block:clamp(56px,7vw,96px);--focus:#81cad3}
.cta-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.cta-band p{font:300 clamp(1.8rem,3vw,2.8rem)/1.15 var(--serif);max-width:24ch}

/* ---------- Mobile refinements (v15) ---------- */
/* Long German compounds must never widen the page (soft hyphens in the markup do the nice break; this is the safety net). */
h1,h2,h3{overflow-wrap:break-word}
.site-footer{padding-bottom:env(safe-area-inset-bottom)}
@media (max-width:899px){
  /* Menu overlay: scrolls when it does not fit (landscape phones), centred when it does. */
  .site-nav{justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right));padding-bottom:calc(40px + env(safe-area-inset-bottom))}
  .site-nav ul{margin-top:auto}
  .site-nav__foot{margin-bottom:auto}
  .site-nav__foot a{display:inline-block;padding:.6rem 0;border-bottom:0;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;text-decoration-color:rgba(255,255,255,.4)}
  .nav-open .site-header__bar{background:var(--navy-deep)}
  /* Touch targets >= 44px */
  .hero__tel{padding:.65rem 0}
  .page-head__tel{padding:.6rem 0;margin-top:.4rem}
  .toc a{padding-top:.72rem;padding-bottom:.72rem}
  .footer__nav li+li{margin-top:0}
  .footer__nav a{display:flex;align-items:center;min-height:44px;padding:0}
  .footer__links{gap:0 1.6rem}
  .footer__legal{padding-block:1rem 1.6rem;row-gap:.2rem}
  .footer__legal a,.footer__legal button{display:inline-flex;align-items:center;min-height:44px;padding:0}
  /* Body copy >= 16px on phones */
  .area p,.proj-list p,.timeline dd{font-size:1rem}
  .footer address,.footer__contact,.footer__nav a{font-size:1rem}
  .footer address,.footer__contact{line-height:1.9}
  .footer__legal a,.footer__legal button{font-size:.9375rem}
  .footer__claim,.page-head__role{font-size:.9375rem}
  .field label{font-size:.875rem}
  /* A one-entry table of contents only pushes the text down. */
  .toc:not(:has(li+li)){display:none}
}
@media (max-width:899px) and (max-height:500px){
  .site-nav{padding-top:calc(var(--head-h) + 8px)}
  .site-nav li a{font-size:1.75rem;padding:.5rem 0}
  .site-nav__foot{margin-top:1rem}
}
/* Narrow phones: label above value so phone numbers and the e-mail address stay on one line. */
@media (max-width:479px){
  .facts div,.kontakt .facts div{grid-template-columns:1fr;row-gap:.1rem;padding:.75rem 0}
  .facts dt{padding-top:0}
}
@media (max-width:374px){
  .page-head h1{font-size:2.2rem}
  .page-head--legal h1{font-size:1.95rem}
  .display{font-size:1.6rem}
}

/* ---------- Print ---------- */
@media print{.site-header,.hero__toggle,.hero__scroll,.toast,.to-top{display:none}.page-head,.contact,.statement{background:#fff!important;color:#000!important}}

/* ---------- WordPress ---------- */
@media screen and (min-width:601px){.admin-bar .site-header{top:var(--wp-admin--admin-bar--height,32px)}}

/* Contact Form 7: its markup mapped onto the design's form styles. */
.wpcf7 .hidden-fields-container{display:none}
.wpcf7-form-control-wrap{display:block}
.field .wpcf7-form-control{display:block}
.wpcf7 .consent{display:block}
.consent .wpcf7-list-item{display:block;margin:0}
.consent .wpcf7-list-item label{display:grid;grid-template-columns:24px 1fr;column-gap:.9rem;align-items:start}
.consent .wpcf7-not-valid input{border-color:#b3261e}
.wpcf7-not-valid-tip{display:block;margin-top:.4rem;font-size:.875rem;font-weight:600;color:#b3261e}
.consent .wpcf7-not-valid-tip{padding-left:calc(24px + .9rem)}
.field .wpcf7-not-valid{border-color:#b3261e}
.wpcf7 input.btn{-webkit-appearance:none;appearance:none;font-family:var(--sans);cursor:pointer}
.wpcf7 .wpcf7-spinner{margin:0 0 0 1rem;vertical-align:middle}
.wpcf7 form .wpcf7-response-output{margin:0;padding:0;border:0;font-size:.9375rem;font-weight:600;color:var(--teal-ink)}
.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.unaccepted .wpcf7-response-output,.wpcf7 form.failed .wpcf7-response-output,.wpcf7 form.aborted .wpcf7-response-output,.wpcf7 form.spam .wpcf7-response-output{color:#b3261e}
/* Long words and URLs never push the page wider than a 320px screen. */
.article p,.article li,.timeline dd,.facts dd{overflow-wrap:break-word}

/* ---------- Cookie consent (Complianz) in the site's design ---------- */
/* Centred dialog over a dimmed page; accept and deny carry equal weight. */
#cmplz-cookiebanner-container{
  --cmplz_banner_background_color:#fff; --cmplz_text_color:var(--ink-2); --cmplz_hyperlink_color:var(--navy);
  --cmplz_button_accept_background_color:var(--navy); --cmplz_button_accept_border_color:var(--navy); --cmplz_button_accept_text_color:#fff;
  --cmplz_button_deny_background_color:#fff; --cmplz_button_deny_border_color:var(--navy); --cmplz_button_deny_text_color:var(--navy);
  --cmplz_button_settings_background_color:transparent; --cmplz_button_settings_border_color:transparent; --cmplz_button_settings_text_color:var(--navy);
  --cmplz_slider_active_color:var(--navy); --cmplz_slider_inactive_color:var(--steel); --cmplz_category_header_always_active_color:var(--teal-ink);
  --cmplz_button_border_radius:2px; --cmplz_banner_border_radius:2px; --cmplz_banner_border_width:0;
  --cmplz_text_font_size:15px; --cmplz_link_font_size:13px; --cmplz_category_body_font_size:14px; --cmplz_category_header_title_font_size:15px; --cmplz_button_font_size:15px
}
body:has(.cmplz-cookiebanner.cmplz-show:not(.cmplz-dismissed))::after{content:"";position:fixed;inset:0;z-index:99998;background:rgba(6,31,58,.42);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:cmplzDim .5s var(--ease) both}
@keyframes cmplzDim{from{opacity:0}}
#cmplz-cookiebanner-container .cmplz-cookiebanner{top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:min(560px,calc(100vw - 32px));min-width:0;max-height:calc(100dvh - 32px);
  padding:clamp(26px,4vw,40px) clamp(22px,4vw,44px) clamp(22px,3vw,30px);display:grid;grid-row-gap:0;font-family:var(--sans);
  box-shadow:0 40px 90px -30px rgba(4,19,38,.55),0 2px 6px rgba(4,19,38,.08)}
#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show{animation:cmplzIn .6s var(--ease) both}
#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show:hover{box-shadow:0 40px 90px -30px rgba(4,19,38,.55),0 2px 6px rgba(4,19,38,.08)}
@keyframes cmplzIn{from{opacity:0;transform:translate(-50%,calc(-50% + 14px))}}
#cmplz-cookiebanner-container .cmplz-divider,#cmplz-cookiebanner-container .cmplz-logo{display:none}
#cmplz-cookiebanner-container .cmplz-header{grid-template-columns:1fr auto;align-items:start;margin-bottom:1.1rem}
#cmplz-cookiebanner-container .cmplz-title{display:block;grid-column:1;justify-self:start;font:400 clamp(1.5rem,3.4vw,1.85rem)/1.2 var(--serif);color:var(--navy);letter-spacing:-.005em}
#cmplz-cookiebanner-container .cmplz-title::after{content:"";display:block;width:48px;height:1px;margin-top:.9rem;background:var(--teal)}
#cmplz-cookiebanner-container .cmplz-close{grid-column:2;display:grid;place-items:center;width:40px;height:40px;margin:-8px -10px 0 0;color:var(--navy);border-radius:2px;transition:background-color .2s var(--ease)}
#cmplz-cookiebanner-container .cmplz-close:hover{background:var(--mist);font-size:20px}
#cmplz-cookiebanner-container .cmplz-close svg{display:none}
#cmplz-cookiebanner-container .cmplz-close::before,#cmplz-cookiebanner-container .cmplz-close::after{content:"";grid-area:1/1;width:17px;height:1.5px;background:currentColor;transform:rotate(45deg)}
#cmplz-cookiebanner-container .cmplz-close::after{transform:rotate(-45deg)}
#cmplz-cookiebanner-container .cmplz-body{min-width:0;max-height:none}
#cmplz-cookiebanner-container .cmplz-message{width:auto;margin:0;line-height:1.65;color:var(--ink-2)}
#cmplz-cookiebanner-container .cmplz-message p{margin:0}
#cmplz-cookiebanner-container .cmplz-categories{width:auto;margin-top:1.2rem}
#cmplz-cookiebanner-container .cmplz-category{background:var(--paper);border-radius:2px;margin-bottom:.5rem}
#cmplz-cookiebanner-container .cmplz-category-title{font-weight:600;color:var(--ink)}
#cmplz-cookiebanner-container .cmplz-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:1.6rem}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn{min-height:50px;padding:.9rem 1.2rem;font-weight:600;letter-spacing:.01em;line-height:1.2;transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease)}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn.cmplz-accept:hover{background:var(--navy-deep);border-color:var(--navy-deep)}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn.cmplz-deny:hover{background:var(--navy);color:#fff}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn.cmplz-view-preferences,#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn.cmplz-save-preferences{grid-column:1/-1;min-height:44px;padding:.5rem;font-weight:500;text-decoration:underline;text-decoration-color:rgba(9,47,87,.35);text-underline-offset:4px}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn.cmplz-view-preferences:hover,#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn.cmplz-save-preferences:hover{text-decoration-color:var(--navy)}
#cmplz-cookiebanner-container .cmplz-documents{justify-content:flex-start;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}
#cmplz-cookiebanner-container .cmplz-documents ul{display:flex;flex-wrap:wrap;gap:.3rem 1.6rem;margin:0;padding:0}
#cmplz-cookiebanner-container .cmplz-documents li:has(.cookie-statement){display:none}
#cmplz-cookiebanner-container .cmplz-documents a{display:inline-block;padding:.35rem 0;color:var(--ink-2);text-decoration:none;border-bottom:1px solid rgba(9,47,87,.25)}
#cmplz-cookiebanner-container .cmplz-documents a:hover{color:var(--navy);border-color:var(--navy)}
#cmplz-cookiebanner-container :focus-visible{outline:2px solid var(--navy);outline-offset:3px}
#cmplz-cookiebanner-container .cmplz-close:focus-visible{outline:1px solid rgba(9,47,87,.4);outline-offset:-3px;background:var(--mist)}
@media (max-width:480px){#cmplz-cookiebanner-container .cmplz-buttons{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show,body:has(.cmplz-cookiebanner.cmplz-show)::after{animation:none}}
/* WordPress' standard visually-hidden class (used by plugins, e.g. the consent switches). */
.screen-reader-text{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* Consent categories: only the two the site really uses (Funktional, Statistiken). */
#cmplz-cookiebanner-container .cmplz-category.cmplz-preferences,#cmplz-cookiebanner-container .cmplz-category.cmplz-marketing{display:none}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category{background:var(--paper);border:1px solid var(--line);border-radius:2px;margin-bottom:10px}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-category-header{grid-template-columns:1fr auto auto!important;gap:14px;align-items:center;padding:12px 10px 12px 18px}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-title{font-size:15px;font-weight:600;color:var(--ink)}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active{display:flex;align-items:center;font-size:13px;font-weight:600;color:var(--teal-ink)}
#cmplz-cookiebanner-container .cmplz-always-active .cmplz-banner-checkbox{display:none!important}
/* Switch: 44x24 track, the real checkbox lies invisibly on top of it. */
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox{position:relative;display:block;width:44px;height:24px;margin:0}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label{position:absolute;inset:0;padding:0;margin:0}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::before{content:"";position:absolute;left:0;top:0;width:44px;height:24px;padding:0;border-radius:12px;background:#b9c5d1;box-shadow:none;transition:background-color .25s var(--ease)}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(4,19,38,.3);transition:left .25s var(--ease)}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked+.cmplz-label::before{background:var(--navy);padding:0}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked+.cmplz-label::after{left:23px}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:focus+.cmplz-label::before{box-shadow:none}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:focus-visible+.cmplz-label::before{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--navy)}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-toggle{display:grid;place-items:center;width:36px;height:36px;border-radius:2px;color:var(--navy)}
#cmplz-cookiebanner-container .cmplz-category-toggle:hover{background:var(--mist)}
#cmplz-cookiebanner-container .cmplz-category-toggle:focus-visible{outline:1px solid rgba(9,47,87,.4);outline-offset:-3px;background:var(--mist)}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-icon.cmplz-open{width:14px;height:14px;transition:transform .3s var(--ease)}
#cmplz-cookiebanner-container .cmplz-icon svg{width:14px;height:14px;fill:currentColor}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-description{padding:0 18px 14px;font-size:14px;line-height:1.6;color:var(--ink-2)}