/* =========================================================
   Op. Dr. Dilarə Həsənova — site styles
   Concept: the examination sheet ("müayinə vərəqi") — ruled rows, field labels, checked practice items.
   Palette: warm neutrals, surgical green and burgundy; the logo's orange→red only as thin accents.
   ========================================================= */

:root {
  --paper: #F6F4EF;
  --sheet: #FFFFFF;
  --stone: #EEEAE3;
  --stone-2: #E4DED4;
  --line: #E0DAD0;
  --line-2: #CCC4B7;
  --ink: #1D1B19;
  --ink-2: #3A3632;
  --ink-3: #66605A;
  --wine: #8A1D2C;
  --wine-2: #6B1421;
  --wine-tint: #F6EBEB;
  --wine-line: #E8CDD0;
  --green: #1E5B52;
  --green-2: #15453E;
  --green-tint: #E7F0ED;
  --green-line: #C7DBD5;
  --ember: #E0472E;
  --amber: #EFA03A;
  --grad: linear-gradient(90deg, #EFA03A, #E0472E);
  --grad-y: linear-gradient(180deg, #EFA03A, #E0472E);
  --radius: 12px;
  --radius-sm: 8px;
  --shadow: 0 1px 2px rgba(29, 27, 25, .05), 0 10px 30px rgba(29, 27, 25, .07);
  --font: "Fira Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --header-h: 88px;
  --gutter: 24px;
  --container: 1240px;
  color-scheme: light;
}

/* ---------------------------------------------------------------- base */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
dialog:not([open]) { display: none !important; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
body {
  margin: 0;
  font: 400 1rem/1.65 var(--font);
  color: var(--ink-2);
  background: var(--paper);
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg { max-width: 100%; }
img { height: auto; }
a { color: var(--wine); }
a:hover { color: var(--wine-2); }
button { font: inherit; }
h1, h2, h3, h4 { color: var(--ink); font-weight: 600; line-height: 1.2; letter-spacing: -.01em; margin: 0 0 .5em; text-wrap: balance; }
h2 { font-size: clamp(1.4rem, 1.15rem + .8vw, 1.85rem); }
h3 { font-size: 1.1rem; }
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; border-radius: 6px; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 300; padding: 10px 16px; border-radius: 8px; background: var(--ink); color: #fff; text-decoration: none; }
.skip:focus { top: 12px; color: #fff; }
.container { width: min(100% - 2 * var(--gutter), var(--container)); margin-inline: auto; }
.main { display: block; }
.main:focus { outline: none; }
.i { width: 22px; height: 22px; flex: none; }
.i--sm { width: 16px; height: 16px; }

/* ---------------------------------------------------------------- buttons & links */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 0 18px; border: 1px solid transparent; border-radius: 10px;
  font-weight: 500; font-size: .95rem; line-height: 1.2; text-decoration: none; cursor: pointer;
  transition: background-color .2s, border-color .2s, color .2s, transform .2s;
}
.btn .i { width: 20px; height: 20px; }
.btn--cta { background: var(--wine); color: #fff; white-space: nowrap; }
.btn--cta:hover { background: var(--wine-2); color: #fff; }
.btn--line { background: #fff; border-color: var(--line-2); color: var(--ink); }
.btn--line:hover { border-color: var(--green); color: var(--green); }
.btn--wa { background: var(--green); color: #fff; }
.btn--wa:hover { background: var(--green-2); color: #fff; }
.btn--text { background: transparent; color: var(--ink-2); padding: 0 8px; }
.btn--text:hover { color: var(--wine); }
.btn--sm { min-height: 38px; padding: 0 14px; font-size: .88rem; }
.link-arrow { display: inline; font-weight: 500; color: var(--wine); text-decoration: none; width: fit-content; }
.link-arrow > span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: var(--wine-line); }
.link-arrow .i { display: inline-block; vertical-align: -3px; margin-left: 6px; transition: translate .2s; }
.link-arrow:hover > span { text-decoration-color: currentColor; }
.link-arrow:hover .i { translate: 3px 0; }
.link-arrow--btn { border: 0; background: none; padding: 0; cursor: pointer; font: inherit; font-weight: 500; }
a.more { display: inline; font-weight: 500; text-decoration: none; }
a.more .i { display: inline-block; vertical-align: -3px; margin-left: 4px; transition: translate .2s; }
a.more:hover .i { translate: 3px 0; }
.more-row { margin-top: .4em; }

/* ---------------------------------------------------------------- kicker & badges (icons instead of decorative lines) */
.kicker { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: .84rem; font-weight: 500; color: var(--green); letter-spacing: .01em; }
.kicker > span:last-child { min-width: 0; }
.badge { display: inline-grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--green-tint); color: var(--green); }
.badge .i { width: 19px; height: 19px; }
.badge--green { background: var(--green); color: #fff; }
.badge--wine { background: var(--wine); color: #fff; }

/* ---------------------------------------------------------------- header */
.site-header { position: sticky; top: 0; z-index: 100; background: #fff; border-bottom: 1px solid var(--line); transition: box-shadow .25s; }
.site-header.is-scrolled { box-shadow: 0 6px 24px rgba(29, 27, 25, .07); }
.header__row { display: flex; align-items: center; gap: 14px; height: var(--header-h); transition: height .25s; }
.brand { display: inline-flex; align-items: center; flex: none; text-decoration: none; }
.brand__logo { display: block; height: 66px; width: auto; transition: height .25s; }
.site-header.is-scrolled .header__row { height: 72px; }
.site-header.is-scrolled .brand__logo { height: 52px; }
.nav { position: relative; flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; }
.nav__list { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; white-space: nowrap; }
.nav__item { position: relative; display: flex; align-items: center; }
.nav__link { display: block; padding: .5rem .5rem; border-radius: 8px; font-size: .95rem; color: var(--ink); text-decoration: none; transition: color .2s, background-color .2s; }
.nav__link:hover { color: var(--wine); }
.nav__link.is-current { color: var(--wine); font-weight: 500; }
.nav__toggle { display: inline-grid; place-items: center; width: 22px; height: 30px; margin-left: -4px; padding: 0; border: 0; border-radius: 6px; background: none; color: var(--ink-3); cursor: pointer; }
.nav__toggle .i { width: 15px; height: 15px; transition: rotate .2s; }
.nav__item.is-open .nav__toggle .i { rotate: 180deg; }
.nav__panel { position: absolute; top: calc(100% - 14px); left: 50%; z-index: 20; padding-top: 24px; min-width: 300px; transform: translateX(-50%); visibility: hidden; opacity: 0; transition: opacity .18s, visibility .18s, translate .18s; translate: 0 6px; }
html:not(.js-menu) .nav__item:hover > .nav__panel,
.nav__item.is-open > .nav__panel { visibility: visible; opacity: 1; translate: 0 0; }
.panel-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); padding: 10px; }
.panel-list { margin: 0; padding: 0; list-style: none; }
.panel-list a { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 9px; color: var(--ink); font-size: .93rem; line-height: 1.3; text-decoration: none; white-space: normal; transition: background-color .15s, color .15s; }
.panel-list a .i { width: 20px; height: 20px; color: var(--green); }
.panel-list a:hover { background: var(--green-tint); color: var(--green-2); }
.panel-list a[aria-current="page"] { background: var(--wine-tint); color: var(--wine); }
/* the mega panel is centred under the whole menu bar (not under its item), so it never leaves the window;
   its transparent padding-top still bridges the strip between the item and the card */
.nav__item.has-mega { position: static; }
.nav__panel--mega { width: min(940px, calc(100vw - 48px)); }
.mega { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 16px; padding: 6px; }
.mega__title { margin: 6px 10px 6px; font: 500 .7rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); white-space: normal; }
.mega__foot { padding: 10px 16px 6px; border-top: 1px solid var(--line); margin-top: 6px; }
.header__actions { display: flex; align-items: center; gap: 6px; margin-left: auto; flex: none; }
.icon-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); text-decoration: none; cursor: pointer; transition: border-color .2s, color .2s; }
.icon-btn:hover { border-color: var(--green); color: var(--green); }
/* language menu: a flag button opens a small card of flags (no text; names are in aria-label/title) */
.lang { position: relative; flex: none; }
.lang__btn { width: 48px; grid-auto-flow: column; place-content: center; gap: 1px; }
.lang__chev { width: 11px; height: 11px; color: var(--ink-3); transition: rotate .2s; }
.lang.is-open .lang__chev { rotate: 180deg; }
.flag { display: block; flex: none; width: 24px; height: 24px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(29, 27, 25, .16); }
.lang__menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 30; display: none; gap: 2px; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); }
.lang__menu::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
.lang.is-open .lang__menu,
html.no-js .lang:is(:hover, :focus-within) .lang__menu { display: grid; }
.lang__menu a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 9px; transition: background-color .15s; }
.lang__menu a:hover { background: var(--green-tint); }
.lang__menu .flag { width: 26px; height: 26px; }
.lang__menu a[aria-current] .flag { outline: 2px solid var(--green); outline-offset: 2px; }
.burger { display: none; }
html.nav-collapse .nav { display: none; }
html.nav-collapse .burger { display: inline-grid; }
@media (max-width: 1279.98px) {
  .nav { display: none; }
  .burger { display: inline-grid; }
}

/* ---------------------------------------------------------------- page head */
.phead { background: #fff; border-bottom: 1px solid var(--line); padding: 22px 0 30px; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 2px 8px; margin: 0 0 18px; padding: 0; list-style: none; font: 400 .78rem/1.4 var(--mono); color: var(--ink-3); }
.crumbs li { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.crumbs li + li::before { content: "/"; color: var(--line-2); }
.crumbs a { color: var(--ink-3); text-decoration: none; }
.crumbs a:hover { color: var(--wine); }
.phead__title { font-size: clamp(1.9rem, 1.35rem + 1.7vw, 2.7rem); line-height: 1.12; max-width: 24ch; margin: 0 0 14px; }
.phead__lead { max-width: 68ch; font-size: 1.08rem; color: var(--ink-2); }
.phead__lead p { margin: 0 0 .8em; }
.phead__lead p:last-child { margin-bottom: 0; }
.record { display: flex; flex-wrap: wrap; margin: 22px 0 0; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.record__cell { flex: 1 1 210px; min-width: 0; padding: 10px 16px; border-left: 1px solid var(--line); }
.record__cell:first-child { border-left: 0; }
.record dt { font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 2px; }
.record dd { margin: 0; font-size: .95rem; color: var(--ink); }
.record dd a { color: var(--ink); text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.legend { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 16px 0 0; padding: 0; list-style: none; font-size: .85rem; color: var(--ink-3); }
.legend__item { display: inline-flex; align-items: flex-start; gap: 8px; min-width: 0; }
.legend__item .i { margin-top: 3px; }
.legend__item--practice .i { color: var(--green); }
.legend__item--general .i { color: var(--ink-3); }
.bylines { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-top: 16px; }
.byline { display: inline-flex; align-items: flex-start; gap: 8px; margin: 0; font-size: .88rem; color: var(--ink-3); }
.byline .i { margin-top: 3px; color: var(--green); }

/* ---------------------------------------------------------------- sections */
.section { padding: 64px 0; }
.section--stone { background: var(--stone); }
.section--wine { background: var(--wine-tint); }
.section--contact { background: #fff; border-top: 1px solid var(--line); }
.shead { margin-bottom: 26px; }
.shead h2 { margin: 0; }
.shead__lead { margin-top: 10px; max-width: 62ch; }
.shead--row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; }
.shead--row .kicker { margin: 0; }
.shead--row h2 { flex: 1 1 100%; }
.section__more { margin: 26px 0 0; }
.lead-p { font-size: 1.06rem; color: var(--ink-2); }
.split { display: grid; gap: 48px; align-items: start; }
.split--complaints { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
.split--faq, .split--contact { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.split--photo { grid-template-columns: 320px minmax(0, 1fr); gap: 56px; }
.split--page { padding: 40px 0 64px; grid-template-areas: "aside main" "aside tail"; row-gap: 0; }
.split--page .split__aside { grid-area: aside; }
.split--page .split__main { grid-area: main; }
.split--page .split__tail { grid-area: tail; min-width: 0; }
.split__main { min-width: 0; }
.split__main--doc { max-width: 820px; }
.split__lead > *:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------------- home: hero triptych */
.hero { background: #fff; border-bottom: 1px solid var(--line); padding: 30px 0 38px; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .78fr) minmax(0, .9fr); grid-template-areas: "text portrait sheet"; gap: 34px; align-items: center; }
.hero__text { grid-area: text; min-width: 0; }
.hero__portrait { grid-area: portrait; margin: 0; }
.hero__sheet { grid-area: sheet; min-width: 0; }
.hero__title { margin: 0 0 14px; }
.hero__name { display: block; font-size: clamp(2.15rem, 1.45rem + 2.3vw, 3.15rem); line-height: 1.05; letter-spacing: -.02em; }
.hero__role { display: block; margin-top: 8px; font-size: clamp(1.1rem, .98rem + .55vw, 1.42rem); font-weight: 400; line-height: 1.3; color: var(--wine); letter-spacing: 0; }
.hero__sub { margin: 0 0 16px; font: 400 .8rem/1.5 var(--mono); color: var(--ink-3); }
.hero__lead { margin: 0 0 20px; max-width: 48ch; font-size: 1.04rem; color: var(--ink-2); }
.hero__frame { position: relative; display: block; overflow: hidden; overflow: clip; border-radius: 14px; background: var(--stone); aspect-ratio: 760 / 1128; }
.hero__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.scan { position: absolute; inset: 0; pointer-events: none; }
.scan__line { position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--grad); box-shadow: 0 0 16px 3px rgba(239, 160, 58, .45); opacity: 0; }
.scan__c { position: absolute; width: 22px; height: 22px; border: 2px solid rgba(255, 255, 255, .9); opacity: 0; }
.scan__c--tl { top: 12px; left: 12px; border-right: 0; border-bottom: 0; border-top-left-radius: 6px; }
.scan__c--tr { top: 12px; right: 12px; border-left: 0; border-bottom: 0; border-top-right-radius: 6px; }
.scan__c--bl { bottom: 12px; left: 12px; border-right: 0; border-top: 0; border-bottom-left-radius: 6px; }
.scan__c--br { bottom: 12px; right: 12px; border-left: 0; border-top: 0; border-bottom-right-radius: 6px; }
.hero__sheet { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px 16px; }
.hero__sheet-title, .sheet__title { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font: 500 .7rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.hero__sheet-title .i, .sheet__title .i { color: var(--green); }
.hero__slogan { margin: 12px 0 0; font-style: italic; color: var(--wine); font-size: .98rem; }
.facts { margin: 0; }
.facts__row { position: relative; padding: 9px 0; }
.facts__row::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--line); transform-origin: left; }
.facts dt { font: 500 .66rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.facts dd { margin: 2px 0 0; font-size: .93rem; line-height: 1.45; color: var(--ink); }
.facts--plain .facts__row:first-child::before { display: none; }
.facts--compact dd { font-size: .9rem; }
.hero__contact { margin-top: 4px; }

/* ---------------------------------------------------------------- contact icons (icon only, labels in aria-label/title) */
.cicons { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.cicon { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line-2); border-radius: 12px; background: #fff; color: var(--ink); text-decoration: none; transition: border-color .2s, color .2s, translate .2s, background-color .2s; }
.cicon .i { width: 21px; height: 21px; }
.cicon:hover { border-color: var(--green); color: var(--green); translate: 0 -1px; }
.cicons--hero .cicon { width: 50px; height: 50px; }
.cicons--hero .cicon--phone { background: var(--green); border-color: var(--green); color: #fff; }
.cicons--hero .cicon--phone:hover { background: var(--green-2); color: #fff; }
.cicons--lg .cicon { width: 52px; height: 52px; border-radius: 14px; }
.cicons--lg .cicon .i { width: 24px; height: 24px; }
.contact-row { margin-top: 14px; }
.contact-row--big { margin: 18px 0; }
.split--contact .contact-row { margin-bottom: 16px; }

/* ---------------------------------------------------------------- home: complaints index */
.symptoms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; margin: 0; padding: 0; list-style: none; }
.symptoms__item { min-width: 0; }
.symptoms__a { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 15px 6px 15px 4px; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; transition: background-color .2s; height: 100%; }
.symptoms__a:hover { background: rgba(255, 255, 255, .55); color: var(--ink); }
.symptoms__t { font-size: .98rem; line-height: 1.45; }
.symptoms__to { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--green); }
.symptoms__a:hover .symptoms__to { color: var(--wine); }

/* ---------------------------------------------------------------- index lists (hubs, services) */
.ilist { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 40px; margin: 0; padding: 0; list-style: none; }
.ilist--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ilist__item { min-width: 0; }
.ilist__a { display: grid; grid-template-columns: 42px minmax(0, 1fr) 20px; gap: 14px; align-items: start; padding: 16px 6px 16px 2px; border-top: 1px solid var(--line-2); color: var(--ink-2); text-decoration: none; height: 100%; transition: background-color .2s; }
.section--stone .ilist__a { border-top-color: var(--line-2); }
.ilist__a:hover { background: rgba(255, 255, 255, .6); color: var(--ink-2); }
.ilist__ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: #fff; border: 1px solid var(--line); color: var(--green); }
.ilist__ic .i { width: 21px; height: 21px; }
.ilist__body { min-width: 0; display: grid; gap: 3px; padding-top: 1px; }
.ilist__t { font-weight: 600; font-size: 1.02rem; color: var(--ink); line-height: 1.35; }
.ilist__x { font-size: .9rem; line-height: 1.5; color: var(--ink-3); }
.ilist__arr { width: 18px; height: 18px; margin-top: 12px; color: var(--line-2); transition: color .2s, translate .2s; }
.ilist__a:hover .ilist__arr { color: var(--wine); translate: 3px 0; }
.ilist__a:hover .ilist__t { color: var(--wine); }

/* ---------------------------------------------------------------- home: principles pathway */
.path { position: relative; margin: 0; padding: 0; list-style: none; }
.path::before, .path::after { content: ""; position: absolute; left: 23px; top: 28px; bottom: 28px; width: 2px; border-radius: 2px; }
.path::before { background: var(--line); }
.path::after { background: var(--grad-y); transform-origin: top; }
.path__step { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 18px; padding: 0 0 22px; }
.path__step:last-child { padding-bottom: 0; }
.path__node { position: relative; z-index: 1; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #fff; border: 2px solid var(--green-line); color: var(--green); transition: background-color .4s, border-color .4s; }
.path__node .i { width: 21px; height: 21px; }
.path__step.is-in .path__node { border-color: var(--green); }
.path__body { min-width: 0; padding-top: 4px; }
.path__t { margin: 0 0 4px; font-size: 1.05rem; }
.path__body p { margin: 0; font-size: .96rem; }

/* ---------------------------------------------------------------- home: instruments */
.instruments { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.instrument { position: relative; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 22px 20px 82px; min-width: 0; }
.instrument__ic { position: absolute; left: 22px; top: 22px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--wine-tint); color: var(--wine); }
.instrument__t { margin: 2px 0 6px; font-size: 1.12rem; }
.instrument p { margin: 0 0 10px; font-size: .96rem; }
.instrument__more { margin: 0; }

/* ---------------------------------------------------------------- tiles, quote */
.tiles { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.tile { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; color: var(--ink); font-size: .92rem; line-height: 1.3; text-decoration: none; transition: border-color .2s, color .2s; }
.tile .i { width: 19px; height: 19px; color: var(--green); }
.tile:hover { border-color: var(--green); color: var(--green-2); }
.quote { margin: 26px 0 0; }
.quote blockquote { margin: 0; }
.quote blockquote p { margin: 0; font-size: clamp(1.15rem, 1rem + .5vw, 1.4rem); font-weight: 500; line-height: 1.35; color: var(--ink); }
.quote figcaption { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; font-size: .86rem; color: var(--ink-3); }
.quote figcaption .i { color: var(--wine); }

/* ---------------------------------------------------------------- photos (whole, plain rounded frame) */
.ph { margin: 0; min-width: 0; }
.ph__frame { display: block; overflow: hidden; overflow: clip; border-radius: 14px; background: var(--stone); }
.ph__img { display: block; width: 100%; height: auto; }
.ph__cap { margin-top: 10px; font-size: .84rem; color: var(--ink-3); }
.ph--sticky { position: sticky; top: calc(var(--header-h) + 18px); }
.ph--aside { margin-top: 26px; }
.ph--inline { max-width: 300px; margin: 6px 0 4px; }

/* ---------------------------------------------------------------- map */
.mapcard { margin: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #fff; }
.mapcard__frame { position: relative; aspect-ratio: 16 / 10; background: var(--stone); }
.mapcard--tall .mapcard__frame { aspect-ratio: 4 / 3.4; }
.mapcard__art, .mapcard__art svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ma-bg { fill: #EFEBE4; }
.ma-road { fill: none; stroke: #fff; stroke-width: 16; }
.ma-lane { fill: none; stroke: #E2DCD2; stroke-width: 6; }
.ma-ring { fill: rgba(138, 29, 44, .08); stroke: rgba(138, 29, 44, .25); stroke-width: 1.5; }
.ma-pin { fill: var(--wine); }
.ma-dot { fill: #fff; }
.mapcard__gate { position: absolute; left: 50%; bottom: 18px; translate: -50% 0; width: min(92%, 420px); display: grid; justify-items: center; gap: 10px; padding: 14px 16px; border-radius: 12px; background: rgba(255, 255, 255, .95); box-shadow: var(--shadow); text-align: center; }
.mapcard__gate-text { margin: 0; font-size: .84rem; color: var(--ink-3); }
.mapcard.is-loaded .mapcard__gate, .mapcard.is-loaded .mapcard__art { display: none; }
.mapcard__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.mapcard__cap { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-top: 1px solid var(--line); font-size: .9rem; }
.mapcard__addr { display: inline-flex; align-items: flex-start; gap: 8px; min-width: 0; color: var(--ink-2); }
.mapcard__addr .i { margin-top: 4px; color: var(--wine); }
.mapcard__ext { display: inline-grid; place-items: center; flex: none; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink-2); }
.mapcard__ext:hover { border-color: var(--green); color: var(--green); }

/* ---------------------------------------------------------------- articles list */
.alist { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; padding: 0; list-style: none; }
.alist--home { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 28px; }
.alist__a { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 18px 6px 18px 2px; border-top: 1px solid var(--line-2); color: var(--ink-2); text-decoration: none; height: 100%; }
.alist__a:hover { background: rgba(255, 255, 255, .5); color: var(--ink-2); }
.alist__t { font-weight: 600; font-size: 1.05rem; line-height: 1.35; color: var(--ink); }
.alist__a:hover .alist__t { color: var(--wine); }
.alist__x { font-size: .9rem; line-height: 1.5; color: var(--ink-3); }
.alist__meta { display: inline-flex; align-items: center; gap: 6px; font: 400 .74rem/1.4 var(--mono); color: var(--ink-3); }

/* ---------------------------------------------------------------- document layout */
.doc { display: grid; grid-template-columns: 250px minmax(0, 1fr); grid-template-areas: "aside main"; gap: 56px; padding: 40px 0 72px; align-items: start; }
.doc--single { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main"; }
.doc__aside { grid-area: aside; position: sticky; top: calc(var(--header-h) + 18px); min-width: 0; }
.doc__main { grid-area: main; min-width: 0; max-width: 820px; }
.toc__box { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; padding: 12px 14px; }
.toc__title { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; font: 500 .7rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.toc__title::-webkit-details-marker { display: none; }
.toc__title .i { color: var(--green); }
.toc__chev { margin-left: auto; transition: rotate .2s; }
.toc__box[open] .toc__chev { rotate: 180deg; }
.toc ol { margin: 10px 0 2px; padding: 0; list-style: none; }
.toc li { margin: 0; }
.toc a { position: relative; display: block; padding: 5px 0 5px 14px; font-size: .88rem; line-height: 1.35; color: var(--ink-3); text-decoration: none; }
.toc a::before { content: ""; position: absolute; left: 0; top: .82em; width: 5px; height: 5px; border-radius: 50%; background: var(--line-2); transition: background-color .2s; }
.toc a:hover { color: var(--wine); }
.toc a.is-active { color: var(--ink); font-weight: 500; }
.toc a.is-active::before { background: var(--wine); }

/* ---------------------------------------------------------------- medical sections */
.sec { margin: 0 0 44px; }
.sec h2 { display: flex; align-items: baseline; gap: 12px; font-size: clamp(1.3rem, 1.15rem + .5vw, 1.6rem); margin-bottom: 14px; }
.sec h2 > span:last-child { min-width: 0; }
.sec--intro { font-size: 1.04rem; }
.gen-tag { display: inline-flex; align-items: center; gap: 6px; margin: -4px 0 14px; padding: 3px 9px; border-radius: 6px; background: var(--stone); font: 500 .68rem/1.5 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.prose > *:last-child { margin-bottom: 0; }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li { margin: .35em 0; }
.prose li::marker { color: var(--wine); }
.prose ol li::marker { font-family: var(--mono); font-size: .86em; }
/* kept at (0,1,1) so that components inside prose (call buttons) can override it with two classes */
.prose a { color: var(--wine); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--wine-line); }
.prose a:hover { text-decoration-color: currentColor; }
.prose a.more, .prose a.btn { text-decoration: none; }
.prose strong { color: var(--ink); font-weight: 600; }
.prose h3 { margin: 1.2em 0 .4em; }
.prose .label { margin: 1.2em 0 .5em; font-weight: 600; color: var(--ink); }
.answer { margin: 0 0 1.2em; padding: 14px 18px 16px; border-radius: var(--radius); background: var(--green-tint); }
.answer__label { display: flex; align-items: center; gap: 7px; margin: 0 0 4px; font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--green); }
.answer .answer-block { margin: 0; font-size: 1.05rem; color: var(--ink); }
.callout { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 12px; align-items: start; margin: 0 0 1.1em; padding: 14px 16px; border-radius: var(--radius); background: var(--stone); }
.callout > .i { margin-top: 3px; color: var(--green); }
.callout p { margin: 0; }
.callout--urgent { background: var(--wine-tint); }
.callout--urgent > .i, .callout--warn > .i { color: var(--wine); }
.callout--warn { background: #FBF0E4; }
.callout .callout__call { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: var(--wine); color: #fff; text-decoration: none; }
.callout .callout__call:hover { background: var(--wine-2); color: #fff; }
.pnote { margin: 0 0 1em; padding: 12px 16px; border-radius: var(--radius); background: var(--green-tint); }
.pnote p { margin: 0; }
.pnote__label { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 4px !important; font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--green); }
.practice { margin: 0; padding: 20px 22px; border: 1px solid var(--green-line); border-radius: 14px; background: #fff; }
.practice__head { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.practice__head h2, .practice__name { margin: 0; font-size: 1.22rem; font-weight: 600; color: var(--ink); display: block; }
.practice__sub { margin: 2px 0 0; font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--green); }
.checks { margin: 0; padding: 0; list-style: none; }
.checks li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; padding: 9px 0; border-top: 1px dashed var(--green-line); }
.checks li:first-child { border-top: 0; }
.checks__i { width: 20px; height: 20px; margin-top: 2px; color: var(--green); }
.when { padding: 20px 22px; border-radius: 14px; background: var(--wine-tint); }
.when h2 { align-items: center; font-size: 1.2rem; }
.when .prose li::marker { color: var(--wine); }
.urgent { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 20px 22px; border: 1px solid var(--wine-line); border-radius: 14px; background: var(--wine-tint); }
.urgent h2 { font-size: 1.2rem; }
.urgent__call { display: inline-grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: var(--wine); color: #fff; }
.urgent__call .i { width: 26px; height: 26px; }
.urgent__call:hover { background: var(--wine-2); color: #fff; }
.sec--faq h2 { align-items: center; }
.qa-list { border-top: 1px solid var(--line-2); }
.qa { border-bottom: 1px solid var(--line-2); }
.qa summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 4px; cursor: pointer; list-style: none; font-weight: 500; color: var(--ink); line-height: 1.4; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary:hover .qa__q { color: var(--wine); }
.qa__chev { flex: none; width: 18px; height: 18px; color: var(--ink-3); transition: rotate .25s; }
.qa[open] .qa__chev { rotate: 180deg; color: var(--wine); }
.qa__a { padding: 0 4px 16px; color: var(--ink-2); }
.qa__a p:last-child { margin-bottom: 0; }
.sources { margin: 32px 0 0; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; font-size: .84rem; color: var(--ink-3); }
.sources__title { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.sources__lead { margin: 0 0 6px; }
.sources ul { margin: 0; padding-left: 1.1em; }
.sources li { margin: .3em 0; }
.related { margin: 32px 0 0; }
.related__title { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font: 500 .7rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.related ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; margin: 0; padding: 0; list-style: none; }
.related a { display: grid; grid-template-columns: 36px minmax(0, 1fr) 18px; gap: 12px; align-items: center; padding: 12px 2px; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: .94rem; line-height: 1.35; }
.related a:hover { color: var(--wine); }
.related__ic { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--green-tint); color: var(--green); }
.related__ic .i { width: 19px; height: 19px; }
.related a > .i { color: var(--line-2); transition: color .2s, translate .2s; }
.related a:hover > .i { color: var(--wine); translate: 3px 0; }

/* tables */
.table-wrap { margin: 0 0 1.2em; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.tbl { width: 100%; border-collapse: collapse; font-size: .94rem; line-height: 1.5; }
.tbl th, .tbl td { padding: 11px 14px; text-align: left; vertical-align: top; border-top: 1px solid var(--line); }
.tbl thead th, .tbl thead td { border-top: 0; background: var(--paper); font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.tbl tbody th { font-weight: 600; color: var(--ink); }
.tbl strong { font-weight: 600; }

/* steps (examination stages) */
.sec--steps .prose ol { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 6px 0 0; padding: 0; list-style: none; counter-reset: step; }
.sec--steps .prose ol::before { content: ""; position: absolute; left: 18px; right: 18px; top: 18px; height: 2px; background: var(--line-2); }
.sec--steps .prose li { position: relative; margin: 0; padding-top: 50px; font-size: .9rem; line-height: 1.5; counter-increment: step; }
.sec--steps .prose li::before { content: counter(step); position: absolute; left: 0; top: 0; z-index: 1; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #fff; border: 2px solid var(--green); color: var(--green); font: 500 .85rem/1 var(--mono); }
.sec--steps .prose li strong { display: block; margin-bottom: 2px; }

/* ---------------------------------------------------------------- plates (schematic figures) */
.plate { margin: 8px 0 30px; padding: 18px 20px 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.plate__title { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--green); }
.plate__cap { margin-top: 14px; font-size: .86rem; color: var(--ink-3); }
.plate__body--split { display: grid; grid-template-columns: minmax(0, 250px) minmax(0, 1fr); gap: 22px; align-items: center; }
.plate__legend { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; font-size: .92rem; }
.lg { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 10px; align-items: start; }
.lg__sw { display: block; width: 26px; height: 8px; margin-top: 8px; border-radius: 4px; }
.lg--wine .lg__sw { background: var(--wine); }
.lg--green .lg__sw { background: var(--green); }
.reach { display: block; width: 100%; height: auto; }
.reach__base { fill: none; stroke: var(--stone-2); stroke-width: 20; stroke-linecap: round; stroke-linejoin: round; }
.reach__colo { fill: none; stroke: var(--green); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; }
.reach__vps { fill: none; stroke: var(--wine); stroke-width: 12; stroke-linecap: round; stroke-dasharray: 1; }
.reach__tip { fill: var(--wine); }
.reach__start { fill: var(--green); }
.cycle-wrap { position: relative; max-width: 440px; margin: 0 auto; }
.cycle { display: block; width: 100%; height: auto; }
.cycle__arc { fill: none; stroke: var(--wine); stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 1; }
.cycle__arc--cut { stroke: var(--line-2); }
.cycle__head { fill: none; stroke: var(--wine); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.cycle__cut { fill: none; stroke: var(--green); stroke-width: 4; stroke-linecap: round; }
.cycle__nodes { margin: 0; padding: 0; list-style: none; }
.cycle__node { position: absolute; display: grid; gap: 1px; width: min(44%, 170px); padding: 7px 10px; border: 1px solid var(--wine-line); border-radius: 10px; background: #fff; text-align: center; translate: -50% -50%; }
.cycle__node strong { font-size: .92rem; color: var(--ink); }
.cycle__node span { font-size: .74rem; line-height: 1.35; color: var(--ink-3); }
.cycle__node--1 { left: 50%; top: 12%; }
.cycle__node--2 { left: 76%; top: 82%; }
.cycle__node--3 { left: 24%; top: 82%; }
.grades { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.grade { min-width: 0; text-align: center; }
.grade svg { display: block; width: 100%; max-width: 116px; height: auto; margin: 0 auto; overflow: visible; }
.grade__wall { fill: none; stroke: var(--line-2); stroke-width: 3; stroke-linecap: round; }
.grade__edge { fill: none; stroke: var(--ink-3); stroke-width: 2; stroke-dasharray: 4 4; }
.grade__node { fill: var(--wine-tint); stroke: var(--wine); stroke-width: 2.5; }
.grade__arrow { fill: none; stroke: var(--green); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.grade__n { margin: 8px 0 2px; font: 500 .78rem/1.4 var(--mono); color: var(--wine); }
.grade__t { margin: 0; font-size: .84rem; line-height: 1.4; color: var(--ink-2); }
.levels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: end; margin: 0; padding: 0; list-style: none; }
.level { display: flex; flex-direction: column; gap: 5px; padding: 16px; border-radius: 12px; background: var(--green-tint); color: var(--ink-2); min-width: 0; }
.level--1 { min-height: 150px; }
.level--2 { min-height: 182px; background: #D8E7E2; }
.level--3 { min-height: 214px; background: var(--green); color: #fff; }
.level__ic { color: var(--green); }
.level--3 .level__ic { color: #fff; }
.level__n { font: 500 .66rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; opacity: .85; }
.level__t { font-size: 1rem; color: inherit; }
.level--1 .level__t, .level--2 .level__t { color: var(--ink); }
.level__x { font-size: .86rem; line-height: 1.45; }
.axis { display: grid; justify-items: center; }
.axis__node { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 8px 18px; border-radius: 999px; background: var(--green); color: #fff; font-weight: 500; }
.axis__node--bottom { background: var(--wine); }
.axis__ch { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; max-width: 660px; margin: 0; padding: 0; list-style: none; }
.axis__line { display: grid; justify-items: center; align-content: start; gap: 8px; padding: 0 6px; min-width: 0; }
.axis__track { position: relative; display: block; width: 2px; height: 86px; border-radius: 2px; background: var(--line-2); overflow: visible; }
.axis__pulse { position: absolute; left: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--amber); opacity: 0; }
.axis__pulse--up { bottom: 0; }
.axis__pulse--down { top: 0; background: var(--ember); }
.axis__label { font-size: .8rem; line-height: 1.35; text-align: center; color: var(--ink-2); }
.scr__axis { position: relative; height: 14px; margin: 34px 0 8px; border-radius: 7px; background: var(--stone-2); }
.scr__band { position: absolute; left: 0; top: 0; bottom: 0; width: 41.667%; border-radius: 7px 0 0 7px; background: var(--wine-line); transform-origin: left; }
.scr__mark { position: absolute; left: 41.667%; top: 50%; translate: -50% -50%; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--green); color: #fff; box-shadow: 0 0 0 4px #fff; }
.scr__mark b { font: 500 .8rem/1 var(--mono); }
.scr__ticks { display: flex; justify-content: space-between; margin: 0 0 16px; padding: 0; list-style: none; font: 400 .72rem/1.4 var(--mono); color: var(--ink-3); }
.scr__notes { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; font-size: .92rem; }
.scr__note { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; }
.scr__note .i { margin-top: 4px; }
.scr__note--avg .i { color: var(--green); }
.scr__note--high .i { color: var(--wine); }
.plate--recovery .plate__body { position: relative; }
.rec__track { position: absolute; left: 18px; right: 18px; top: 18px; height: 2px; border-radius: 2px; background: var(--grad); transform-origin: left; }
.rec { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 14px; margin: 0; padding: 0; list-style: none; }
.rec__pt { display: grid; justify-items: start; align-content: start; gap: 6px; min-width: 0; }
.rec__dot { position: relative; z-index: 1; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #fff; border: 2px solid var(--green); color: var(--green); }
.rec__pt strong { font-size: .92rem; color: var(--ink); }
.rec__pt span:last-child { font-size: .84rem; line-height: 1.45; color: var(--ink-3); }

/* ---------------------------------------------------------------- video (original YouTube covers; nothing drawn over them) */
.video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin: 6px 0 10px; }
.video-grid--1 { grid-template-columns: minmax(0, 640px); margin: 8px 0 26px; }
.video { margin: 0; min-width: 0; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; }
.video__media { position: relative; aspect-ratio: 16 / 9; background: #111; }
.video__cover { display: block; width: 100%; height: 100%; object-fit: cover; }
.video__media iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video__meta { display: grid; gap: 6px; padding: 14px 16px 16px; }
.video__chan { display: inline-flex; align-items: center; gap: 7px; font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--green); }
.video__title { margin: 0; font-size: 1.04rem; font-weight: 600; line-height: 1.35; color: var(--ink); }
.video__info { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .84rem; color: var(--ink-3); }
.video__actions { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.video__play { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 9px; background: #fff; color: var(--ink); font-size: .9rem; cursor: pointer; transition: border-color .2s, color .2s; }
.video__play .i { width: 18px; height: 18px; color: var(--wine); }
.video__play:hover { border-color: var(--wine); color: var(--wine); }
.video__ext { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--line-2); border-radius: 9px; color: var(--ink-2); }
.video__ext:hover { border-color: var(--green); color: var(--green); }
.video__consent { font-size: .74rem; color: var(--ink-3); }
.video.is-playing .video__play { display: none; }

/* ---------------------------------------------------------------- profile (about) */
.profile { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 56px; padding: 40px 0 72px; align-items: start; }
.profile__aside { min-width: 0; }
.profile__main { min-width: 0; max-width: 780px; }
.psec { margin: 0 0 36px; }
.psec h2 { display: flex; align-items: center; gap: 12px; font-size: clamp(1.25rem, 1.12rem + .45vw, 1.5rem); margin-bottom: 12px; }
.sheet { margin-top: 16px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.sheet h2 { display: flex; align-items: center; gap: 12px; font-size: 1.2rem; }
@media (min-width: 1024px) and (min-height: 860px) {
  .profile__stick { position: sticky; top: calc(var(--header-h) + 18px); }
}

/* ---------------------------------------------------------------- career timeline */
.career { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 48px; padding: 40px 0 72px; align-items: start; }
.career__nav { position: sticky; top: calc(var(--header-h) + 18px); }
.career__nav ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.career__nav a { display: block; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font: 500 .82rem/1.4 var(--mono); color: var(--ink-2); text-decoration: none; }
.career__nav a:hover, .career__nav a.is-active { border-color: var(--wine-line); color: var(--wine); }
.career__main { min-width: 0; max-width: 820px; }
.period { margin: 0 0 36px; }
.period__title { font: 500 1rem/1.4 var(--mono); color: var(--wine); margin: 0 0 8px; }
.timeline { position: relative; margin: 0; padding: 0; list-style: none; }
.timeline::before { content: ""; position: absolute; left: 157px; top: 10px; bottom: 10px; width: 2px; background: var(--line); }
.timeline::after { content: ""; position: absolute; left: 157px; top: 10px; bottom: 10px; width: 2px; background: var(--grad-y); transform-origin: top; }
.timeline__item { position: relative; display: grid; grid-template-columns: 140px 36px minmax(0, 1fr); align-items: start; padding: 10px 0; }
.timeline__year { font: 500 .82rem/1.6 var(--mono); color: var(--ink); text-align: right; }
.timeline__dot { position: relative; z-index: 1; justify-self: center; width: 12px; height: 12px; margin-top: 6px; border-radius: 50%; background: #fff; border: 2px solid var(--green); }
.timeline__text { margin: 0; font-size: .97rem; color: var(--ink-2); }

/* ---------------------------------------------------------------- science, media */
.science, .media { padding: 36px 0 72px; }
.block { margin: 0 0 40px; }
.block__title { display: flex; align-items: center; gap: 12px; font-size: 1.3rem; }
.log { margin: 0; padding: 0; list-style: none; }
.log__row { display: grid; grid-template-columns: 70px minmax(0, 190px) minmax(0, 1fr) 130px; gap: 16px; align-items: start; padding: 14px 4px; border-top: 1px solid var(--line-2); }
.log__year { font: 500 .9rem/1.5 var(--mono); color: var(--wine); }
.log__place { display: inline-flex; align-items: flex-start; gap: 6px; font-size: .9rem; color: var(--ink-3); min-width: 0; }
.log__place .i { margin-top: 4px; color: var(--green); }
.log__event { font-size: .96rem; color: var(--ink); min-width: 0; }
.log__role { font: 400 .76rem/1.7 var(--mono); color: var(--ink-3); }
.science__grid, .media__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin: 0 0 40px; align-items: start; }
.science__grid .block, .media__grid .block { margin: 0; }
.principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.principles__item { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: center; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: #fff; font-size: .94rem; color: var(--ink); }
.principles__ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--green-tint); color: var(--green); }
.mlog { margin: 0; padding: 0; list-style: none; }
.mlog__row { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 14px; padding: 14px 2px; border-top: 1px solid var(--line-2); }
.mlog__year { font: 500 .82rem/1.6 var(--mono); color: var(--wine); }
.mlog__body { display: grid; gap: 3px; min-width: 0; font-size: .94rem; }
.mlog__body strong { color: var(--ink); font-weight: 600; }
.mlog__note { font-size: .84rem; color: var(--ink-3); }

/* ---------------------------------------------------------------- gallery + lightbox */
.gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; align-items: start; margin: 36px 0 72px; padding: 0; list-style: none; }
.gallery__item { min-width: 0; margin: 0; }
@media (max-width: 1023.98px) { .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 479.98px) { .gallery { grid-template-columns: minmax(0, 1fr); } }
.gallery__a { position: relative; display: block; border-radius: 14px; }
.gallery__img { display: block; width: 100%; height: auto; transition: scale .5s ease; }
.gallery__a:hover .gallery__img { scale: 1.02; }
.gallery__zoom { position: absolute; right: 10px; bottom: 10px; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--ink); }
.gallery__cap { margin: 10px 0 0; font-size: .86rem; color: var(--ink-3); }
/* two classes: the generic .dlg rule further down would reset width and padding */
.dlg.dlg--lightbox { width: min(760px, calc(100vw - 24px)); padding: 62px 12px 12px; background: #fff; }
.lightbox { margin: 0; }
.lightbox__img { display: block; max-width: 100%; max-height: calc(100dvh - 220px); width: auto; height: auto; margin: 0 auto; border-radius: 10px; }
.lightbox__cap { margin-top: 10px; font-size: .9rem; color: var(--ink-3); text-align: center; }
.lightbox__nav { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 10px; }
.lightbox__count { min-width: 56px; font: 500 .8rem/1 var(--mono); color: var(--ink-3); text-align: center; }
.lightbox__prev .i { rotate: 90deg; }
.lightbox__next .i { rotate: -90deg; }
.dlg__x { position: absolute; right: 12px; top: 12px; z-index: 2; }

/* ---------------------------------------------------------------- hubs */
.hub { padding: 34px 0 72px; }
.hub__group { margin: 0 0 46px; }
.hub__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin-bottom: 10px; }
.hub__head h2 { margin: 0; font-size: clamp(1.25rem, 1.1rem + .5vw, 1.55rem); }
.hub__note { display: inline-flex; align-items: center; gap: 6px; margin: 0; font: 500 .7rem/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--green); }
.hub__links { display: grid; gap: 4px; }
.hub__links .tiles { margin: 6px 0 0; }
.hub__callout { max-width: 860px; }
.dx { padding: 34px 0 72px; max-width: 1000px; }
.dx__own { margin-bottom: 30px; }
.dx__col h2 { display: flex; align-items: center; gap: 12px; font-size: 1.3rem; }
.dxlist { margin: 0; padding: 0; list-style: none; }
.dxlist__row { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr) minmax(0, 1fr); gap: 16px; padding: 14px 0; border-top: 1px dashed var(--green-line); font-size: .94rem; }
.dx__col .dxlist__row { border-top: 1px solid var(--line); }
.dxlist--2 .dxlist__row { grid-template-columns: minmax(0, 220px) minmax(0, 1fr); }
.dxlist__name { display: inline-flex; align-items: flex-start; gap: 10px; font-weight: 600; color: var(--ink); }
.dxlist__name a { color: var(--ink); text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.dxlist__name a:hover { color: var(--wine); }
.dxlist__lab { display: block; font: 500 .64rem/1.5 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.methods { display: grid; gap: 8px; margin: 0 0 1em; padding: 0; list-style: none; }
.methods__item { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 11px 14px; border-radius: 10px; background: var(--stone); color: var(--ink); }
.methods__item .i { color: var(--ink-3); }
.methods__item.is-practice { background: var(--green-tint); }
.methods__item.is-practice .i { color: var(--green); }
.methods__k { font: 500 .64rem/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.methods__item.is-practice .methods__k { color: var(--green); }
.opsheet { margin: 0; }
.opsheet__row { display: grid; grid-template-columns: minmax(0, 170px) minmax(0, 1fr); gap: 14px; padding: 10px 0; border-top: 1px dashed var(--green-line); font-size: .95rem; }
.opsheet dt { font-weight: 600; color: var(--ink); }
.opsheet dd { margin: 0; }
.sec .practice { margin-bottom: 1.1em; }

/* ---------------------------------------------------------------- insurance, faq, booking, contact */
.ins { padding: 30px 0 72px; }
.ins > .prose { max-width: 760px; margin-bottom: 28px; }
.insurers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.insurers__item { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 12px; background: #fff; font-weight: 500; color: var(--ink); }
.insurers__item .i { color: var(--green); }
.insurers__item--more { border-style: dashed; background: transparent; font-weight: 400; color: var(--ink-3); }
.stepper { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.stepper::before { content: ""; position: absolute; left: 19px; right: 19px; top: 19px; height: 2px; background: var(--line-2); }
.stepper::after { content: ""; position: absolute; left: 19px; right: 19px; top: 19px; height: 2px; background: var(--grad); transform-origin: left; }
.stepper__step { position: relative; padding-top: 52px; min-width: 0; }
.stepper__step p { margin: 0; font-size: .95rem; }
.stepper__n { position: absolute; left: 0; top: 0; z-index: 1; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--green); color: #fff; font: 500 .9rem/1 var(--mono); }
.faqpage { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 52px; padding: 36px 0 72px; align-items: start; }
.faq-nav { position: sticky; top: calc(var(--header-h) + 18px); padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.faq-nav__title { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font: 500 .7rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.faq-nav ul { margin: 0; padding: 0; list-style: none; }
.faq-nav a { display: flex; align-items: center; gap: 9px; padding: 8px 6px; border-radius: 8px; font-size: .9rem; color: var(--ink-2); text-decoration: none; }
.faq-nav a .i { color: var(--green); }
.faq-nav a:hover, .faq-nav a.is-active { background: var(--wine-tint); color: var(--wine); }
.faqpage__main { min-width: 0; max-width: 820px; }
.faqgroup { margin: 0 0 40px; }
.faqgroup h2 { display: flex; align-items: center; gap: 12px; font-size: clamp(1.2rem, 1.1rem + .4vw, 1.45rem); }
.booking { display: grid; grid-template-columns: 290px minmax(0, 1fr); grid-template-areas: "aside main"; gap: 48px; padding: 36px 0 72px; align-items: start; }
.booking__main { grid-area: main; min-width: 0; max-width: 760px; }
.booking__aside { grid-area: aside; min-width: 0; }
.sheet--form { margin-top: 0; padding: 22px 24px; }
.notes { display: grid; gap: 10px; margin: 20px 0 0; padding: 0; list-style: none; font-size: .92rem; }
.notes__item { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; }
.notes__item .i { margin-top: 4px; color: var(--green); }
.notes__item--urgent { color: var(--wine-2); }
.notes__item--urgent .i { color: var(--wine); }
.contact { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 36px; padding: 36px 0 72px; align-items: start; }
.contact__info, .contact__map { min-width: 0; }
.contact__info .sheet:first-child { margin-top: 0; }
.contact__privacy { display: flex; align-items: flex-start; gap: 8px; font-size: .9rem; color: var(--ink-3); }
.contact__privacy .i { margin-top: 4px; color: var(--green); }

/* forms */
.form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.field { display: grid; gap: 6px; min-width: 0; }
.field--wide { grid-column: 1 / -1; }
.field__label { font-size: .88rem; font-weight: 500; color: var(--ink); }
.req { color: var(--wine); }
.input { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; color: var(--ink); font: inherit; font-size: 1rem; transition: border-color .2s, box-shadow .2s; }
textarea.input { min-height: 96px; resize: vertical; }
.input:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(30, 91, 82, .15); outline: none; }
.input[aria-invalid="true"] { border-color: var(--wine); }
.field__hint { margin: 0; font-size: .8rem; color: var(--ink-3); }
.check { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start; margin: 16px 0 0; font-size: .88rem; color: var(--ink-2); cursor: pointer; }
.check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--green); }
.check input[aria-invalid="true"] { outline: 2px solid var(--wine); outline-offset: 2px; }
.form__error { margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--wine-tint); color: var(--wine-2); font-size: .9rem; }
.form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 18px; }
.form__note { display: inline-flex; align-items: flex-start; gap: 8px; margin: 0; font-size: .8rem; color: var(--ink-3); flex: 1 1 260px; }
.form__note .i { margin-top: 3px; color: var(--green); }
.form__done { margin-top: 16px; padding: 14px 16px; border-radius: 12px; background: var(--green-tint); }
.form__done-title { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-weight: 600; color: var(--green-2); }
.form__done p { margin: 0 0 8px; font-size: .9rem; }

/* ---------------------------------------------------------------- vizitkart */
.vcard-page { padding: 22px 0 72px; }
.vcard { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 30px; align-items: center; max-width: 820px; margin: 12px auto 0; padding: 30px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow); }
.vcard__logo { min-width: 0; }
.vcard__img { display: block; width: 100%; height: auto; }
.vcard__body { min-width: 0; }
.vcard__name { margin: 0 0 4px; font-size: clamp(1.5rem, 1.3rem + .8vw, 2rem); }
.vcard__role { margin: 0 0 8px; color: var(--wine); font-weight: 500; }
.vcard__clinic { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 16px; font-size: .92rem; color: var(--ink-3); }
.vcard__clinic .i { margin-top: 4px; color: var(--green); }
.cicons--vcard .cicon { width: 50px; height: 50px; }
.vcard__actions { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 18px; }
.vcard__slogan { margin: 16px 0 0; font-style: italic; color: var(--ink-3); }

/* ---------------------------------------------------------------- legal, sitemap, search, 404 */
.legal { padding: 34px 0 72px; }
.legal__main { max-width: 800px; }
.legal__main h2 { font-size: 1.3rem; margin-top: 1.6em; }
.legal__main h2:first-child { margin-top: 0; }
.smap { columns: 3 260px; column-gap: 36px; padding: 36px 0 72px; }
.smap__group { break-inside: avoid; margin: 0 0 28px; }
.smap__group h2 { display: flex; align-items: center; gap: 10px; font-size: 1.1rem; }
.smap__group ul { margin: 0; padding: 0; list-style: none; }
.smap__group a { display: block; padding: 5px 0; font-size: .93rem; color: var(--ink-2); text-decoration: none; }
.smap__group a:hover { color: var(--wine); }
.searchpage { padding: 28px 0 72px; max-width: 880px; }
.search { display: flex; align-items: center; gap: 10px; }
.search--page { padding: 6px 6px 6px 14px; border: 1px solid var(--line-2); border-radius: 14px; background: #fff; }
.search__icon { display: inline-grid; color: var(--ink-3); }
.search__input { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 8px 4px; border: 0; background: transparent; color: var(--ink); font: inherit; font-size: 1.05rem; }
.search__input:focus { outline: none; }
.search__results { margin-top: 18px; }
.search__count { font: 400 .76rem/1.4 var(--mono); color: var(--ink-3); }
.results { margin: 0; padding: 0; list-style: none; }
.result__a { display: grid; gap: 3px; padding: 14px 4px; border-top: 1px solid var(--line); color: var(--ink-2); text-decoration: none; }
.result__a:hover { background: var(--paper); }
.result__kind { font: 500 .66rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--green); }
.result__title { font-weight: 600; color: var(--ink); }
.result__text { font-size: .9rem; color: var(--ink-3); }
.result mark, .result__text mark { background: #FCE7C8; color: inherit; border-radius: 3px; padding: 0 1px; }
.search__empty p { margin: 0 0 12px; }
.nf { padding: 64px 0 84px; }
.nf__code { margin: 0; font: 500 min(6rem, 26vw)/1 var(--mono); color: var(--wine-line); }
.nf__title { font-size: clamp(1.8rem, 1.4rem + 1.4vw, 2.5rem); }
.nf__text { max-width: 56ch; }

/* ---------------------------------------------------------------- dialogs */
.dlg { width: min(560px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 0; border-radius: 18px; background: #fff; color: var(--ink-2); box-shadow: 0 30px 80px rgba(0, 0, 0, .25); }
.dlg::backdrop { background: rgba(29, 27, 25, .45); }
.dlg__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px 12px 18px; border-bottom: 1px solid var(--line); }
.dlg__title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.1rem; font-weight: 600; color: var(--ink); }
.dlg__body { padding: 18px 20px 20px; overflow: auto; }
.dlg__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--line); }
.dlg--drawer { position: fixed; inset: 0 0 0 auto; width: min(420px, 100vw); height: 100dvh; max-height: 100dvh; margin: 0 0 0 auto; border-radius: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.dlg--drawer .brand__logo { height: 48px; }
.drawer { min-height: 0; overflow: auto; padding: 6px 12px 12px; }
.drawer__group { border-bottom: 1px solid var(--line); }
.drawer__group summary, .drawer__link { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 6px; cursor: pointer; list-style: none; font-weight: 500; color: var(--ink); text-decoration: none; }
.drawer__group summary::-webkit-details-marker { display: none; }
.drawer__group summary .i, .drawer__link .i { color: var(--green); }
.drawer__chev { margin-left: auto; transition: rotate .2s; color: var(--ink-3) !important; }
.drawer__group[open] .drawer__chev { rotate: 180deg; }
.drawer__group .panel-list { padding-bottom: 10px; }
.drawer__sub { margin: 10px 10px 4px; font: 500 .68rem/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.drawer__all { margin: 4px 10px 12px; }
.dlg--search { width: min(720px, calc(100vw - 24px)); margin-top: 8vh; }
.dlg--search .search { padding: 10px 12px 10px 18px; border-bottom: 1px solid var(--line); }
.search__body { padding: 16px 20px 18px; max-height: min(60dvh, 560px); overflow: auto; }
.search__hint { margin: 0 0 8px; font: 500 .68rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.search__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; padding: 0; list-style: none; }
.search__chips button { min-height: 36px; padding: 6px 12px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink-2); font-size: .88rem; cursor: pointer; }
.search__chips button:hover { border-color: var(--green); color: var(--green); }
.dlg__foot--search:has(.cta-slot:empty) { display: none; }
.dlg--booking { width: min(660px, calc(100vw - 24px)); }
.booking__lead { margin-bottom: 16px; }
.booking__lead p { font-size: .94rem; }
.booking__urgent { display: flex; align-items: flex-start; gap: 8px; margin: 16px 0 0; font-size: .85rem; color: var(--wine-2); }
.booking__urgent .i { margin-top: 3px; }
.dlg--consent { width: min(600px, calc(100vw - 24px)); }
.cta-slot:empty { display: none; }

/* ---------------------------------------------------------------- consent */
.consent { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 120; display: flex; justify-content: center; pointer-events: none; }
.consent__box { pointer-events: auto; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 14px; align-items: center; width: 100%; max-width: 980px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 20px 50px rgba(0, 0, 0, .18); }
.consent__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--wine-tint); color: var(--wine); }
.consent__title { margin: 0 0 4px; font-size: 1rem; }
.consent__text p { margin: 0; font-size: .86rem; line-height: 1.5; }
.consent__actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.consent-prefs > p { font-size: .92rem; }
.pref { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: start; padding: 14px 0; border-bottom: 1px solid var(--line); }
.pref__name { display: block; margin: 0 0 4px; font-weight: 600; color: var(--ink); cursor: pointer; }
.pref__desc { margin: 0; font-size: .86rem; color: var(--ink-3); }
.switch { position: relative; display: inline-block; width: 48px; height: 28px; }
.switch__input { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.switch__track { display: block; width: 100%; height: 100%; border-radius: 999px; background: var(--line-2); transition: background-color .2s; }
.switch__knob { position: absolute; left: 3px; top: 3px; width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); transition: translate .2s; }
.switch__input:checked + .switch__track { background: var(--green); }
.switch__input:checked + .switch__track .switch__knob { translate: 20px 0; }
.switch__input:focus-visible + .switch__track { outline: 2px solid var(--green); outline-offset: 3px; }
.switch.is-locked { opacity: .65; }
.switch.is-locked .switch__input { cursor: not-allowed; }
.consent-prefs__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

/* ---------------------------------------------------------------- footer */
.site-footer { background: var(--stone); color: var(--ink-2); padding: 52px 0 24px; }
.footer__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) repeat(3, minmax(0, 1fr)); gap: 36px; }
.footer__brand { min-width: 0; }
.brand--footer .brand__logo { height: 96px; }
.footer__slogan { margin: 14px 0 12px; font-style: italic; color: var(--wine); }
.footer__addr { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 14px; font-size: .92rem; }
.footer__addr .i { margin-top: 4px; color: var(--wine); }
.footer__brand .cicons { margin-bottom: 14px; }
.footer__brand .cicon { background: transparent; }
.footer__vcard { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 12px; border: 1px solid var(--line-2); border-radius: 10px; color: var(--ink); font-size: .9rem; text-decoration: none; }
.footer__vcard .i { color: var(--green); }
.footer__vcard:hover { border-color: var(--green); color: var(--green); }
.footer__col { min-width: 0; }
.footer__title { margin: 6px 0 10px; font: 500 .7rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.footer__col ul { margin: 0; padding: 0; list-style: none; }
.footer__col a { display: inline-block; padding: 4px 0; font-size: .93rem; color: var(--ink-2); text-decoration: none; }
.footer__col a:hover { color: var(--wine); }
.footer__note { margin-top: 32px; padding-top: 18px; border-top: 1px solid var(--line-2); }
.footer__note p { display: flex; align-items: flex-start; gap: 8px; margin: 0; font-size: .86rem; color: var(--ink-3); }
.footer__note .i { margin-top: 3px; color: var(--green); }
.footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; margin-top: 18px; font-size: .86rem; color: var(--ink-3); }
.footer__copy { margin: 0; }
.footer__legal { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; padding: 0; list-style: none; }
.footer__legal a { color: var(--ink-3); text-decoration: none; }
.footer__legal a:hover { color: var(--wine); }
.footer__otx { margin: 0; }
.footer__otx a { color: var(--ink); font-weight: 600; text-decoration: none; }
.footer__otx a:hover { color: var(--wine); }

/* ---------------------------------------------------------------- motion (only with html.m-on: motion allowed) */
@keyframes rv-in { from { opacity: 0; translate: 0 12px; } }
@keyframes pl-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes pl-pop { from { opacity: 0; scale: .7; } }
@keyframes pl-grow-y { from { opacity: 0; translate: 0 18px; } }
@keyframes pl-grow-x { from { scale: 0 1; } }
@keyframes pl-drop { from { opacity: 0; translate: 0 -26px; } }
@keyframes scr-mark { from { left: 0; opacity: 0; } }
@keyframes rule { from { scale: 0 1; } }
@keyframes grow-y { from { scale: 1 0; } }
@keyframes grow-x { from { scale: 0 1; } }
@keyframes scan { 0% { top: 0; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: calc(100% - 2px); opacity: 0; } }
@keyframes scan-corner { 0% { opacity: 0; scale: .85; } 14%, 86% { opacity: 1; scale: 1; } 100% { opacity: 0; scale: 1; } }
@keyframes pulse-up { 0% { opacity: 0; bottom: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { opacity: 0; bottom: calc(100% - 10px); } }
@keyframes pulse-down { 0% { opacity: 0; top: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { opacity: 0; top: calc(100% - 10px); } }

html.m-on [data-rv]:not(.is-in) { opacity: 0; }
html.m-on [data-rv].is-in { animation: rv-in .6s cubic-bezier(.2, .7, .2, 1) var(--m-d, 0s) backwards; }
html.m-on .hero__portrait.is-in .scan__line { animation: scan 2.6s cubic-bezier(.45, 0, .2, 1) .6s 1; }
html.m-on .hero__portrait.is-in .scan__c { animation: scan-corner 2.6s ease .5s 1; }
html.m-on .hero__sheet.is-in .facts__row::before { animation: rule .8s cubic-bezier(.4, 0, .2, 1) backwards; }
html.m-on .hero__sheet.is-in .facts__row:nth-child(2)::before { animation-delay: .12s; }
html.m-on .hero__sheet.is-in .facts__row:nth-child(3)::before { animation-delay: .24s; }
html.m-on .hero__sheet.is-in .facts__row:nth-child(4)::before { animation-delay: .36s; }
html.m-on .hero__sheet.is-in .facts__row:nth-child(5)::before { animation-delay: .48s; }
html.m-on [data-path]:not(.is-in)::after { scale: 1 0; }
html.m-on .path.is-in::after, html.m-on .timeline.is-in::after { animation: grow-y 1.8s cubic-bezier(.4, 0, .2, 1) backwards; }
html.m-on .stepper.is-in::after { animation: grow-x 1.6s cubic-bezier(.4, 0, .2, 1) backwards; }
html.m-on .stepper:not(.is-in)::after { scale: 0 1; }

html.m-on [data-plate]:not(.is-in) .pl-draw { stroke-dashoffset: 1; }
html.m-on [data-plate]:not(.is-in) :is(.pl-pop, .pl-grow, .pl-move) { opacity: 0; }
html.m-on [data-plate].is-in .pl-draw { animation: pl-draw 1.4s cubic-bezier(.4, 0, .2, 1) backwards; }
html.m-on [data-plate].is-in .pl-pop { animation: pl-pop .5s cubic-bezier(.2, .7, .2, 1) backwards; transform-box: fill-box; transform-origin: center; }
html.m-on [data-plate].is-in .pl-grow { animation: pl-grow-y .7s cubic-bezier(.2, .7, .2, 1) backwards; }
html.m-on [data-plate].is-in :is(.scr__band, .rec__track).pl-grow { animation-name: pl-grow-x; }
html.m-on [data-plate].is-in .pl-move { animation: pl-drop .8s cubic-bezier(.2, .7, .2, 1) backwards; transform-box: fill-box; }
html.m-on [data-plate].is-in .scr__mark.pl-move { animation-name: scr-mark; animation-duration: 1.2s; }
html.m-on [data-plate].is-in .pl-d1 { animation-delay: .15s; }
html.m-on [data-plate].is-in .pl-d2 { animation-delay: .5s; }
html.m-on [data-plate].is-in .pl-d3 { animation-delay: .85s; }
html.m-on [data-plate].is-in .pl-d4 { animation-delay: 1.2s; }
html.m-on [data-plate].is-in .pl-d5 { animation-delay: 1.5s; }
html.m-on [data-plate].is-in .axis__pulse--up { animation: pulse-up 1.8s ease-in-out .4s 2; }
html.m-on [data-plate].is-in .axis__pulse--down { animation: pulse-down 1.8s ease-in-out 1.3s 2; }
html.m-on [data-plate].is-in .axis__line.pl-d2 .axis__pulse { animation-delay: .7s, 0s; }
html.m-on [data-plate].is-in .axis__line.pl-d2 .axis__pulse--down { animation-delay: 1.6s; }
html.m-on [data-plate].is-in .axis__line.pl-d3 .axis__pulse--up { animation-delay: 1s; }
html.m-on [data-plate].is-in .axis__line.pl-d3 .axis__pulse--down { animation-delay: 1.9s; }
html.m-on [data-plate].is-in .axis__line.pl-d4 .axis__pulse--up { animation-delay: 1.3s; }
html.m-on [data-plate].is-in .axis__line.pl-d4 .axis__pulse--down { animation-delay: 2.2s; }

@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  html { scroll-behavior: smooth; }
  .qa::details-content { block-size: 0; overflow: clip; transition: block-size .3s ease, content-visibility .3s allow-discrete; }
  .qa[open]::details-content { block-size: auto; }
  :root { interpolate-size: allow-keywords; }
}
html.uwa-pause::view-transition-group(*), html.uwa-pause::view-transition-old(*), html.uwa-pause::view-transition-new(*) { animation: none !important; }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 1199.98px) {
  .hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .8fr) minmax(0, .9fr); gap: 26px; }
  .split--photo { grid-template-columns: 280px minmax(0, 1fr); gap: 40px; }
  .doc { grid-template-columns: 220px minmax(0, 1fr); gap: 40px; }
}
@media (max-width: 1099.98px) {
  .hero__grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-areas: "text text" "portrait sheet"; gap: 24px 28px; align-items: start; }
  .hero__text .hero__lead { max-width: 62ch; }
  .alist--home { grid-template-columns: minmax(0, 1fr); }
  .principles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log__row { grid-template-columns: 64px minmax(0, 1fr) 110px; }
  .log__place { grid-column: 2; grid-row: 1; }
  .log__event { grid-column: 2; grid-row: 2; }
  .log__role { grid-column: 3; grid-row: 1 / span 2; }
}
@media (max-width: 1023.98px) {
  :root { --header-h: 76px; }
  .brand__logo { height: 56px; }
  .site-header.is-scrolled .header__row { height: 66px; }
  .site-header.is-scrolled .brand__logo { height: 46px; }
  .doc, .profile, .career, .faqpage, .booking { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .doc { grid-template-areas: "toc" "main" "photo"; padding-top: 26px; }
  .doc__aside { display: contents; }
  .doc__aside > .toc { grid-area: toc; }
  .doc__aside > .ph { grid-area: photo; max-width: 300px; margin: 0; }
  .doc__main, .profile__main, .career__main, .faqpage__main, .booking__main { max-width: none; }
  .profile__aside { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 20px; align-items: start; }
  .profile__aside .sheet { margin-top: 0; }
  .profile__stick { display: contents; }
  .career__nav { position: static; }
  .career__nav ul { display: flex; flex-wrap: wrap; gap: 6px; }
  .faq-nav { position: static; }
  .faq-nav ul { display: flex; flex-wrap: wrap; gap: 4px; }
  .booking { grid-template-areas: "main" "aside"; }
  .booking__aside { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: 20px; align-items: start; }
  .booking__aside .sheet { margin-top: 0; }
  .contact { grid-template-columns: minmax(0, 1fr); }
  .split--complaints, .split--faq, .split--contact { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 899.98px) {
  .ilist--2, .symptoms, .related ul { grid-template-columns: minmax(0, 1fr); }
  .instruments, .science__grid, .media__grid { grid-template-columns: minmax(0, 1fr); }
  .video-grid { grid-template-columns: minmax(0, 1fr); }
  .insurers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stepper { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 26px; }
  .stepper::before, .stepper::after { display: none; }
  .sec--steps .prose ol { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .sec--steps .prose ol::before { left: 18px; right: auto; top: 18px; bottom: 18px; width: 2px; height: auto; }
  .sec--steps .prose li { padding: 6px 0 14px 54px; min-height: 52px; }
  .split--photo { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .split--photo .split__aside { order: 2; }
  .split--page { grid-template-areas: "main" "aside" "tail"; row-gap: 30px; }
  .split--photo .ph { max-width: 300px; }
  .ph--sticky { position: static; }
  .plate__body--split { grid-template-columns: minmax(0, 1fr); }
  .plate__body--split .reach { max-width: 240px; margin: 0 auto; }
  .vcard { grid-template-columns: minmax(0, 1fr); text-align: left; }
  .vcard__logo { max-width: 240px; }
}
@media (max-width: 767.98px) {
  :root { --gutter: 16px; --header-h: 64px; }
  .header__row { gap: 10px; }
  .brand__logo { height: 46px; }
  .site-header.is-scrolled .header__row { height: 58px; }
  .site-header.is-scrolled .brand__logo { height: 40px; }
  /* the page's single CTA docks to the bottom of the screen on phones */
  .cta-home .btn--cta { position: fixed; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 95; min-height: 52px; justify-content: center; border-radius: 14px; box-shadow: 0 12px 30px rgba(107, 20, 33, .35); font-size: 1rem; }
  body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .consent { bottom: calc(76px + env(safe-area-inset-bottom)); }
  .section { padding: 44px 0; }
  .phead { padding: 16px 0 24px; }
  .record__cell { flex-basis: 100%; border-left: 0; border-top: 1px solid var(--line); }
  .record__cell:first-child { border-top: 0; }
  .hero { padding: 20px 0 28px; }
  .hero__grid { grid-template-columns: minmax(0, .82fr) minmax(0, 1fr); gap: 18px 14px; }
  .hero__sheet { padding: 12px 14px; }
  .facts__row { padding: 7px 0; }
  .facts dd { font-size: .84rem; }
  .hero__slogan { font-size: .86rem; }
  .facts__row--long { display: none; }
  .ilist__a { grid-template-columns: 38px minmax(0, 1fr) 16px; }
  .levels { grid-template-columns: minmax(0, 1fr); }
  .level--1, .level--2, .level--3 { min-height: 0; }
  .grades { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 22px; }
  .axis__ch { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 8px; }
  .axis__track { height: 56px; }
  .rec { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .rec__track { left: 18px; right: auto; top: 18px; bottom: 18px; width: 2px; height: auto; background: var(--grad-y); transform-origin: top; }
  .rec__pt { grid-template-columns: 38px minmax(0, 1fr); column-gap: 12px; justify-items: stretch; }
  .rec__dot { grid-row: span 2; }
  .tbl--stack thead { display: none; }
  .tbl--stack tr { display: block; padding: 8px 0; border-top: 1px solid var(--line); }
  .tbl--stack tr:first-child { border-top: 0; }
  .tbl--stack th, .tbl--stack td { display: block; padding: 4px 14px; border: 0; }
  .tbl--stack td::before { content: attr(data-label); display: block; font: 500 .62rem/1.5 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
  .tbl--cmp thead { display: none; }
  .tbl--cmp tr { display: block; padding: 8px 0; border-top: 1px solid var(--line); }
  .tbl--cmp tr:first-child { border-top: 0; }
  .tbl--cmp th, .tbl--cmp td { display: block; padding: 4px 14px; border: 0; }
  .tbl--cmp td::before { content: attr(data-label); display: block; font: 500 .62rem/1.5 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
  .dxlist__row, .dxlist--2 .dxlist__row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .opsheet__row { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .log__row { grid-template-columns: 56px minmax(0, 1fr); }
  .log__role { grid-column: 2; grid-row: 3; }
  .timeline::before, .timeline::after { left: 5px; }
  .timeline__item { grid-template-columns: 12px minmax(0, 1fr); column-gap: 18px; }
  .timeline__year { grid-column: 2; text-align: left; }
  .timeline__dot { grid-column: 1; grid-row: 1; justify-self: start; }
  .timeline__text { grid-column: 2; }
  .form__grid { grid-template-columns: minmax(0, 1fr); }
  .consent__box { grid-template-columns: 40px minmax(0, 1fr); }
  .consent__actions { grid-column: 1 / -1; justify-content: flex-start; }
  .footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
  .brand--footer .brand__logo { height: 80px; }
  .profile__aside, .booking__aside { grid-template-columns: minmax(0, 1fr); }
  .profile__aside .ph, .booking__aside .ph { max-width: 280px; }
  .instrument { padding: 18px 18px 18px 74px; }
  .instrument__ic { left: 18px; top: 18px; }
}
@media (max-width: 479.98px) {
  .hero__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "text" "portrait" "sheet"; }
  .hero__portrait { max-width: 300px; }
  .insurers { grid-template-columns: minmax(0, 1fr); }
  .stepper { grid-template-columns: minmax(0, 1fr); }
  .footer__grid { grid-template-columns: minmax(0, 1fr); }
  .grades { column-gap: 8px; }
  .cycle__node { width: min(46%, 150px); padding: 5px 7px; }
  .cycle__node span { display: none; }
  .cicons--lg .cicon { width: 48px; height: 48px; border-radius: 12px; }
  .cicons--lg .cicon .i { width: 22px; height: 22px; }
  .callout { grid-template-columns: 22px minmax(0, 1fr); }
  .callout__call { grid-column: 2; justify-self: start; }
  .urgent { grid-template-columns: minmax(0, 1fr); }
  .mapcard__gate { position: static; translate: none; width: auto; margin: 0; border-radius: 0; box-shadow: none; }
  .mapcard__frame, .mapcard--tall .mapcard__frame { aspect-ratio: auto; min-height: 0; }
  .mapcard__art { position: relative; display: block; aspect-ratio: 16 / 10; }
  .mapcard.is-loaded .mapcard__frame { aspect-ratio: 4 / 3; }
}
@media (max-width: 399.98px) {
  /* narrow phones: the flag button drops its chevron so logo, flag, search and menu fit in 320px */
  .lang__btn { width: 44px; padding: 0; }
  .lang__chev { display: none; }
}

/* ---------------------------------------------------------------- print */
@media print {
  .site-header, .site-footer, .dlg, .consent, .toc, .related, .video__actions, .mapcard, .cta-home, .skip { display: none !important; }
  body { background: #fff; padding: 0; }
  .doc { display: block; padding: 0; }
  a { color: inherit; text-decoration: none; }
}