

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/Inter-Light.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/Inter-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/Inter-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/Inter-Black.woff2") format("woff2");
}

@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url("../fonts/PlusJakartaSans-200.woff2") format("woff2");
}
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/PlusJakartaSans-300.woff2") format("woff2");
}



:root {

  --page-max: 1440px;

  --page-pad: 12px;
  --grid-cols: 12;
  --gutter: 12px;
  --header-h: 72px;

  --header-pad-inline: 20px;

  --logo-w: 110px;

  --hero-h1: clamp(1.75rem, 5.333vw + .45rem, 5.25rem);

  --hero-pulse-cycle: 9s;
  --marquee-h: 120px;

  --marquee-dur: 65s;

  --marquee-cap-size: clamp(1.13rem, .57vw + .99rem, 1.5rem);
  --marquee-cap-fit: 4.2vw;

  --showcase-gap: 20px;
  --showcase-title-max: 500px;

  --showcase-body-gap: 40px;

  --quote-size-ramp: clamp(1.75rem, 1.5238vw + 1.3785rem, 2.75rem);
  --quote-size: var(--quote-size-ramp);

  --quote-mark-size: 2.49em;

  --quote-mark-rise-ratio: 1.97;
  --quote-mark-rise: calc(var(--quote-mark-rise-ratio) * 1em);

  --quote-mark-fg: #a9a9a9;

  --quote-meta-fg: #212529;
  --quote-lh: 1.25;

  --showcase-anchor: 10px;

  --showcase-frame-pad: var(--space-base);
  --showcase-card-pad: var(--space-base);
  --showcase-intro-gap: var(--space-m);

  --cursor-size: 100px;
  --cursor-blur: 10px;
  --cursor-dur: .5s;
  --cursor-tint: .1;

  --fwt-cta-gap: var(--space-l);

  --where-card-pad: var(--space-m);
  --where-arrow-w: var(--card-arrow-w);
  --where-card-min: 0px;

  --team-tile-gap: var(--space-s);
  --team-band-inset: var(--space-xs);

  --team-slide-dur: .5s;
  --team-img-dur: 1s;
  --team-delay: .5s;
  --team-scale-in: 1.1;
  --team-scale-out: .95;
  --team-swap-ms: 2000;

  --team-band-h: max(80vh, 100vw);

  --cta-card-pad: var(--space-l) var(--space-base) var(--space-base);

  --footer-icon: 28px;
  --footer-icon-gap: var(--space-m);
  --footer-contact-gap: var(--space-m);
  --footer-legal-lh: 20px;

  --footer-legal-gap: 40px;
  --footer-stack-gap: 40px;
  --footer-menu-gap: var(--space-base);
  --footer-menu-mt: var(--space-2xl);

  --footer-menu-lh: 24px;

  --footer-peek: 75px;

  --footer-band-gap: var(--space-2xl);

  --hwh-card-text: clamp(1.25rem, 1.06vw + 0.81rem, 1.75rem);
  --hwh-pill-pad-inline: 28px;
  --hwh-chev-fg: #656565;
  --hwh-ghost-fg: #bbbbbb;

  --hwh-reveal-dur: 1.4s;

  --space-2xs: 4px;
  --space-xs: 8px;
  --space-s: 12px;
  --space-base: 16px;
  --space-m: 24px;
  --space-l: 32px;
  --space-xl: 48px;
  --space-2xl: 64px;

  --spec-col-gap: 96px;
  --spec-row-gap: var(--space-2xl);
  --spec-text-size: 19px;
  --spec-text-size-mobile: 1rem;

  --extgal-col-gap: 11.2%;
  --extgal-row-gap: 19px;
  --extgal-wide-aspect: var(--gal-wide-aspect);
  --extgal-tall-w: 51.2%;

  --gal-tall-aspect: 4 / 5;
  --gal-wide-aspect: 25 / 16;

  --intgal-tall-w: 22.6%;
  --intgal-wide-w: 44.14%;
  --intgal-indent: 25%;
  --intgal-row-gap: 17px;

  --card-arrow-w: 40px;

  --section-pad: 64px;
  --section-gap: 40px;
  --footer-pad: 64px;

  --ink: #000000;
  --body-ink: #000000;

  --paper: #f6f6f6;
  --white: #ffffff;
  --paper-warm: #f7f3ea;
  --gray: #d5d5d5;
  --tint-4: rgba(0, 0, 0, .04);
  --tint-20: rgba(0, 0, 0, .2);
  --tint-40: rgba(0, 0, 0, .4);
  --scrim: rgba(0, 0, 0, .3);
  --scrim-video: rgba(0, 0, 0, .5);

  --accent-mint:     linear-gradient(90deg, #c5e5e5 -6.14%, #ebf0f0 108.04%);
  --accent-lime:     linear-gradient(90deg, #dfeea8 -4.05%, #fff2e0 106.71%);
  --accent-lavender: linear-gradient(90deg, #d0d0f0 -6.61%, #f1eae0 102.48%);
  --accent-green:    linear-gradient(90deg, #92e437 -120%, #ebfadb 100%);
  --surface-mint:    #e4efe8;
  --accent-green-bright: #00f781;

  --stage-buying:  linear-gradient(90deg, #b9eaa1 0%, #e3f7c5 100%);
  --stage-develop: linear-gradient(90deg, #e9bce5 0%, #faf0f8 100%);
  --stage-design:  linear-gradient(90deg, #ffdbb9 0%, #ffe7e0 100%);
  --stage-build:   linear-gradient(90deg, #88b3dd 0%, #e1f1e7 100%);
  --stage-plan:    linear-gradient(90deg, #bef7fe 0%, #e0f5e2 100%);
  --stage-sell:    linear-gradient(90deg, #e6c34f, 22%, #f2e9a0);

  --cv-card-grad:  linear-gradient(90deg, #b6e09e 0%, #dbf4bd 100%);

  --fg: var(--ink);
  --body-fg: var(--body-ink);
  --bg: var(--paper);

  --radius-pill: 16px;
  --radius-btn: 12px;

  --font-sans: "Inter", helvetica, Roboto, "Helvetica Neue", "Arial Nova", "Nimbus Sans", Arial, sans-serif;
  --fw-extralight: 200;
  --fw-light: 300;
  --fw-medium: 500;
  --fw-bold: 700;
  --fw-black: 900;

  --font-display: "Plus Jakarta Sans", var(--font-sans);

  --ease-enter: cubic-bezier(.22, 1, .36, 1);
  --ease-swap: cubic-bezier(.65, 0, .35, 1);
  --reveal-dur: 1s;

  --showcase-recede-scale: .85;

  --aspect-wide: 16 / 9;
  --aspect-portrait: 403 / 480;
  --cv-card-aspect: 62 / 85;
  --aspect-services: 1400 / 782;
  --aspect-bridging: 1400 / 782;
}

@media (min-width: 768px) {
  :root { --page-pad: 32px; }
}

@media (min-width: 769px) {
  :root {
    --showcase-frame-pad: var(--space-l);
    --showcase-card-pad: var(--space-m);
    --showcase-intro-gap: 40px;

    --where-card-pad: var(--space-l);
    --where-card-min: 320px;

    --team-band-inset: calc(var(--page-pad) - var(--team-tile-gap) / 2);
    --team-band-h: 33.3333vw;
  }
}

@media (min-width: 1024px) {
  :root {
    --section-pad: 100px;
    --section-gap: 80px;
    --footer-pad: 40px;
    --fwt-cta-gap: 40px;
    --cta-card-pad: 40px;

    --footer-menu-gap: var(--space-s);
    --footer-menu-mt: 0;
    --footer-band-gap: 280px;
    --footer-stack-gap: 0;
  }
}

[data-theme="light"] { --fg: var(--ink);   --body-fg: var(--body-ink); --bg: var(--paper); }
[data-theme="dark"]  { --fg: var(--paper); --body-fg: var(--paper);     --bg: var(--ink);   }



*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
  font-weight: var(--fw-medium);
  line-height: 1.3;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}
img, video, canvas, svg { display: block; max-width: 100%; }
img, video { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
ul { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 1px dashed currentColor; outline-offset: 2px; }

.container {
  width: 100%;
  max-width: var(--page-max);
  margin-inline: auto;
  padding-inline: var(--page-pad);
}

.full-bleed {
  width: 100vw;
  margin-inline: calc(50% - 50vw);
}

.row {
  display: flex;
  flex-wrap: wrap;
  margin-inline: calc(-1 * var(--gutter));
}
[class*="col-"] { padding-inline: var(--gutter); --c: calc(100% / var(--grid-cols)); }

.col-1  { flex: 0 0 calc(var(--c) * 1);  max-width: calc(var(--c) * 1);  }
.col-2  { flex: 0 0 calc(var(--c) * 2);  max-width: calc(var(--c) * 2);  }
.col-3  { flex: 0 0 calc(var(--c) * 3);  max-width: calc(var(--c) * 3);  }
.col-4  { flex: 0 0 calc(var(--c) * 4);  max-width: calc(var(--c) * 4);  }
.col-5  { flex: 0 0 calc(var(--c) * 5);  max-width: calc(var(--c) * 5);  }
.col-6  { flex: 0 0 calc(var(--c) * 6);  max-width: calc(var(--c) * 6);  }
.col-7  { flex: 0 0 calc(var(--c) * 7);  max-width: calc(var(--c) * 7);  }
.col-8  { flex: 0 0 calc(var(--c) * 8);  max-width: calc(var(--c) * 8);  }
.col-9  { flex: 0 0 calc(var(--c) * 9);  max-width: calc(var(--c) * 9);  }
.col-10 { flex: 0 0 calc(var(--c) * 10); max-width: calc(var(--c) * 10); }
.col-11 { flex: 0 0 calc(var(--c) * 11); max-width: calc(var(--c) * 11); }
.col-12 { flex: 0 0 100%; max-width: 100%; }

@media (min-width: 1024px) {
  .col-md-1  { flex: 0 0 calc(var(--c) * 1);  max-width: calc(var(--c) * 1);  }
  .col-md-2  { flex: 0 0 calc(var(--c) * 2);  max-width: calc(var(--c) * 2);  }
  .col-md-3  { flex: 0 0 calc(var(--c) * 3);  max-width: calc(var(--c) * 3);  }
  .col-md-4  { flex: 0 0 calc(var(--c) * 4);  max-width: calc(var(--c) * 4);  }
  .col-md-5  { flex: 0 0 calc(var(--c) * 5);  max-width: calc(var(--c) * 5);  }
  .col-md-6  { flex: 0 0 calc(var(--c) * 6);  max-width: calc(var(--c) * 6);  }
  .col-md-7  { flex: 0 0 calc(var(--c) * 7);  max-width: calc(var(--c) * 7);  }
  .col-md-8  { flex: 0 0 calc(var(--c) * 8);  max-width: calc(var(--c) * 8);  }
  .col-md-9  { flex: 0 0 calc(var(--c) * 9);  max-width: calc(var(--c) * 9);  }
  .col-md-10 { flex: 0 0 calc(var(--c) * 10); max-width: calc(var(--c) * 10); }
  .col-md-11 { flex: 0 0 calc(var(--c) * 11); max-width: calc(var(--c) * 11); }
  .col-md-12 { flex: 0 0 100%; max-width: 100%; }

  .offset-md-1 { margin-left: calc(var(--c) * 1); }
  .offset-md-2 { margin-left: calc(var(--c) * 2); }
  .offset-md-3 { margin-left: calc(var(--c) * 3); }
  .offset-md-6 { margin-left: calc(var(--c) * 6); }
}

.section {
  padding-block: var(--section-pad);
  background: var(--bg);
  color: var(--fg);
}
.section--flush { padding-block: 0; }

.section__inner {
  display: flex;
  flex-direction: column;
  gap: var(--section-gap);
}

.measure { max-width: 68ch; }

h1, h2, h3, h4 { margin: 0; color: var(--fg); font-family: inherit; }

.u-h1 { font-weight: var(--fw-black); text-transform: uppercase; letter-spacing: 0;
        line-height: .9;  font-size: clamp(2rem, 9.52vw - .32rem, 8.25rem); }
.u-h2 { font-weight: var(--fw-black); text-transform: uppercase; letter-spacing: 0;
        line-height: 1;   font-size: clamp(2rem, 5.33vw + .7rem, 5.5rem); }
.u-h3 { font-weight: var(--fw-black); text-transform: uppercase; letter-spacing: 0;
        line-height: .95; font-size: clamp(1.25rem, 2.67vw + .6rem, 3rem); }
.u-h3-nav { font-weight: var(--fw-medium); text-transform: capitalize;
        line-height: .95; font-size: clamp(2.5rem, .762vw + 2.31rem, 3rem); }
.u-h4 { font-weight: var(--fw-medium); line-height: 1.1;
        font-size: clamp(1.5rem, 2.29vw + .94rem, 3rem); }

.b-1 { color: var(--body-fg); font-weight: var(--fw-medium); line-height: 1.3;
       font-size: clamp(1.13rem, .57vw + .99rem, 1.5rem); }
.b-2 { color: var(--body-fg); font-weight: var(--fw-medium); line-height: 1.4; font-size: 1rem; }
.b-3 { color: var(--body-fg); font-weight: var(--fw-medium); line-height: 1.4; font-size: .875rem; }
.light { font-weight: var(--fw-light); }

.cta-large { font-weight: var(--fw-medium); text-transform: uppercase; line-height: 1.3;
             font-size: clamp(1rem, .19vw + .95rem, 1.125rem); }
.cta-small { font-weight: var(--fw-medium); text-transform: uppercase; line-height: 1.3;
             font-size: 14px; }

.btn { position: relative; display: inline-flex; align-items: center; color: var(--fg); }

.btn--pill {
  isolation: isolate;
  height: 32px; gap: 8px; padding-inline: 12px; border-radius: var(--radius-pill);
  overflow: hidden; background: var(--bg); width: fit-content;
  text-transform: uppercase; font-size: 14px; font-weight: var(--fw-medium);
  -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px);
}
.btn--pill::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--fg); opacity: .1; transition: opacity .3s; }
.btn--pill:hover::before { opacity: .3; }

.btn--icon {
  width: 32px; height: 32px; border-radius: 50%; justify-content: center; overflow: hidden;
}
.btn--icon svg { width: 100%; height: 100%; fill: var(--fg);
  transition: scale 1s var(--ease-enter); }
.btn--icon:hover svg { scale: .7; }

.btn--text {
  padding: 4px 0 6px; overflow: hidden; text-transform: uppercase; font-weight: var(--fw-medium);
  line-height: 1.3; font-size: clamp(1rem, .19vw + .95rem, 1.125rem);
}
.btn--text > span { display: block; transition: translate 1s var(--ease-enter); }
.btn--text::before, .btn--text::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px;
  background: var(--fg);
}
.btn--text::before { translate: calc(-100% - 2px) 0; transition: translate .4s var(--ease-swap); }
.btn--text::after  { transition: translate .3s var(--ease-swap) .15s; }
.btn--text:hover > span { translate: 0 -5px; }
.btn--text:hover::after  { translate: calc(100% + 2px) 0; transition: translate .5s var(--ease-swap); }
.btn--text:hover::before { translate: 0 0; transition: translate .5s var(--ease-swap) .25s; }

.media { position: relative; display: block; overflow: hidden; }
.media--fill { width: 100%; height: 100%; }
.media img, .media video { width: 100%; height: 100%; object-fit: cover; }
.media-frame { position: relative; width: 100%; aspect-ratio: var(--aspect-wide); overflow: hidden; }

.card-arrow {
  flex: none;
  width: var(--card-arrow-w);
  height: auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: square;
  stroke-linejoin: miter;
  transition: translate .4s var(--ease-enter);
}
a:hover .card-arrow { translate: var(--space-xs) 0; }

.card-hover { position: relative; isolation: isolate; }
.card-hover::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--tint-4); opacity: 0;
  transition: opacity var(--cursor-dur) var(--ease-enter);
}
.card-hover:hover::after { opacity: 1; }

.reveal { opacity: 0; translate: 0 24px;
  transition: opacity .8s var(--ease-enter), translate .8s var(--ease-enter); }
.reveal.is-revealed { opacity: 1; translate: 0 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; translate: 0 0; }
}



.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 99;
  padding: var(--header-pad-inline);
  display: flex; justify-content: space-between; align-items: flex-start;
  pointer-events: none; color: var(--fg);
}
.site-header > * { pointer-events: auto; }
.site-header__content { display: flex; align-items: center; gap: 40px; }
.site-nav     { display: flex; align-items: center; gap: 8px; }
.site-actions { display: flex; align-items: center; gap: 20px; }
@media (max-width: 768px) { .site-nav { display: none; } }

.site-header .btn--icon svg {
  width: 22px; height: 22px; fill: none; stroke: var(--fg); stroke-width: 2; stroke-linecap: round;
}

.site-header .btn--pill,
.site-header .btn--pill::before,
.oic-logo,
.site-header .btn--icon svg {
  transition: background-color .4s var(--ease-enter), color .4s var(--ease-enter),
              fill .4s var(--ease-enter), stroke .4s var(--ease-enter);
}

.oic-logo {
  display: block;
  width: var(--logo-w);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.oic-logo svg { display: block; width: 100%; height: auto; overflow: visible; }
.oic-logo .oic-fill { fill: currentColor; }

.oic-ease { transition-timing-function: var(--ease-swap); }

.oic-icon {
  opacity: 1; transform: scale(1); transform-origin: 2688px 2497px;
  transition-property: opacity, transform; transition-duration: .75s;
}
.oic-tm {
  opacity: 1; transform: scale(1) translateY(0); transform-origin: 4550px 700px;
  transition-property: opacity, transform; transition-duration: .667s;
}

.oic-ring {
  fill: none; stroke: currentColor; stroke-width: 463px;
  opacity: 0; transform: scale(.432); transform-origin: 2686px 2510px;
  transition-property: opacity, transform; transition-duration: 1.417s;
}

.oic-ic {
  opacity: 0; transform: translateX(-900px); transform-origin: 8000px 2510px;
  transition-property: opacity, transform; transition-duration: .917s; transition-delay: .467s;
}

.oic-logo:hover .oic-icon, .oic-logo:focus-visible .oic-icon { opacity: 0; transform: scale(.92); }
.oic-logo:hover .oic-tm,   .oic-logo:focus-visible .oic-tm   { opacity: 0; transform: scale(.7) translateY(-120px); }
.oic-logo:hover .oic-ring, .oic-logo:focus-visible .oic-ring { opacity: 1; transform: scale(1); }
.oic-logo:hover .oic-ic,   .oic-logo:focus-visible .oic-ic   { opacity: 1; transform: translateX(0); }

@media (prefers-reduced-motion: reduce) {
  .oic-icon, .oic-tm, .oic-ring, .oic-ic { transition-duration: .01ms; }
}

.menu {
  position: fixed; inset: 0; z-index: 102;
  display: flex; justify-content: flex-end;
  pointer-events: none; visibility: hidden;
  -webkit-backdrop-filter: blur(0); backdrop-filter: blur(0);
  transition: backdrop-filter 1s var(--ease-enter), -webkit-backdrop-filter 1s var(--ease-enter),
              visibility 0s linear 1s;

  --menu-green: linear-gradient(180deg, #f4f8e2 0%, #cde5b1 100%);
  --menu-label: clamp(1.25rem, .6vw + 1.1rem, 1.6rem);
  --menu-peek: 80px;
}
.menu.is-open {
  pointer-events: auto; visibility: visible;
  -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px);
  transition: backdrop-filter 1s var(--ease-enter), -webkit-backdrop-filter 1s var(--ease-enter),
              visibility 0s;
}

.menu__panel {
  position: relative; z-index: 3; width: 50vw; height: 100%; box-sizing: border-box;
  background: var(--bg); color: var(--fg);
  padding: 15vh 40px 40px;
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
  translate: 100% 0; transition: translate 1s var(--ease-enter);
}
.menu.is-open .menu__panel { translate: 0 0; }
.menu__panel a { color: var(--fg); }

.menu__primary { display: flex; flex-direction: column; gap: var(--space-m); }

.menu__primary a { transition: opacity .4s; text-transform: none; }
.menu__primary:hover a:not(:hover) { opacity: .35; }

.menu__meta { display: flex; flex-direction: column; gap: 28px; }
.menu__secondary { display: flex; flex-direction: column; gap: 10px; }
.menu__secondary a { transition: opacity .4s; }
.menu__secondary:hover a:not(:hover) { opacity: .35; }
.menu__lang { background: none; border: 0; padding: 0; cursor: pointer; color: var(--fg); width: fit-content; }
.menu__lang [aria-current="true"] { font-weight: 700; }
.menu__lang { display: none; }
.menu__email { width: fit-content; }
.menu__social { display: flex; align-items: center; gap: 22px; }
.menu__social a { display: inline-flex; }
.menu__social img { width: 26px; height: 26px; object-fit: contain; display: block; }

.menu__disciplines {
  position: absolute; top: 0; right: 50vw; z-index: 2;
  width: 22vw; height: 100%; box-sizing: border-box;
  background: var(--menu-green); color: var(--ink);
  padding: 24px 20px;
  display: flex; flex-direction: column; gap: 24px;
  opacity: 0; translate: calc(100% - var(--menu-peek)) 0;
  transition: opacity 1s var(--ease-enter), translate 1s var(--ease-enter);
}
.menu.is-open .menu__disciplines { opacity: 1; }
.menu.is-open .menu__disciplines:hover { translate: 0 0; }

.menu__disciplines::after {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: rgba(0, 0, 0, .5); opacity: 1; transition: opacity 1s var(--ease-enter);
}
.menu.is-open .menu__disciplines:hover::after { opacity: 0; }

.menu__disc { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 12px; color: var(--ink); flex: 1 1 0; min-height: 0; }
.menu__disc-img { display: block; width: 100%; flex: 1 1 0; min-height: 0; overflow: hidden; background: var(--gray); }
.menu__disc-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.menu__disc-label { font-size: var(--menu-label); font-weight: 700; line-height: 1.1; flex: none; }

.menu__close {
  position: absolute; top: 20px; right: 20px; z-index: 4; width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  background: none; border: 0; padding: 0;
  opacity: 0; transition: opacity .3s;
}
.menu.is-open .menu__close { opacity: 1; }
.menu__close svg { width: 24px; height: 24px; fill: none; stroke: var(--fg); stroke-width: 2; stroke-linecap: round; }

@media (max-width: 768px) {

  .menu__disciplines {
    position: absolute; top: 0; bottom: 0; left: 0; z-index: 2;
    width: calc(100% - var(--menu-peek)); height: 100%;
    opacity: 1; translate: 0 0;
    flex-direction: column; gap: 16px; padding: 16px;
  }
  .menu__disc { flex: 1 1 0; min-height: 0; gap: 10px; }
  .menu__disc-img { display: block; }
  .menu__disc-label { font-size: 15px; }

  .menu.is-open.menu--disc-open .menu__disciplines::after { opacity: 0; }

  .menu__panel {
    position: absolute; top: 0; right: 0; z-index: 3;
    width: calc(100% - var(--menu-peek)); height: 100%; translate: 0 0;
    padding: 96px 22px 36px 26px;
  }
  .menu__primary a { font-size: clamp(2rem, 8.5vw, 2.5rem); }
  .menu.is-open.menu--disc-open .menu__panel { translate: calc(100% - var(--menu-peek)) 0; }
}

@media (prefers-reduced-motion: reduce) {
  .menu, .menu.is-open, .menu__panel, .menu__disciplines,
  .menu__disciplines::after, .menu__close { transition: none; }
}

.hero {
  position: relative; width: 100%; height: 100svh; background: var(--ink);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.hero__media { position: absolute; inset: 0; z-index: 0;
  background: radial-gradient(120% 90% at 50% 30%, #14425a 0%, #0a2634 45%, #050f16 100%); }

.hero__video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }

@media (prefers-reduced-motion: reduce) {
  .hero__video { display: none; }
}
.hero__media::after { content: ""; position: absolute; inset: 0; background: var(--scrim-video); }

.hero::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 55%;
  background: linear-gradient(transparent, rgba(0,0,0,.5)); z-index: 1; pointer-events: none; }

.hero__text {
  position: relative; z-index: 5; width: 100%;
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 40px;

}

.hero__headline {
  margin: 0; color: var(--fg); text-align: center;
  display: flex; flex-direction: column; align-items: center;
  font-size: var(--hero-h1);
  font-weight: var(--fw-black); text-transform: uppercase; letter-spacing: 0;

  line-height: .97;
}

.hero__line { display: block; white-space: nowrap; }

@keyframes heroPulse {
  0%      { color: var(--fg); }
  5.556%  { color: var(--accent-green-bright); }
  27.778% { color: var(--accent-green-bright); }
  33.333% { color: var(--fg); }
  100%    { color: var(--fg); }
}
.hero__line { animation: heroPulse var(--hero-pulse-cycle) linear infinite; }
.hero__line:nth-child(1) { animation-delay: 0s; }
.hero__line:nth-child(2) { animation-delay: calc(var(--hero-pulse-cycle) / 3); }
.hero__line:nth-child(3) { animation-delay: calc(var(--hero-pulse-cycle) / 3 * 2); }

.hero__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px 32px; }

@media (prefers-reduced-motion: reduce) {

  .hero__line { animation: none; }
  .hero__line:nth-child(1) { color: var(--accent-green-bright); }
}

.about { padding-bottom: var(--space-base); }
.about__row { row-gap: var(--section-gap); }
.about__aside {
  display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-l);
}

.marquee { padding-block: var(--space-2xl) var(--space-2xl); }
.marquee__viewport {
  overflow: hidden; width: 100%; min-height: var(--marquee-h);
  display: flex; align-items: center;
}
.marquee__track {
  display: flex; align-items: center; width: max-content; margin: 0; padding: 0;
  list-style: none; will-change: translate;

  flex: none;
  animation: marquee-scroll var(--marquee-dur) linear infinite;
}

.marquee__item {
  flex: none; display: flex; flex-direction: column; align-items: center;
  text-align: center; color: var(--fg);
  padding-inline: clamp(2.5rem, 4vw, 4.5rem);
}
.marquee__num {
  white-space: nowrap; font-weight: var(--fw-medium); line-height: 1;
  font-size: clamp(2.5rem, 6vw + .85rem, 6.5rem);
}
.marquee__cap {
  margin-top: var(--space-base);
  font-weight: var(--fw-medium); line-height: 1.3;
  font-size: var(--marquee-cap-size);
}

@keyframes marquee-scroll { from { translate: 0 0; } to { translate: -33.333% 0; } }

@media (prefers-reduced-motion: reduce) {
  .marquee__track { animation: none; }
}

@media (max-width: 767px) {
  .marquee__viewport { overflow: visible; min-height: 0; display: block; }
  .marquee__track {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: auto;
    animation: none; gap: var(--space-2xl) var(--space-l);
    padding-inline: var(--page-pad);
  }
  .marquee__item[aria-hidden="true"] { display: none; }
  .marquee__item { padding-inline: 0; }
  .marquee__cap { font-size: min(var(--marquee-cap-size), var(--marquee-cap-fit)); }
}

.showcase { position: relative; width: 100%; background: var(--bg); }

.showcase__wash {
  position: fixed; top: 0; left: 0; width: 100%; height: 100lvh;
  z-index: 1; pointer-events: none; opacity: var(--g, 0);
}
.showcase__wash::after { content: ""; position: absolute; inset: 0; background: var(--accent-green); }

.showcase__intro {
  position: sticky; top: 0; z-index: 2;
  width: 100%; max-width: var(--page-max); margin-inline: auto; height: 100lvh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: calc(var(--showcase-frame-pad) * 2);
  text-align: center;
  opacity: var(--i, 1);
}
.showcase__intro p { margin: 0 0 var(--showcase-intro-gap); }
.showcase__intro h2 { margin: 0; }

.showcase__track { position: relative; z-index: 2; width: 100%; height: 600lvh; }

.showcase__item {
  position: sticky; top: 0; z-index: 4;
  width: 100%; max-width: var(--page-max); margin-inline: auto; height: 100lvh;
  padding: var(--showcase-frame-pad);
  padding-top: var(--header-h);
  overflow: hidden; pointer-events: none;
}

.showcase__project {
  position: relative; width: 100%; height: 100%;
  background-color: var(--bg);
  pointer-events: auto;
  opacity: calc(1 - var(--p, 0));
  scale: calc(1 - (1 - var(--showcase-recede-scale)) * var(--p, 0));
}

.showcase__inner {
  position: relative; z-index: 2;
  display: flex; gap: var(--showcase-gap);
  width: 100%; height: 100%; padding: var(--showcase-card-pad);
  color: var(--fg); text-decoration: none;
  cursor: none;
}
.showcase__image { position: relative; z-index: 2; width: 50%; height: 100%; }
.showcase__image img { display: block; width: 100%; height: 100%; object-fit: cover; }

.showcase__content {
  position: relative; width: 50%; height: 100%;
  display: flex; flex-direction: column;
  align-items: flex-start; justify-content: space-between;
}

.showcase__content::before {
  content: ""; position: relative;
  width: var(--showcase-anchor); height: var(--showcase-anchor);
}
.showcase__title { position: relative; max-width: var(--showcase-title-max); }
.showcase__title > :first-child { display: block; margin-bottom: var(--space-base); }

.showcase__body { display: block; margin-top: var(--showcase-body-gap); }
.showcase__footer {
  display: flex; align-self: flex-end; justify-content: space-between; align-items: flex-end;
  width: 100%; margin-top: var(--showcase-card-pad);
}

.showcase__all { cursor: pointer; position: relative; z-index: 4; }

.showcase__link { position: absolute; inset: 0; z-index: 3; }
.showcase__link-label {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}

.cursor {
  position: fixed; top: 0; left: 0; z-index: 10; pointer-events: none;
  width: var(--cursor-size); height: var(--cursor-size);
  margin: calc(var(--cursor-size) / -2) 0 0 calc(var(--cursor-size) / -2);
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; overflow: hidden;
  backdrop-filter: blur(var(--cursor-blur));
  color: var(--ink);
  scale: 0;
  transition: scale var(--cursor-dur) var(--ease-enter);
}
.cursor::before {
  content: ""; position: absolute; inset: 0;
  background: var(--fg); opacity: var(--cursor-tint);
}
.cursor > span { position: relative; }
.cursor.is-on { scale: 1; }

@media (max-width: 768px) {
  .showcase__inner { flex-direction: column; cursor: auto; }

  .showcase__image {
    width: 100%; height: auto;
    flex: 1 1 auto; min-height: 0;

    max-height: calc(100vw - (var(--showcase-frame-pad) + var(--showcase-card-pad)) * 2);
  }
  .showcase__content { width: 100%; height: auto; flex: 0 0 auto; }
  .showcase__content::before { display: none; }
  .showcase__title {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    width: 100%; max-width: none; padding-inline: var(--space-base);
  }
  .showcase__title * { text-align: center; }
  .showcase__cursor { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .showcase__wash { position: absolute; height: 100%; opacity: 1; }
  .showcase__intro { position: static; height: auto; padding-block: var(--section-pad); }
  .showcase__track { height: auto; }
  .showcase__item {
    position: static; height: auto; min-height: 100svh;
    overflow: visible; pointer-events: auto;
  }
  .showcase__project { opacity: 1; scale: 1; }
  .showcase__inner { cursor: auto; }
  .showcase__cursor { display: none; }
}

.section--after-pin {
  margin-top: -100lvh;
  position: relative;
  z-index: 3;
}

.where__lede { margin: var(--space-m) 0 0; }

.where__grid { row-gap: var(--space-m); }

@media (max-width: 767px) {
  .where__grid > [class*="col-"] { flex-basis: 100%; max-width: 100%; }
}

.where__card {

  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-xl);
  height: 100%;
  min-height: var(--where-card-min);
  padding: var(--where-card-pad);
  background: var(--surface-mint);
  color: var(--fg);
}

.where__card-foot {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: var(--space-base);
}
.where__card-desc { max-width: 22ch; }

@media (min-width: 1024px) {
  .where__card { justify-content: flex-start; }
  .where__card-foot { align-items: center; }
}

.fw-text { row-gap: var(--space-m); }
.fw-text__cta { margin-top: var(--fwt-cta-gap); }

.asset-row .media-frame { width: 100%; }

.services .media-frame { aspect-ratio: var(--aspect-services); }

.text-pair__heading { margin-bottom: var(--space-m); }
.text-pair__body { margin: 0 0 var(--space-base); }
.text-pair__cta { margin-top: var(--space-m); }

@media (min-width: 1024px) {
  .text-pair__heading { margin-bottom: 0; }
}

.quote {
  min-height: 100svh;
  display: flex; align-items: center;
}

.quote { --quote-size: min(clamp(1.75rem, 1.5238vw + 1.3785rem, 2.75rem), calc(3svh + 1.6vw)); }
.quote > .container { width: 100%; }

.quote__figure {
  margin: 0;
  display: flex; flex-direction: column; gap: var(--section-gap);
}

.quote__mark {
  font-size: var(--quote-size-ramp);
  display: flex; justify-content: center; align-items: flex-start;
  margin-top: calc(var(--quote-mark-rise) * -1);
}
.quote__mark-glyph {
  display: block;
  height: var(--quote-mark-size);
  width: auto;
  fill: var(--quote-mark-fg);
}
.quote__text {
  margin: 0;

  font-weight: var(--fw-medium);
  line-height: var(--quote-lh);
  font-size: var(--quote-size);
}

.quote__cite { display: block; margin-top: 0; font-style: normal; color: var(--quote-meta-fg); }
.quote__cta { margin-top: var(--space-l); color: var(--quote-meta-fg); }
.quote__cta::before, .quote__cta::after { background: var(--quote-meta-fg); }

.quote[data-theme="dark"] {
  --quote-mark-fg: #383838;
  --quote-meta-fg: #dadada;
}

@media (max-width: 768px) {
  .quote__mark { justify-content: flex-start; margin-top: 0; margin-bottom: var(--space-m); }

  .quote__mark-glyph { line-height: .5; }
}

.team-band {
  width: 100%;
  padding-inline: var(--team-band-inset);
}

.team-band__track {
  position: relative;
  width: 100%;
  height: var(--team-band-h);
}

.team-band__item {
  position: absolute;
  top: 0;
  left: calc(var(--position) * 25%);
  width: 25%;
  height: 100%;
  display: flex;
  justify-content: center;
  opacity: 0;

  transition: opacity var(--team-slide-dur);
}

.team-band__inner {
  position: relative;
  overflow: hidden;
  width: calc(100% - var(--team-tile-gap));
  height: calc(100% - var(--team-tile-gap));
}

.team-band__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  scale: var(--team-scale-in);
  transition: scale var(--team-img-dur) var(--ease-enter);
}

.team-band__item.is-loaded { opacity: 1; }
.team-band__item.is-loaded img { scale: 1; }

.team-band__item.is-leaving { transition-delay: var(--team-delay); opacity: 0; }
.team-band__item.is-leaving img {
  transition-delay: var(--team-delay);
  scale: var(--team-scale-out);
}

@media (max-width: 768px) {
  .team-band__item {
    width: 50%;
    height: 50%;
    left: calc(mod(var(--position), 2) * 50%);
    top: calc(round(down, var(--position) / 2, 1) * 50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .team-band__item,
  .team-band__item img { transition: none; }
  .team-band__item img { scale: 1; }
}

.cta-card {
  min-height: 100svh;
  display: flex; align-items: center;
}

.section.quote + .section.cta-card[data-theme] { padding-top: var(--section-pad); }
.cta-card > .container { width: 100%; }

.cta-card__inner {

  background: var(--accent-green);
  padding: var(--cta-card-pad);

}

.cta-card__content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.cta-card__cta { margin-top: var(--space-m); }

.cta-card__cta a { width: fit-content; }

.cta-card__media {
  padding-inline: var(--space-base);
  margin-top: 40px;
}
.cta-card__media img {
  width: 100%;
  aspect-ratio: var(--aspect-portrait);
  object-fit: cover;
  display: block;
}

@media (min-width: 1024px) {
  .cta-card__media { padding-inline: 0; margin-top: 0; }
}

.site-footer {
  background: var(--ink);
  color: var(--paper);
  padding-block: var(--footer-pad);
  min-height: calc(100svh - var(--footer-peek));
  display: flex;
  flex-direction: column;
}

.site-footer__inner {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--footer-band-gap);
}

.site-footer__logo { display: inline-flex; align-items: center; max-width: 100%; }

.site-footer__logo-img { display: block; width: 220px; max-width: 100%; height: auto; }

.site-footer__accred { display: block; width: 160px; max-width: 100%; height: auto; }

.site-footer__legalcol {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: var(--space-m);
  margin-top: var(--footer-stack-gap);
}

.site-footer__menu {
  margin: var(--footer-menu-mt) 0 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--footer-menu-gap);
}

.site-footer__menu li { line-height: var(--footer-menu-lh); }

.site-footer__contact {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: var(--footer-contact-gap);
}

.site-footer__legal {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-end;
  align-content: flex-end;
  column-gap: var(--footer-legal-gap);
  row-gap: var(--space-xs);

}

.site-footer__copyright { margin: 0; }

.site-footer__nominated { margin: 0; }

.site-footer__channels {
  display: flex;
  align-items: center;
  gap: var(--footer-icon-gap);
}
.site-footer__channels a { display: block; transition: opacity var(--cursor-dur) var(--ease-enter); }
.site-footer__channels a:hover { opacity: .6; }

.site-footer__glyph { width: var(--footer-icon); height: auto; }

@media (min-width: 1024px) {
  .site-footer__menu { align-items: flex-end; }

  .site-footer__legalcol { align-items: flex-end; }
  .site-footer__legal { justify-content: flex-end; }
}

@media (max-width: 1023px) {
  .site-footer__legal {
    flex-flow: column nowrap;
    align-items: flex-start;
    align-content: flex-start;
    row-gap: var(--space-s);
  }
  .site-footer__copyright { order: 1; }
}

.hwh [data-stage="buying"]  { --stage-grad: var(--stage-buying); }
.hwh [data-stage="develop"] { --stage-grad: var(--stage-design); }
.hwh [data-stage="design"]  { --stage-grad: var(--stage-develop); }
.hwh [data-stage="build"]   { --stage-grad: var(--stage-plan); }
.hwh [data-stage="plan"]    { --stage-grad: var(--stage-build); }
.hwh [data-stage="sell"]    { --stage-grad: var(--accent-lavender); }

.hwh__lede { margin: var(--space-m) 0 0; }

.hwh__stages {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.hwh__stage {
  flex: none;
  background: var(--stage-grad);
  color: var(--ink);
  border-radius: 999px;

  font-size: 1rem;
  padding: var(--space-base) var(--space-base);
  cursor: pointer;
  white-space: nowrap;
  transition: box-shadow var(--cursor-dur) var(--ease-enter);
}

.hwh__stage[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--ink); }

@media (max-width: 767px) {
  .hwh__stages { display: grid; grid-template-columns: 1fr 1fr; }
  .hwh__stage {
    white-space: normal;
    text-align: center;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px;
  }
}

.hwh__grid[hidden] { display: none; }

.hwh__grid {
  display: grid;
  gap: var(--space-m);
  grid-template-columns: 1fr;
}
@media (min-width: 768px)  { .hwh__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {
  .hwh__grid { grid-template-columns: repeat(4, 1fr); gap: var(--space-base); }
  .hwh { --hwh-card-text: clamp(0.9375rem, 0.72vw + 0.48rem, 1.125rem); }
  .hwh__card { padding: var(--space-m) var(--space-base); }
}

@keyframes hwh-cards-in { from { opacity: 0; } to { opacity: 1; } }
.hwh__grid:not([hidden]) { animation: hwh-cards-in var(--hwh-reveal-dur) linear both; }

.hwh__card {

  display: flex;
  flex-direction: column;
  padding: var(--space-l) var(--space-m);
  background: var(--stage-grad);
  color: var(--ink);

}

.hwh__card-text {
  font-size: var(--hwh-card-text);
  font-weight: var(--fw-medium);
  line-height: 1.15;
  padding-right: var(--space-s);
  text-wrap: pretty;
}

.hwh__card .card-arrow {
  margin-top: auto;
  padding-top: var(--space-s);
  align-self: flex-end;
  overflow: visible;
}

.hwh:has(.hwh__empty:not([hidden])) {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
.hwh:has(.hwh__empty:not([hidden])) .section__inner { flex: 1; }
.hwh:has(.hwh__empty:not([hidden])) .hwh__panels {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hwh:has(.hwh__empty[hidden]) {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
.hwh:has(.hwh__empty[hidden]) .section__inner { flex: 1; }
.hwh:has(.hwh__empty[hidden]) .hwh__panels {
  flex: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
}
.hwh:has(.hwh__empty[hidden]) .hwh__grid { grid-area: 1 / 1; }
.hwh:has(.hwh__empty[hidden]) .hwh__grid[hidden] {
  display: grid;
  visibility: hidden;
}

.hwh__empty { text-align: center; }
.hwh__empty-prompt {
  margin: 0;
  font-size: var(--hwh-card-text);
  font-weight: var(--fw-medium);
  text-transform: uppercase;
  color: var(--hwh-ghost-fg);
}
.hwh__empty-ghost {
  margin: var(--space-l) 0 0;
  color: var(--hwh-ghost-fg);
}

@media (prefers-reduced-motion: reduce) {
  .hwh__stage, .hwh__card { transition-duration: .01ms; }

  .hwh__grid:not([hidden]) { animation: none; }
}

@media (max-width: 1023px) {
  .psym-about .psym-spec { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .psym-about .psym-spec {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(4, auto);
    grid-auto-flow: column;
    column-gap: var(--space-m);
    --spec-text-size: var(--spec-text-size-mobile);

    --spec-row-gap: var(--space-l);
  }
  .psym-about .psym-spec__col { display: contents; }
  .psym-about .psym-spec__col:nth-child(1) .psym-spec__item:nth-child(1) { order: 1; }
  .psym-about .psym-spec__col:nth-child(1) .psym-spec__item:nth-child(2) { order: 2; }
  .psym-about .psym-spec__col:nth-child(1) .psym-spec__item:nth-child(3) { order: 3; }
  .psym-about .psym-spec__col:nth-child(2) .psym-spec__item:nth-child(2) { order: 4; }
  .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(1) { order: 5; }
  .psym-about .psym-spec__col:nth-child(2) .psym-spec__item:nth-child(1) { order: 6; }
  .psym-about .psym-spec__col:nth-child(2) .psym-spec__item:nth-child(3) { order: 7; }
  .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2) { order: 8; }

  body[data-project="symphony"]  .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="aurum"]     .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="kalandra"]  .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="jadefield"] .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="elara"]     .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="everleigh"] .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="rosemere"]  .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="amara"]     .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2),
  body[data-project="solace"]    .psym-about .psym-spec__col:nth-child(3) .psym-spec__item:nth-child(2) {
    grid-row: 5;
    grid-column: 1 / -1;
    order: 9;
  }
}

@media (min-width: 1024px) {

  .psym-about .psym-spec {
    grid-template-columns: repeat(3, minmax(0, max-content));
  }

}

.psym-interior__lead { display: block; width: 100%; height: auto; }



.arch-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  background: var(--ink);
  color: var(--fg);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.arch-hero__media {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%;
  max-width: none;
  object-fit: cover;
}

.arch-hero::before,
.arch-hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
}
.arch-hero::before { background: var(--scrim); }
.arch-hero::after {
  top: auto; height: 72%;
  background: linear-gradient(transparent, rgba(0, 0, 0, .6));
}

.arch-hero__inner {
  position: relative; z-index: 5; width: 100%;
  display: flex; flex-direction: column; align-items: flex-start;
  padding-block: var(--section-pad);
}

.arch-hero__crumb { display: flex; align-items: center; gap: var(--space-xs); }
.arch-hero__crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }

.arch-hero__title { margin-top: var(--space-m); }

.arch-hero__body  { margin: var(--space-m) 0 0; }
.arch-hero__cta   { margin-top: var(--fwt-cta-gap); }

@keyframes archHeroIn {
  from { opacity: 0; translate: 0 24px; }
  to   { opacity: 1; translate: 0 0; }
}
.arch-hero__inner > * { animation: archHeroIn .8s var(--ease-enter) both; }
.arch-hero__crumb { animation-delay: .05s; }
.arch-hero__title { animation-delay: .15s; }
.arch-hero__body  { animation-delay: .30s; }
.arch-hero__cta   { animation-delay: .45s; }

@media (prefers-reduced-motion: reduce) {
  .arch-hero__inner > * { animation: none; }
}

.arch-about__text { row-gap: var(--space-m); }
.arch-about__lede { margin: 0; }

.arch-about__body { margin: 0; }

.arch-about__photo { width: 100%; }

.arch-menu__eyebrow { margin: 0 0 var(--space-xl); font-weight: var(--fw-bold); }

.arch-menu__row { row-gap: var(--space-2xl); }

.arch-menu__list { display: flex; flex-direction: column; gap: var(--space-l); }
.arch-menu__item {
  display: flex; align-items: center; gap: var(--space-m);
  width: 100%; text-align: left;
}

.arch-menu__label {
  font-weight: var(--fw-bold);
  line-height: 1.3;
  text-transform: none;
  color: var(--ink);
}

.arch-menu__item[aria-selected="true"] .arch-menu__label {
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 2px;
}

.arch-menu__dot {
  flex: none;
  display: grid; place-items: center;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--accent-lavender);
  opacity: 0; scale: .7;
  transition: opacity var(--cursor-dur) var(--ease-enter), scale var(--cursor-dur) var(--ease-enter);
}
.arch-menu__item[aria-selected="true"] .arch-menu__dot { opacity: 1; scale: 1; }

.arch-menu__dot .card-arrow { width: 18px; color: var(--ink); }

.arch-menu__stage { position: relative; }
.arch-menu__panel[hidden] { display: none; }
.arch-menu__panel { display: flex; flex-direction: column; gap: var(--space-l); }

.arch-menu__title { text-transform: none; font-weight: var(--fw-medium); }
.arch-menu__copy { display: flex; flex-direction: column; gap: var(--space-m); }
.arch-menu__copy p { margin: 0; }
.arch-menu__img { width: 100%; }

@keyframes archMenuIn { from { opacity: 0; translate: 0 32px; } to { opacity: 1; translate: 0 0; } }
.arch-menu__panel:not([hidden]) { animation: archMenuIn .9s var(--ease-enter) both; }

@media (prefers-reduced-motion: reduce) {
  .arch-menu__panel:not([hidden]) { animation: none; }
}

.arch-promise {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.arch-promise__eyebrow {
  display: inline-block;
  margin: 0 0 var(--space-2xl);
  padding-bottom: var(--space-s);
  border-bottom: 1px solid currentColor;
  font-size: 50px;
}
.arch-promise__statement {
  font-size: clamp(2rem, 5.33vw + .7rem, 3.75rem);
}

.arch-faq { min-height: 100svh; }
.arch-faq__list { border-bottom: 1px solid var(--gray); }
.arch-faq__item { border-top: 1px solid var(--gray); }

.arch-faq__summary {
  list-style: none;
  display: flex; align-items: center; gap: var(--space-m);
  padding-block: var(--space-l);
  cursor: pointer;
}
.arch-faq__summary::-webkit-details-marker { display: none; }
.arch-faq__q { flex: 1; font-weight: var(--fw-bold); }

.arch-faq__icon {
  position: relative; flex: none; width: 32px; height: 32px;
  color: var(--ink);
  transition: rotate .4s var(--ease-enter), color .4s var(--ease-enter);
}
.arch-faq__icon::before,
.arch-faq__icon::after {
  content: ""; position: absolute; inset: 0; margin: auto; background: currentColor;
}
.arch-faq__icon::before { width: 100%; height: 2px; }
.arch-faq__icon::after  { width: 2px; height: 100%; }
.arch-faq__item[open] .arch-faq__icon { rotate: 45deg; color: var(--gray); }

@media (max-width: 768px) {
  .arch-faq__icon { width: 20px; height: 20px; }
}

.arch-faq__answer { padding-right: var(--space-2xl); padding-bottom: var(--space-l); }
.arch-faq__answer p { margin: 0; }
@keyframes faqAnswerIn { from { opacity: 0; translate: 0 -8px; } to { opacity: 1; translate: 0 0; } }
.arch-faq__item[open] .arch-faq__answer { animation: faqAnswerIn .4s var(--ease-enter); }

.arch-gallery__row { row-gap: var(--section-gap); }
.arch-gallery__col { display: flex; flex-direction: column; gap: var(--section-gap); }
.arch-gallery__img { width: 100%; }
.arch-gallery__cta-wrap { margin-top: var(--section-gap); }

@media (min-width: 1024px) {
  .arch-gallery__row { position: relative; }
  .arch-gallery__col--right { padding-top: var(--section-pad); }

  .arch-gallery__cta-wrap {
    position: absolute; left: 0; bottom: 0; width: auto;
    margin-top: 0;
  }
}

.arch-gallery__img.reveal { transition-delay: calc(var(--seq, 0) * .2s); }

.arch-gallery__cta { font-size: 22px; }

.arch-related .cta-card__inner { background: var(--accent-lavender); }
.arch-related__eyebrow { margin: 0 0 var(--space-m); }
.arch-related__title   { margin: 0; }
.arch-related__body    { margin: var(--space-m) 0 0; }

:root {
  --door-grad: var(--accent-green);
  --door-soft: var(--surface-mint);
  --tbc-bg: #ffe2c2;
  --tbc-fg: #8a3b00;
  --line: var(--gray);
  --prose-size: clamp(1.0625rem, .28vw + 1rem, 1.25rem);
  --t-h1: clamp(2rem, 4.95vw + .79rem, 5.25rem);
  --t-h1-long: clamp(2.25rem, 4.7vw + .4rem, 5.25rem);
  --t-h2: clamp(2rem, 3.05vw + 1.26rem, 4rem);
  --t-h2-title: clamp(2rem, 4vw + .6rem, 4rem);
  --t-h2s: clamp(1.75rem, 3.1vw + .65rem, 3rem);
  --t-door: clamp(2rem, 2.29vw + 1.44rem, 3.5rem);
  --t-h3: clamp(1.25rem, 1.9vw + .79rem, 2.5rem);
  --t-h4: clamp(1.375rem, .95vw + 1.14rem, 2rem);
  --t-hero-lead: clamp(1.125rem, 1vw + .85rem, 1.75rem);
  --t-quote: min(clamp(1.5rem, 1.05vw + 1.24rem, 2.25rem), calc(3svh + 1.6vw));
  --u-h2s: var(--t-h2s);
}
body[data-door="homes"] { --door-grad: var(--accent-mint); --door-soft: #e6f1f1; }
body[data-door="business"] { --door-grad: var(--accent-lime); --door-soft: #f4f6e2; }

@media (min-width: 1024px) {
  .offset-md-4 { margin-left: calc(var(--c) * 4); }
  .offset-md-5 { margin-left: calc(var(--c) * 5); }
}
.pfacts .psym-spec { --spec-row-gap: var(--space-l); }
html:not(.js) .reveal { opacity: 1; translate: 0 0; }

.u-h2s { font-weight: var(--fw-black); text-transform: uppercase; line-height: 1; font-size: var(--u-h2s); text-wrap: balance; }
.u-h1, .u-h2 { text-wrap: balance; }
.u-h1 { font-size: var(--t-h1); }
.u-h2 { font-size: var(--t-h2); }
.u-h3 { font-size: var(--t-h3); }
.u-h4 { font-size: var(--t-h4); line-height: 1.2; }
.door__title { font-size: var(--t-door); }
.arch-promise__statement { font-size: var(--t-h2s); }
.arch-promise__eyebrow { font-size: var(--t-h4); }
.quote { --quote-size: var(--t-quote); }

.section[data-theme="light"]:not(.section--flush) + .section[data-theme="light"]:not(.section--flush):not(.cta-card):not(.quote):not(.arch-promise) { padding-top: 0; }

.sec__h2 { margin: 0; }
.sec__intro { margin: var(--space-m) 0 0; }

.tbc {
  display: inline-block; padding: 1px 8px; margin: 0 2px; border-radius: 999px;
  background: var(--tbc-bg); color: var(--tbc-fg); font-size: .78em; font-weight: var(--fw-bold);
  line-height: 1.5; text-transform: none; letter-spacing: 0; vertical-align: .08em; white-space: normal;
}
.chip {
  display: inline-flex; align-items: center; width: fit-content; padding: 3px 10px; border-radius: 999px;
  background: var(--tint-4); color: var(--ink); font-size: 13px; font-weight: var(--fw-medium); line-height: 1.4; text-transform: none;
}
.chip--client { background: #d9f0d1; }
.chip--own { background: #e3e0f6; }
.chip--tbc { background: var(--tbc-bg); color: var(--tbc-fg); }
[data-theme="dark"] .chip { background: rgba(255, 255, 255, .14); color: var(--paper); }

.prose { font-size: var(--prose-size); line-height: 1.6; color: var(--body-fg); max-width: 70ch; }
.prose > :first-child { margin-top: 0; }
.prose p { margin: 0 0 1em; }
.prose h2 { font-weight: var(--fw-black); text-transform: uppercase; line-height: 1.05; font-size: clamp(1.5rem, 1.6vw + .9rem, 2.25rem); margin: 2em 0 .7em; text-wrap: balance; }
.prose h3 { font-weight: var(--fw-bold); font-size: clamp(1.125rem, .4vw + 1.02rem, 1.375rem); line-height: 1.3; margin: 1.7em 0 .5em; }
.prose h4 { font-weight: var(--fw-bold); font-size: 1em; margin: 1.4em 0 .4em; }
.prose ul, .prose ol { margin: 0 0 1em; padding-left: 1.25em; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li { margin: .35em 0; padding-left: .2em; }
.prose li::marker { color: #6b6b6b; }
.prose a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.prose a:hover { text-decoration-thickness: 2px; }
.prose strong { font-weight: var(--fw-bold); }
.prose hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
.prose .md-check { list-style: none; padding-left: 0; }
.prose .md-check li { position: relative; padding-left: 2em; }
.prose .md-check li::before { content: ""; position: absolute; left: 0; top: .3em; width: 1.1em; height: 1.1em; border: 1.5px solid var(--ink); border-radius: 4px; }
.md-note { margin: 1.4em 0; padding: var(--space-m); background: var(--door-soft); border-left: 3px solid var(--ink); }
.md-note p:last-child { margin-bottom: 0; }

.md-table { width: 100%; margin: 1.4em 0; }
.md-table table { width: 100%; border-collapse: collapse; font-size: .92em; line-height: 1.45; }
.md-table th { text-align: left; font-size: 13px; font-weight: var(--fw-bold); text-transform: uppercase; letter-spacing: .02em; padding: 10px 12px 10px 0; border-bottom: 1.5px solid var(--ink); vertical-align: bottom; }
.md-table td { padding: 12px 12px 12px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
@media (max-width: 767px) {
  .md-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .md-table table, .md-table tbody, .md-table tr, .md-table td { display: block; width: 100%; }
  .md-table tr { padding: 12px 0; border-bottom: 1px solid var(--line); }
  .md-table td { border: 0; padding: 3px 0; }
  .md-table td[data-label]:not([data-label=""])::before { content: attr(data-label); display: block; font-size: 12px; font-weight: var(--fw-bold); text-transform: uppercase; color: #6b6b6b; }
}
.tbl__wrap table { font-size: var(--prose-size); }
.tbl__cell { font-size: inherit; max-width: none; }
.tbl__cell > :last-child { margin-bottom: 0; }
.tbl__note { margin: 0; color: #555; max-width: 80ch; }

.pg-hero { min-height: 92svh; }
.pg-hero__title { font-size: var(--t-h1-long); max-width: 16ch; }
.pg-hero__eyebrow { margin: var(--space-m) 0 0; opacity: .9; }
.pg-hero__eyebrow + .pg-hero__title { margin-top: var(--space-s); }
.pg-hero__lead { max-width: 30ch; font-size: var(--t-hero-lead); }
.pg-hero__lead--long { max-width: 46ch; font-size: clamp(1.125rem, .75vw + .95rem, 1.6rem); line-height: 1.3; }
.pg-hero__chips { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: var(--space-m) 0 0; opacity: .85; }
.pg-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px 32px; margin-top: var(--fwt-cta-gap); }
.arch-hero__crumb { flex-wrap: wrap; row-gap: 4px; }

.lt-hero { padding-top: calc(var(--section-pad) + var(--header-h)); }
.lt-hero__crumb { display: flex; flex-wrap: wrap; gap: 4px var(--space-xs); margin-bottom: var(--space-l); }
.lt-hero__crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.lt-hero__eyebrow { margin: 0 0 var(--space-base); }
.lt-hero__title { margin: 0; }
.lt-hero__title.u-h2 { font-size: var(--t-h2-title); }
.lt-hero__lead { margin: var(--space-m) 0 0; max-width: 34ch; }
.lt-hero__meta { margin: var(--space-l) 0 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; text-transform: none; font-size: 15px; }

.ans__box { padding: var(--space-l) var(--space-m); background: var(--door-grad); }
@media (min-width: 1024px) { .ans__box { padding: var(--space-xl) var(--space-xl); } }
.ans__label { margin: 0 0 var(--space-s); font-weight: var(--fw-bold); }
.ans__text { margin: 0; font-size: clamp(1.2rem, .9vw + .95rem, 1.75rem); line-height: 1.35; font-weight: var(--fw-medium); }

.stm__row { row-gap: var(--section-gap); }
.stm__eyebrow { margin: 0; }
.stm__text { margin: 0; }
.stm__aside { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-l); }

.txt__lede { margin: 0; }
.txt__row { row-gap: var(--space-xl); }
.txt__img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
@media (min-width: 1024px) { .txt__media { position: sticky; top: calc(var(--header-h) + var(--space-m)); align-self: flex-start; } }
.txt__asidebox { padding: var(--space-m); background: var(--door-soft); font-size: 1rem; }
@media (min-width: 1024px) { .txt__aside { order: 2; } .txt__aside + .txt__body { order: 1; margin-left: 0; } }

.cards__grid { display: grid; gap: var(--space-m); grid-template-columns: 1fr; }
@media (min-width: 768px) { .cards__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) {
  .cards__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cards__grid--4.cards__grid--img { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cards__grid--4.cards__grid--txt { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.icard { display: flex; flex-direction: column; color: var(--ink); background: var(--white); }
.icard__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--gray); }
.icard__img img { width: 100%; height: 100%; object-fit: cover; transition: scale 1s var(--ease-enter); }
.icard:hover .icard__img img { scale: 1.04; }
.icard__body { display: flex; flex-direction: column; gap: var(--space-s); padding: var(--space-m) var(--space-base) var(--space-base); flex: 1; }
.icard__title { font-weight: var(--fw-bold); font-size: clamp(1.25rem, .8vw + 1rem, 1.75rem); line-height: 1.15; }
.icard__text { flex: 1; }
.icard .card-arrow { align-self: flex-end; }
.tcard { display: flex; flex-direction: column; gap: var(--space-s); padding: var(--space-l) var(--space-m) var(--space-m); background: var(--door-grad); color: var(--ink); min-height: 220px; }
.tcard__title { font-weight: var(--fw-bold); font-size: clamp(1.25rem, .8vw + 1rem, 1.75rem); line-height: 1.15; }
.tcard__text { flex: 1; }
.tcard .card-arrow { align-self: flex-end; }
.tcard--soon { background: var(--accent-lavender); }
.tcard__soon { align-self: flex-end; padding: 4px 10px; border: 1px solid var(--ink); border-radius: 999px; }
.tcard .chip, .icard .chip { background: rgba(255, 255, 255, .7); }

.sit__grid { display: grid; grid-template-columns: 1fr; column-gap: var(--space-2xl); }
@media (min-width: 1024px) { .sit__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sit__item { padding: var(--space-l) 0; border-top: 1px solid var(--line); }
.sit__q { margin: 0 0 var(--space-base); font-size: clamp(1.25rem, 1vw + .95rem, 1.75rem); line-height: 1.2; font-weight: var(--fw-medium); text-wrap: pretty; }
.sit__a { font-size: 1.0625rem; }
.sit__a p:last-child { margin-bottom: 0; }
.sit__link { margin-top: var(--space-base); }

.steps__list { display: grid; gap: 0 var(--space-m); grid-template-columns: 1fr; counter-reset: s; }
@media (min-width: 768px) { .steps__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .steps__list { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } }
.steps__item { display: flex; flex-direction: column; gap: var(--space-s); padding: var(--space-m) 0 var(--space-l); border-top: 1.5px solid var(--ink); }
.steps__n { font-weight: var(--fw-black); font-size: clamp(2rem, 2vw + 1.2rem, 3rem); line-height: 1; color: #b9b9b9; }
.steps__title { margin: 0; font-weight: var(--fw-bold); font-size: clamp(1.125rem, .5vw + 1rem, 1.375rem); line-height: 1.2; }
.steps__text p { margin: 0 0 .6em; }
.steps__meta { margin-top: auto; background: var(--door-grad); }

.chk { display: grid; gap: var(--space-base) var(--space-2xl); grid-template-columns: 1fr; }
@media (min-width: 768px) { .chk--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.chk li { position: relative; padding-left: 40px; font-size: var(--prose-size); line-height: 1.5; }
.chk li::before { content: ""; position: absolute; left: 0; top: .15em; width: 24px; height: 24px; border-radius: 50%; background: var(--door-grad); }
.chk li::after { content: ""; position: absolute; left: 8px; top: calc(.15em + 6px); width: 8px; height: 5px; border-left: 2px solid var(--ink); border-bottom: 2px solid var(--ink); rotate: -45deg; }
.lst__after { margin-top: var(--space-l); }

.prj__grid { display: grid; gap: var(--space-m); grid-template-columns: 1fr; }
@media (min-width: 768px) { .prj__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .prj__grid:not(.prj__grid--2) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.prj { position: relative; display: flex; flex-direction: column; background: var(--white); color: var(--ink); }
.prj[hidden] { display: none; }
.prj__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--gray); }
.prj__img img { width: 100%; height: 100%; object-fit: cover; transition: scale 1s var(--ease-enter); }
.prj:hover .prj__img img { scale: 1.04; }
.prj__meta { display: flex; flex-direction: column; gap: 6px; padding: var(--space-base) var(--space-base) var(--space-l); }
.prj__name { font-weight: var(--fw-bold); font-size: clamp(1.125rem, .5vw + 1rem, 1.5rem); line-height: 1.2; margin-top: 4px; }
.prj__type { color: #444; }
.prj__status { color: #6b6b6b; }
.prj > .card-arrow { position: absolute; right: var(--space-base); bottom: var(--space-base); }

.gcard__grid { display: grid; gap: var(--space-m); grid-template-columns: 1fr; }
@media (min-width: 768px) { .gcard__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .gcard__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.gcard { display: flex; flex-direction: column; gap: var(--space-s); padding: var(--space-l) var(--space-m) var(--space-m); min-height: 260px; color: var(--ink); background: var(--accent-mint); }
.gcard[hidden] { display: none; }
.gcard[data-side="business"] { background: var(--accent-lime); }
.gcard__title { font-weight: var(--fw-bold); font-size: clamp(1.2rem, .6vw + 1rem, 1.6rem); line-height: 1.2; text-wrap: pretty; }
.gcard__text { flex: 1; }
.gcard__foot { display: flex; justify-content: space-between; align-items: center; gap: var(--space-base); }

.cdc__card { display: grid; gap: var(--space-xl); padding: var(--space-xl) var(--space-m); background: var(--accent-lavender); color: var(--ink); }
@media (min-width: 1024px) { .cdc__card { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-2xl); padding: var(--space-2xl) var(--space-xl); } }
.cdc__eyebrow { display: flex; align-items: center; gap: var(--space-xs); margin: 0 0 var(--space-base); font-weight: var(--fw-bold); }
.cdc__dot { width: 10px; height: 10px; border-radius: 50%; background: #6b5bd6; box-shadow: 0 0 0 4px rgba(107, 91, 214, .2); }
.cdc__title { margin: 0 0 var(--space-m); }
.cdc__title--inline { font-weight: var(--fw-black); text-transform: uppercase; font-size: clamp(1.3rem, 1vw + 1rem, 1.9rem); line-height: 1.05; }
.cdc__text { margin: 0; }
.cdc__text p { margin: 0 0 .8em; }
.cdc__text ul { margin: 0 0 .8em; padding-left: 1.25em; list-style: disc; }
.cdc__text li { margin: .3em 0; padding-left: .2em; }
.cdc__text > :last-child { margin-bottom: 0; }
.cdc__types { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-m); }
.cdc__types .chip { background: rgba(255, 255, 255, .75); }
.cdc__side { display: flex; flex-direction: column; justify-content: flex-end; gap: var(--space-base); }
.cdc__btn {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-base); width: 100%;
  padding: 18px 20px; border-radius: var(--radius-btn); background: var(--ink); color: var(--paper);
  font-weight: var(--fw-bold); text-transform: uppercase; font-size: 15px; cursor: not-allowed; opacity: .92;
}
.cdc__soon { padding: 3px 10px; border-radius: 999px; background: rgba(255, 255, 255, .18); font-size: 12px; }
.cdc__small { margin: 0; }
.cdc__card--inline { margin: 2em 0; padding: var(--space-l) var(--space-m); grid-template-columns: 1fr; gap: var(--space-m); font-size: 1rem; }
.cdc__card--inline .cdc__text { font-size: 1rem; }

.form2__card { display: grid; gap: var(--space-xl); padding: var(--space-xl) var(--space-m); background: var(--accent-lavender); color: var(--ink); }
@media (min-width: 1024px) { .form2__card { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: var(--space-2xl); padding: var(--space-2xl) var(--space-xl); } }
.form2__title { margin: 0 0 var(--space-m); }
.form2__intro { margin: 0; }
.form2__form { display: flex; flex-direction: column; gap: var(--space-l); }
.form2__progress { color: var(--ink); }
.form2__step { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-l); min-width: 0; }
.form2__step[hidden] { display: none; }
.form2__legend { padding: 0; margin-bottom: var(--space-base); font-weight: var(--fw-bold); font-size: clamp(1.25rem, 1vw + 1rem, 1.75rem); }
.form2__q { margin: 0 0 var(--space-xs); font-weight: var(--fw-bold); width: 100%; }
.form2__doors { display: grid; gap: var(--space-base); grid-template-columns: 1fr; }
@media (min-width: 768px) { .form2__doors { grid-template-columns: 1fr 1fr; } }
.door-opt { position: relative; display: block; cursor: pointer; }
.door-opt input, .opt input { position: absolute; opacity: 0; pointer-events: none; }
.door-opt span { display: flex; flex-direction: column; gap: 4px; padding: var(--space-m); border: 1.5px solid var(--line); background: var(--white); transition: border-color .3s, background .3s; }
.door-opt strong { font-size: 1.25rem; }
.door-opt em { font-style: normal; color: #555; }
.door-opt input:checked + span { border-color: var(--ink); background: var(--door-soft); }
.door-opt input:focus-visible + span, .opt input:focus-visible + span { outline: 1px dashed var(--ink); outline-offset: 3px; }
.form2__opts { display: flex; flex-wrap: wrap; gap: 8px; }
.form2__opts[hidden], .form2__stage[hidden] { display: none; }
.form2__where { display: grid; gap: var(--space-m); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.form2__where .fld--address, .form2__where .fld--suburb { grid-column: 1 / -1; }
@media (min-width: 768px) { .form2__where { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); } .form2__where .fld--suburb { grid-column: auto; } }
.opt { position: relative; cursor: pointer; }
.opt span { display: inline-flex; padding: 10px 16px; border: 1.5px solid var(--line); border-radius: 999px; background: var(--white); font-size: 15px; transition: border-color .3s, background .3s; }
.opt input:checked + span { border-color: var(--ink); background: var(--door-soft); }
.opt--sm span { padding: 6px 14px; }
.form2__row { display: grid; gap: var(--space-m); grid-template-columns: 1fr; }
@media (min-width: 768px) { .form2__row { grid-template-columns: 1fr 1fr; } }
.fld { display: flex; flex-direction: column; gap: 6px; min-width: 0; border: 0; padding: 0; margin: 0; }
.fld > span, .fld > legend { font-size: 13px; font-weight: var(--fw-bold); text-transform: uppercase; letter-spacing: .02em; padding: 0; }
.fld--radio { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; }
.fld--radio > legend { width: 100%; margin-bottom: 6px; }
.fld input, .fld select, .fld textarea {
  width: 100%; font: inherit; font-size: 1.0625rem; color: var(--ink); background: var(--white);
  border: 1.5px solid var(--line); border-radius: 0; padding: 12px 14px;
}
.fld input:focus, .fld select:focus, .fld textarea:focus { outline: none; border-color: var(--ink); }
.form2__actions { display: flex; flex-wrap: wrap; gap: var(--space-base); align-items: center; }
.form2__btn { display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 16px 28px; background: var(--ink); color: var(--paper); font-weight: var(--fw-bold); text-transform: uppercase; font-size: 15px; border-radius: var(--radius-btn); transition: opacity .3s; }
.form2__btn:hover { opacity: .85; }
.form2__back { padding: 16px 8px; text-transform: uppercase; font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.form2__small { margin: 0; color: #555; }
.form2__small a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.form2__consent { display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: center; font-size: 14px; line-height: 1.35; cursor: pointer; }
.form2__consent input { width: 18px; height: 18px; margin: 0; accent-color: var(--ink); }

.cinfo__list { display: grid; gap: var(--space-l) var(--space-2xl); grid-template-columns: 1fr; margin: 0; }
@media (min-width: 768px) { .cinfo__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cinfo__list div { padding-top: var(--space-base); border-top: 1px solid var(--line); }
.cinfo__list dt { margin-bottom: 6px; color: #555; }
.cinfo__list dd { margin: 0; }
.cinfo__list a { text-decoration: underline; text-underline-offset: 3px; }
.cinfo__qr img { display: block; width: 192px; height: auto; }

.doors__grid { display: grid; gap: var(--space-m); grid-template-columns: 1fr; }
@media (min-width: 1024px) { .doors__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.door { display: flex; flex-direction: column; color: var(--ink); background: var(--accent-mint); }
.door[data-side="business"] { background: var(--accent-lime); }
.door__img { display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.door__img img { width: 100%; height: 100%; object-fit: cover; transition: scale 1s var(--ease-enter); }
.door:hover .door__img img { scale: 1.03; }
.door__body { display: flex; flex-direction: column; gap: var(--space-base); padding: var(--space-l) var(--space-m) var(--space-l); flex: 1; }
@media (min-width: 1024px) { .door__body { padding: var(--space-xl) var(--space-l); } }
.door__title { margin: 0; }
.door__facts { display: flex; flex-direction: column; gap: 6px; margin: var(--space-xs) 0 var(--space-base); }
.door__facts li { position: relative; padding-left: 20px; }
.door__facts li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 50%; background: var(--ink); }
.door__go { margin-top: auto; width: fit-content; }

.router .hwh__card { min-height: 170px; gap: var(--space-s); }
.router__side { opacity: .7; }
@media (min-width: 1024px) { .router__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.showcase__track { height: var(--track-h, 600lvh); }
@media (prefers-reduced-motion: reduce) { .showcase__track { height: auto; } }

.home-hero .hero__text { padding-inline: var(--page-pad); gap: var(--space-m); }
.home-hero__h1 .hero__line { white-space: normal; text-wrap: balance; }
.home-hero__lead { margin: 0; max-width: 38ch; color: var(--fg); font-size: clamp(1.125rem, 1vw + .85rem, 1.75rem); }
.home-hero__cred { margin: 0; color: var(--fg); opacity: .8; }
.home-hero .hero__ctas { margin-top: var(--space-s); }
.home-hero .hero__media { background: var(--ink) url("../video/hero-loop-poster.webp") center / cover no-repeat; }
@media (orientation: portrait) { .home-hero .hero__media { background-image: url("../video/hero-loop-mobile-poster.webp"); } }

.psym-hero__top { position: absolute; top: calc(var(--header-h) + var(--space-base)); left: 0; right: 0; z-index: 5; }
.psym-hero__crumb { display: flex; flex-wrap: wrap; gap: 4px var(--space-xs); color: var(--paper); }
.psym-hero__crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.psym-hero__h1 { margin: 0; display: flex; flex-direction: column; align-items: center; gap: var(--space-base); color: var(--paper); }
.psym-hero__h1 .psym-hero__title { display: block; }
.psym-hero__sub { display: block; color: var(--paper); max-width: 40ch; text-wrap: balance; }
.pfacts .psym-spec__value .tbc { font-size: .7em; }

.pgal__grid { display: grid; gap: var(--space-m); grid-template-columns: 1fr; }
@media (min-width: 768px) { .pgal__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .pgal__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pgal__item { margin: 0; }
.pgal__img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.pgal__cap { margin-top: var(--space-xs); color: #555; }

.art-img__img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; }
@media (max-width: 767px) { .art-img__img { aspect-ratio: 4 / 3; } }
.art__toc { margin-bottom: var(--space-xl); }
@media (min-width: 1024px) { .art__toc nav { position: sticky; top: calc(var(--header-h) + var(--space-m)); max-height: calc(100vh - var(--header-h) - 48px); overflow: auto; } }
.art__toc-h { margin: 0 0 var(--space-base); font-weight: var(--fw-bold); }
.art__toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; border-left: 1.5px solid var(--line); }
.art__toc a { display: block; padding-left: var(--space-base); font-size: 15px; line-height: 1.35; color: #444; }
.art__toc a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.art__toc ol { position: relative; }
.art__toc nav { padding-left: 8px; margin-left: -8px; }
.art__toc ol::before { content: ""; position: absolute; left: -1.5px; top: 0; width: 3px; height: var(--toc-fill, 0px); background: var(--ink); transition: height .35s ease; }
.art__toc li { position: relative; }
.art__toc li::before { content: ""; position: absolute; left: -6.75px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: var(--ink); box-shadow: 0 0 0 3px var(--paper); transform: scale(0); transition: transform .25s ease; }
.art__toc li.is-current::before { transform: scale(1); }
.art__toc li.is-current a { color: var(--ink); font-weight: var(--fw-bold); }
.art__toc a { transition: color .25s; }
.art__body h2, .art__body h3 { scroll-margin-top: calc(var(--header-h) + var(--space-m)); }
@media (prefers-reduced-motion: reduce) { .art__toc ol::before, .art__toc li::before, .art__toc a { transition: none; } }
.art__body > h2:first-child { margin-top: 0; }
.art__sources-h + ul { font-size: .85em; line-height: 1.5; }
.art__sources-h + ul a { word-break: break-word; }
.site-actions__book { display: none; }
@media (max-width: 767px) {
  .site-actions { gap: 12px; }
  .site-actions__book { display: inline-flex; white-space: nowrap; }
  .oic-logo, .site-actions__book, .site-actions .btn--icon { flex-shrink: 0; }
}
@media (max-width: 359px) { .site-actions__more { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
.art-by { display: flex; align-items: center; gap: var(--space-base); margin: var(--space-l) 0 0; }
.art-by__photo { flex: none; display: block; }
.art-by__img { display: block; width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 18%; }
.art-by__text { margin: 0; display: flex; flex-direction: column; gap: 2px; font-size: 15px; line-height: 1.35; }
.art-by__name { font-weight: var(--fw-bold); }
.art-by__name a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.art-by__meta { color: #444; }
.art-author { display: grid; grid-template-columns: 72px 1fr; gap: var(--space-m); align-items: start; margin: var(--space-2xl) 0 0; padding-top: var(--space-l); border-top: 1.5px solid var(--line); }
@media (min-width: 768px) { .art-author { grid-template-columns: 112px 1fr; gap: var(--space-l); } }
.art-author .art-author__img { display: block; width: 100%; height: auto; aspect-ratio: 1; border-radius: 50%; object-fit: cover; object-position: 50% 18%; }
.art-author .art-author__body p { margin: 0; }
.art-author .art-author__eyebrow { margin-bottom: var(--space-xs); }
.art-author .art-author__name { font-size: var(--t-h4); font-weight: var(--fw-bold); line-height: 1.2; color: var(--ink); }
.art-author .art-author__role { margin-top: 4px; color: #444; }
.art-author .art-author__bio { margin-top: var(--space-s); max-width: 52ch; }
.art-author .art-author__more { display: inline-block; margin-top: var(--space-s); }
.art-note { margin: var(--space-xl) 0 0; padding: var(--space-m); background: var(--door-soft); }
.art-note .art-note__h { margin: 0 0 var(--space-xs); font-weight: var(--fw-bold); }
.art-note .art-note__text { margin: 0; color: #444; line-height: 1.5; }

/* The download box Florian approved on 19 Oct 2026 (guide-pdf-prototype/, version B): the text across the top, then
   First name, Email and the button in one row with the tick box under it. The form is one grid, so on a phone the tick
   box always comes before the button, and First name and Email always share the width equally. */
.dl__card { display: grid; gap: var(--space-l); align-items: start; padding: var(--space-xl) var(--space-m); background: var(--accent-lime); }
body[data-door="homes"] .dl__card { background: var(--accent-mint); }
@media (min-width: 1024px) { .dl__card { padding: var(--space-2xl) var(--space-xl); } }
.dl__text { max-width: 760px; }
.dl__text p { margin: 0 0 var(--space-s); }
.dl__text p:last-child { margin-bottom: 0; }
.dl__title { font-weight: var(--fw-bold); }
.dl__small { color: #555; }
.dl__small a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.dl__form { display: grid; gap: var(--space-base); grid-template-areas: "name" "email" "tick" "btn"; }
.dl__form .fld input { width: 100%; }
.dl__form > label:nth-of-type(1) { grid-area: name; }
.dl__form > label:nth-of-type(2) { grid-area: email; }
.dl__form .form2__btn { grid-area: btn; align-self: end; }
.dl__consent { grid-area: tick; display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: center; font-size: 14px; line-height: 1.35; cursor: pointer; }
.dl__consent input { width: 18px; height: 18px; margin: 0; accent-color: var(--ink); }
@media (min-width: 600px) { .dl__form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "name email" "tick tick" "btn btn"; } }
@media (min-width: 1024px) { .dl__form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .55fr); grid-template-areas: "name email btn" "tick tick tick"; } .dl__form .form2__btn { width: 100%; } }
/* The download page (also its thank-you). */
.dlp__card { display: grid; gap: var(--space-base); padding: var(--space-xl) var(--space-m); background: var(--accent-lime); }
body[data-door="homes"] .dlp__card { background: var(--accent-mint); }
@media (min-width: 1024px) { .dlp__card { padding: var(--space-2xl) var(--space-xl); } }
.dlp__card .b-3 a { color: inherit; }
.dlp__h { margin-top: var(--space-2xl); }
.dlp__next { display: grid; gap: var(--space-m); margin-top: var(--space-l); }
@media (min-width: 768px) { .dlp__next { grid-template-columns: 1fr 1fr; } }
.dlp__next > div { padding: var(--space-l) var(--space-m); background: var(--white); display: grid; gap: var(--space-s); align-content: start; }
.dlp__back { margin-top: var(--space-l); }

.flt { padding-block: 0 var(--space-xl); }
.flt__bar { display: flex; flex-wrap: wrap; gap: 8px; }
.flt__btn { padding: 10px 16px; border-radius: 999px; border: 1.5px solid var(--line); font-size: 15px; background: var(--white); }
.flt__btn[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--paper); }

.btn--pill-cta::before { background: var(--accent-green-bright); opacity: .9; }
.btn--pill-cta { color: var(--ink); }
.btn--pill[aria-current="page"]::before { opacity: .3; }
.menu__disc-sub { font-size: 14px; font-weight: var(--fw-medium); line-height: 1.3; flex: none; }
@media (max-width: 768px) { .menu__disc-sub { display: none; } }

.site-footer__about { margin: var(--space-m) 0 0; color: #cfcfcf; max-width: 32ch; }
.site-footer__h { margin: var(--space-xl) 0 var(--space-base); color: #9a9a9a; }
@media (min-width: 1024px) { .site-footer__h { margin-top: 0; } }
.site-footer .site-footer__menu { margin: 0; align-items: flex-start; gap: 10px; }
.site-footer__menu a { color: var(--paper); }
.site-footer__menu a:hover { text-decoration: underline; text-underline-offset: 3px; }
.site-footer__contact p { margin: 0; }
.site-footer__areas { color: #bdbdbd; max-width: 60ch; }
.site-footer .tbc { font-size: 12px; }
@media (min-width: 1024px) { .site-footer .site-footer__legalcol { align-items: flex-end; } }

.img-missing { display: flex; align-items: center; justify-content: center; min-height: 160px; padding: 16px; background: var(--tbc-bg); color: var(--tbc-fg); font-size: 13px; text-align: center; }

.rv[hidden] { display: none !important; }
.rv-note { position: relative; z-index: 6; margin: var(--space-m) auto 0; max-width: calc(var(--page-max) - 2 * var(--page-pad)); width: calc(100% - 2 * var(--page-pad)); padding: 12px 16px; background: #fff7c2; color: #222; border: 1px solid #e6d36b; font-size: 14px; line-height: 1.45; }
.rv-note p { margin: 4px 0 0; }
.rv-note__tag { display: inline-block; padding: 1px 8px; border-radius: 999px; background: #222; color: #fff7c2; font-size: 11px; text-transform: uppercase; font-weight: var(--fw-bold); }
.arch-hero .rv-note, .psym-hero .rv-note, .hero .rv-note { position: absolute; left: var(--page-pad); right: var(--page-pad); bottom: var(--space-base); width: auto; margin: 0; z-index: 7; }
.rv-bar { position: fixed; left: 12px; bottom: 12px; z-index: 120; display: flex; flex-wrap: wrap; gap: 6px; max-width: calc(100vw - 24px); }
.rv-bar__btn { padding: 8px 12px; border-radius: 999px; background: #fff7c2; color: #222; border: 1px solid #e6d36b; font-size: 13px; font-weight: var(--fw-bold); box-shadow: 0 4px 16px rgba(0, 0, 0, .15); }
.rv-bar__btn[aria-pressed="true"] { background: #222; color: #fff7c2; }
.rv-plan { position: fixed; left: 12px; bottom: 60px; z-index: 120; width: min(560px, calc(100vw - 24px)); max-height: 60vh; overflow: auto; padding: 16px; background: #fffdf0; color: #222; border: 1px solid #e6d36b; box-shadow: 0 10px 40px rgba(0, 0, 0, .25); font-size: 13px; }
.rv-plan__h { margin: 0 0 8px; font-weight: var(--fw-bold); text-transform: uppercase; }
.rv-plan table { border-collapse: collapse; width: 100%; }
.rv-plan th { text-align: left; vertical-align: top; padding: 4px 10px 4px 0; white-space: nowrap; }
.rv-plan td { padding: 4px 0; word-break: break-word; }

.rv-bar__btn--tbc { background: var(--tbc-bg); border-color: #f0b27a; color: var(--tbc-fg); }
.tc__tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s); margin-bottom: var(--space-xl); }
.tc__group { margin-bottom: var(--space-2xl, 96px); }
.tc__who { margin: var(--space-xs) 0 var(--space-l); color: #555; }
.tc__list { list-style: none; margin: 0; padding: 0; }
.tc__item { display: flex; flex-direction: column; gap: var(--space-s); padding: var(--space-m) 0; border-top: 1px solid var(--line); }
.tc__q { margin: 0; max-width: 62ch; }
.tc__n { font-weight: var(--fw-bold); }
.tc__where summary { cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.tc__where ul, .tc__page ul { margin: var(--space-xs) 0 0; padding-left: 1.2em; display: flex; flex-direction: column; gap: 6px; }
.tc__where a, .tc__page a { text-decoration: underline; }
.tc mark { background: var(--tbc-bg); color: var(--tbc-fg); padding: 0 4px; border-radius: 3px; }
.tc__ans { display: flex; flex-direction: column; gap: 4px; max-width: 62ch; }
.tc__ans textarea { width: 100%; font: inherit; font-size: 1rem; color: var(--ink); background: var(--white); border: 1.5px solid var(--line); padding: 10px 12px; resize: vertical; }
.tc__ans textarea:focus { outline: none; border-color: var(--ink); }
.tc__page { padding: var(--space-s) 0; border-top: 1px solid var(--line); }
.tc__page summary { cursor: pointer; }
.tc__status { color: #555; }
@media print { .rv-bar, .site-header, .menu, .tc__tools { display: none; } .tc__where, .tc__page { break-inside: avoid; } }
.rvt__wrap { overflow-x: auto; }
.rvt__table { border-collapse: collapse; font-size: 13px; line-height: 1.4; min-width: 1100px; }
.rvt__table th { text-align: left; padding: 8px; border-bottom: 2px solid var(--ink); position: sticky; top: 0; background: var(--paper); }
.rvt__table td { padding: 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.rvt__table td a { text-decoration: underline; }
.rvt__table .num { text-align: right; font-variant-numeric: tabular-nums; }
.rvt__table tr.is-flag td:last-child { background: #fff3e6; }
.rvt__tbc { display: flex; flex-direction: column; gap: 10px; margin-top: var(--space-l); }
.rvt__tbc a { text-decoration: underline; }
body[data-kind="review"] .rvt__wrap { max-width: 100%; }
