/* Shared YuTu typography and a quiet, full-width navigation. */
:root { --yutu-navy:#0f1e4d; --yutu-cream:#f8f9fc; --yutu-ink:#17213a; }
html { scroll-padding-top:100px; }
body { color:var(--yutu-ink); }
h1,h2,h3,h4,h5,h6 { font-family:'Open Sans',sans-serif; text-transform:none; letter-spacing:-.03em; }
header[data-navbar] { top:0; left:0; right:0; width:100%; transform:none; border-radius:0; border-bottom:1px solid rgba(15,30,77,.08); background:#fff; box-shadow:none; backdrop-filter:blur(12px); }
header[data-navbar] > div:first-child { max-width:1244px; padding-top:18px; padding-bottom:18px; }
header[data-navbar] #mobile-menu { background:#f8f9fc; border-color:rgba(15,30,77,.1); }
@media(max-width:640px) { header[data-navbar] > div:first-child { padding-top:12px; padding-bottom:12px; } }

/* Shared fixes from the full-site responsive review. */
main { overflow-x:clip; }
main :is(h1,h2,h3,p,li,address) { overflow-wrap:anywhere; }
main :is(h1,h2,h3) { hyphens:auto; }
@media(min-width:1024px) { main :is(h1,h2,h3) { hyphens:none; overflow-wrap:normal; } }
main .grid > * { min-width:0; }
.bg-brand-cream { background-color:#f8f9fc; }
main > section:first-child:has(> div > nav[aria-label="Breadcrumb"]) { padding-top:116px; }
@media(min-width:640px) { main > section:first-child:has(> div > nav[aria-label="Breadcrumb"]) { padding-top:128px; } }

/* Navy header matches the original logo; the expanded menu stays light. */
header[data-navbar] { background:#162455; color:#fff; border-bottom-color:rgba(255,255,255,.1); }
header[data-navbar] > div:first-child nav a,
header[data-navbar] > div:first-child > div a:not([data-track]) { color:#f8f9fc; }
header[data-navbar] > div:first-child a[data-track="personal_anfragen_click"] { background:#f8f9fc; color:#0f1e4d; }
header[data-navbar] > div:first-child a[data-track="phone_click"] { background:transparent; color:#f8f9fc; border-color:rgba(248,249,252,.3); }
header[data-navbar] [data-menu-toggle] { background:transparent; color:#f8f9fc; border-color:rgba(248,249,252,.3); }
header[data-navbar] #mobile-menu { color:#17213a; }

/* Hide the faint frame baked into the original logo image. */
header[data-navbar] a[aria-label="YuTu GmbH Startseite"] img { clip-path:inset(2px round 2px); }

@media(max-width:760px) {
 main h2:has(> .faq-topic) { font-size:clamp(22px,6vw,28px); hyphens:none; }
 main h2 > .faq-topic { display:block; white-space:nowrap; font-size:clamp(18px,5.4vw,28px); letter-spacing:-.035em; }
}

/* Keep the brand mark proportional when the full desktop navigation is visible. */
header[data-navbar] a[aria-label="YuTu GmbH Startseite"] { flex-shrink:0; }
header[data-navbar] a[aria-label="YuTu GmbH Startseite"] img { width:auto; max-width:none; object-fit:contain; }
@media(min-width:1280px) { header[data-navbar] > div:first-child { max-width:1440px; } }
