/* F.D. Beissel | Contao 5.7 | Basis / Design-Tokens
   Voraussetzung: Layout-Builder + Responsives Layout aktiv.
   Keine feste Seitenbreite im Contao-Seitenlayout setzen.
   Farben anhand der Entwurfsgrafiken angenähert. */
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/manrope-v20-latin-regular.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/manrope-v20-latin-500.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/manrope-v20-latin-600.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/manrope-v20-latin-700.woff2') format('woff2')}
:root{
 --color-brand:#0b4a9b;--color-brand-dark:#073b7a;--color-navy:#10213d;
 --color-text:#272e3b;--color-muted:#687181;--color-line:#d9dce1;
 --color-white:#fff;--color-warmwhite:#fcfaf7;--color-greige:#f3efea;
 --color-sand:#d9c8b6;--color-stone:#e4e0dc;
 --font-primary:'Manrope',Arial,sans-serif;
 --container-width:1440px;--gutter:clamp(20px,4vw,64px);
 --section-space:clamp(60px,6vw,110px);--radius-card:2px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;font:400 16px/1.65 var(--font-primary);color:var(--color-text);background:var(--color-warmwhite);-webkit-font-smoothing:antialiased}
img,svg,video{max-width:100%;height:auto}img{display:block}button,input,select,textarea{font:inherit}
a{color:var(--color-brand);text-underline-offset:3px}a:hover{color:var(--color-brand-dark)}
h1,h2,h3,h4,h5,h6{font-family:var(--font-primary);line-height:1.16;letter-spacing:-.035em;color:var(--color-navy);margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(2.8rem,6vw,5.8rem)}h2{font-size:clamp(2rem,3.4vw,3.5rem)}h3{font-size:clamp(1.2rem,1.65vw,1.6rem)}
p{margin:0 0 1.25em}p:last-child{margin-bottom:0}
/* Contao Standardstruktur: Außenbereiche volle Breite. */
#wrapper{width:100%;max-width:none;margin:0;overflow:visible}
#container,#main,#main>.inside{width:100%;max-width:none;min-width:0;margin:0;padding:0}
/* Verwende .be-container in Artikel-/Elementgruppen für begrenzte Inhalte. */
.be-container{width:min(100% - (2 * var(--gutter)),var(--container-width));margin-inline:auto}
.be-section{padding-block:var(--section-space)}
.be-section--white{background:var(--color-white)}.be-section--warm{background:var(--color-warmwhite)}.be-section--greige{background:var(--color-greige)}
.be-eyebrow{text-transform:uppercase;letter-spacing:.32em;font-size:.72rem;font-weight:700;color:var(--color-muted);margin-bottom:18px}
.be-accent{color:var(--color-brand)}
.be-lead{font-size:clamp(1.05rem,1.5vw,1.35rem);color:var(--color-muted)}
.be-button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:52px;padding:12px 26px;border:1px solid var(--color-brand);border-radius:7px;background:var(--color-brand);color:#fff;font-size:.95rem;font-weight:700;text-decoration:none;transition:background .2s,border-color .2s,transform .2s}
.be-button:hover{background:var(--color-brand-dark);border-color:var(--color-brand-dark);color:white;transform:translateY(-1px)}
.be-button--outline{background:transparent;color:var(--color-brand)}.be-button--outline:hover{color:white}
:focus-visible{outline:3px solid var(--color-brand);outline-offset:3px}