/* AA Investments site styles. Tokens come from the brand kit. No shadows, square, flat. */
@font-face { font-family: "Source Serif 4"; src: url(fonts/SourceSerif4-400.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url(fonts/SourceSerif4-600.woff2) format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url(fonts/IBMPlexSans-400.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url(fonts/IBMPlexSans-500.woff2) format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url(fonts/IBMPlexSans-600.woff2) format("woff2"); font-weight: 600; font-display: swap; }

:root {
  --navy: #0e2038; --navy-soft: #1f3550; --steel: #5b6f86; --glacier: #6fa3be;
  --surface: #f7f8fa; --tint: #e8ecf1; --line: #d5dce4; --accent: #2f6f8f;

  --sc-canvas: #0e2038;
  --sc-surface: #f7f8fa;
  --sc-ink: #0e2038;
  --sc-ink-soft: #4e6178;
  --sc-accent: #2f6f8f;
  --sc-accent-ink: #ffffff;
  --sc-font-display: "Source Serif 4", Georgia, serif;
  --sc-font-text: "IBM Plex Sans", system-ui, sans-serif;
  --sc-r-sm: 2px; --sc-r-md: 4px;
  --sc-gutter: clamp(1rem, 5vw, 5rem);
  --sc-maxw: 78rem;

  --pad: clamp(3rem, 8vw, 6rem);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}
html { background: var(--navy); }
body { font-size: 1rem; line-height: 1.625; letter-spacing: 0; }

/* Grounds. Each restates color, because ink tokens do not re-ink inherited text. */
.g-navy  { background: var(--navy);    --sc-ink: #f2f5f8; --sc-ink-soft: #a9b8c9; --sc-accent: #6fa3be; --sc-accent-ink: #0e2038; color: var(--sc-ink); }
.g-light { background: var(--surface); --sc-ink: #0e2038; --sc-ink-soft: #4e6178; --sc-accent: #2f6f8f; --sc-accent-ink: #fff;    color: var(--sc-ink); }
.g-tint  { background: var(--tint);    --sc-ink: #0e2038; --sc-ink-soft: #3f5169; --sc-accent: #2f6f8f; --sc-accent-ink: #fff;    color: var(--sc-ink); }

.wrap { width: 100%; max-width: var(--sc-maxw); margin-inline: auto; padding-inline: var(--sc-gutter); }
.chapter { padding-block: var(--pad); position: relative; }

/* Type, from the kit: display 56/60, headline 36/42, title 24/30, body 16/26. */
.t-display { font-family: var(--sc-font-display); font-weight: 600; font-size: clamp(2.5rem, 5vw, 3.5rem); line-height: 1.07; letter-spacing: -0.01em; margin: 0; text-wrap: balance; }
.t-headline { font-family: var(--sc-font-display); font-weight: 600; font-size: clamp(1.7rem, 3.2vw, 2.25rem); line-height: 1.17; letter-spacing: -0.005em; margin: 0; text-wrap: balance; }
.t-title { font-family: var(--sc-font-display); font-weight: 600; font-size: 1.5rem; line-height: 1.25; margin: 0; }
.t-body { font-size: 1rem; line-height: 1.625; color: var(--sc-ink-soft); max-width: 62ch; margin: 0; text-wrap: pretty; }
.t-lede { font-size: clamp(1.05rem, 1.4vw, 1.2rem); line-height: 1.55; color: var(--sc-ink); max-width: 56ch; margin: 0; text-wrap: pretty; }
.t-label { font-size: 0.8125rem; line-height: 1.4; font-weight: 500; letter-spacing: 0.02em; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.stack > * + * { margin-top: 1.25rem; }
.stack > .t-headline + * { margin-top: 1.5rem; }

a { text-underline-offset: 0.2em; }
.link { color: var(--sc-ink); text-decoration: none; background-image: linear-gradient(currentColor, currentColor); background-size: 0 1px; background-position: 0 100%; background-repeat: no-repeat; transition: background-size 220ms var(--ease); }
@media (hover: hover) and (pointer: fine) { .link:hover { background-size: 100% 1px; } }
.link[aria-current="page"] { background-size: 100% 1px; }

/* Buttons. Primary is a solid fill, secondary an outline. Hover wipes left to right. */
.btn { position: relative; display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.8rem 1.25rem; font-size: 0.9375rem; line-height: 1.25rem; font-weight: 500; text-decoration: none; border-radius: 2px; overflow: hidden; isolation: isolate; white-space: nowrap; transition: color 200ms var(--ease), transform 120ms var(--ease); }
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; transform: scaleX(0); transform-origin: left; transition: transform 320ms var(--ease); }
.btn svg { width: 1em; height: 1em; transition: transform 240ms var(--ease); flex: none; }
.btn:active { transform: translateY(1px); }
.btn--primary { background: #f2f5f8; color: #0e2038; }
.btn--primary::before { background: #ffffff; }
.g-light .btn--primary, .g-tint .btn--primary { background: #0e2038; color: #fff; }
.g-light .btn--primary::before, .g-tint .btn--primary::before { background: #1f3550; }
.btn--ghost { color: #0e2038; box-shadow: none; border: 1px solid #5b6f86; }
.btn--ghost::before { background: #0e2038; }
@media (hover: hover) and (pointer: fine) {
  .btn:hover::before { transform: scaleX(1); }
  .btn:hover svg { transform: translateX(4px); }
  .btn--ghost:hover { color: #fff; }
}
:focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 2px; }

/* Header on the title page. Static: it scrolls away with the page. */
.top { position: absolute; inset: 0 0 auto 0; z-index: 5; }
.top__in { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: 1.5rem; }
.brand { display: inline-flex; align-items: center; gap: 0.7rem; color: inherit; text-decoration: none; }
.brand svg { width: 2.1rem; height: 2.1rem; flex: none; }
.brand span { font-family: var(--sc-font-display); font-weight: 600; font-size: 1.25rem; letter-spacing: 0; line-height: 1; }
.top nav { display: flex; align-items: center; gap: 1.75rem; }
.lang { display: inline-flex; gap: 0.6rem; }
.lang a { text-decoration: none; opacity: 0.7; }
.lang a[aria-current="true"] { opacity: 1; background-size: 100% 1px; }
@media (max-width: 720px) { .top nav .link--partners { display: none; } .brand span { font-size: 1.1rem; } }

/* Hero / title page */
.hero { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; position: relative; overflow: clip; padding-block: 7rem clamp(3rem, 10vh, 6.5rem); }
.hero__mark { position: absolute; right: var(--sc-gutter); top: clamp(5.5rem, 15vh, 9rem); width: min(38vw, 30rem); max-height: 40vh; aspect-ratio: 120 / 100; pointer-events: none; }
.hero__mark svg { width: 100%; height: 100%; overflow: visible; }
.hero__mark .o { fill: none; stroke: #1f3550; stroke-width: 1.5; stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 2s var(--ease) 0.3s forwards; }
.hero__mark .i { fill: none; stroke: #6fa3be; stroke-width: 1.5; stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.4s var(--ease) 1.4s forwards; }
.hero__h1 { max-width: 20ch; }
.hero__h1 .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: 0.16em; margin-bottom: -0.16em; }
.hero__h1 .w > span { display: inline-block; transform: translateY(112%); animation: rise 1s var(--ease) forwards; animation-delay: calc(var(--i) * 80ms + 350ms); }
.hero__sub, .hero__cta { opacity: 0; transform: translateY(14px); animation: fade 0.9s var(--ease) forwards; }
.hero__sub { margin-top: 1.5rem; max-width: 44ch; color: var(--sc-ink-soft); animation-delay: 1.15s; }
.hero__cta { margin-top: 2rem; animation-delay: 1.35s; }
@keyframes rise { to { transform: none; } }
@keyframes fade { to { opacity: 1; transform: none; } }
@keyframes draw { to { stroke-dashoffset: 0; } }

/* Folio: names the current chapter in the margin. */
.folio { position: fixed; left: 0.9rem; top: 50%; z-index: 30; pointer-events: none; opacity: 0; transition: opacity 400ms var(--ease), color 400ms var(--ease); writing-mode: vertical-rl; transform: translateY(-50%) rotate(180deg); color: #0e2038; }
.folio.on { opacity: 0.8; }
.folio.dark { color: #a9b8c9; }
@media (max-width: 1100px) { .folio { display: none; } }

/* Intro */
.intro__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem; column-gap: 1.5rem; }
.intro__h { grid-column: 1 / span 7; }
.intro__p { grid-column: 6 / span 7; }
.intro__rule { grid-column: 1 / span 12; height: 1px; background: var(--line); transform-origin: left; }
@media (max-width: 860px) { .intro__h, .intro__p { grid-column: 1 / -1; } }

/* Peak: the building drawing */
.peak { position: relative; }
.peak [data-sc-stage] { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); align-items: center; gap: clamp(1.5rem, 3vw, 3rem); max-width: var(--sc-maxw); margin-inline: auto; padding-inline: var(--sc-gutter); background: var(--navy); }
.peak { background: var(--navy); }
.peak__copy { position: relative; min-height: 15rem; }
.pillar { position: absolute; left: 0; top: 0; right: 0; }
.pillar .t-headline { color: #f2f5f8; }
.pillar .t-body { margin-top: 1rem; max-width: 40ch; }
.pillar__rule { display: block; width: 3.5rem; height: 2px; background: #6fa3be; margin-bottom: 1.5rem; }
.peak__draw { width: 100%; }
.peak__draw svg { width: 100%; height: auto; max-height: 78svh; overflow: visible; color: #f2f5f8; }
.dr { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: square; stroke-linejoin: miter; stroke-dasharray: 1; stroke-dashoffset: calc(1 - clamp(0, (var(--sc-p, 1) - var(--s)) / var(--w), 1)); }
.dr--ground { color: #5b6f86; }
.dr--glacier { color: #6fa3be; }
.dim { color: #a9b8c9; opacity: calc(0.35 + 0.65 * clamp(0, (var(--sc-p, 1) - var(--a)) / 0.04, 1) * (1 - clamp(0, (var(--sc-p, 1) - var(--b)) / 0.04, 1))); }
.dim.dim--end { opacity: calc(0.35 + 0.65 * clamp(0, (var(--sc-p, 1) - var(--a)) / 0.04, 1)); }
.ghost { fill: none; stroke: #a9b8c9; stroke-width: 2; stroke-dasharray: 8 8; opacity: calc(clamp(0, (var(--sc-p, 1) - 0.66) / 0.2, 1) * 0.9); }
@media (max-width: 860px) {
  .peak [data-sc-stage] { grid-template-columns: 1fr; grid-template-rows: minmax(0, 44svh) auto; align-content: center; gap: 1rem; }
  .peak__draw { order: -1; }
  .peak__draw svg { max-height: 42svh; }
  .peak__copy { min-height: 13rem; }
}

/* Projects (only rendered when there are real projects) */
.projects__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem 1.5rem; margin-top: 3rem; }
.project { grid-column: span 6; }
.project:nth-child(3n+1) { grid-column: span 7; }
.project:nth-child(3n+2) { grid-column: span 5; }
.project figure { margin: 0; }
.project img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0; background: var(--tint); }
.project figcaption { margin-top: 0.9rem; }
@media (max-width: 860px) { .project, .project:nth-child(n) { grid-column: 1 / -1; } }

/* Pointer chapter */
.point { padding-block: clamp(4rem, 10vw, 7rem); }
.point__in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem 1.5rem; align-items: end; }
.point__h { grid-column: 1 / span 7; }
.point__p { grid-column: 8 / span 5; }
.point__rule { grid-column: 1 / -1; height: 2px; background: #6fa3be; width: 100%; transform: scaleX(0); transform-origin: left; transition: transform 1100ms var(--ease); }
.sc-in .point__rule, .sc-in.point__rule { transform: none; }
@media (max-width: 860px) { .point__h, .point__p { grid-column: 1 / -1; } }

/* People */
.people__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem 1.5rem; margin-top: 3rem; }
.person { grid-column: span 4; }
.person:nth-child(1) { grid-column: 3 / span 4; }
.person:nth-child(2) { grid-column: 7 / span 4; }
.person figure { margin: 0; }
.person .ph { aspect-ratio: 4 / 5; background: var(--tint); position: relative; overflow: hidden; display: grid; place-items: center; }
.person .ph img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.person .ph svg { width: 28%; opacity: 0.5; }
.person h3 { margin-top: 1.1rem; }
.person p { margin-top: 0.25rem; }
@media (max-width: 860px) { .person:nth-child(n) { grid-column: span 6; } .people__grid { gap: 2rem 1rem; } }
@media (max-width: 520px) { .person:nth-child(n) { grid-column: 1 / -1; } }

/* Footer / colophon */
.foot { padding-block: clamp(3.5rem, 8vw, 6rem) 2.5rem; }
.foot__top { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem 1.5rem; }
.foot__brand { grid-column: 1 / span 5; }
.foot__cols { grid-column: 6 / span 7; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 1.5rem; }
.foot dt { color: var(--sc-ink-soft); font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.02em; }
.foot dd { margin: 0.35rem 0 0; font-size: 0.9375rem; line-height: 1.5; }
.foot__cta { margin-top: 2rem; }
.foot__bar { margin-top: clamp(3rem, 7vw, 5rem); padding-top: 1.5rem; border-top: 1px solid #2e4663; display: flex; gap: 1rem 2rem; flex-wrap: wrap; justify-content: space-between; font-size: 0.8125rem; color: #a9b8c9; }
.ph-text { color: #a9b8c9; }
@media (max-width: 860px) { .foot__brand, .foot__cols { grid-column: 1 / -1; } .foot__cols { grid-template-columns: 1fr 1fr; } }

/* Realtors and investors page */
.look { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem 1.5rem; }
.look__h { grid-column: 1 / span 5; }
.look__rows { grid-column: 6 / span 7; margin: 0; }
.look__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 1rem 1.5rem; padding-block: 1.25rem; border-top: 1px solid var(--line); }
.look__row:last-of-type { border-bottom: 1px solid var(--line); }
.look__row dt { font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.02em; color: var(--sc-ink-soft); padding-top: 0.35rem; }
.look__row dd { margin: 0; font-family: var(--sc-font-display); font-weight: 600; font-size: 1.5rem; line-height: 1.25; }
.look__note { grid-column: 6 / span 7; margin-top: 0.5rem; }
.how { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem 1.5rem; }
.how__h { grid-column: 1 / -1; }
.step { grid-column: span 4; position: relative; padding-top: 1.5rem; }
.step::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: #6fa3be; transform: scaleX(0); transform-origin: left; transition: transform 1000ms var(--ease) 200ms; }
.step.sc-in::before { transform: none; }
.step .t-title { margin-bottom: 0.6rem; }
.invest { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem 1.5rem; }
.invest__h { grid-column: 1 / span 5; }
.invest__p { grid-column: 6 / span 7; }
.close { padding-block: clamp(4rem, 10vw, 7rem) 0; }
.close .foot { padding-top: clamp(3.5rem, 8vw, 5rem); }
@media (max-width: 860px) {
  .look__h, .look__rows, .look__note, .invest__h, .invest__p { grid-column: 1 / -1; }
  .step { grid-column: 1 / -1; }
}

/* Reduced motion: fewer and gentler. Keep opacity, drop movement. */
@media (prefers-reduced-motion: reduce) {
  .hero__h1 .w > span { transform: none; animation: none; }
  .hero__sub, .hero__cta { transform: none; animation: none; opacity: 1; }
  .hero__mark .o, .hero__mark .i { animation: none; stroke-dashoffset: 0; }
  .peak__draw { --sc-p: 1; }
  .point__rule, .step::before { transform: none; transition: none; }
  .btn::before, .btn svg { transition: none; }
}

/* ---------- Visuals ---------- */

/* Belgium map in the intro */
.intro__h { grid-row: 1; }
.intro__p { grid-row: 2; }
.intro__map { grid-column: 1 / span 4; grid-row: 2; margin: 0.5rem 0 0; max-width: 22rem; }
.intro__map svg { width: 100%; height: auto; overflow: visible; }
.map__be { fill: none; stroke: #0e2038; stroke-width: 1.4; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 2.6s var(--ease) 0.2s, fill 900ms var(--ease) 2.2s; }
.map__dot { fill: #0e2038; opacity: 0; transition: opacity 500ms var(--ease) 2.2s; }
.map__ring { fill: none; stroke: #6fa3be; stroke-width: 1.5; opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(0.4); transition: opacity 600ms var(--ease) 2.4s, transform 900ms var(--ease) 2.4s; }
.map__lead { stroke: #5b6f86; stroke-width: 1; opacity: 0; transition: opacity 300ms var(--ease) 2.6s; }
.map__city { font: 500 13px/1 var(--sc-font-text); letter-spacing: 0.02em; fill: #0e2038; opacity: 0; transition: opacity 500ms var(--ease) 2.8s; }
.intro__map figcaption { color: var(--sc-ink-soft); margin-top: 1rem; }
.intro__map.sc-in .map__be { stroke-dashoffset: 0; fill: #e8ecf1; }
.intro__map.sc-in .map__dot, .intro__map.sc-in .map__lead, .intro__map.sc-in .map__city { opacity: 1; }
.intro__map.sc-in .map__ring { opacity: 1; transform: none; }
@media (max-width: 860px) { .intro__map { grid-column: 1 / -1; grid-row: 3; max-width: 18rem; } }

/* Layered hero */
.hero--scene .wrap { position: relative; z-index: 3; }
.hero__scene { position: absolute; top: 0; right: 0; bottom: 0; width: 64%; z-index: 1; overflow: clip;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 34%); mask-image: linear-gradient(to right, transparent 0%, #000 34%); }
.hero__scene img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 78% 100%; }
.scene__layer { position: absolute; inset: -4% 0 0 0; will-change: transform; }
.scene__poster { z-index: 0; transition: opacity 500ms var(--ease); }
.hero__scene .scene__layer { opacity: 0; transition: opacity 700ms var(--ease); }
.hero__scene.is-ready .scene__layer { opacity: 1; }
.hero__scene.is-ready .scene__poster { opacity: 0; }
.hero__scene--single .scene__layer { opacity: 1; }
.scene__plate { animation: slowzoom 20s linear forwards; transform-origin: 70% 80%; }
@keyframes slowzoom { from { transform: scale(1); } to { transform: scale(1.06); } }
.hero--scene::after { content: ""; position: absolute; inset: auto 0 0 0; height: 30%; z-index: 2; pointer-events: none; background: linear-gradient(to top, #0e2038 0%, transparent 100%); }
@media (max-width: 860px) {
  .hero--scene { justify-content: flex-end; }
  .hero__scene { width: 100%; bottom: auto; height: 56svh; -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); }
  .hero__scene img { object-position: 62% 100%; }
  .hero--scene::after { display: none; }
}

/* Street band above the pointer chapter */
.band { background: var(--tint); }
.band__frame { position: relative; height: clamp(18rem, 56vh, 34rem); overflow: hidden; }
.band__frame img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; will-change: transform; transform: scale(1.14); }

/* Partners page detail image */
.look__img { margin-top: 2.5rem; aspect-ratio: 4 / 5; max-width: 22rem; overflow: hidden; position: relative; }
.look__img img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; transform: scale(1.14); will-change: transform; }

@media (prefers-reduced-motion: reduce) {
  .scene__plate { animation: none; }
  .map__be, .map__dot, .map__ring, .map__lead, .map__city { transition: none; }
  .band__frame img, .look__img img { transform: none; }
}
.hero__scene::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 22%; z-index: 4; pointer-events: none; background: linear-gradient(to bottom, rgba(14, 32, 56, 0.72), rgba(14, 32, 56, 0)); }

/* ---------- Hero film: pinned sequence ---------- */
.hero--film { display: block; min-height: 0; padding: 0; height: 260vh; height: 260svh; overflow: visible; }
.hero--film::after { display: none; }
.hero__pin { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: clip; display: flex; flex-direction: column; justify-content: flex-end; padding-block: 7rem clamp(3rem, 10vh, 6.5rem); }
.hero__pin::after { content: ""; position: absolute; inset: auto 0 0 0; height: 18%; z-index: 2; pointer-events: none; background: linear-gradient(to top, #0e2038, rgba(14, 32, 56, 0)); }
.hero--film .hero__scene { inset: 0; width: 100%; -webkit-mask-image: none; mask-image: none; }
.hero--film .scene__layer { inset: 0; will-change: transform; }
.hero--film .hero__scene img { object-position: 78% 100%; }
.scene__layer--plate { transform: translate3d(calc(var(--push, 0) * -1%), 0, 0) scale(calc(1 + var(--push, 0) * 0.06)); transform-origin: 77% 87%; }
.scene__layer--building { transform: translate3d(calc(var(--push, 0) * -4%), 0, 0) scale(calc(1 + var(--push, 0) * 0.2)); transform-origin: 77% 87%; }
.scene__layer--front { transform: translate3d(calc(var(--push, 0) * -10%), calc(var(--push, 0) * 2%), 0) scale(calc(1 + var(--push, 0) * 0.36)); transform-origin: 62% 100%; }
.scene__dusk { position: absolute; inset: 0; background: #0b1a2e; opacity: calc(var(--dusk, 0) * 0.5); }
.hero__veil { position: absolute; inset: 0 auto 0 0; width: 72%; z-index: 2; pointer-events: none; background: linear-gradient(to right, #0e2038 0%, #0e2038 50%, rgba(14, 32, 56, 0) 100%); transform: translate3d(calc(var(--wipe, 0) * -100%), 0, 0); will-change: transform; }
.hero__scrim { position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: var(--scrim, 0); background: linear-gradient(to right, rgba(14, 32, 56, 0.88) 0%, rgba(14, 32, 56, 0.6) 32%, rgba(14, 32, 56, 0) 58%); }
.hero__copy { position: relative; z-index: 3; opacity: calc(1 - var(--fade, 0)); transform: translate3d(0, calc(var(--fade, 0) * -56px), 0); }
.hero__beat { position: absolute; left: 0; right: 0; bottom: clamp(3rem, 12vh, 7rem); z-index: 3; pointer-events: none; }
.hero__beat p { margin: 0; font-family: var(--sc-font-display); font-weight: 600; font-size: clamp(2rem, 4.2vw, 3.5rem); line-height: 1.12; letter-spacing: -0.01em; color: #f2f5f8; opacity: var(--b); transform: translate3d(0, calc((1 - var(--b)) * 28px), 0); }
.hero__beat p:last-child { color: #6fa3be; }

/* Entrance once the layers have loaded */
.hero--film .scene__layer img { transform-origin: 77% 87%; }
.hero--film .is-ready .scene__layer--plate img { animation: inPlate 2.2s var(--ease) both; }
.hero--film .is-ready .scene__layer--building img { animation: inBuilding 1.9s var(--ease) 0.15s both; }
.hero--film .is-ready .scene__layer--front img { animation: inFront 1.9s var(--ease) 0.3s both; }
.hero--film .scene__plate { animation: none; }
@keyframes inPlate { from { transform: scale(1.14); } to { transform: none; } }
@keyframes inBuilding { from { transform: translate3d(0, 6%, 0) scale(1.04); } to { transform: none; } }
@keyframes inFront { from { transform: translate3d(0, 12%, 0); } to { transform: none; } }

@media (max-width: 860px) {
  .hero--film { height: 220vh; height: 220svh; }
  .hero--film .hero__scene { height: 100%; -webkit-mask-image: none; mask-image: none; }
  .hero--film .hero__scene img { object-position: 64% 100%; }
  .hero__veil { inset: auto 0 0 0; width: 100%; height: 66%; background: linear-gradient(to top, #0e2038 0%, #0e2038 58%, rgba(14, 32, 56, 0) 100%); transform: translate3d(0, calc(var(--wipe, 0) * 100%), 0); }
  .hero__scrim { background: linear-gradient(to top, rgba(14, 32, 56, 0.9) 0%, rgba(14, 32, 56, 0.55) 30%, rgba(14, 32, 56, 0) 52%); }
  .hero__beat p { font-size: 2rem; }
  .hero__beat { bottom: 3.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hero--film { height: auto; }
  .hero__pin { position: relative; height: 100vh; height: 100svh; }
  .hero__beat { display: none; }
  .hero--film .is-ready .scene__layer img { animation: none; }
}

/* ---------- Approach: elevation, built up, lit ---------- */
.peak__draw {
  --draw: clamp(0, var(--sc-p, 1) / 0.32, 1);
  --build: clamp(0, (var(--sc-p, 1) - 0.33) / 0.29, 1);
  --lit: clamp(0, (var(--sc-p, 1) - 0.66) / 0.16, 1);
}
.peak__copy { min-height: 0; display: flex; flex-direction: column; gap: 1.75rem; }
.peak__kicker { color: #6fa3be; margin: 0; }
.peak__pillars { position: relative; min-height: 12rem; }
.peak .pillar .t-body { margin-top: 1rem; }
.peak__steps { display: flex; gap: 0.5rem; max-width: 16rem; }
.peak__steps span { flex: 1; height: 2px; background: #2e4663; position: relative; overflow: hidden; }
.peak__steps span::after { content: ""; position: absolute; inset: 0; background: #6fa3be; transform-origin: left; }
.peak__steps .s1::after { transform: scaleX(clamp(0, var(--sc-p, 1) / 0.32, 1)); }
.peak__steps .s2::after { transform: scaleX(clamp(0, (var(--sc-p, 1) - 0.33) / 0.31, 1)); }
.peak__steps .s3::after { transform: scaleX(clamp(0, (var(--sc-p, 1) - 0.66) / 0.3, 1)); }
.elev { width: 100%; height: auto; max-height: 82svh; display: block; overflow: visible; margin-inline: auto; }
.elev__corners { fill: none; stroke: #5b6f86; stroke-width: 2; }
.elev__grid { opacity: calc(clamp(0, var(--draw) * 4, 1) * 0.05 * (1 - var(--lit))); }
.elev__rise { transform: translate3d(0, calc((1 - var(--build)) * 1300px), 0); }
.elev__unlit { opacity: calc(1 - var(--lit) * 0.0); }
.elev__lit { opacity: var(--lit); }
.elev__lines { opacity: calc((1 - clamp(0, (var(--sc-p, 1) - 0.36) / 0.24, 1) * 0.72) * (1 - var(--lit))); }
.ln { fill: none; stroke: #f2f5f8; stroke-width: 2.2; stroke-linecap: butt; stroke-dasharray: 1; stroke-dashoffset: calc(1 - clamp(0, (var(--sc-p, 1) - var(--s)) / var(--w), 1)); }
.ln--ground { stroke: #a9b8c9; }
.ln--datum { stroke: #6fa3be; stroke-width: 1.4; opacity: 0.6; }
.ln--fine { stroke-width: 1.4; opacity: 0.7; }
.ln--dim { stroke: #6fa3be; stroke-width: 1.8; }
.elev__level { stroke: #6fa3be; stroke-width: 3; transform: translate3d(0, calc((1 - var(--build)) * 1300px), 0); opacity: calc(clamp(0, var(--build) * 30, 1) * clamp(0, (1 - var(--build)) * 30, 1)); }
@media (max-width: 860px) {
  .elev { max-height: 46svh; }
  .peak__pillars { min-height: 11rem; }
  .peak__copy { gap: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .peak__draw { --sc-p: 1; }
}
.elev__lvl { font: 500 24px/1 var(--sc-font-text); fill: #6fa3be; text-anchor: end; opacity: clamp(0, (var(--sc-p, 1) - var(--s)) / 0.04, 1); }

/* New taller building: start further right on desktop, glide in as the veil opens */
@media (min-width: 861px) {
  .scene__layer--building { transform: translate3d(calc(var(--push, 0) * -4% + (1 - var(--wipe, 0)) * 12%), 0, 0) scale(calc(1 + var(--push, 0) * 0.16)); transform-origin: 67% 86%; }
  .scene__layer--front { transform: translate3d(calc(var(--push, 0) * -10% + (1 - var(--wipe, 0)) * 12%), calc(var(--push, 0) * 2%), 0) scale(calc(1 + var(--push, 0) * 0.36)); }
  .scene__layer--plate { transform-origin: 67% 86%; }
}

/* ---------- People: text + mark left, flip cards right ---------- */
.people__in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem 1.5rem; align-items: center; }
.people__text { grid-column: 1 / span 5; }
.people__p { margin-top: 1.5rem; max-width: 34ch; }
.people__cards { grid-column: 7 / span 6; display: flex; gap: clamp(1rem, 2.5vw, 2rem); justify-content: flex-end; }
.people__hint { margin-top: 1.25rem; color: var(--sc-ink-soft); }
.h-touch { display: none; }
@media (hover: none) { .h-fine { display: none; } .h-touch { display: inline; } }

/* the two-roof mark */
.people__mark { margin: 2.25rem 0 0; display: flex; align-items: flex-end; gap: 1.25rem; }
.people__mark svg { width: clamp(7rem, 11vw, 9.5rem); height: auto; overflow: visible; }
.pm-o, .pm-i { stroke-width: 1.4; stroke-linejoin: miter; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.6s var(--ease), fill 500ms var(--ease), opacity 400ms var(--ease); }
.pm-o { fill: rgba(14, 32, 56, 0); stroke: #0e2038; }
.pm-i { fill: rgba(111, 163, 190, 0); stroke: #6fa3be; transition-delay: 0.9s, 0s, 0s; }
.people__mark.sc-in .pm-o, .people__mark.sc-in .pm-i { stroke-dashoffset: 0; }
.people__mark.sc-in .pm-o { fill: rgba(14, 32, 56, 0.06); }
.people__mark.sc-in .pm-i { fill: rgba(111, 163, 190, 0.12); }
.people.lit-outer .pm-o { fill: #0e2038; }
.people.lit-inner .pm-i { fill: #6fa3be; }
.people.lit-outer .pm-i, .people.lit-inner .pm-o { opacity: 0.35; }
.people__mark figcaption { display: flex; flex-direction: column; gap: 0.35rem; color: var(--sc-ink-soft); padding-bottom: 0.2rem; }
.pm-cap { display: flex; align-items: center; gap: 0.5rem; transition: color 300ms var(--ease); }
.pm-cap::before { content: ""; width: 1.4rem; height: 2px; background: currentColor; opacity: 0.5; transition: opacity 300ms var(--ease); }
.pm-cap--o::before { background: #0e2038; }
.pm-cap--i::before { background: #6fa3be; }
.people.lit-outer .pm-cap--o, .people.lit-inner .pm-cap--i { color: #0e2038; }
.people.lit-outer .pm-cap--o::before, .people.lit-inner .pm-cap--i::before { opacity: 1; }

/* flip cards */
.pcard { width: clamp(9.5rem, 15vw, 14rem); perspective: 1200px; cursor: pointer; outline: none; }
.pcard:nth-child(2) { margin-top: 3rem; }
.pcard__flip { position: relative; aspect-ratio: 4 / 5; transform-style: preserve-3d; transition: transform 800ms var(--ease); }
.pcard__face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; border-radius: 4px; }
.pcard__front img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 800ms var(--ease); }
.pcard__back { transform: rotateY(180deg); display: flex; flex-direction: column; justify-content: space-between; padding: 1.1rem; }
.pcard__mark { width: 2.2rem; height: auto; }
.pcard__mark .o, .pcard__mark .i { fill: none; stroke-width: 3; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 900ms var(--ease) 250ms; }
.pcard__mark .o { stroke: #f2f5f8; } .pcard__mark .i { stroke: #6fa3be; }
.pcard[data-roof="outer"] .pcard__mark .o { fill: #f2f5f8; } .pcard[data-roof="inner"] .pcard__mark .i { fill: #6fa3be; }
.pcard__role { color: #6fa3be; margin: 0; }
.pcard__name { font-family: var(--sc-font-display); font-weight: 600; font-size: 1.25rem; line-height: 1.2; margin: 0.35rem 0 0; color: #f2f5f8; }
.pcard__line { font-size: 0.875rem; line-height: 1.45; color: #a9b8c9; margin: 0.6rem 0 0; }
.pcard__cap { margin: 0.9rem 0 0; display: flex; flex-direction: column; }
.pcard__capname { font-family: var(--sc-font-display); font-weight: 600; font-size: 1.125rem; line-height: 1.3; }
.pcard__caprole { font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.02em; color: var(--sc-ink-soft); }
.pcard.is-flipped .pcard__flip { transform: rotateY(180deg); }
.pcard.is-flipped .pcard__mark .o, .pcard.is-flipped .pcard__mark .i { stroke-dashoffset: 0; }
@media (hover: hover) and (pointer: fine) {
  .pcard:hover .pcard__flip { transform: rotateY(180deg); }
  .pcard:hover .pcard__mark .o, .pcard:hover .pcard__mark .i { stroke-dashoffset: 0; }
}
.pcard:focus-visible .pcard__flip { outline: 2px solid #2f6f8f; outline-offset: 4px; }
@media (max-width: 860px) {
  .people__text, .people__cards { grid-column: 1 / -1; }
  .people__cards { justify-content: flex-start; }
  .pcard { width: calc(50% - 0.5rem); }
  .pcard:nth-child(2) { margin-top: 2rem; }
  .pcard__back { padding: 0.85rem; }
  .pcard__name { font-size: 1.05rem; }
  .pcard__line { font-size: 0.8125rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pcard__flip { transition: none; }
  .pcard__face { transition: opacity 200ms linear; }
  .pcard.is-flipped .pcard__flip, .pcard:hover .pcard__flip { transform: none; }
  .pcard__back { transform: none; opacity: 0; }
  .pcard.is-flipped .pcard__back, .pcard:hover .pcard__back { opacity: 1; }
  .pm-o, .pm-i, .pcard__mark .o, .pcard__mark .i { transition: none; stroke-dashoffset: 0; }
}

/* People mark v2: outer roof drawn from the left foot, inner roof from the right foot, finish together, then fill */
.people__mark svg { width: clamp(7.5rem, 12vw, 10rem); }
.pm-l { fill: none; stroke-width: 1.3; stroke-linecap: square; stroke-linejoin: miter; stroke-dasharray: 1; stroke-dashoffset: 1; }
.pm-o .pm-l { stroke: #0e2038; }
.pm-i .pm-l { stroke: #2f6f8f; }
.pm-l { transition: stroke-dashoffset 1.8s cubic-bezier(0.65, 0, 0.35, 1) 0.25s; }
.pm-cap0 { transition-duration: 0.25s; transition-delay: 0s; }
.pm-cap1 { transition-duration: 0.25s; transition-delay: 2.05s; }
.pm-fill { opacity: 0; transition: opacity 0.8s var(--ease) 2.3s; }
.pm-fill--o { fill: #0e2038; }
.pm-fill--i { fill: #6fa3be; }
.people__mark.sc-in .pm-l { stroke-dashoffset: 0; }
.people__mark.sc-in .pm-fill { opacity: 1; }
.pm-o, .pm-i, .pm-o *, .pm-i * { fill: none; opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .pm-l, .pm-fill { transition: none; }
  .pm-l { stroke-dashoffset: 0; } .pm-fill { opacity: 1; }
}
.pm-i .pm-l { transition: stroke-dashoffset 1.8s cubic-bezier(0.65, 0, 0.35, 1) 0.25s, stroke-opacity 0.8s var(--ease) 2.3s; }
.pm-i .pm-cap0 { transition: stroke-dashoffset 0.25s linear 0s, stroke-opacity 0.8s var(--ease) 2.3s; }
.pm-i .pm-cap1 { transition: stroke-dashoffset 0.25s linear 2.05s, stroke-opacity 0.8s var(--ease) 2.3s; }
.people__mark.sc-in .pm-i .pm-l { stroke-opacity: 0; }
.pcard__turn { position: absolute; right: 0.6rem; bottom: 0.6rem; z-index: 2; width: 2rem; height: 2rem; display: grid; place-items: center; background: rgba(14, 32, 56, 0.72); color: #f2f5f8; border-radius: 2px; transition: transform 300ms var(--ease); }
.pcard__turn svg { width: 1rem; height: 1rem; }
@media (hover: hover) and (pointer: fine) { .pcard:hover .pcard__turn { transform: rotate(180deg); } }

/* ---------- Contact page ---------- */
.hero--short { min-height: 72vh; min-height: 72svh; }
.contact__in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3rem 1.5rem; align-items: start; }
.contact__direct { grid-column: 1 / span 4; }
.contact__form { grid-column: 6 / span 7; scroll-margin-top: 2rem; }
.contact__kicker { color: #2f6f8f; margin: 0 0 1.25rem; }
.cdir { margin: 0; }
.cdir__row { padding-block: 1.1rem; border-top: 1px solid var(--line); }
.cdir__row:last-child { border-bottom: 1px solid var(--line); }
.cdir__row dt { color: var(--sc-ink-soft); }
.cdir__row dd { margin: 0.4rem 0 0; display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.cdir__val { font-family: var(--sc-font-display); font-weight: 600; font-size: 1.375rem; line-height: 1.3; }
.cdir__copy { background: none; border: 0; padding: 0.25rem 0; color: #2f6f8f; cursor: pointer; flex: none; }
.cdir__copy:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.contact .intro__map { margin-top: 2.5rem; max-width: 18rem; }
.contact__form > .t-headline { margin-bottom: 2rem; }
#cform { display: grid; gap: 1.5rem; }
.fld-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.fld { display: flex; flex-direction: column; gap: 0.5rem; margin: 0; border: 0; padding: 0; min-width: 0; }
.fld label, .fld legend { font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.02em; color: #0e2038; padding: 0; }
.fld__opt { color: var(--sc-ink-soft); font-weight: 400; }
.fld input, .fld textarea { width: 100%; font: 400 1rem/1.5 var(--sc-font-text); color: #0e2038; background: #ffffff; border: 1px solid #5b6f86; border-radius: 2px; padding: 0.75rem 0.85rem; transition: border-color 160ms var(--ease); }
.fld textarea { resize: vertical; min-height: 9rem; }
.fld input:hover, .fld textarea:hover { border-color: #0e2038; }
.fld input:focus-visible, .fld textarea:focus-visible { outline: 2px solid #2f6f8f; outline-offset: 2px; }
.fld [aria-invalid="true"] { border-color: #a3342a; }
.fld__err { margin: 0; min-height: 0; font-size: 0.8125rem; color: #a3342a; }
.fld__err:empty { display: none; }
.chips legend { margin-bottom: 0.6rem; }
.chips__list { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.chip { position: relative; cursor: pointer; }
.chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.chip span { display: inline-block; padding: 0.55rem 0.9rem; border: 1px solid #5b6f86; border-radius: 2px; font-size: 0.875rem; color: #0e2038; background: #fff; transition: background 160ms var(--ease), color 160ms var(--ease), border-color 160ms var(--ease); }
.chip:hover span { border-color: #0e2038; }
.chip input:checked + span { background: #0e2038; border-color: #0e2038; color: #fff; }
.chip input:focus-visible + span { outline: 2px solid #2f6f8f; outline-offset: 2px; }
.cform__foot { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; margin-top: 0.5rem; }
.cform__privacy { color: var(--sc-ink-soft); margin: 0; max-width: 32ch; }
.cform__ok { border-top: 2px solid #6fa3be; padding-top: 1.5rem; outline: none; }
.cform__ok .t-body { margin-top: 0.75rem; }
.cform__preview { margin: 1.25rem 0 0; padding: 1rem 1.1rem; background: #e8ecf1; border-radius: 4px; font: 400 0.875rem/1.55 var(--sc-font-text); color: #0e2038; white-space: pre-wrap; max-height: 16rem; overflow: auto; }
.cform__actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 1.5rem; }
.cform__again { background: none; border: 0; cursor: pointer; padding: 0; }
.btn--ghost { background: transparent; cursor: pointer; font-family: inherit; }
button.btn { cursor: pointer; border: 0; font-family: inherit; }
button.btn--ghost { border: 1px solid #5b6f86; }
@media (max-width: 860px) {
  .contact__direct, .contact__form { grid-column: 1 / -1; }
  .fld-row { grid-template-columns: 1fr; }
  .cdir__val { font-size: 1.2rem; }
}
@media (max-width: 720px) { .top nav { gap: 1.1rem; } }
#cform[hidden], .cform__ok[hidden] { display: none; }
.cform__fail { margin: 1.25rem 0 0; padding: 0.9rem 1rem; border-left: 1px solid #a3342a; background: #fbeeec; color: #a3342a; font-size: 0.9375rem; line-height: 1.5; }
.cform__fail a { color: inherit; }
button.btn:disabled { opacity: 0.7; cursor: progress; }

/* ---------- Contact hero: the facade lights up ---------- */
.hero--short .facade { position: absolute; right: var(--sc-gutter); bottom: 0; top: 4.5rem; width: min(46vw, 40rem); z-index: 1; pointer-events: none; }
.facade svg { width: 100%; height: 100%; display: block; overflow: visible; }
.hero--short .wrap { position: relative; z-index: 2; }
.fc-l { fill: none; stroke: #4e6a8a; stroke-width: 1.5; stroke-dasharray: 1; stroke-dashoffset: 1; animation: fcDraw 1.1s var(--ease) var(--d) forwards; }
.fc-l--floor { stroke: #24405f; stroke-width: 1; }
.fc-l--ground { stroke: #6fa3be; stroke-width: 1.5; }
.fc-frame { stroke: #3d5878; stroke-width: 1.2; animation-duration: 0.8s; }
.fc-glass { fill: #12284a; opacity: 0; animation: fcIn 0.6s var(--ease) 0.6s forwards; }
.fc-w--warm .fc-glass { animation: fcIn 0.6s var(--ease) 0.6s forwards, fcWarm 0.9s var(--ease) var(--d) forwards; }
.fc-w--blue .fc-glass { animation: fcIn 0.6s var(--ease) 0.6s forwards, fcBlue 0.9s var(--ease) var(--d) forwards; }
.fc-hl { fill: #6fa3be; opacity: calc(var(--near, 0) * 0.35); transition: opacity 240ms var(--ease); pointer-events: none; }
.fc-door .fc-glass { animation: fcIn 0.6s var(--ease) 0.6s forwards, fcDoor 1.2s var(--ease) 3.9s forwards; }
.fc-spill { fill: url(#spill); opacity: 0; animation: fcFade 1.4s var(--ease) 4.2s forwards; }
@keyframes fcDraw { to { stroke-dashoffset: 0; } }
@keyframes fcIn { to { opacity: 1; } }
@keyframes fcFade { to { opacity: 1; } }
@keyframes fcWarm { from { fill: #12284a; } to { fill: #e8c48f; } }
@keyframes fcBlue { from { fill: #12284a; } to { fill: #5d8fb0; } }
@keyframes fcDoor { from { fill: #12284a; } to { fill: #f6dcb0; } }
@media (max-width: 860px) {
  .hero--short .facade { right: 0; left: 28%; top: 4rem; bottom: auto; height: 52%; width: auto; opacity: 0.55; }
}
@media (prefers-reduced-motion: reduce) {
  .fc-l, .fc-glass, .fc-spill, .fc-w--warm .fc-glass, .fc-w--blue .fc-glass, .fc-door .fc-glass { animation: none; }
  .fc-l { stroke-dashoffset: 0; } .fc-glass { opacity: 1; } .fc-spill { opacity: 1; }
  .fc-w--warm .fc-glass { fill: #e8c48f; } .fc-w--blue .fc-glass { fill: #5d8fb0; } .fc-door .fc-glass { fill: #f6dcb0; }
}
.hero--short.hero--scene::after { display: none; }
.hero--short .facade { bottom: 1.5rem; }
.fc-l { stroke: #5b7799; }
.fc-frame { stroke: #46617f; }
@media (max-width: 860px) {
  .hero--short { min-height: 0; padding-top: calc(5rem + 38svh); }
  .hero--short .facade { left: 14%; right: 0; top: 4.75rem; height: 36svh; bottom: auto; width: auto; opacity: 1; }
  .hero--short .facade svg { preserveAspectRatio: xMidYMax; }
}

/* ---------- Privacy + 404 ---------- */
.pv-hero { padding-block: 9rem 3.5rem; position: relative; }
.pv-hero__date { color: #a9b8c9; margin-top: 1rem; }
.pv { max-width: 46rem; }
.pv__sec + .pv__sec { margin-top: 2.25rem; padding-top: 2.25rem; border-top: 1px solid var(--line); }
.pv__sec .t-body { margin-top: 0.75rem; color: #3f5169; }
.nf { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; }
.nf .brand { margin-bottom: 4rem; }
.nf .t-lede { margin-top: 1.25rem; color: #a9b8c9; }
.nf .t-body { margin-top: 0.75rem; }
.nf__cta { margin-top: 2.5rem; display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }
.cform__privacy .link { color: inherit; text-decoration: underline; text-underline-offset: 0.2em; }
.sr-only:focus-visible { position: fixed; left: 1rem; top: 1rem; width: auto; height: auto; clip-path: none; white-space: normal; z-index: 100; padding: 0.7rem 1rem; background: #f2f5f8; color: #0e2038; font-weight: 500; border-radius: 2px; outline: 2px solid #6fa3be; outline-offset: 2px; }
/* studio credit */
.foot__credit { display: inline-flex; align-items: center; gap: 0.6rem; color: #a9b8c9; text-decoration: none; opacity: .85; transition: opacity .2s ease; }
.foot__credit svg { height: 1.05rem; width: auto; display: block; transform: translateY(-1px); }
.foot__credit:hover, .foot__credit:focus-visible { opacity: 1; color: #f2f5f8; }
.foot__credit:focus-visible { outline: 2px solid #6fa3be; outline-offset: 4px; border-radius: 2px; }