/* One native, keyboard-accessible selector stays visible in every layout. */
:root { color-scheme: light; --surface: #edf3f3; --surface-raised: #eaf3f5; --field: #fff; --edge: #c7dae1; --action: #08769f; --action-ink: #fff; }
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.display-control { display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0; min-height: 44px; padding-left: 10px; border: 1px solid var(--edge); border-radius: 6px; background: var(--paper); color: var(--ink); }
.display-icon { font: 21px/1 Arial,sans-serif; color: var(--blue-dark); }
.display-control select { width: 142px; min-height: 44px; padding: 8px 6px; border: 0; border-radius: 5px; background: var(--paper); color: var(--ink); font: 600 14px/1.5 var(--sans); cursor: pointer; }
.display-control:focus-within { outline: 3px solid var(--blue-dark); outline-offset: 4px; }
.display-control select:focus-visible { outline: none; }
.header { gap: 18px; }
.header .nav { gap: 20px; margin-left: auto; }
.language-switch { margin-left: auto; }
@media (max-width: 1600px) { .header-cta { display: none; } }
@media (max-width: 1300px) {
  .header { position: relative; z-index: 10; }
  .header .nav { position: absolute; top: calc(100% - 8px); left: 20px; right: 20px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 15px 23px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); box-shadow: 0 20px 30px #0002; }
  .header .nav.open { display: flex; }
  .header .nav a { font-size: 18px; padding: 15px 0; }
  .header .nav a::after { display: none; }
  .menu-toggle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 9px; flex-shrink: 0; background: transparent; border: 1px solid var(--line); border-radius: 50%; }
  .menu-toggle span { width: 18px; height: 1px; background: var(--ink); }
  .menu-toggle[aria-expanded=true] span:first-child { transform: translateY(3px) rotate(45deg); }
  .menu-toggle[aria-expanded=true] span:last-child { transform: translateY(-3px) rotate(-45deg); }
}
@media (max-width: 650px) {
  .header { display: grid; grid-template-columns: 1fr auto; height: auto; padding: 19px 20px 14px; gap: 12px 16px; }
  .header .brand { grid-column: 1; grid-row: 1; }
  .header .brand img { width: 203px; }
  .header .menu-toggle { grid-column: 2; grid-row: 1; justify-self: end; }
  .language-switch { grid-column: 2; grid-row: 2; margin: 0; justify-self: end; }
  .display-control { grid-column: 1; grid-row: 2; justify-self: start; }
  .display-control select { width: 144px; font-size: 14px; }
}

/* Dark surfaces retain the blue identity; contrast uses black, white and yellow. */
html[data-display=dark] { color-scheme: dark; --paper: #0f1d23; --ink: #edf5f5; --muted: #c0d0d6; --blue: #77d5f4; --blue-dark: #9ae4ff; --line: #405861; --pale: #192f37; --surface: #182a32; --surface-raised: #203842; --field: #10232b; --edge: #526f7b; --action: #8adcf6; --action-ink: #082630; }
html[data-display=contrast] { color-scheme: dark; --paper: #000; --ink: #fff; --muted: #fff; --blue: #ffdf00; --blue-dark: #ffdf00; --line: #fff; --pale: #000; --surface: #000; --surface-raised: #000; --field: #000; --edge: #fff; --action: #ffdf00; --action-ink: #000; }
html[data-display=dark] .brand img { content: url('assets/complex-clinic-logo-light.svg'); }
html[data-display=contrast] .brand img { filter: brightness(0) invert(1); }
html[data-display=dark] .hero-photo { filter: brightness(.85); }
html[data-display]:not([data-display=light]) :is(.topics-section,.process-section,.topic-illustration,.contact-section,.footer-contact,.contact-message-card,.collaboration-section,.floating-note,.info-note,.kme-limit,.biologika-note,.biologika-contexts span,.orbit-label,.message-status,.form-summary,.contact-envelope) { background: var(--surface); border-color: var(--edge); color: var(--ink); }
html[data-display]:not([data-display=light]) :is(.eyebrow,.small-note,.art-caption,.step-tag,.info-note,.kme-limit p,.biologika-contexts span,.orbit-label,.orbit-toggle,.footer-contact-note,.message-consent,.message-form-note,.collaboration-copy p,.collaboration-section .eyebrow,.subpage-breadcrumb>span[aria-hidden],.contact-email-text>span) { color: var(--muted); }
html[data-display]:not([data-display=light]) :is(input,textarea,select) { background: var(--field); color: var(--ink); border-color: var(--edge); accent-color: var(--blue); }
html[data-display]:not([data-display=light]) :is(input,textarea)::placeholder { color: var(--muted); opacity: 1; }
html[data-display]:not([data-display=light]) :is(.button,.collaboration-copy .button) { background: var(--action); color: var(--action-ink); border-color: var(--action); }
html[data-display]:not([data-display=light]) :is(.button,.collaboration-copy .button):hover { background: var(--blue-dark); color: var(--action-ink); }
html[data-display]:not([data-display=light]) .form-choices label:has(input:checked) { background: var(--surface-raised); border-color: var(--blue); }
html[data-display]:not([data-display=light]) :is(.language-switch a:hover,.orbit-toggle:hover) { background: var(--surface-raised); color: var(--blue); }
html[data-display]:not([data-display=light]) :is(.footer-contact-status a,.message-status a,.collaboration-section em) { color: var(--blue); }
html[data-display]:not([data-display=light]) .contact-orbit { color: var(--line); }
html[data-display]:not([data-display=light]) dialog { border-color: var(--edge); }
html[data-display]:not([data-display=light]) dialog::backdrop { background: #000b; }
html[data-display]:not([data-display=light]) .form-progress>span { background: var(--line); }
html[data-display]:not([data-display=light]) .form-progress>span.active { background: var(--blue); }
html[data-display]:not([data-display=light]) .form-step .form-error { color: #ffb6a8; }
html[data-display]:not([data-display=light]) .orbit-scene { background: radial-gradient(circle, var(--surface-raised), transparent 70%); --orbit-blue: var(--blue); }
html[data-display]:not([data-display=light]) .orbit-core { background: var(--action); color: var(--action-ink); border-color: var(--edge); box-shadow: 0 0 0 9px var(--surface-raised); }
html[data-display]:not([data-display=light]) .orbit-ring { stroke: var(--edge); }
html[data-display]:not([data-display=light]) .orbit-ring-inner { fill: var(--surface); }
html[data-display]:not([data-display=light]) ::selection { color: var(--action-ink); background: var(--blue); }

/* Readability mode: larger copy, clear boundaries, visible links, no movement. */
html[data-display=contrast] { scroll-behavior: auto; }
html[data-display=contrast] body { font-size: 22px; line-height: 1.75; }
html[data-display=contrast] *, html[data-display=contrast] *::before, html[data-display=contrast] *::after { animation: none !important; transition: none !important; text-shadow: none !important; box-shadow: none !important; }
html[data-display=contrast] :is(p,li,small,label,input,textarea,select,summary,.text-link,.step-tag,.small-note,.field-label,.contact-email-text,.footer-email,.footer-contact-status,.message-status,.form-summary) { font-size: 20px !important; line-height: 1.75 !important; letter-spacing: normal !important; }
html[data-display=contrast] :is(.eyebrow,.topic-count,.footer-bottom,.footer-bottom>span,.footer-external-links a,.privacy-link,.dialog-footnote,.form-counter,.contact-subnote,.message-privacy,.form-note,.orbit-label,.art-caption,.photo-label,.language-switch a,.message-field>span,.contact-email-text>span,.subpage-breadcrumb,.biologika-contexts span,.biologika-principles>div>span) { font-size: 18px !important; line-height: 1.7 !important; letter-spacing: normal !important; }
html[data-display=contrast] :is(h1,h2,h3,h4,em,.photo-caption i) { font-family: var(--sans); font-style: normal; font-weight: 700; letter-spacing: normal; line-height: 1.3; }
html[data-display=contrast] :is(h1 em,h2 em) { font-size: 1em; }
html[data-display=contrast] :is(.button,.form-buttons .button) { font-size: 20px; min-height: 54px; white-space: normal; }
html[data-display=contrast] :is(a:not(.brand):not(.button):not(.back-top),.text-link,.privacy-link,.message-privacy) { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 2px; }
html[data-display=contrast] :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible { outline: 4px solid #ffdf00; outline-offset: 5px; }
html[data-display=contrast] .display-control:focus-within { outline: 4px solid #ffdf00; outline-offset: 5px; }
html[data-display=contrast] .display-control select:focus-visible { outline: none; }
html[data-display=contrast] :is(.display-control,.menu-toggle,.button,.back-top,.form-choices label,input,textarea,.contact-message-card,.footer-contact,.info-note,.kme-limit,.topic-panel,.contact-section,.collaboration-section,.biologika-note) { border: 2px solid var(--edge); }
html[data-display=contrast] .button { border-color: var(--blue); }
html[data-display=contrast] :is(input[type=checkbox],.form-choices input) { width: 26px; height: 26px; }
html[data-display=contrast] :is(.topic-tabs button,.header .nav a) { font-size: 20px; line-height: 1.75; min-height: 52px; }
html[data-display=contrast] .topic-tabs button[aria-selected=true] { border-bottom: 4px solid var(--blue); }
html[data-display=contrast] .topic-illustration { display: none; }
html[data-display=contrast] .topic-panel { grid-template-columns: 1fr; }
html[data-display=contrast] .contact-orbit { display: none; }
html[data-display=contrast] .orbit-core::before { display: none; }
html[data-display=contrast] .orbit-toggle { display: none; }
html[data-display=contrast] .orbit-label { padding: 6px 10px; }
html[data-display=contrast] .orbit-trail { stroke: var(--blue); opacity: 1; }
html[data-display=contrast] .orbit-point { fill: var(--blue); }
html[data-display=contrast] .photo-caption { left: 16px; right: 16px; bottom: 20px; background: #000; padding: 12px; font-size: 24px; }
html[data-display=contrast] .photo-caption i { font-size: 24px; }
html[data-display=contrast] .photo-label { color: #fff; background: #000; }
html[data-display=contrast] .floating-note { background: #000; color: #fff; border: 2px solid #fff; }
html[data-display=contrast] .contact-page-hero { gap: 45px; }
html[data-display=contrast] .footer-contact { grid-template-columns: 1fr; gap: 20px; }
html[data-display=contrast] .footer-contact-row { grid-template-columns: repeat(3,minmax(0,1fr)); align-items: end; }
html[data-display=contrast] .footer-contact-submit { grid-column: 1 / -1; justify-self: start; }
html[data-display=contrast] .footer-contact-field>span { position: static; width: auto; height: auto; margin: 0 0 8px; clip-path: none; overflow: visible; display: block; white-space: normal; }
html[data-display=contrast] .display-control select { width: 195px; }
@media (min-width: 1301px) { html[data-display=contrast] .header { flex-wrap: wrap; height: auto; min-height: 110px; padding-block: 20px; } html[data-display=contrast] .header .nav { order: 5; width: 100%; justify-content: center; flex-wrap: wrap; margin: 0; } }
@media (max-width: 900px) { html[data-display=contrast] :is(.contact-page-hero,.biologika-section,.collaboration-section) { grid-template-columns: 1fr; } }
@media (max-width: 650px) {
  html[data-display=contrast] .header { grid-template-columns: 1fr auto; }
  html[data-display=contrast] .display-control { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  html[data-display=contrast] .display-control select { width: 100%; }
  html[data-display=contrast] .language-switch { grid-row: 3; grid-column: 1 / -1; justify-self: start; }
  html[data-display=contrast] .hero-copy h1, html[data-display=contrast] .contact-page-copy h1 { font-size: clamp(34px,8.5vw,50px); }
  html[data-display=contrast] .footer-contact-row, html[data-display=contrast] .message-form-row { grid-template-columns: 1fr; }
  html[data-display=contrast] .contact-email-text { overflow-wrap: anywhere; }
  html[data-display=contrast] .orbit-scene { aspect-ratio: auto; display: grid; justify-items: center; gap: 12px; padding: 20px; border: 2px solid #fff; border-radius: 12px; }
  html[data-display=contrast] .orbit-drawing { display: none; }
  html[data-display=contrast] .orbit-core { position: static; transform: none; width: 120px; margin: 10px; }
  html[data-display=contrast] .orbit-label { position: static; font-size: 18px !important; white-space: normal; }
  html[data-display=contrast] .floating-note { position: relative; left: 0; bottom: auto; margin-top: 14px; }
  html[data-display=contrast] .hero-visual { height: auto; }
  html[data-display=contrast] .photo-frame { height: 410px; }
}

html[data-display=contrast] .biologika-principles h4 { font-size: 24px; line-height: 1.5; }

/* Touch screens, landscape menus and on-screen keyboards. */
.dialog-close { width: 44px; height: 44px; display: grid; place-items: center; }
.message-consent { min-height: 44px; }
input, textarea, select { scroll-margin-block: 24px; }
.footer-email, .contact-email-text { overflow-wrap: anywhere; }
@media (max-width: 1300px) {
  .header .nav { max-height: calc(100dvh - 130px); overflow-y: auto; overscroll-behavior: contain; }
}
@media (max-width: 650px) {
  body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
  .header .nav { max-height: calc(100dvh - 150px); }
  html[data-display=contrast] .header .nav { max-height: calc(100dvh - 220px); }
}
@media (max-height: 600px) {
  dialog { max-height: calc(100dvh - 24px); }
}