@font-face {
  font-family: Inter;
  src: url(assets/inter.woff2) format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  color-scheme: light;
  --night: #101828;
  --night-deep: #0b141e;
  --ivory: #f7f4ed;
  --practice-surface: #06282b;
  --practice-panel: #103b3d;
  --champagne: #f1e2c6;
  --champagne-light: #fbf7ee;
  --ink: #17202c;
  --muted: #4f5759;
  --gold: #e4bc78;
  --bronze: #815725;
  --gold-rule: #e4bc784d;
  --line: #c7bba9;
  --side: clamp(22px, 5.55vw, 88px);
  --header: 76px;
  --chapter-viewport: calc(100dvh - var(--header));
  --chapter-padding: clamp(28px, 4vw, 60px);
  --chapter-index-inset: clamp(20px, 3vw, 42px);
  --chapter-index-gap: clamp(22px, 3vw, 38px);
  --control-radius: 12px;
  font: 16px/1.6 Inter, sans-serif;
  background: var(--night);
  color: var(--ivory);
}

*, *::before, *::after { box-sizing: border-box; }
body, p, h1, h2, figure { margin: 0; }
button, input, select, textarea { font-family: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
main:focus { outline: none; }
html { scroll-padding-top: var(--header); }
html.motion-ready { overscroll-behavior-y: none; }
html.is-navigating { overflow-anchor: none; }
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-group(root) { animation-duration: .24s; }
}
.motion-disabled::view-transition-group(root),
.motion-disabled::view-transition-old(root),
.motion-disabled::view-transition-new(root) { animation-duration: 0s; }
.wrap { width: min(calc(100% - 2 * var(--side)), 1280px); margin-inline: auto; }
.skip { position: fixed; z-index: 10; top: 10px; left: 10px; padding: 10px 15px; color: var(--ink); background: var(--ivory); }
.skip:not(:focus) { transform: translateY(-150%); }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 4;
  background-image: linear-gradient(#0b141ef5, #0b141ee8);
  transition: background-color .25s ease;
}
.site-header.is-scrolled { background-color: var(--night-deep); }
.header-inner {
  width: min(calc(100% - 2 * var(--side)), 1280px);
  min-height: var(--header);
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  border-bottom: 1px solid #f7f3eb38;
}
.brand { display: inline-flex; align-items: center; justify-self: start; gap: 11px; min-height: 44px; }
.brand-lockup { display: grid; justify-items: center; flex: none; width: 46px; }
.brand-mark { width: 41px; height: auto; }
.brand-wordmark { width: 46px; height: auto; }
.brand-identity { display: grid; gap: 2px; line-height: 1.25; white-space: nowrap; }
.brand-identity strong { font-size: 15px; font-weight: 650; }
.brand-identity small { color: var(--gold); font-size: 11px; }
.desktop-nav, .header-actions, .languages { display: flex; align-items: center; }
.desktop-nav { gap: clamp(15px, 1.9vw, 30px); font-size: 13px; }
.desktop-nav a { display: flex; align-items: center; min-height: 44px; white-space: nowrap; }
.desktop-nav a:hover, .text-link:hover { text-decoration: underline; text-underline-offset: .3em; }
.site-header nav a[aria-current="location"] { color: var(--gold); text-decoration: underline; text-underline-offset: 5px; }
.header-actions { justify-self: end; gap: clamp(8px, 1.5vw, 24px); }
.languages a { display: grid; place-items: center; min-width: 30px; min-height: 44px; font-size: 11px; color: #dfdcd4; }
.languages a[aria-current] { color: var(--gold); text-decoration: underline; text-underline-offset: 4px; }
.button.header-contact {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border-color: var(--gold-rule);
  padding-inline: 16px;
  color: var(--gold);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.header-contact:hover { background: var(--gold); color: var(--night); }
.mobile-menu { display: none; }
.mobile-menu:not([open]) nav { display: none; }

.baku-not-found { min-height: 100svh; display: grid; align-content: center; justify-items: start; padding-block: 48px; }
.baku-not-found h1 { margin: 12px 0; font-size: clamp(34px, 7vw, 76px); line-height: 1.08; overflow-wrap: anywhere; }
.baku-not-found .button { margin-top: 24px; background: var(--gold); color: var(--night); }

.story { position: relative; }
.stage {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(min-content, 1fr);
  padding-block: calc(var(--header) + var(--chapter-index-inset)) calc(max(24px, env(safe-area-inset-bottom)) + 60px);
  min-height: 580px;
  height: 100vh;
  height: 100svh;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(155deg, #15263b, var(--night) 65%, var(--night-deep));
}
.city, .sky-shade { position: absolute; inset: 0; z-index: -1; }
.city {
  transform: translate3d(var(--camera-x, 0%), var(--camera-y, 0%), 0) scale(var(--zoom, 1));
  transform-origin: var(--zoom-origin, 77% 60%);
  opacity: var(--city-opacity, 1);
}
.city img, .city-film { width: 100%; height: 100%; object-fit: cover; object-position: 53% 52%; }
.city picture { display: block; height: 100%; }
.city-film { --themis-framing: 0; object-position: 53% calc(52% * (1 - var(--themis-framing)) + 16px * var(--themis-framing)); }
.city-film { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .24s ease; }
.city-film.has-frame { opacity: 1; }
.sky-shade {
  background: linear-gradient(0deg, #0b141eee, #0b141eda 110px, transparent 225px),
              linear-gradient(180deg, #0b141ef0, #0b141eb0 150px, transparent 235px),
              linear-gradient(155deg, rgb(13 34 59 / .14), transparent 62%);
}
.motion-ready .sky-shade::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #0c2040;
  opacity: var(--title-shade, 0);
}
.stage-copy {
  align-self: center;
  opacity: var(--copy-opacity, 1);
  transform: translateY(var(--copy-shift, 0));
}
.stage-copy:focus-within { opacity: 1; }
.hero-text {
  --hero-soft-edge: clamp(65px, 15vw, 225px);
  position: relative;
  isolation: isolate;
  display: flow-root;
  width: fit-content;
  max-width: 100%;
  color: var(--ivory);
}
.hero-text::before {
  content: "";
  position: absolute;
  inset: -56px calc(-1 * var(--hero-soft-edge)) -56px calc(-1 * var(--side));
  z-index: -1;
  pointer-events: none;
  background: rgb(8 18 31 / var(--hero-shade, .84));
  mask-image: linear-gradient(to right, #000 calc(100% - var(--hero-soft-edge)), transparent),
              linear-gradient(to bottom, transparent, #000 56px, #000 calc(100% - 56px), transparent);
  mask-composite: intersect;
}
.eyebrow {
  display: flex;
  align-items: center;
  gap: 13px;
  color: var(--gold);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.45;
  text-transform: uppercase;
}
.hairline { width: 30px; height: 1px; background: currentColor; flex: 0 0 auto; }
h1, h2 { font-weight: 560; text-wrap: balance; }
h1 { max-width: 11.5ch; margin: 20px 0 23px; font-size: clamp(54px, 7.1vw, 104px); line-height: .98; }
.hero-description { max-width: 36ch; color: var(--ivory); font-size: clamp(16px, 1.3vw, 18px); font-weight: 480; line-height: 1.6; }
.hero-cta { visibility: var(--copy-action, visible); margin-top: 26px; }
.hero-cta:focus-visible { visibility: visible; }
.stage-bottom { position: absolute; inset: auto 0 max(24px, env(safe-area-inset-bottom)); display: flex; align-items: end; justify-content: flex-end; border-top: 1px solid var(--gold-rule); padding-top: 12px; }
.motion-ready .stage-bottom { opacity: var(--rail-opacity, 1); visibility: var(--rail-action, visible); }
.stage-bottom:focus-within { opacity: 1; visibility: visible; }
.scroll-cue { display: inline-flex; align-items: center; gap: 15px; min-height: 46px; margin-inline-start: auto; font-size: 13px; font-weight: 500; }
.scroll-cue svg { flex: 0 0 auto; border-radius: 50%; color: var(--gold); transition: background-color .2s, color .2s; }
.scroll-cue:hover svg { background: var(--gold); color: var(--night); }
.scroll-cue circle, .cue-arrow { stroke: currentColor; }
.cue-track { opacity: .42; }
.cue-meter { transform: rotate(-90deg); transform-origin: center; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--progress, 0)); }
.cue-arrow { stroke-width: 1.4; transform: translateY(var(--arrow-travel, 0px)); }
.motion-ready .story {
  --stage-height: max(580px, 100svh);
  --runway-height: min(61svh, 560px);
  --scene-length: calc(var(--stage-height) + var(--runway-height) - var(--header));
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.motion-ready .story > :is(.stage, .profile) { grid-area: 1 / 1; }
.motion-ready .stage {
  position: sticky;
  top: 0;
  align-self: start;
  height: var(--stage-height);
}
.motion-ready .city { will-change: transform, opacity; }

.profile-sheet, .practice, .approach, .faq, .contact, .site-footer { min-height: var(--chapter-viewport); }

.chapter:not(.profile), .profile-sheet, .institutions {
  display: grid;
  grid-template-rows: auto 1fr;
  padding-block: var(--chapter-index-inset) var(--chapter-padding);
}
:is(.chapter:not(.profile), .profile-sheet, .institutions) > .wrap:not(.section-index) {
  align-self: center;
}
.chapter {
  --chapter-rule: var(--line);
  --chapter-accent: var(--bronze);
  --chapter-muted: var(--muted);
  position: relative;
}
.chapter h2 { font-size: clamp(34px, 4.65vw, 68px); line-height: 1.03; }
.section-index {
  display: flex;
  gap: 17px;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 13px;
  margin-bottom: var(--chapter-index-gap);
  border-bottom: 1px solid var(--chapter-rule);
  font-size: 12px;
  font-weight: 600;
  text-align: start;
  text-transform: uppercase;
}
.section-index span:first-child { color: var(--chapter-accent); font-variant-numeric: tabular-nums; }
.stage-index {
  --chapter-accent: var(--gold);
  --chapter-rule: var(--gold-rule);
  color: var(--ivory);
  opacity: var(--copy-opacity, 1);
}
.profile {
  --profile-wash: linear-gradient(136deg, #f9f6f0 5%, var(--ivory) 50%, #ede7dd);
  z-index: 1;
  color: var(--ink);
}
.profile-anchor { position: absolute; top: 0; left: 0; }
.motion-ready .profile { margin-top: var(--header); pointer-events: none; }
.motion-ready .profile-anchor { top: var(--scene-length); }
.motion-ready .profile::after {
  content: "";
  display: block;
  height: var(--scene-length);
}
.profile-sheet {
  position: relative;
  background: var(--profile-wash);
}
.motion-ready .profile-sheet {
  position: sticky;
  top: var(--header);
  isolation: isolate;
  overflow: clip;
  background: transparent;
  pointer-events: var(--sheet-actions, none);
}
.motion-ready .profile-sheet::before {
  content: "";
  position: absolute;
  inset: 0 0 calc(-1 * var(--blend-width, 0px));
  background: var(--profile-wash);
  --paper-mask: linear-gradient(
    to bottom,
    transparent,
    rgb(0 0 0 / .043) calc(.125 * var(--blend-width, 0px)),
    rgb(0 0 0 / .15625) calc(.25 * var(--blend-width, 0px)),
    rgb(0 0 0 / .3164) calc(.375 * var(--blend-width, 0px)),
    rgb(0 0 0 / .5) calc(.5 * var(--blend-width, 0px)),
    rgb(0 0 0 / .6836) calc(.625 * var(--blend-width, 0px)),
    rgb(0 0 0 / .84375) calc(.75 * var(--blend-width, 0px)),
    rgb(0 0 0 / .957) calc(.875 * var(--blend-width, 0px)),
    black var(--blend-width, 0px)
  );
  -webkit-mask-image: var(--paper-mask);
  mask-image: var(--paper-mask);
  transform: translate3d(0, var(--blend-top, calc(var(--stage-height) - var(--header))), 0);
  z-index: -1;
  pointer-events: none;
}
.motion-ready .profile-sheet .section-index { opacity: var(--index-opacity, 0); }
.profile-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); grid-template-areas: "photo bio"; gap: clamp(40px, 8vw, 128px); align-items: center; }
.portrait {
  grid-area: photo;
  width: min(100%, 495px);
  padding: calc(clamp(8px, 1vw, 14px) + 1px);
}
.motion-ready .portrait {
  opacity: var(--portrait-opacity, 0);
  transform: translateY(var(--portrait-lift, 0px)) scale(var(--portrait-approach, 1));
  transform-origin: 50% 28%;
}
.portrait-image { position: relative; overflow: hidden; background: #b09b82; box-shadow: 0 14px 34px rgb(40 26 13 / .12); }
.portrait-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 4.5;
  object-fit: cover;
  object-position: 50% 34%;
  transform-origin: 50% 36%;
  transform: translateY(var(--portrait-shift, 0%)) scale(var(--portrait-scale, 1));
}
.portrait figcaption { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; padding-top: 9px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.portrait figcaption span:first-child { color: var(--ink); font-weight: 600; }
.motion-ready .portrait figcaption {
  opacity: var(--portrait-caption, 1);
  transform: translateY(calc(5px * (1 - var(--portrait-caption, 1))));
}
.profile-copy { grid-area: bio; }
.motion-ready .profile-page-link {
  opacity: var(--profile-link-opacity, 0);
  visibility: var(--profile-link-visibility, hidden);
}
.profile-copy .eyebrow { color: var(--bronze); }
.motion-ready .profile-copy .eyebrow { opacity: var(--eyebrow-opacity, 0); }
.motion-ready .profile-copy > :is(.intro, .profile-metrics, .profile-history-toggle) { transform: translateY(var(--bio-shift, 0px)); opacity: var(--bio-opacity, 0); }
.profile-copy h2 { margin-top: 19px; max-width: 16ch; font-size: clamp(34px, 4.25vw, 62px); }
.motion-ready .profile-copy h2 {
  --title-edge: var(--title-contrast-edge, 100%);
  background: linear-gradient(to bottom, #f0f6ff calc(var(--title-edge) - 2px), var(--ink) calc(var(--title-edge) + 2px));
  background-clip: text;
  color: transparent;
  opacity: var(--title-opacity, 0);
}
.intro { max-width: 48ch; color: var(--muted); font-size: clamp(15px, 1.3vw, 19px); line-height: 1.7; }
.profile-copy .intro { margin-top: 18px; color: var(--ink); }
.profile-metrics {
  container-type: inline-size;
  margin-top: 18px;
  border: 1px solid #66563f;
  border-radius: var(--control-radius);
  background: radial-gradient(ellipse at 14% 0%, #233449, transparent 76%),
              linear-gradient(135deg, var(--night), var(--night-deep));
  box-shadow: inset 0 1px rgb(228 188 120 / .16), 0 8px 22px rgb(16 24 40 / .12);
}
.profile-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding: 16px 4px;
}
.profile-metric-grid > div {
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-end;
  gap: 6px;
  padding-inline: 10px;
  text-align: center;
}
.profile-metric-grid > div + div { border-inline-start: 1px solid var(--gold-rule); }
.profile-metric-grid dt { color: #e1e5ea; font-size: 13px; line-height: 1.35; text-wrap: balance; overflow-wrap: anywhere; }
.profile-metric-grid dd {
  margin: 0;
  color: var(--gold);
  font-size: clamp(28px, 2.6vw, 38px);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.text-link { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; font-size: 13px; font-weight: 550; }

/* Avoid scroll anchoring while a disclosure changes height. */
html:has(.profile-history-toggle:focus, .history-panel:focus-within, .practice-list details:focus-within) { overflow-anchor: none; }
.profile-history-toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  width: 100%;
  min-height: 62px;
  margin-top: clamp(16px, 2vw, 26px);
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: var(--control-radius);
  background: rgb(129 87 37 / .035);
  color: inherit;
  font: inherit;
  text-align: start;
  cursor: pointer;
  -webkit-tap-highlight-color: rgb(129 87 37 / .15);
}
.profile-history-toggle:is(:hover, :focus-visible) strong { color: var(--bronze); }
.profile-history-toggle strong { display: block; font-size: clamp(17px, 1.7vw, 23px); font-weight: 550; }
.motion-ready .profile-copy > :is(.profile-metrics, .profile-history-toggle) { visibility: var(--bio-visibility, hidden); }
.history-topics { display: block; color: var(--muted); font-size: 13px; }
.history-panel.is-collapsible { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--disclosure-duration) var(--disclosure-ease); }
.history-panel.is-open { grid-template-rows: 1fr; }
.history-clip { display: flow-root; min-block-size: 0; overflow: clip; }
.history-body {
  display: grid;
  gap: clamp(13px, 1.3vw, 17px);
  margin-block: clamp(20px, 2.2vw, 28px) 4px;
  padding: clamp(14px, 1.65vw, 23px);
  border: 1px solid #d8c8ae;
  border-radius: 18px;
  background: linear-gradient(135deg, #fbf8f1, #f4efe5 78%);
  box-shadow: inset 0 1px #fff, 0 9px 20px rgb(16 24 40 / .07);
}
.history-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 14px;
  --disclosure-content-delay: 40ms;
}
.history-header h3 {
  margin: 0;
  padding-inline-start: 12px;
  border-inline-start: 2px solid var(--bronze);
  font-size: clamp(23px, 2.55vw, 36px);
  font-weight: 590;
  line-height: 1.15;
}
.history-body > .profile-metrics {
  margin: 0;
  background: radial-gradient(ellipse at 18% 0%, #2a3d51, transparent 71%),
              linear-gradient(115deg, #152235, var(--night-deep));
  --disclosure-content-delay: 65ms;
}
.history-body .profile-metric-grid { padding-block: clamp(14px, 1.55vw, 21px); }
.history-body .profile-metric-grid dd { font-size: clamp(29px, 3.3vw, 47px); line-height: 1; }
.history-body .profile-metric-grid dt { font-size: 14px; }
.history-close { display: inline-flex; flex: none; align-items: center; gap: 6px; min-height: 44px; padding-inline: 12px; border: 1px solid #dfd1bb; border-radius: 8px; color: var(--bronze); background: #fffcf680; font: 550 13px Inter, sans-serif; cursor: pointer; }
.history-close:is(:hover, :focus-visible) { background: rgb(129 87 37 / .08); }
.history-facts {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px 20px;
  padding-block: 9px;
  border-block: 1px solid #d9cbb6;
  --disclosure-content-delay: 180ms;
}
.history-facts dl { display: grid; grid-template-columns: minmax(0, .52fr) minmax(0, 1.6fr); gap: 12px 22px; margin: 0; }
.history-facts dt { margin-bottom: 4px; color: var(--muted); font-size: 13px; font-weight: 550; }
.history-facts dd { margin: 0; font-size: 15px; line-height: 1.45; }
.history-services { justify-self: start; padding-inline: 11px; border: 1px solid #dfd1bb; border-radius: 8px; background: #fffcf680; color: var(--bronze); }
.history-services:is(:hover, :focus-visible) { text-decoration: underline; text-underline-offset: 4px; }
.history-registration {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  justify-self: start;
  align-items: center;
  gap: 10px clamp(10px, 1.4vw, 20px);
  max-inline-size: 100%;
  padding: 10px 12px;
  border: 1px solid #dfd1bb;
  border-radius: var(--control-radius);
  background: #fffcf6;
  --disclosure-content-delay: 205ms;
}
.history-identity { display: flex; align-items: center; gap: 11px; min-width: 0; }
.history-seal { display: grid; flex: 0 0 42px; place-items: center; height: 42px; border: 1px solid #dfc79e; border-radius: 50%; background: #fbf5e9; color: var(--bronze); }
.history-name { display: grid; gap: 2px; color: var(--muted); font-size: 13px; }
.history-name strong { color: var(--ink); font-size: 15px; font-weight: 580; overflow-wrap: anywhere; }
.credential-id {
  padding: 4px 9px;
  border: 1px solid #e5d5bb;
  border-radius: 6px;
  background: #f6eddd;
  color: var(--bronze);
  font-size: 14px;
  font-weight: 620;
  font-variant-numeric: tabular-nums;
}
.history-register {
  justify-content: center;
  padding-inline: 11px;
  border-radius: 8px;
  background: var(--night-deep);
  color: var(--ivory);
}
.history-register [aria-hidden] { color: var(--gold); }
.history-register:is(:hover, :focus-visible) { background: var(--night); }
.history-register:focus-visible { outline-color: var(--bronze); }
.history-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(20px, 2.4vw, 36px); font-size: 15px; line-height: 1.45; }
.history-grid > :first-child { --disclosure-content-delay: 105ms; }
.history-grid > :last-child { --disclosure-content-delay: 155ms; }
.history-qualifications { padding-inline-start: clamp(20px, 2.4vw, 36px); border-inline-start: 1px solid #d9cbb6; }
.history-grid h4 { margin: 0 0 10px; font-size: clamp(18px, 1.75vw, 23px); font-weight: 590; }
.history-education { margin-bottom: 15px; color: var(--muted); }
.history-education span { display: block; }
.history-education span + span { margin-top: 4px; }
.history-list { list-style: none; margin: 0; padding: 0; }
.history-list li { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: 8px; padding: 6px 0; border-top: 1px solid #ded3c1; }
.history-date { color: var(--bronze); font-size: 13px; font-weight: 550; font-variant-numeric: tabular-nums; }
.history-timeline { padding-inline-start: 17px; }
.history-timeline li { position: relative; grid-template-columns: 1fr; gap: 2px; padding-block: 3px 9px; border: 0; }
.history-timeline li > :last-child { font-weight: 520; }
.history-timeline li::before { position: absolute; content: ""; inset-block-start: 9px; inset-inline-start: -17px; width: 7px; height: 7px; border: 1px solid var(--bronze); border-radius: 50%; background: #f8ecd6; }
.history-timeline li:not(:last-child)::after { position: absolute; content: ""; inset-block: 16px -9px; inset-inline-start: -14px; width: 1px; background: #c3a577; }
.history-timeline li:last-child::before { background: var(--bronze); }

.practice {
  --chapter-rule: var(--gold-rule);
  --chapter-accent: var(--gold);
  --chapter-muted: #e0ece8;
  --chapter-panel: var(--practice-panel);
  isolation: isolate;
  background: radial-gradient(ellipse at 82% 8%, #103638, transparent 67%),
              linear-gradient(156deg, var(--practice-surface) 48%, #0b2b2d);
  color: var(--ivory);
}
.practice::before {
  --art-fade: linear-gradient(180deg, #000 12%, #000a 52%, transparent 100%);
  --art-opacity: .34;
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  height: min(100%, clamp(420px, 48vw, 670px));
  background: linear-gradient(90deg, #06282b70 64%, transparent 85%),
              url(assets/practice-themis.webp) calc(50% - 21vw) 24% / cover no-repeat;
  mask-image: var(--art-fade), linear-gradient(90deg, #000 62%, transparent 79%);
  mask-composite: intersect;
  opacity: var(--art-opacity);
  pointer-events: none;
}
.practice-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .57fr);
  grid-template-areas: "heading ." "list office";
  align-items: start;
  column-gap: clamp(24px, 5vw, 72px);
  row-gap: clamp(18px, 2.1vw, 28px);
}
.practice-heading { grid-area: heading; }
.practice h2 { font-weight: 580; }
.practice-heading .intro { margin-top: 12px; color: var(--chapter-muted); }
.practice-heading .button.practice-directory-link {
  --consultation-focus: var(--gold);
  margin-top: 18px;
  border-color: var(--gold);
  background: var(--gold);
  color: var(--night-deep);
}
.practice-directory-link .consultation-cta-icon { background: rgb(11 20 30 / .09); box-shadow: none; }
.practice-heading .practice-directory-link:is(:hover, :focus-visible) { background: #f4d7a6; }
.practice-list {
  --row-number: 34px;
  --row-gap: 12px;
  --row-padding: 8px;
  --row-control: 30px;
  --row-text-start: calc(var(--row-number) + var(--row-gap) + var(--row-padding));
  grid-area: list;
  border-top: 1px solid var(--chapter-rule);
}
.practice-list details {
  border-bottom: 1px solid var(--chapter-rule);
  scroll-margin-top: calc(var(--header) + 16px);
  transition: background-color .32s ease, box-shadow .32s ease;
}
.practice-list summary {
  display: grid;
  align-items: center;
  grid-template-columns: var(--row-number) minmax(0, 1fr) var(--row-control);
  gap: var(--row-gap);
  min-height: 78px;
  padding: 13px var(--row-padding);
  cursor: pointer;
  list-style: none;
  -webkit-tap-highlight-color: rgb(228 188 120 / .15);
}
.practice-list summary:focus-visible { outline-offset: -2px; }
.practice-summary { display: grid; gap: 5px; }
.practice-name { font-size: clamp(18px, 1.95vw, 26px); font-weight: 560; line-height: 1.22; }
.practice-situation { color: var(--chapter-muted); font-size: clamp(15px, 1.15vw, 17px); line-height: 1.48; }
summary::-webkit-details-marker { display: none; }
.practice-list :is(summary:hover, summary:focus-visible, details[open] summary) .practice-name { color: var(--chapter-accent); }
.practice-list details[open] { background: var(--chapter-panel); box-shadow: inset 2px 0 var(--chapter-accent); }
.practice-list summary .number { align-self: start; margin-top: 6px; color: var(--chapter-accent); }
.number { color: var(--bronze); font-size: 11px; font-weight: 550; line-height: 1; }
.plus { position: relative; width: 15px; height: 15px; color: var(--bronze); }
.plus::before, .plus::after { content: ""; position: absolute; background: currentColor; }
.plus::before { inset: 7px 0; }
.plus::after { inset: 0 7px; }
.disclosure {
  --disclosure-duration: 680ms;
  --disclosure-ease: cubic-bezier(.32, 0, .2, 1);
  --disclosure-content-in: 490ms;
  --disclosure-content-out: 260ms;
  --disclosure-content-delay: 110ms;
}
:is(.disclosure-body > :is(p, .practice-actions), .history-panel.is-collapsible :is(.history-header, .profile-metrics, .history-facts, .history-grid > div, .history-registration)) {
  opacity: 0;
  transform: translateY(-12px);
  transition: opacity var(--disclosure-content-out) ease,
              transform var(--disclosure-content-out) var(--disclosure-ease);
}
.disclosure[open] .disclosure-body > :is(p, .practice-actions),
.history-panel.is-revealed :is(.history-header, .profile-metrics, .history-facts, .history-grid > div, .history-registration) {
  opacity: 1;
  transform: translateY(0);
  transition-duration: var(--disclosure-content-in);
  transition-delay: var(--disclosure-content-delay);
}
@starting-style {
  .disclosure[open] .disclosure-body > :is(p, .practice-actions) { opacity: 0; transform: translateY(-12px); }
}
.disclosure .plus {
  flex: 0 0 auto;
  width: var(--row-control, 36px);
  height: var(--row-control, 36px);
  border: 1px solid var(--chapter-rule);
  border-radius: 50%;
  color: var(--chapter-accent);
  transition: color .32s ease, background-color .32s ease, border-color .32s ease;
}
.disclosure .plus::before { inset: 50% auto auto 50%; width: 10px; height: 1px; transform: translate(-50%, -50%); }
.disclosure .plus::after {
  inset: 50% auto auto 50%;
  width: 1px;
  height: 10px;
  transform: translate(-50%, -50%);
  transition: transform .32s var(--disclosure-ease);
}
.disclosure :is(summary:hover, summary:focus-visible) .plus, .disclosure:is([open], [aria-expanded="true"]) .plus { border-color: var(--chapter-accent); }
.disclosure:is([open], [aria-expanded="true"]) .plus { color: var(--ivory); background: var(--chapter-accent); }
.practice-list .disclosure[open] .plus { color: var(--practice-surface); }
.disclosure:is([open], [aria-expanded="true"]) .plus::after { transform: translate(-50%, -50%) scaleY(0); }
@supports selector(details::details-content) and (transition-behavior: allow-discrete) {
  .disclosure::details-content {
    display: grid;
    grid-template-rows: 0fr;
    overflow: clip;
    transition: grid-template-rows var(--disclosure-duration) var(--disclosure-ease),
                content-visibility var(--disclosure-duration) allow-discrete;
  }
  .disclosure[open]::details-content { grid-template-rows: 1fr; }
  .disclosure-body { min-block-size: 0; overflow: clip; }
}
.practice-list .disclosure-body > p {
  color: var(--ivory);
  padding: 0 calc(var(--row-control) + var(--row-gap) + var(--row-padding)) 10px var(--row-text-start);
  font-size: 15px;
}
.practice-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 2px 12px 14px var(--row-text-start);
}
.practice-actions:not(:has(a, button:not([hidden]))) { display: none; }
.practice-detail-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 6px 12px;
  border: 1px solid var(--chapter-rule);
  border-radius: var(--control-radius);
  color: var(--gold);
  font: 600 14px/1.3 Inter, sans-serif;
}
.practice-detail-link svg { flex: none; width: 16px; height: 16px; }
.practice-detail-link:is(:hover, :focus-visible) { border-color: var(--gold); background: rgb(228 188 120 / .09); }
.practice-detail-link:focus-visible { outline-color: var(--gold); outline-offset: -3px; }
.practice-enquiry-action {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 48px;
  max-inline-size: 100%;
  padding: 6px 6px 6px 14px;
  border: 1px solid rgb(228 188 120 / .5);
  border-radius: var(--control-radius);
  background: linear-gradient(110deg, #143237, #0a252a);
  color: var(--ivory);
  box-shadow: inset 0 1px rgb(255 255 255 / .06), 0 4px 10px rgb(7 15 23 / .15);
  font: 600 14px/1.3 Inter, sans-serif;
  text-align: start;
  cursor: pointer;
}
.practice-enquiry-icon {
  display: grid;
  flex: none;
  place-items: center;
  inline-size: 34px;
  block-size: 34px;
  border-radius: 8px;
  background: linear-gradient(135deg, #f6e4c1, var(--gold));
  color: var(--night-deep);
  box-shadow: inset 0 1px rgb(255 255 255 / .45);
}
.practice-enquiry-action::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(110deg, transparent 37%, rgb(228 188 120 / .16) 50%, transparent 63%) 100% 0 / 260% 100% no-repeat;
  pointer-events: none;
  content: "";
}
.practice-enquiry-action:is(:hover, :focus-visible) { border-color: var(--gold); }
.practice-enquiry-action:focus-visible { outline-color: var(--ivory); outline-offset: 3px; }
@media (prefers-reduced-motion: no-preference) {
  .practice-enquiry-action::before { transition: background-position .6s ease-out; }
  .practice-enquiry-action:is(:hover, :focus-visible)::before { background-position: 0 0; }
  .practice-enquiry-icon { transition: transform .24s ease; }
  .practice-enquiry-action:is(:hover, :focus-visible) .practice-enquiry-icon { transform: translateY(-1px); }
}
.practice-contact { margin: 18px 0 0 var(--row-text-start); }
.practice-contact p { max-width: 48ch; color: var(--chapter-muted); font-size: 14px; }
.office { grid-area: office; }
.office img { width: 100%; height: auto; border-radius: 3px; filter: saturate(.82) contrast(1.04); }
.office figcaption { display: grid; gap: 2px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--chapter-rule); color: var(--chapter-muted); font-size: 13px; }
.office figcaption strong { color: var(--ivory); font-size: 15px; font-weight: 580; }

.chapter-heading { margin-bottom: clamp(20px, 2.7vw, 34px); text-align: center; }
.chapter-heading h2 { font-size: clamp(32px, 4.25vw, 59px); font-weight: 580; }
.chapter-heading .intro {
  max-width: 52ch;
  margin: 12px auto 0;
  color: var(--chapter-muted);
  font-size: clamp(15px, 1.3vw, 17px);
}

.approach-art::before, .approach-art::after, .contact::after {
  content: "";
  position: absolute;
  z-index: -1;
  aspect-ratio: 3 / 2;
  background: var(--themis-art) center / 100% 100% no-repeat;
  filter: url(#themis-relief);
  mask-image: linear-gradient(90deg,
                transparent 2%, #0002 8%, #0009 15%, #000 23% 74%,
                #000d 80%, #0008 86%, #0003 91%, #0001 95%, transparent 98%),
              linear-gradient(180deg,
                transparent 2%, #0002 6%, #0008 11%, #000 19% 48%,
                #000c 62%, #0006 76%, #0002 89%, transparent 98%);
  mask-position: center;
  mask-size: 100% 100%;
  mask-repeat: no-repeat;
  mask-composite: intersect;
  pointer-events: none;
}
.approach {
  isolation: isolate;
  overflow: clip;
  background: radial-gradient(ellipse at 50% 12%, #fffdf8, transparent 70%),
              linear-gradient(145deg, #f7f3ea 26%, #e9ddc8);
  color: var(--ink);
}
.approach-content { position: relative; }
.approach-art {
  position: absolute;
  inset: 0;
  pointer-events: none;
  --themis-left-width: clamp(360px, 37vw, 520px);
  --themis-right-width: calc(var(--themis-left-width) * .86);
  --themis-head-line: calc(clamp(12px, 1.37vw, 19px) - var(--chapter-index-gap));
}
/* The crowns sit at different offsets within the source images. */
.approach-art::before {
  --themis-art: url(assets/practice-themis-profile.webp);
  inset: calc(var(--themis-head-line) - var(--themis-right-width) * .027) clamp(8px, 1.9vw, 29px) auto auto;
  width: var(--themis-right-width);
  opacity: .63;
}
.approach-art::after {
  --themis-art: url(assets/practice-themis.webp);
  inset: calc(var(--themis-head-line) - var(--themis-left-width) * .076) auto auto max(-120px, -8.5vw);
  width: var(--themis-left-width);
  opacity: .49;
}
.approach .chapter-heading { margin-bottom: clamp(24px, 3.4vw, 46px); }
.approach .chapter-heading .intro { max-width: 50ch; text-wrap: balance; }
.approach-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 1.45vw, 20px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.approach-list li {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 16px;
  padding: clamp(16px, 1.8vw, 25px);
  border: 1px solid #d8c6a9;
  border-radius: var(--control-radius);
  background: linear-gradient(90deg, #b99053, #d5b47e24) 24px 0 / 56px 1px no-repeat,
              linear-gradient(145deg, #fffdf8, #f3ebdd);
  box-shadow: inset 0 1px #fff, 0 7px 18px rgb(73 50 25 / .065);
}
.approach-list li > div { display: flex; flex-direction: column; align-items: flex-start; }
.approach-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid #d7bb8c;
  border-radius: 10px;
  background: linear-gradient(145deg, #fbf5e8, #ebd7b4);
  color: var(--bronze);
  box-shadow: inset 0 1px rgb(255 255 255 / .85);
}
.approach-list h3 { margin: 0 0 8px; font-size: clamp(17px, 1.5vw, 21px); font-weight: 620; line-height: 1.25; }
.approach-list p { color: var(--muted); font-size: 15px; line-height: 1.55; }
.approach-bio {
  margin-top: auto;
  padding-top: 6px;
  color: var(--bronze);
}
.approach-bio > :first-child { text-decoration: underline; text-underline-offset: 3px; }
.approach-bio:is(:hover, :focus-visible) { color: var(--ink); }
.approach-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2.4vw, 34px);
  margin-top: clamp(20px, 2.8vw, 38px);
}
.approach-footer::before, .approach-footer::after {
  content: "";
  flex: 1;
  max-width: 134px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #b9965b);
}
.approach-footer::after { transform: scaleX(-1); }

.faq {
  --chapter-accent: var(--gold);
  --chapter-rule: var(--gold-rule);
  --chapter-muted: #d3dde7;
  isolation: isolate;
  overflow: clip;
  background: radial-gradient(ellipse at 50% 18%, #1c3044, transparent 72%),
              linear-gradient(154deg, #142133, var(--night) 78%);
  color: var(--ivory);
}
.faq::before {
  --faq-art-width: clamp(630px, 62vw, 900px);
  content: "";
  position: absolute;
  inset: 36px -105px auto auto;
  z-index: -1;
  width: var(--faq-art-width);
  aspect-ratio: 4 / 3;
  background: linear-gradient(90deg, #111c2c70 40%, #111c2c45 56%, transparent 64%),
              url(assets/faq-themis.webp) center / cover no-repeat;
  mask-image: linear-gradient(90deg, transparent, #000 38% 74%, transparent),
              linear-gradient(180deg, transparent, #000 18% 54%, transparent);
  mask-composite: intersect;
  opacity: .34;
  pointer-events: none;
}
.faq-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, .43fr);
  align-items: start;
  gap: clamp(20px, 3.25vw, 48px);
  width: min(100%, 1080px);
  margin-inline: auto;
}
.faq-list {
  --faq-inset: clamp(12px, 1.75vw, 23px);
  --faq-number: 20px;
  --faq-gap: clamp(10px, 1.5vw, 18px);
  border-block: 1px solid var(--chapter-rule);
}
.faq-list .disclosure {
  --row-control: 32px;
  --disclosure-duration: 520ms;
  --disclosure-content-in: 350ms;
  --disclosure-content-out: 170ms;
  --disclosure-content-delay: 70ms;
  transition: background-color .3s ease, box-shadow .3s ease;
}
.faq-list details + details { border-top: 1px solid var(--chapter-rule); }
.faq-list summary {
  display: grid;
  grid-template-columns: var(--faq-number) minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--faq-gap);
  min-height: 62px;
  padding: 10px var(--faq-inset);
  font-size: clamp(15px, 1.4vw, 18px);
  font-weight: 590;
  line-height: 1.35;
  list-style: none;
  text-align: start;
  cursor: pointer;
  transition: color .25s ease, background-color .25s ease;
}
.faq-number { color: var(--gold); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.faq-list summary:focus-visible { outline-color: var(--gold); outline-offset: -4px; }
.faq-list :is(summary:hover, summary:focus-visible, details[open] summary) { color: var(--gold); }
.faq-list details:not([open]) summary:is(:hover, :focus-visible) { background-color: rgb(247 244 237 / .045); }
.faq-list details[open] { background-color: #1e3442; box-shadow: inset 2px 0 var(--gold); }
.faq-list details[open] .plus { color: var(--night-deep); }
.faq-list .disclosure-body > p {
  max-width: 72ch;
  padding: 0 var(--faq-inset) 17px calc(var(--faq-inset) + var(--faq-number) + var(--faq-gap));
  color: var(--chapter-muted);
  font-size: 15px;
  line-height: 1.65;
}
.faq-reading {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: 10px;
  margin: 0;
  padding: 12px 0;
  border-top: 1px solid var(--chapter-rule);
  list-style: none;
}
.faq-reading a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  height: 100%;
  padding: 9px 9px 9px 14px;
  border: 1px solid #d5bd98;
  border-radius: var(--control-radius);
  background: linear-gradient(135deg, transparent 25%, rgb(228 188 120 / .16)) var(--champagne-light);
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
  box-shadow: inset 0 1px rgb(255 255 255 / .7), 0 4px 12px rgb(7 15 23 / .15);
}
.faq-reading-icon {
  display: grid;
  place-items: center;
  inline-size: 22px;
  color: var(--bronze);
}
.faq-reading-icon svg { width: 19px; height: 19px; }
.faq-reading a:is(:hover, :focus-visible) {
  border-color: var(--gold);
  background-color: #f7ebd4;
}
.faq-reading a:active { background-color: var(--champagne); }
.faq-reading a:focus-visible { outline-color: var(--gold); outline-offset: 3px; }
@media (prefers-reduced-motion: no-preference) {
  .faq-reading a { transition: background-color .2s ease, border-color .2s ease; }
  .faq-reading a:is(:hover, :focus-visible) .consultation-cta-icon { transform: translateX(2px); }
}
.faq-followup {
  padding: clamp(18px, 2.1vw, 30px);
  border: 1px solid #d5bd98;
  border-radius: var(--control-radius);
  background: radial-gradient(ellipse at 92% 0%, #f8f2e7, transparent 80%),
              linear-gradient(150deg, #fbf8f0, #eadbc3);
  color: var(--ink);
  box-shadow: inset 0 1px rgb(255 255 255 / .8), 0 12px 32px rgb(7 14 23 / .22);
  text-align: start;
}
.faq-followup-mark {
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  border: 1px solid #dac6a5;
  border-radius: 50%;
  background: #f4ead9;
  color: var(--bronze);
}
.faq-followup h3 { margin: 14px 0 7px; font-size: clamp(19px, 2vw, 24px); font-weight: 610; line-height: 1.25; }
.faq-followup p { color: var(--muted); font-size: 14px; line-height: 1.55; }
.faq-contact { width: 100%; margin-top: 18px; }

@media (max-width: 760px) {
  .faq::before {
    --faq-art-width: min(115vw, 540px);
    top: 20px;
    right: -94px;
    opacity: .23;
  }
  .faq-content { grid-template-columns: minmax(0, 1fr); }
}

.contact {
  --chapter-muted: #394749;
  --contact-wash: linear-gradient(115deg, var(--champagne-light) 24%, #f6eedf 66%, var(--champagne));
  isolation: isolate;
  overflow: clip;
  background: var(--contact-wash);
  color: var(--ink);
}
.contact::after {
  --themis-art: url(assets/practice-themis.webp);
  inset: clamp(28px, 6vw, 96px) auto auto max(-270px, -19vw);
  width: clamp(590px, 63vw, 900px);
  opacity: .66;
}
.contact-grid {
  width: min(100%, 1100px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas: "copy office" "save office" "social office" ". office";
  grid-template-rows: auto auto auto 1fr;
  align-items: start;
  gap: 20px clamp(28px, 4vw, 58px);
  margin-inline: auto;
}
.contact-copy { grid-area: copy; }
.contact-grid > .contact-save { grid-area: save; }
.contact h3 { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.35; }
.contact-office-head { display: flex; align-items: center; justify-content: space-between; gap: 4px 12px; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; gap: 15px; min-height: 48px; padding: 0 15px; border: 1px solid var(--gold); border-radius: var(--control-radius); font-size: 13px; font-weight: 600; transition: color .2s ease, background-color .2s ease, border-color .2s ease; }
.button.hero-cta { min-height: 49px; padding-inline: 19px; gap: 28px; }
.primary { background: var(--gold); color: var(--night); }
.primary:hover { background: var(--ivory); border-color: var(--ivory); }
.action-arrow { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid currentColor; border-radius: 50%; font-size: 13px; line-height: 1; }
.contact-arrow { color: var(--gold); font-size: 16px; line-height: 1; }
.contact .contact-social { grid-area: social; padding-top: 12px; border-top: 1px solid var(--chapter-rule); }
.office-address {
  grid-area: office;
  --chapter-accent: var(--gold);
  --chapter-muted: #d6e4df;
  --chapter-rule: var(--gold-rule);
  padding: clamp(17px, 2.4vw, 34px);
  border: 1px solid var(--chapter-rule);
  border-radius: var(--control-radius);
  background: linear-gradient(145deg, #123639, #0b252b 56%, var(--night-deep));
  color: var(--ivory);
  box-shadow: inset 0 1px 0 rgb(228 188 120 / .2), 0 14px 32px rgb(34 30 23 / .14);
}
.contact-channels { margin: 9px 0 15px; padding: 0; list-style: none; }
.contact-channels li { border-bottom: 1px solid var(--chapter-rule); }
.contact-channels a {
  display: grid;
  grid-template-columns: 32px minmax(0, .9fr) minmax(0, 1.6fr) 12px;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 5px 2px;
  border-radius: 6px;
  color: var(--chapter-muted);
  font-size: 13px;
  line-height: 1.35;
}
.contact-channels a svg {
  width: 32px;
  height: 32px;
  padding: 7px;
  border-radius: 8px;
  background: rgb(228 188 120 / .1);
  color: var(--gold);
}
.contact-channels strong { color: var(--ivory); font-size: 14px; font-weight: 560; overflow-wrap: anywhere; }
.contact-channels a[href^="tel:"] strong { font-variant-numeric: tabular-nums; }
.contact-channels a:is(:hover, :focus-visible) strong { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.contact-office address { margin: 4px 0; color: var(--ivory); font-size: 14px; font-style: normal; line-height: 1.45; }
.contact-office p { color: var(--chapter-muted); font-size: 13px; }
.contact-map {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 4px 10px;
  border: 1px solid var(--chapter-rule);
  border-radius: 8px;
  background: rgb(228 188 120 / .06);
  color: var(--gold);
  font: 600 12px/1.35 Inter, sans-serif;
  cursor: pointer;
}
.contact-map:focus-visible { outline-offset: 2px; }
.contact-map:is(:hover, [aria-expanded="true"]) { border-color: var(--gold); }
.contact-map:hover span, .contact-map-route:hover span:first-child { text-decoration: underline; text-underline-offset: 3px; }
.contact-map-chevron { transition: transform .25s ease; }
.contact-map[aria-expanded="true"] .contact-map-chevron { transform: rotate(180deg); }
.contact-map-panel {
  display: grid;
  grid-template-rows: 1fr;
  opacity: 1;
  scroll-margin-bottom: 16px;
  transition: grid-template-rows .36s var(--disclosure-ease, ease), opacity .24s ease;
}
.contact-map-panel[inert] { grid-template-rows: 0fr; opacity: 0; }
.contact-map-content { min-height: 0; overflow: hidden; }
.contact-map-view {
  height: clamp(224px, 34vh, 260px);
  margin-top: 12px;
  overflow: hidden;
  border: 1px solid rgb(228 188 120 / .42);
  border-radius: var(--control-radius);
  background: #eee9dc;
}
.contact-map-view iframe { display: block; width: 100%; height: 100%; border: 0; }
.contact-map-route {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding-inline: 4px;
  color: var(--gold);
  font-size: 13px;
  font-weight: 600;
}
.contact-map-route:focus-visible { outline-offset: -2px; }

@media (prefers-reduced-motion: reduce) {
  .contact-map-panel, .contact-map-chevron { transition: none; }
}

@media (max-width: 480px) {
  .contact-channels a { grid-template-columns: 32px minmax(0, 1fr) 12px; gap: 0 9px; min-height: 56px; }
  .contact-channels a svg { grid-area: 1 / 1 / span 2; }
  .contact-channels a strong { grid-column: 2; }
  .contact-channels .contact-arrow { grid-area: 1 / 3 / span 2; }
}

.site-footer {
  display: flex;
  flex-direction: column;
  background: linear-gradient(167deg, #121f2f, var(--night-deep) 74%);
  color: var(--ivory);
}
.institutions {
  --chapter-accent: var(--gold);
  --chapter-rule: var(--gold-rule);
  flex: 1;
  background: radial-gradient(ellipse at 50% 34%, #1b2a3b, transparent 73%);
  text-align: center;
}
.institutions h2 {
  max-width: 25ch;
  margin-inline: auto;
  font-size: clamp(25px, 3.2vw, 42px);
  font-weight: 610;
  line-height: 1.15;
  text-wrap: balance;
}
.institution-list {
  --institution-gap: clamp(10px, 1.35vw, 18px);
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--institution-gap);
  margin: clamp(24px, 4vw, 46px) 0 0;
  padding: 0;
  list-style: none;
}
.institution-link {
  display: grid;
  grid-template-rows: auto 1fr auto;
  justify-items: center;
  align-items: start;
  gap: 13px;
  height: 100%;
  min-height: 216px;
  padding: 20px clamp(8px, 1.25vw, 19px) 14px;
  border: 1px solid #e8d7ba;
  border-radius: var(--control-radius);
  background: linear-gradient(155deg, rgb(255 255 255 / .76), transparent), #f1e9db;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .8), 0 6px 20px rgb(0 0 0 / .18);
  color: var(--ink);
  text-align: center;
  transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.institution-link:is(:hover, :focus-visible) {
  border-color: var(--gold);
  background-color: #ead7b6;
  box-shadow: 0 10px 23px rgb(0 0 0 / .28);
}
.institution-link:focus-visible { outline-color: var(--gold); outline-offset: 3px; }
.institution-label { font-size: 14px; font-weight: 600; line-height: 1.35; text-wrap: balance; overflow-wrap: anywhere; }
.institution-label strong { font-weight: inherit; }
.institution-label small {
  display: table;
  margin: 6px auto 0;
  padding: 2px 8px;
  border: 1px solid #dfceb2;
  border-radius: 20px;
  background: #f5ecdc;
  color: var(--bronze);
  font-size: 11px;
  font-weight: 550;
}
.institution-arrow {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border: 1px solid #ddccb0;
  border-radius: 50%;
  color: var(--bronze);
  font-size: 13px;
  line-height: 1;
  transition: background-color .2s ease, color .2s ease;
}
.institution-link:is(:hover, :focus-visible) .institution-arrow { background: var(--night-deep); color: var(--gold); }
.institution-seal {
  display: grid;
  place-items: center;
  width: 80px;
  height: 80px;
  border: 1px solid #ded0ba;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 30%, #fffefa 15%, #f2e9d9 100%);
  box-shadow: inset 0 0 0 4px rgb(255 255 255 / .52), 0 2px 4px rgb(56 36 16 / .08);
}
.institution-mark { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; width: 60px; height: 57px; overflow: hidden; }
.institution-mark img { width: var(--mark-width); height: auto; max-width: none; filter: drop-shadow(0 2px 2px rgb(31 22 11 / .17)); }
/* Frame the emblems from the source lockups. Text labels are typeset below. */
.mark-bar { --mark-width: 156px; }
.mark-justice { --mark-width: 76px; height: 61px; }
.mark-parliament { --mark-width: 192px; width: 73px; height: 44px; }
.mark-courts { --mark-width: 238px; width: 53px; height: 53px; justify-items: start; }
.mark-e-qanun { --mark-width: 165px; width: 48px; height: 48px; justify-items: start; padding: 5px 4px 3px; border-radius: 50%; background: var(--night-deep); box-shadow: 0 3px 6px rgb(31 22 11 / .22); }

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .institution-link:hover { transform: translateY(-3px); }
}

@media (max-width: 920px) {
  .institution-list { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .institution-list li { grid-column: span 2; }
  .institution-list li:nth-last-child(2) { grid-column: 2 / span 2; }
}

@media (max-width: 620px) {
  .institution-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .institution-list li, .institution-list li:nth-last-child(2) { grid-column: auto; }
  .institution-list li:last-child {
    grid-column: 1 / -1;
    width: calc((100% - var(--institution-gap)) / 2);
    justify-self: center;
  }
  .institution-link { min-height: 188px; padding-block: 14px 12px; }
  .institution-seal { width: 70px; height: 70px; }
}

.motion-ready .section-index[data-reveal] { position: relative; }
.motion-ready .section-index[data-reveal]::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 1px;
  background: var(--chapter-accent);
  transform: scaleX(calc(1 - var(--reveal-remaining, 0)));
  transform-origin: left;
}
.motion-ready .practice[data-reveal]::before {
  opacity: calc(var(--art-opacity) * (1 - .56 * var(--reveal-remaining, 0)));
  transform: translateY(calc(12px * var(--reveal-remaining, 0)));
}
.motion-ready .office img {
  clip-path: inset(0 0 calc(38% * var(--reveal-remaining, 0)) 0);
  transform: translateY(calc(12px * var(--reveal-remaining, 0)));
}
.motion-ready .contact[data-reveal] {
  isolation: isolate;
  background: var(--champagne-light);
}
.motion-ready .office-address[data-reveal] { position: relative; isolation: isolate; }
.motion-ready :is(.contact, .office-address)[data-reveal]::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  opacity: calc(1 - .72 * var(--reveal-remaining, 0));
  pointer-events: none;
}
.motion-ready .contact[data-reveal]::before {
  background: var(--contact-wash);
}
.motion-ready .office-address[data-reveal]::before {
  background: radial-gradient(ellipse at top right, rgb(228 188 120 / .12), transparent 67%);
  box-shadow: inset 0 1px 0 rgb(228 188 120 / .4);
}
.motion-ready .institution-list[data-reveal] .institution-mark {
  opacity: calc(1 - .28 * var(--reveal-remaining, 0));
  transform: translateY(calc(7px * var(--reveal-remaining, 0)));
}

@supports (animation-timeline: view()) {
  @keyframes practice-art-enter {
    from { opacity: calc(.44 * var(--art-opacity)); transform: translateY(12px); }
    to { opacity: var(--art-opacity); transform: translateY(0); }
  }
  @keyframes office-enter {
    from { clip-path: inset(0 0 28%); transform: translateY(12px); }
    to { clip-path: inset(0); transform: translateY(0); }
  }
  @keyframes rule-enter {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
  }
  @keyframes surface-enter {
    from { opacity: .28; }
    to { opacity: 1; }
  }
  @keyframes emblem-enter {
    from { opacity: .72; transform: translateY(7px); }
    to { opacity: 1; transform: translateY(0); }
  }

  .motion-ready [data-reveal] { view-timeline: --chapter-entry block; }
  .motion-ready .section-index[data-reveal]::after,
  .motion-ready .practice[data-reveal]::before,
  .motion-ready .office img,
  .motion-ready :is(.contact, .office-address)[data-reveal]::before,
  .motion-ready .institution-list[data-reveal] .institution-mark {
    animation: var(--entry-animation) cubic-bezier(.22, .61, .36, 1) both;
    animation-timeline: --chapter-entry;
    animation-range: entry 0% entry var(--entry-end, 86%);
  }
  .motion-ready .section-index[data-reveal]::after { --entry-animation: rule-enter; }
  .motion-ready .practice[data-reveal]::before { --entry-animation: practice-art-enter; --entry-end: 54%; }
  .motion-ready .office img { --entry-animation: office-enter; }
  .motion-ready :is(.contact, .office-address)[data-reveal]::before { --entry-animation: surface-enter; --entry-end: 54%; }
  .motion-ready .institution-list[data-reveal] .institution-mark { --entry-animation: emblem-enter; --entry-end: 54%; }
}

.chapter-motion-ready [data-chapter-shot] { overflow: clip; }
.chapter-motion-ready [data-chapter-layer] {
  --chapter-travel: clamp(21px, 2.6vw, 36px);
  translate: 0 calc(var(--chapter-travel) * var(--chapter-layer-progress, 0));
}
.chapter-motion-ready [data-chapter-layer="body"] { --chapter-travel: clamp(32px, 4vw, 54px); }

@supports (animation-timeline: view()) and (animation-range: entry 0% exit 100%) {
  @keyframes chapter-layer-track {
    entry 0% { translate: 0 var(--chapter-travel); }
    entry 92%, exit 8% { translate: 0 0; }
    exit 100% { translate: 0 calc(-1 * var(--chapter-travel)); }
  }
  @keyframes chapter-rule-track {
    entry 0%, exit 100% { transform: scaleX(.08); opacity: .35; }
    entry 88%, exit 12% { transform: scaleX(1); opacity: 1; }
  }
  .chapter-motion-ready [data-chapter-shot] {
    view-timeline: --chapter-shot block;
    view-timeline-inset: var(--header) 0;
  }
  .chapter-motion-ready [data-chapter-layer] {
    animation: chapter-layer-track auto cubic-bezier(.42, 0, .22, 1) both;
    animation-timeline: --chapter-shot;
    animation-range: entry 0% exit 100%;
  }
  .motion-ready [data-chapter-shot] .section-index[data-reveal]::after {
    animation: chapter-rule-track auto cubic-bezier(.42, 0, .22, 1) both;
    animation-timeline: --chapter-shot;
    animation-range: entry 0% exit 100%;
    transform-origin: center;
  }
}

@media (max-width: 1100px) {
  .header-inner { grid-template-columns: 1fr auto; }
  .desktop-nav { display: none; }
  .mobile-menu { display: block; }
  .mobile-menu summary { display: grid; place-items: center; cursor: pointer; list-style: none; width: 44px; height: 44px; }
  .mobile-menu nav { position: absolute; inset: 100% var(--side) auto auto; min-width: 195px; padding: 8px; border: 1px solid #d8ba8e4d; background: var(--night-deep); }
  .mobile-menu nav a { display: flex; align-items: center; min-height: 44px; padding: 0 13px; font-size: 14px; }
  .mobile-menu nav .menu-consultation { display: none; }
  .mobile-menu nav a:hover { color: var(--gold); }
}

@media (max-width: 820px) {
  .history-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .history-qualifications { padding: 16px 0 0; border-inline-start: 0; border-block-start: 1px solid #d9cbb6; }
  .history-facts { grid-template-columns: minmax(0, 1fr); gap: 3px; }
  .contact::after { inset: 24px -68px auto auto; width: max(440px, 78vw); opacity: .44; }
  .contact-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "copy" "office" "save" "social";
    grid-template-rows: none;
  }
}

@container (max-width: 440px) {
  .profile-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-metric-grid > div:nth-child(odd) { border-inline-start: 0; }
  .profile-metric-grid > div:nth-child(-n+2) { padding-bottom: 12px; }
  .profile-metric-grid > div:nth-child(n+3) { padding-top: 12px; border-top: 1px solid var(--gold-rule); }
}

@media (max-width: 940px) {
  .approach-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .approach-art::before { right: 0; }
  .approach-art::after { left: -11vw; }
}

@media (max-width: 600px) {
  .approach .chapter-heading { margin-bottom: 10px; }
  .approach-art {
    position: relative;
    inset: auto;
    overflow: clip;
    block-size: clamp(84px, 23vw, 112px);
    --themis-left-width: clamp(140px, 39vw, 205px);
    --themis-head-line: 5px;
  }
  .approach-art::before { right: calc(25% - var(--themis-right-width) * .27); opacity: .8; }
  .approach-art::after { left: calc(25% - var(--themis-left-width) * .62); opacity: .68; }
  .history-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  .history-header h3 { padding-inline-start: 8px; font-size: clamp(19px, 5.6vw, 25px); }
  .history-close { justify-content: center; width: 44px; padding: 0; }
  .history-close span { display: none; }
  .history-facts dl { grid-template-columns: minmax(0, 1fr); }
  .history-registration { grid-template-columns: auto minmax(0, 1fr); }
  .history-identity { grid-column: 1 / -1; }
  .history-register { justify-self: end; }
  .approach-list { grid-template-columns: minmax(0, 1fr); }
  .approach-list li { grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto; gap: 13px; }
  .approach-footer::before, .approach-footer::after { display: none; }
  .button.approach-cta { width: 100%; }
}

@media (min-width: 681px) and (max-height: 720px) {
  .profile { --chapter-padding: 32px; }
  .profile-copy h2 { margin-top: 13px; }
  .profile-copy .intro { margin-top: 18px; }
  .profile-history-toggle { margin-top: 16px; }
}

@media (max-width: 680px) {
  :root { --header: 66px; }
  .header-inner { width: calc(100% - 2 * max(12px, env(safe-area-inset-left))); grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
  .brand { gap: 7px; min-width: 0; }
  .brand-lockup, .brand-wordmark { width: 38px; }
  .brand-mark { width: 34px; }
  .brand-identity { min-width: 0; white-space: normal; }
  .brand-identity strong { font-size: 13px; }
  .brand-identity small { font-size: 10px; }
  .header-actions { gap: 2px; }
  .button.header-contact { padding-inline: 7px; font-size: 11px; }
  .languages a { min-width: 24px; }
  .city img, .city-film { object-position: 62% 50%; }
  .city-film { object-position: calc(62% - var(--themis-side-shift, 18%) * var(--themis-framing)) calc(50% * (1 - var(--themis-framing)) + 16px * var(--themis-framing)); }
  .stage { min-height: 520px; }
  h1 { font-size: clamp(37px, 10.6vw, 56px); margin: 15px 0 15px; }
  .hero-description { max-width: 31ch; }
  .hero-cta { margin-top: 18px; }
  .stage-bottom { padding-top: 8px; }
  .motion-ready .story {
    --stage-height: max(520px, 100svh);
    --runway-height: min(46svh, 380px);
  }
  .profile-grid { grid-template-columns: minmax(0, 1fr); gap: 27px; }
  .profile-grid { grid-template-areas: "bio" "photo"; }
  .practice-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "heading" "list" "office"; }
  .practice h2 { font-size: clamp(32px, 8.45vw, 34px); }
  .practice::before { --art-opacity: .21; height: min(100%, 430px); background-position: center, 90% 20%; mask-image: var(--art-fade); }
  .practice-list { --row-number: 20px; --row-gap: 9px; --row-padding: 5px; --row-control: 26px; }
  .practice-list summary { min-height: 72px; padding-block: 12px; }
  .practice-list .disclosure-body > p { padding-inline-end: 14px; }
  .practice-actions { flex-direction: column; align-items: stretch; }
  .practice-detail-link { justify-content: space-between; }
  .portrait { width: 100%; }
  .portrait-image img { max-height: 460px; }
  .profile-copy .intro { margin-top: 17px; }
}

@media (max-width: 680px) and (orientation: portrait) and (min-aspect-ratio: 1 / 2) {
  .city-film { --themis-side-shift: 21%; }
}

@media (max-width: 430px) {
  .button.header-contact { display: none; }
  .mobile-menu nav .menu-consultation { display: flex; color: var(--gold); }
}

@media (max-width: 360px) {
  .scroll-cue { gap: 7px; font-size: 12px; }
}

@media (orientation: landscape) and (max-height: 580px) {
  .stage { display: flex; flex-direction: column; align-items: stretch; height: auto; min-height: max(470px, 100svh); padding-block-end: 0; }
  .stage-copy { padding-bottom: 16px; }
  .stage-bottom {
    position: relative;
    inset: auto;
    margin-top: auto;
    margin-bottom: max(24px, env(safe-area-inset-bottom));
  }
  h1 { max-width: 18ch; font-size: clamp(37px, 6vw, 60px); }
}

@media (max-width: 1120px) and (orientation: landscape) and (max-height: 580px) {
  .stage h1 { max-width: 11.5ch; }
}

@media (prefers-contrast: more) {
  :root { --muted: #343a3c; --bronze: #68441d; --gold: #f1ca85; --hero-shade: .94; }
  .site-header { background: var(--night-deep); }
  .sky-shade { background: linear-gradient(0deg, var(--night-deep) 110px, transparent 225px); }
  .practice::before { --art-opacity: .12; }
  .faq::before { opacity: .12; }
  .approach-art::before, .approach-art::after { opacity: .18; }
}

@media (forced-colors: active) {
  .city, .sky-shade, .hero-text::before, .practice::before, .faq::before,
  .approach-art, .contact::after { display: none; }
  .approach .chapter-heading { margin-bottom: clamp(24px, 3.4vw, 46px); }
}

@media (prefers-reduced-motion: reduce) {
  .disclosure { --disclosure-duration: 0s; }
  *, *::before, *::after { transition-duration: 0s !important; transition-delay: 0s !important; }
  .city, .stage-copy { transform: none; opacity: 1; }
  .city-film { display: none; }
  .motion-ready .profile-sheet { background: var(--profile-wash); pointer-events: auto; }
  .motion-ready .profile-sheet::before { display: none; }
  .motion-ready .sky-shade::after { display: none; }
  .portrait-image img, .cue-arrow { transform: none; }
  .motion-ready .portrait, .motion-ready .profile-copy > :is(.eyebrow, .intro, .profile-metrics, .profile-history-toggle) { transform: none; opacity: 1; }
  .motion-ready .profile-sheet .section-index { opacity: 1; }
  .motion-ready .profile-copy > :is(.profile-metrics, .profile-history-toggle) { visibility: visible; }
  .motion-ready .profile-copy h2 { background: none; color: var(--ink); opacity: 1; }
  .motion-ready .portrait figcaption { opacity: 1; transform: none; }
  .cue-meter { display: none; }
}
