/* Querencia — site styles.
   Extracted from the original single-file index.html so all pages share
   one cached stylesheet. Edit here once and every page changes. */

/* ==========================================================================
   QUERENCIA — brand system
   Purple #601974 · Ivory #F4EFE7 · Blue #1341CD · Orange #FF6B36

   FONTS — two of the three brand faces are commercial and must be self-hosted.
   Bona Nova is on Google Fonts (SIL OFL) and is loaded above; it is live now.
   Bearhug and TT Norms are licensed faces with no free CDN. Until their webfont
   files are dropped into /fonts/ (see the @font-face rules below), the stacks
   fall through to the stand-ins noted there, so nothing breaks — but the sans
   and the wordmark are NOT yet the real brand faces on this page.
   ========================================================================== */

/* --- Bearhug: the wordmark face. Buy the webfont kit, then place
   bearhug.woff2 in /fonts/. Stand-in until then: Saira Condensed 800, which is
   also a heavy condensed grotesque but noticeably less squared off. */
@font-face{
  font-family:"Bearhug";
  src:url("/fonts/bearhug.woff2") format("woff2"),
      url("/fonts/bearhug.woff") format("woff");
  font-weight:400 900;font-style:normal;font-display:swap;
}

/* --- TT Norms: body + UI face, from TypeType. A webfont licence is required;
   the desktop licence does not cover @font-face. Place the two weights in
   /fonts/ as below. Stand-in until then: DM Sans. */
@font-face{
  font-family:"TT Norms Pro";
  src:url("/fonts/tt-norms-pro-regular.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"TT Norms Pro";
  src:url("/fonts/tt-norms-pro-bold.woff2") format("woff2");
  font-weight:700;font-style:normal;font-display:swap;
}

:root{
  /* brand purple — this token was referenced 17 times but never defined
     (see also --purple-deep, 5 uses). The old --aubergine pair it replaced was
     defined and never used. */
  --purple:#601974;
  --purple-deep:#4A1259;
  --sapphire:#1341CD;
  --sapphire-deep:#0F34A6;
  --beacon:#FF6B36;
  --ivory:#F4EFE7;
  --ivory-soft:#EFE8DC;
  --chrome-line:linear-gradient(90deg,#8f96a3 0%,#eef1f5 30%,#8f96a3 55%,#e6e9ee 80%,#aab0bb 100%);
  --wordmark:"Bearhug", "Saira Condensed", "Arial Narrow", sans-serif;
  --wm-src:url("data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 294 73%22><path fill=%22%23fff%22 fill-rule=%22evenodd%22 d=%22M274.00,53.38 273.50,54.12 273.50,71.62 274.00,72.25 274.38,72.25 274.88,71.50 274.88,57.25 275.12,56.88 275.38,56.75 276.12,57.38 282.25,65.75 283.12,66.25 283.88,65.75 288.25,59.75 288.88,59.12 289.88,57.50 290.75,56.88 291.25,57.25 291.38,57.75 291.25,58.12 291.25,71.50 291.75,72.12 292.25,72.12 292.75,71.38 292.75,56.38 292.50,53.62 291.75,53.38 290.88,54.12 283.50,64.00 282.75,64.00 282.12,63.50 281.75,62.75 275.12,54.00 274.50,53.38ZM261.12,53.25 260.38,53.88 259.88,55.25 259.12,56.50 258.88,57.50 258.12,58.88 257.75,60.25 256.12,63.75 254.88,67.25 254.00,68.88 253.62,70.25 253.12,70.88 253.00,71.25 253.12,72.12 253.62,72.38 254.62,71.38 256.00,67.75 256.88,66.88 265.12,66.75 266.00,67.12 266.50,67.75 268.12,71.75 268.75,72.25 269.25,72.25 269.50,71.88 269.38,71.00 268.12,68.38 267.88,67.38 267.00,65.75 266.75,64.62 266.00,63.25 265.75,62.25 265.12,61.12 264.75,59.75 264.25,59.00 263.75,57.38 262.00,53.62 261.50,53.25ZM261.38,56.00 261.75,56.25 263.12,59.88 263.75,61.00 264.00,62.00 264.88,63.62 265.12,64.50 265.00,65.00 264.38,65.50 257.88,65.38 257.38,64.88 257.38,64.25 258.88,61.12 259.00,60.38 259.75,59.00 260.12,57.62 260.62,56.62ZM238.25,53.38 237.88,54.12 237.88,71.38 238.12,72.00 238.88,72.88 250.25,72.88 250.75,72.00 250.75,71.38 250.25,71.00 240.00,71.00 239.25,70.50 239.12,70.25 239.12,64.00 239.75,63.12 247.75,63.00 248.25,62.75 248.38,62.25 247.75,61.75 239.75,61.62 239.25,61.12 239.12,60.62 239.12,55.50 240.00,54.62 249.75,54.62 250.50,54.12 250.38,53.38 249.88,53.12 238.88,53.12ZM220.75,53.25 220.50,53.50 220.50,54.12 221.12,54.62 225.75,54.62 226.50,55.25 226.62,55.62 226.62,70.75 226.50,71.12 226.75,71.88 227.12,72.25 227.50,72.25 227.88,71.75 227.88,55.62 228.00,55.25 228.62,54.62 233.38,54.62 233.88,54.25 234.00,53.75 233.38,53.12 228.00,53.12 227.88,53.25 221.12,53.12ZM285.25,39.12 284.12,40.75 284.00,43.88 284.25,44.88 285.50,46.38 286.50,46.88 290.88,46.88 291.88,46.38 292.75,45.50 293.38,43.75 293.38,41.50 293.00,40.38 292.25,39.25 290.50,38.38 286.88,38.38ZM258.38,0.00 258.38,0.25 257.38,1.25 257.12,1.75 256.88,3.50 256.25,5.25 256.00,7.00 255.25,9.25 255.00,11.00 254.38,12.75 254.00,15.00 253.38,16.62 253.12,18.38 252.38,20.75 250.62,28.50 249.88,30.75 249.62,32.50 249.00,34.12 248.75,36.00 248.12,37.62 247.75,40.00 247.12,41.62 246.88,43.50 246.12,45.75 246.25,46.38 246.88,46.88 253.75,46.88 254.62,46.00 255.12,43.50 255.88,41.25 256.00,40.00 256.25,39.25 257.00,38.38 257.62,38.12 258.25,38.25 266.12,38.12 266.62,38.25 267.62,39.50 269.25,46.25 269.62,46.62 270.12,46.88 276.88,46.88 277.38,46.62 277.62,46.12 277.50,45.00 276.88,43.38 276.75,42.12 276.00,39.88 275.75,38.12 275.12,36.38 274.62,33.62 274.00,32.00 273.75,30.12 273.12,28.50 272.88,26.75 272.25,25.00 271.88,22.75 271.25,21.00 271.00,19.38 270.38,17.50 270.00,15.50 268.75,11.00 268.50,9.38 268.00,8.12 267.62,5.88 267.00,4.12 266.50,1.50 265.25,0.00ZM261.62,19.00 262.00,19.00 262.62,19.88 263.25,23.12 264.00,25.25 264.25,27.12 265.00,29.12 264.88,29.88 264.25,30.38 259.50,30.38 258.88,29.88 258.75,29.50 260.75,22.00 261.12,19.62ZM231.50,0.00 230.50,1.50 230.50,46.00 230.62,46.38 231.25,46.88 238.25,46.88 238.75,46.50 239.00,45.75 239.00,1.62 238.62,0.75 238.00,0.00ZM201.38,0.00 201.25,0.25 199.12,1.00 198.25,1.62 197.12,2.88 196.38,5.00 196.38,42.38 196.75,44.25 197.62,45.62 198.62,46.38 199.75,46.88 217.88,46.88 218.38,46.75 219.50,46.12 220.50,45.25 221.62,42.88 221.75,33.12 221.38,32.12 220.38,31.75 214.38,31.75 213.50,32.00 213.00,32.75 213.00,37.88 212.75,38.50 212.00,39.00 206.62,39.12 205.50,38.75 205.00,38.12 204.88,37.62 204.88,9.62 205.38,8.75 206.38,8.25 212.00,8.38 212.88,9.12 213.00,9.50 213.00,14.50 213.62,15.50 220.75,15.62 221.25,15.38 221.75,14.12 221.50,4.00 220.62,2.25 219.62,1.25 218.00,0.62 217.12,0.00ZM162.62,0.00 161.75,1.12 161.50,1.75 161.62,2.88 161.50,3.38 161.50,21.50 161.62,21.62 161.50,45.50 161.75,46.38 162.38,46.88 169.50,46.88 170.12,46.12 170.12,25.25 170.25,24.88 170.62,24.75 171.12,25.25 172.00,27.00 172.25,28.38 172.88,29.62 173.25,31.12 173.88,32.38 174.25,33.88 174.75,34.75 175.12,36.25 175.75,37.50 177.12,41.75 177.62,42.62 178.25,44.75 179.00,46.38 179.62,46.88 187.50,46.88 187.75,46.75 188.25,45.88 188.25,1.50 188.00,1.00 187.25,0.25 187.25,0.00 180.62,0.00 179.62,1.50 179.75,21.75 179.62,22.25 179.12,22.50 178.62,22.00 178.00,20.88 177.75,19.62 177.00,17.88 176.62,16.38 176.12,15.50 175.62,13.62 175.12,12.75 174.75,11.25 173.00,7.00 172.88,6.12 172.25,4.88 171.75,3.00 170.88,1.12 169.88,0.00ZM132.50,0.00 131.50,1.75 131.62,2.25 131.62,46.25 132.25,46.88 154.00,46.88 154.38,46.75 154.88,45.88 154.88,40.25 154.38,39.25 153.62,39.00 141.38,39.12 140.50,38.88 140.00,38.25 140.00,27.75 140.62,27.00 141.12,26.88 149.38,27.00 150.25,26.75 150.75,26.12 150.75,20.00 150.25,19.25 149.38,19.00 141.12,19.12 140.62,19.00 140.00,18.25 140.00,9.25 140.12,8.88 140.88,8.25 153.75,8.25 154.38,8.00 154.88,7.25 154.88,1.50 154.62,1.00 153.75,0.25 153.75,0.00ZM98.38,0.00 98.38,0.25 97.38,1.50 97.38,45.88 97.62,46.50 98.12,46.88 105.25,46.88 105.75,46.50 106.00,45.75 106.00,27.62 106.38,27.12 107.00,26.88 112.62,26.88 113.38,27.12 113.88,27.62 114.12,28.50 114.12,41.75 115.00,44.75 116.00,45.88 118.00,46.88 123.25,47.00 124.12,46.75 124.38,46.50 124.38,46.12 123.00,43.75 122.75,42.62 122.62,26.75 121.62,24.62 120.25,23.38 120.25,22.75 120.75,22.12 121.62,21.50 122.38,20.12 122.75,18.00 122.75,5.62 122.50,3.88 121.75,2.38 120.50,1.12 118.50,0.38 118.25,0.00ZM106.50,8.38 112.75,8.25 113.38,8.50 113.88,9.00 114.12,9.62 114.12,17.50 113.88,18.38 113.38,18.88 112.50,19.12 107.00,19.12 106.12,18.62 106.00,18.38 106.00,9.00ZM68.38,0.00 67.25,1.62 67.25,45.62 67.38,46.12 67.88,46.75 68.75,47.00 69.00,46.88 89.75,46.88 90.38,46.50 90.62,45.88 90.62,40.12 90.25,39.38 89.50,39.00 77.00,39.12 76.25,38.88 75.88,38.38 75.88,27.62 76.00,27.38 76.75,26.88 85.25,27.00 86.12,26.75 86.62,26.00 86.62,20.12 86.25,19.38 85.25,19.00 76.75,19.12 76.00,18.62 75.88,18.38 75.88,9.00 76.62,8.25 89.50,8.25 90.12,8.00 90.62,7.25 90.62,1.50 89.50,0.00ZM34.88,0.00 33.88,1.50 33.88,42.00 34.12,43.25 35.00,44.75 36.00,45.75 38.25,46.88 55.00,46.88 55.88,46.62 57.12,45.88 58.38,44.50 59.12,42.38 59.12,1.38 58.12,0.00 51.62,0.00 50.62,1.50 50.62,37.75 50.38,38.38 49.88,38.88 49.00,39.12 43.50,39.00 42.62,38.25 42.38,37.25 42.50,36.50 42.50,1.62 42.12,0.88 41.50,0.25 41.50,0.00ZM5.50,0.00 4.88,0.50 2.75,1.25 1.38,2.62 0.50,4.62 0.00,5.00 0.00,42.25 0.38,42.38 1.12,44.12 2.12,45.38 4.25,46.75 13.62,46.88 14.62,47.50 15.38,49.75 16.00,51.00 16.38,51.38 16.88,51.62 22.62,51.62 23.25,51.12 23.38,50.38 22.38,48.00 22.25,47.12 23.12,46.12 23.50,46.00 24.75,44.75 25.50,43.25 25.75,42.25 25.75,28.12 26.00,27.50 26.50,27.12 29.38,27.12 29.88,26.75 30.12,26.12 30.00,25.50 30.12,19.75 29.88,19.12 29.38,18.75 26.50,18.75 26.00,18.38 25.75,17.75 25.62,4.62 24.75,2.75 23.38,1.38 22.50,0.88 21.50,0.62 20.62,0.00ZM10.38,8.25 15.75,8.25 16.38,8.50 17.12,9.38 17.12,18.00 16.50,18.75 13.38,18.75 12.88,19.00 12.50,19.50 12.50,26.38 12.62,26.62 13.38,27.12 16.38,27.12 17.12,27.88 17.12,37.88 16.88,38.50 16.12,39.00 10.62,39.12 9.75,38.88 9.25,38.38 9.00,37.75 9.00,9.50 9.50,8.75Z%22/></svg>");
  --display:"Bona Nova", Georgia, serif;
  --sans:"TT Norms Pro", "DM Sans", "Helvetica Neue", Arial, sans-serif;
  --pad:clamp(1.25rem,4vw,4.5rem);
  --measure:62ch;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}
}
body{
  font-family:var(--sans);
  font-weight:340;
  
  background:var(--ivory);
  color:var(--purple);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--sapphire);color:var(--ivory)}

h1,h2,h3{font-family:var(--display);font-weight:400;line-height:.98;letter-spacing:-.015em}
.eyebrow{
  font-family:var(--sans);
  font-size:.72rem;font-weight:560;letter-spacing:.32em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:.75rem;
}
.eyebrow .tick{color:var(--beacon)}

/* focus */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--beacon);outline-offset:3px;border-radius:2px;
}
.skip-link{position:absolute;left:-999px;top:0;background:var(--purple);color:var(--ivory);padding:.6rem 1rem;z-index:200}
.skip-link:focus{left:0}

/* ------------------------------------------------------------------ header */
header.site{
  position:fixed;inset:0 0 auto 0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:.9rem var(--pad);
  background:var(--ivory);
  transition:background .35s ease, box-shadow .35s ease;
}
header.site.scrolled{background:rgba(244,239,231,.94);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(96,25,116,.12)}
.header-brand{display:flex;align-items:center;gap:1.1rem;text-decoration:none}
/* Brokerage compliance: eXp mark sits upper-left, larger than personal brand */
.exp-mark{height:44px;width:auto}
.brand-word{
  /* must be a block container: this is a <span>, and once the masked .wordmark
     and <small> (both block-level) went inside it, the inline box was split
     into anonymous blocks and its border-left was painted as a stray horizontal
     stub above the mark rather than as a vertical divider. */
  display:flex;flex-direction:column;align-items:flex-start;
  font-family:var(--wordmark);font-weight:800;
  font-size:1.05rem;letter-spacing:.12em;text-transform:uppercase;color:var(--purple);
  border-left:1px solid rgba(96,25,116,.28);padding-left:1.1rem;line-height:1.2;
}
.brand-word small{display:block;font-family:var(--sans);font-size:.56rem;letter-spacing:.24em;font-weight:500;text-transform:uppercase;opacity:.72}
/* Real logo files (client-supplied) replace the earlier CSS/vector wordmark
   attempts. Sized per placement: header is compact, footer brand block runs
   larger, the hero eyebrow badge smaller still and inline with its tick. */
.brand-logo-img{display:block;height:34px;width:auto}
.foot-brand .brand-logo-img{height:46px;margin-bottom:.5rem}
.hero-kicker{gap:.6rem}
.brand-logo-hero{height:34px;margin-top:1px}

/* ---------------------------------------------------------------- WORDMARK
   The QUERENCIA. TEAM lockup, used as an alpha mask rather than a plain image
   so it paints in currentColor — purple on ivory in the header, ivory on
   purple in the footer and hero, one asset for all three. Because it inherits
   colour, the blue and orange brand variants are also available anywhere just
   by setting `color`; no extra files needed.
   The supplied art was a 336x119 PNG, too small to stay crisp at the sizes
   used here, so it was traced to vector: contours lifted from the alpha
   channel at 8x and simplified to within 0.12px of the original (99.4% area
   match). It is now resolution-independent and scales to any size.
   Filled white rather than black so it survives both alpha- and
   luminance-based masking. */
.wordmark{
  display:none;
  width:var(--wm-w,112px);
  aspect-ratio:294 / 73;
  background-color:currentColor;
  -webkit-mask:var(--wm-src) no-repeat center / 100% 100%;
  mask:var(--wm-src) no-repeat center / 100% 100%;
  flex:0 0 auto;
}
/* the accessible name, and the visible fallback where masks are unsupported */
.wordmark-text{font-family:var(--wordmark);font-weight:800;letter-spacing:.06em}
@supports (mask-image:url("#m")) or (-webkit-mask-image:url("#m")){
  .wordmark{display:block}
  .wordmark-text{
    position:absolute;width:1px;height:1px;overflow:hidden;
    clip-path:inset(50%);white-space:nowrap;
  }
}
/* no margin-bottom in the header: the mark is the only thing in the block now,
   so a trailing gap would just push it off the vertical centre. The footer
   rule below re-adds one, because the tagline still sits under it there. */
.brand-word .wordmark{--wm-w:112px}
.foot-brand .wordmark{--wm-w:172px;margin-bottom:.55rem}
/* The eyebrow is a centred flex row, so it would centre the tick against the
   middle of the whole lockup — which now reads low, level with TEAM rather
   than with QUERENCIA. Pulling the box up by the height of the TEAM line
   (21 of the mark's 73 units) lets TEAM overhang into the margin below and
   centres the tick on the main line instead. */
.hero-kicker .wordmark{--wm-w:130px;margin-bottom:calc(var(--wm-w) * -21 / 294)}
nav.primary{display:flex;align-items:center;gap:1.9rem}
nav.primary a.navlink{
  font-size:.8rem;font-weight:480;letter-spacing:.06em;text-decoration:none;position:relative;padding:.3rem 0;
}
nav.primary a.navlink::after{
  content:"";position:absolute;left:0;bottom:0;height:1.5px;width:100%;
  background:var(--sapphire);transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.7,0,.2,1);
}
nav.primary a.navlink:hover::after,nav.primary a.navlink:focus-visible::after{transform:scaleX(1)}

.btn{
  display:inline-flex;align-items:center;gap:.7rem;
  font-family:var(--sans);font-weight:540;
  font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  padding:.95rem 1.6rem;border:0;cursor:pointer;border-radius:2px;
  transition:background .3s ease,color .3s ease,transform .25s ease,box-shadow .3s ease;
}
.btn .arr{display:inline-block;transition:transform .3s cubic-bezier(.7,0,.2,1)}
.btn:hover .arr,.btn:focus-visible .arr{transform:translateX(5px)}
.btn-primary{background:var(--sapphire);color:var(--ivory)}
.btn-primary:hover,.btn-primary:focus-visible{background:var(--beacon);color:var(--purple-deep)}
/* .btn-gold was only ever defined scoped to .pathway.alt — every other use
   of it (all the modal CTAs: Get directions, Sign In, etc.) was silently
   falling back to an unstyled transparent button. This is the real,
   general rule those were supposed to get. */
.btn-gold{background:var(--beacon);color:var(--purple-deep)}
.btn-gold:hover,.btn-gold:focus-visible{background:#E85A24;color:var(--purple-deep)}
.btn-ghost{
  background:transparent;color:var(--purple);
  border:1px solid rgba(96,25,116,.35);position:relative;
}
.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--sapphire);color:var(--sapphire)}
.btn-ivory{background:var(--ivory);color:var(--purple)}
.btn-ivory:hover,.btn-ivory:focus-visible{background:var(--beacon);color:var(--purple-deep)}
.header-cta{white-space:nowrap}

.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:.5rem;z-index:130}
.nav-toggle span{display:block;width:26px;height:2px;background:var(--purple);margin:6px 0;transition:transform .3s ease,opacity .3s ease}
/* ---------------------------------------------------------- mobile menu
   A panel that drops from beneath the header and is only as tall as its own
   links, rather than a full-screen purple takeover at display-type size.
   It sits *below* the header in the stacking order (z-index 90 vs 100), so
   the brand lockup and the close button stay visible and the panel's top
   edge can never show a seam against the header. */
.mobile-nav{
  position:fixed;top:0;left:0;right:0;z-index:90;
  background:var(--purple);color:var(--ivory);
  /* clears the header; the strip above is hidden behind it */
  padding:5.2rem var(--pad) 1.5rem;
  max-height:100svh;overflow-y:auto;
  display:flex;flex-direction:column;
  opacity:0;transform:translateY(-10px);visibility:hidden;pointer-events:none;
  box-shadow:0 16px 34px rgba(30,13,40,.26);
  transition:opacity .28s ease,transform .28s cubic-bezier(.7,0,.2,1),visibility 0s .28s;
}
.mobile-nav.open{
  opacity:1;transform:none;visibility:visible;pointer-events:auto;
  transition:opacity .28s ease,transform .28s cubic-bezier(.7,0,.2,1),visibility 0s;
}
/* :not(.mn-cta) matters — this selector outranks .btn, so without it the
   button's label inherited the link size and rendered enormous. */
.mobile-nav a:not(.mn-cta){
  font-family:var(--display);font-size:1.2rem;line-height:1.25;
  text-decoration:none;padding:.6rem 0;
  border-bottom:1px solid rgba(244,239,231,.14);
}
.mobile-nav a:not(.mn-cta):last-of-type{border-bottom:0}
.mobile-nav a:hover,.mobile-nav a:focus-visible{color:var(--beacon)}
.mobile-nav .mn-cta{margin-top:1.2rem;align-self:flex-start}
body.nav-open{overflow:hidden}
/* dims the page behind the panel; tapping it closes the menu */
body.nav-open::before{
  content:"";position:fixed;inset:0;z-index:80;background:rgba(30,13,40,.4);
}
/* hold the header fully opaque while open — when scrolled it is translucent,
   which would let the purple panel tint it */
body.nav-open header.site{background:var(--ivory)}
body.nav-open .nav-toggle span:nth-child(1){transform:translateY(8px) rotate(45deg)}
body.nav-open .nav-toggle span:nth-child(2){opacity:0}
body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* -------------------------------------------------------------------- hero */
.hero{
  min-height:100svh;position:relative;overflow:hidden;
  display:flex;align-items:center;
  padding:8.5rem var(--pad) 5.5rem;
  --mx:62%; --my:40%;
  background:
    radial-gradient(38% 30% at var(--mx) var(--my),rgba(255,170,100,.13),rgba(255,150,80,0) 70%),
    radial-gradient(90% 46% at 62% 62%,rgba(255,150,80,.13),rgba(255,150,80,0) 62%),
    radial-gradient(120% 44% at 50% 100%,rgba(96,58,124,.55),rgba(96,58,124,0) 70%),
    linear-gradient(180deg,#170920 0%,#24102F 42%,#33184290 66%,#1B0B24 100%);
  color:var(--ivory);
}
/* readability scrim so the copy holds over the structure behind it */
.hero::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(96deg,rgba(30,13,40,.94) 0%,rgba(30,13,40,.86) 26%,rgba(30,13,40,.45) 46%,rgba(30,13,40,0) 64%);
}
.hero-copy{position:relative;z-index:3;max-width:min(56ch,56vw)}
.hero .eyebrow{color:rgba(244,239,231,.8)}
.hero h1{
  font-size:clamp(2.9rem,6.6vw,6.2rem);
  color:var(--ivory);
}
.hero h1 .ln2{display:block;color:var(--beacon);font-weight:400}
/* the supporting brand statement: deliberately subordinate to the slogan —
   sans, small, letterspaced caps, so it reads as a descriptor rather than a
   second headline competing with the first */
.hero-statement{
  margin:1.15rem 0 0;
  font-family:var(--sans);
  font-size:clamp(.8rem,1.05vw,.95rem);
  font-weight:560;letter-spacing:.2em;text-transform:uppercase;
  color:var(--beacon);
}
.hero-statement::before{
  content:"";display:inline-block;vertical-align:middle;
  width:2.2rem;height:1px;margin-right:.9rem;
  background:linear-gradient(90deg,rgba(255,107,53,0),rgba(255,107,53,.75));
}
.hero-sub{max-width:34ch;margin:1.8rem 0 2.4rem;font-size:1.02rem;color:rgba(244,239,231,.82)}
.hero .btn-ghost{border-color:rgba(244,239,231,.45);color:var(--ivory)}
.hero .btn-ghost:hover,.hero .btn-ghost:focus-visible{border-color:var(--beacon);color:var(--beacon)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:1rem;width:max-content;max-width:100%}
.hero-kicker{margin-bottom:1.6rem}
.hero-baseline{
  position:absolute;left:var(--pad);bottom:1.4rem;right:var(--pad);z-index:3;
  display:flex;justify-content:space-between;align-items:center;
  font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(244,239,231,.55);
}
.hero-baseline .rule{flex:1;height:1px;margin:0 1.4rem;background:linear-gradient(90deg,rgba(255,107,53,.1),rgba(255,107,53,.55),rgba(255,107,53,.1))}

/* ------------- planetarium hero: star dome + a residence that builds itself */
.hero-visual{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  display:flex;align-items:center;justify-content:center;
}
.holo-stage{
  position:absolute;inset:0;
  perspective:4200px;perspective-origin:50% 46%;
  display:flex;align-items:center;justify-content:center;
  /* the residence is the scene: pushed right and blown up */
  transform:translate(7.5%,7%) scale(1.30);
}
@media (min-width:1700px){ .holo-stage{transform:translate(8%,5%) scale(1.46)} }
@media (max-width:1439px){ .holo-stage{transform:translate(10%,5%) scale(1.18)} }
@media (max-width:1279px){ .holo-stage{transform:translate(8%,6%) scale(1.02)} }
/* stacked layout: the estate is ~830 units wide, so it has to come down hard.
   Scoped to .hero so these outrank the max-width:1080 block later in the sheet. */
@media (max-width:860px){ .hero .holo-stage{transform:translate(0,16%) scale(.58)} .hero .holo{margin-top:150px} }
@media (max-width:640px){ .hero .holo-stage{transform:translate(0,20%) scale(.46)} .hero .holo{margin-top:160px} }
@media (max-width:460px){ .hero .holo-stage{transform:translate(0,24%) scale(.38)} .hero .holo{margin-top:168px} }
.holo-pivot{transform-style:preserve-3d;will-change:transform;transition:transform .3s ease-out}
.holo{
  position:relative;width:0;height:0;transform-style:preserve-3d;margin-top:172px;
  /* held three-quarter pose while building, so the volume reads as solid */
  transform:rotateX(9deg) rotateY(-9deg);
  animation:holo-sway 36s ease-in-out 5.6s infinite alternate;   /* begins once built */
}
@keyframes holo-sway{
  from{transform:rotateX(8deg) rotateY(-15deg)}
  to{transform:rotateX(10deg) rotateY(-2deg)}
}
.holo *{transform-style:preserve-3d}
.holo-root{position:absolute;left:0;top:0}
/* NOTE: opacity/transform on a wrapper flattens its 3D children, so the
   build animation runs on the leaf surfaces themselves. The `translate`
   property is used instead of `transform` so each surface keeps the
   placement transform that puts it in 3D space. */
.piece{position:absolute;left:0;top:0}
.piece > *{animation:surf-rise .9s cubic-bezier(.18,.7,.2,1) var(--d,0s) both}
.piece.drop > *{animation-name:surf-drop}
.piece.fade > *{animation-name:surf-fade;animation-duration:1.15s}
.piece.dissolving > *{animation:surf-dissolve 1.4s ease-in forwards!important}
/* lit surfaces: build animation + slow pulse, running on separate properties */
.piece > .glow{animation:surf-rise .9s cubic-bezier(.18,.7,.2,1) var(--d,0s) both,
               window-glow 5.2s ease-in-out var(--d,0s) infinite}
.piece.drop > .glow{animation-name:surf-drop,window-glow}
.piece.fade > .glow{animation-name:surf-fade,window-glow;animation-duration:1.15s,5.2s}
.piece.dissolving > .glow{animation:surf-dissolve 1.4s ease-in forwards!important}
@keyframes surf-rise{from{opacity:0;translate:0 54px 0}to{opacity:1;translate:none}}
@keyframes surf-drop{from{opacity:0;translate:0 -60px 0}to{opacity:1;translate:none}}
@keyframes surf-fade{from{opacity:0}to{opacity:1}}
@keyframes surf-dissolve{to{opacity:0;translate:0 -22px 0}}
.face{
  position:absolute;left:0;top:0;transform-origin:center;
  backface-visibility:hidden;
}
/* materials -------------------------------------------------------------- */
.m-stone{
  background:
    repeating-linear-gradient(0deg,rgba(18,6,26,.30) 0 1px,rgba(18,6,26,0) 1px 12px),
    repeating-linear-gradient(90deg,rgba(18,6,26,.22) 0 1px,rgba(18,6,26,0) 1px 26px),
    linear-gradient(180deg,#4A3358,#332046);
  box-shadow:inset 0 0 0 1px rgba(255,214,166,.14);
}
.m-base{background:linear-gradient(180deg,#4A3358,#37244A);box-shadow:inset 0 0 0 1px rgba(255,214,166,.16)}
/* clapboard siding: fine shadow line under every course */
.m-wall{
  background:
    repeating-linear-gradient(180deg,
      rgba(96,25,116,.20) 0 1px,
      rgba(255,255,255,.42) 1px 3px,
      rgba(96,25,116,0) 3px 13px),
    linear-gradient(180deg,#FBF7F1 0%,#EFE6DA 58%,#E2D6C7 100%);
  box-shadow:inset 0 0 0 1px rgba(96,25,116,.16);
}
/* cedar shingle courses with a staggered butt line */
.m-roof{
  border-top:1px solid rgba(255,190,140,.35);
  background:
    repeating-linear-gradient(180deg,rgba(255,214,166,.16) 0 1px,rgba(255,214,166,0) 1px 11px),
    repeating-linear-gradient(90deg,rgba(0,0,0,.20) 0 1px,rgba(0,0,0,0) 1px 22px),
    linear-gradient(180deg,#6B4283 0%,#3A1C4B 100%);
  box-shadow:inset 0 0 0 1px rgba(255,214,166,.26), inset 0 2px 0 0 rgba(255,222,186,.28);
}
.m-ridge{background:linear-gradient(180deg,#4B2A60,#2C1338)}
.m-fascia{background:linear-gradient(180deg,#FDFAF4,#D9CCBB)}
.m-brick{
  background:
    repeating-linear-gradient(0deg,rgba(20,8,26,.34) 0 1px,rgba(20,8,26,0) 1px 9px),
    repeating-linear-gradient(90deg,rgba(20,8,26,.26) 0 1px,rgba(20,8,26,0) 1px 19px),
    linear-gradient(180deg,#7B4F5D,#482C3D);
  box-shadow:inset 0 0 0 1px rgba(255,214,166,.12);
}
.m-trim{background:linear-gradient(180deg,#FDFAF4,#DFD3C4)}
/* fluted portico columns */
.m-column{
  background:
    repeating-linear-gradient(90deg,rgba(96,25,116,.20) 0 1px,rgba(255,255,255,0) 1px 5px),
    linear-gradient(180deg,#FFFDF8,#DBCFBE);
  box-shadow:inset 0 0 0 1px rgba(96,25,116,.14);
}
.m-sill{background:linear-gradient(180deg,#FFFDF8,#D6C9B7);box-shadow:0 1px 3px rgba(20,8,26,.35)}
.m-head{background:linear-gradient(180deg,#FFFDF8,#E4D8C8)}
/* louvered shutters */
.m-shutter{
  background:
    repeating-linear-gradient(180deg,rgba(255,255,255,.10) 0 1px,rgba(0,0,0,.34) 1px 2px,rgba(0,0,0,0) 2px 5px),
    linear-gradient(180deg,#3E2456,#20102D);
  box-shadow:inset 0 0 0 1px rgba(255,214,166,.20);
}
.m-rail{background:linear-gradient(180deg,#FDFAF4,#D9CCBB)}
/* the whole baluster run drawn as one plane: bars with see-through gaps */
.m-baluster{background:repeating-linear-gradient(90deg,rgba(253,250,244,.94) 0 5px,rgba(253,250,244,0) 5px 16px)}
.m-step{background:linear-gradient(180deg,#5A3E6B,#3E2450)}
.m-copper{
  background:
    repeating-linear-gradient(90deg,rgba(60,26,20,.20) 0 1px,rgba(0,0,0,0) 1px 9px),
    linear-gradient(180deg,#D6AC80,#7E5738);
}
.m-iron{background:linear-gradient(180deg,#584072,#2C1A3E)}
.m-lantern{
  background:linear-gradient(170deg,#FFE7C4,#FF9F53);
  box-shadow:inset 0 0 0 1px rgba(255,246,232,.7),0 0 16px 3px rgba(255,150,80,.42);
}
.m-conifer{
  background:linear-gradient(180deg,#597B70 0%,#31465A 54%,#1D2B3C 100%);
}
.m-trunk{background:linear-gradient(180deg,#4A3350,#2A1934)}
.m-hedge{background:linear-gradient(180deg,#6A4788,#3B2154);box-shadow:inset 0 0 10px rgba(0,0,0,.28);border-radius:4px}
.m-paver{
  background:
    repeating-linear-gradient(90deg,rgba(30,13,40,.30) 0 1px,rgba(30,13,40,0) 1px 30px),
    repeating-linear-gradient(0deg,rgba(30,13,40,.24) 0 1px,rgba(30,13,40,0) 1px 22px),
    linear-gradient(180deg,rgba(198,182,170,.17),rgba(130,114,132,.07));
}
.m-path{background:linear-gradient(180deg,rgba(255,214,166,.16),rgba(255,214,166,.04));border-radius:4px}
.site-shadow{
  background:radial-gradient(ellipse at 50% 50%,rgba(12,3,18,.72) 0%,rgba(12,3,18,.42) 32%,rgba(12,3,18,.12) 58%,rgba(12,3,18,0) 78%);
  border-radius:50%;
}
/* the wall behind the veranda drops into shade, so the columns read forward */
.m-shade{background:linear-gradient(180deg,rgba(22,8,34,.70) 0%,rgba(22,8,34,.52) 62%,rgba(22,8,34,.30) 100%)}
.gable{box-shadow:none}
/* directional shading so the volume reads as solid */
.s-front{filter:brightness(1)}
.s-right{filter:brightness(.80)}
.s-left{filter:brightness(.66)}
.s-back{filter:brightness(.58)}
.s-top{filter:brightness(.88)}
.m-roof.s-back{filter:brightness(.72)}
/* openings ---------------------------------------------------------------- */
.pane{
  background:linear-gradient(160deg,rgba(19,65,205,.55),rgba(20,32,84,.85));
  box-shadow:inset 0 0 0 2px #F6F1E9, 0 0 10px rgba(19,65,205,.25);
}
/* true divided lites, drawn as muntins rather than an overlay corner */
.p-glass{
  background:
    repeating-linear-gradient(90deg,rgba(246,241,233,.8) 0 2px,rgba(246,241,233,0) 2px 50%),
    repeating-linear-gradient(0deg,rgba(246,241,233,.8) 0 2px,rgba(246,241,233,0) 2px 33.34%),
    linear-gradient(160deg,rgba(52,104,255,.58),rgba(18,29,78,.9));
}
.p-door{
  background:
    repeating-linear-gradient(0deg,rgba(255,255,255,.12) 0 1px,rgba(0,0,0,0) 1px 18px),
    linear-gradient(180deg,#FF7A46,#D84A1E);
  box-shadow:inset 0 0 0 3px #F6F1E9, 0 0 16px rgba(255,107,53,.35);
}
.p-garage{
  background:
    repeating-linear-gradient(90deg,rgba(96,25,116,.20) 0 2px,rgba(0,0,0,0) 2px 50%),
    repeating-linear-gradient(0deg,#EDE3D6 0 9px,#DCCFC0 9px 18px);
  box-shadow:inset 0 0 0 3px #F6F1E9;
}
.p-lit{
  background:
    repeating-linear-gradient(90deg,rgba(255,250,240,.92) 0 2px,rgba(0,0,0,0) 2px 50%),
    repeating-linear-gradient(0deg,rgba(255,250,240,.92) 0 2px,rgba(0,0,0,0) 2px 33.34%),
    linear-gradient(170deg,#FFDFB2,#F58A3C);
  box-shadow:inset 0 0 0 2px #FFF6E8, 0 0 20px 2px rgba(255,150,80,.42);
}
.lantern-glow{
  background:radial-gradient(circle at 50% 50%,rgba(255,206,150,.62) 0%,rgba(255,170,100,.2) 32%,rgba(255,150,80,0) 66%);
}
.porch-glow{
  background:radial-gradient(ellipse at 50% 42%,rgba(255,170,100,.20) 0%,rgba(255,160,90,.07) 38%,rgba(255,150,80,0) 68%);
}
@keyframes window-glow{0%,100%{filter:brightness(.86) saturate(1)}50%{filter:brightness(1.16) saturate(1.06)}}
.hero-baseline > span{transition:color .8s ease, text-shadow .8s ease}
.hero-baseline > span.stage-lit{color:var(--beacon);text-shadow:0 0 14px rgba(255,107,53,.45)}
.m-plinth{background:linear-gradient(180deg,#43265A 0%,#25102F 100%);box-shadow:inset 0 0 0 1px rgba(255,214,166,.16)}
.m-plinth.s-top{background:linear-gradient(180deg,#4E2E66,#3A1F4E)}
.m-lawn{
  background:radial-gradient(ellipse at 50% 50%,rgba(104,66,136,.72) 0%,rgba(70,41,96,.44) 38%,rgba(40,19,55,.14) 64%,rgba(30,13,40,0) 82%);
}
/* the near foreground projects high on screen at this camera angle, so it
   stays faint — otherwise it washes straight across the facade */
.m-lawn-near{
  background:radial-gradient(ellipse at 50% 40%,rgba(84,52,112,.30) 0%,rgba(56,32,78,.16) 44%,rgba(30,13,40,0) 78%);
}
.m-terrace{
  background:
    repeating-linear-gradient(90deg,rgba(48,24,64,.35) 0 1px,rgba(48,24,64,0) 1px 52px),
    linear-gradient(180deg,#CFC2B4,#AB9C8D);
  box-shadow:0 0 40px rgba(255,180,120,.12);
}
.m-lightpool{
  background:radial-gradient(ellipse at 50% 50%,rgba(255,182,116,.13) 0%,rgba(255,166,96,.05) 38%,rgba(255,150,80,0) 66%);
}
.m-drive{background:linear-gradient(180deg,#BFB3A5,#8E8175);border-radius:2px}
@media (prefers-reduced-motion:reduce){
  .holo{animation:none;transform:rotateX(9deg) rotateY(-9deg)}
  .piece > *,.piece > .glow,.piece.fade > .glow{animation:none!important;opacity:1;translate:none}
  .holo .lit-pane{animation:none;opacity:.95}
}
/* ---------------------------------------- lit surfaces on small screens
   `window-glow` animates `filter`, which forces a repaint of every element
   carrying it — roughly twenty of them, all inside a preserve-3d subtree that
   the phone then has to re-rasterise and re-sort each frame. Desktop absorbs
   it; phones drop layers, and the windows blink. So below 860px the panes and
   lantern bodies just stay lit, and only the two soft halos keep a pulse —
   moved onto `scale`, which the compositor animates without repainting. The
   pulse is barely legible at .46 scale anyway. */
@keyframes halo-breathe{0%,100%{scale:1}50%{scale:1.05}}
@media (max-width:860px){
  .hero .piece > .glow{animation-name:surf-rise;filter:none}
  .hero .piece.drop > .glow{animation-name:surf-drop}
  .hero .piece.fade > .glow{animation-name:surf-fade;animation-duration:1.15s}
  .hero .piece > .lantern-glow.glow,
  .hero .piece > .porch-glow.glow{animation-name:surf-rise,halo-breathe;animation-duration:.9s,6s}
  .hero .piece.fade > .lantern-glow.glow,
  .hero .piece.fade > .porch-glow.glow{animation-name:surf-fade,halo-breathe;animation-duration:1.15s,6s}
}

/* --------------------------------------------- 3D tilt cards (site-wide) */
.tilt{transform-style:preserve-3d;will-change:transform;transition:transform .35s cubic-bezier(.2,.6,.2,1)}
.tilt.tilting{transition:transform .06s linear}
.grabbable{cursor:grab}
.grabbing{cursor:grabbing}

/* ------------------------------------------- luxury hover micro-detail */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::after{
  content:"";position:absolute;inset:0;z-index:-1;transform:translateX(-101%);
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.22) 46%,transparent 72%);
  transition:transform .62s cubic-bezier(.3,.7,.2,1);
}
.btn:hover::after,.btn:focus-visible::after{transform:translateX(101%)}
.svc{transition:background .35s ease,transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s ease}
.svc:hover{box-shadow:0 26px 60px rgba(20,8,32,.28)}
.svc .link{position:relative}
.svc .link::after{
  content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--beacon);
  transition:width .45s cubic-bezier(.3,.7,.2,1);
}
.svc:hover .link::after{width:100%}
.pathway{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s ease,border-color .45s ease}
.pathway:hover{box-shadow:0 26px 60px rgba(20,8,32,.3);border-color:rgba(255,214,166,.5)}
.portrait-frame{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease}
.portrait-frame:hover{box-shadow:0 30px 60px rgba(20,8,32,.22)}
.portrait-frame .portrait-img{transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .6s ease}
.portrait-frame:hover .portrait-img{transform:scale(1.045);filter:contrast(1.06)}
nav.primary .navlink{position:relative}
nav.primary .navlink::after{
  content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1px;background:var(--beacon);
  transition:right .4s cubic-bezier(.3,.7,.2,1);
}
nav.primary .navlink:hover::after,nav.primary .navlink:focus-visible::after{right:0}
.cred{transition:transform .35s ease,border-color .35s ease}
.cred:hover{transform:translateX(6px)}
.foot-links a,.foot-nav a{position:relative;transition:color .3s ease,letter-spacing .4s ease}
.foot-links a:hover,.foot-nav a:hover{letter-spacing:.02em}
.field input,.field select,.field textarea{transition:box-shadow .3s ease,border-color .3s ease,transform .3s ease}
.field input:focus,.field select:focus,.field textarea:focus{transform:translateY(-1px)}
.pathway li,.step-pin,.cred{transition:all .35s cubic-bezier(.2,.7,.2,1)}
.pathway li:hover{color:var(--ivory);padding-left:1.7rem}

/* ------------------------------------------------------- beacon cursor */
#cursor-dot,#cursor-ring{display:none}
@media (hover:hover) and (pointer:fine){
  body{cursor:none}
  a,button,select,label,.btn{cursor:none}
  input,textarea{cursor:text}
  #cursor-dot,#cursor-ring{
    display:block;position:fixed;top:0;left:0;pointer-events:none;z-index:3000;
    transform:translate(-50%,-50%);will-change:transform;
  }
  #cursor-dot{
    width:7px;height:7px;border-radius:50%;background:var(--beacon);
    box-shadow:0 0 12px rgba(255,107,53,.85);
  }
  #cursor-ring{
    width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(19,65,205,.7);
    transition:width .22s ease,height .22s ease,border-color .22s ease,background-color .22s ease;
  }
  #cursor-ring.on{width:58px;height:58px;border-color:var(--beacon);background-color:rgba(255,107,53,.1)}
  #cursor-ring.press{width:26px;height:26px;border-color:var(--beacon)}
}

/* ------------------------------------------------------------------- intro */
section{position:relative}
.section-pad{padding:clamp(5rem,11vh,9rem) var(--pad)}
.intro{background:var(--ivory)}
.intro h2{
  font-size:clamp(2.6rem,6.4vw,5.6rem);max-width:16ch;color:var(--purple);
}
.intro h2 em{font-style:normal;color:var(--sapphire)}
.intro-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:3rem;align-items:end;margin-top:1rem}
.intro-copy{max-width:46ch;color:rgba(96,25,116,.85);font-size:1.04rem}
.intro-copy p+p{margin-top:1rem}
.chrome-rule{height:1px;background:var(--chrome-line);border:0;margin:2.6rem 0 0}

/* ---------------------------------------------------------------- services */
.services{background:var(--sapphire);color:var(--ivory)}
.services .eyebrow{color:var(--ivory)}
.services h2{font-size:clamp(2.4rem,5.6vw,4.6rem);color:var(--ivory);max-width:18ch}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(244,239,231,.28);margin-top:3.4rem;border:1px solid rgba(244,239,231,.28)}
.svc{
  background:var(--sapphire);padding:2.6rem 2.2rem 2.4rem;position:relative;overflow:hidden;
  display:flex;flex-direction:column;gap:1.1rem;min-height:280px;
  transition:background .35s ease;scroll-margin-top:6.5rem;
}
.svc:hover{background:var(--sapphire-deep)}
.svc .num{
  font-family:var(--sans);font-size:.68rem;letter-spacing:.3em;font-weight:560;color:rgba(244,239,231,.72);
}
.svc h3{font-size:clamp(1.7rem,2.6vw,2.3rem);color:var(--ivory)}
.svc p{color:rgba(244,239,231,.88);max-width:38ch;flex:1}
.svc .link{
  align-self:flex-start;text-decoration:none;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:560;
  color:var(--ivory);display:inline-flex;gap:.6rem;align-items:center;border-bottom:1px solid rgba(244,239,231,.5);padding-bottom:.3rem;
}
.svc .link:hover{color:#FFD9C2;border-color:var(--beacon)}
.svc .link:hover .arr{transform:translateX(5px)}
.svc .arr{transition:transform .3s ease}

/* -------------------------------------------------------------- meet emma */
.emma{background:var(--ivory)}
.emma-grid{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:clamp(2rem,6vw,5.5rem);align-items:center}
.emma-grid > *{min-width:0;width:100%}
.portrait-frame{
  position:relative;aspect-ratio:4/5;max-width:330px;width:100%;margin:0 auto;background:var(--ivory-soft);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  box-shadow:0 24px 48px rgba(68,15,82,.14);
}
.portrait-frame::before{
  content:"";position:absolute;inset:12px;border:1px solid rgba(255,107,53,.55);pointer-events:none;z-index:2;
}
.portrait-frame .ph{
  color:rgba(244,239,231,.66);text-align:center;padding:2rem;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;line-height:2;
}
.portrait-frame .portrait-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}
.portrait-frame .beacon-dot{position:absolute;top:26px;right:26px;width:9px;height:9px;border-radius:50%;background:var(--beacon);box-shadow:0 0 14px rgba(255,107,53,.7);z-index:2}
.emma h2{font-size:clamp(2.4rem,5.4vw,4.4rem)}
.emma h2 em{font-style:normal;color:var(--sapphire)}
.emma-bio{max-width:52ch;margin-top:1.6rem;color:rgba(96,25,116,.86);font-size:1.02rem}
.emma-bio p+p{margin-top:1rem}
.cred-list{margin-top:2rem;display:grid;gap:.9rem}
.cred{
  display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:baseline;
  padding-bottom:.9rem;border-bottom:1px solid rgba(96,25,116,.16);
}
.cred b{font-family:var(--sans);font-weight:600;font-size:.86rem;letter-spacing:.05em}
.cred span{font-size:.9rem;color:rgba(96,25,116,.78)}
.cred .marker{color:var(--beacon);font-size:.8rem}
.emma-social{margin-top:2rem;display:flex;align-items:center;gap:1.2rem}
.emma-social a{font-weight:560;font-size:.86rem;letter-spacing:.08em;text-decoration:none;border-bottom:1.5px solid var(--sapphire);padding-bottom:2px}
.emma-social a:hover{color:var(--beacon);border-color:var(--beacon)}
.emma-identity{margin-top:1.8rem;line-height:1.75;font-size:.92rem}
.emma-identity b{font-weight:640}

/* ----------------------------------------------------------------- process */
.process{background:var(--ivory-soft)}
.process-head{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end}
.process h2{font-size:clamp(2.6rem,6vw,5.2rem)}
.process h2 em{font-style:normal;color:var(--sapphire)}
.process-lede{max-width:44ch;color:rgba(96,25,116,.82);margin-top:1.4rem}
.mode-switch{display:inline-flex;border:1px solid rgba(96,25,116,.3);border-radius:2px;overflow:hidden}
.mode-switch button{
  font-family:var(--sans);font-weight:560;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;
  background:transparent;color:var(--purple);border:0;padding:1rem 1.7rem;cursor:pointer;transition:background .3s ease,color .3s ease;
}
.mode-switch button[aria-pressed="true"]{background:var(--sapphire);color:var(--ivory)}
.mode-switch button:not([aria-pressed="true"]):hover{color:var(--sapphire)}

.path-wrap{margin-top:3.4rem}
.path-rail{position:relative;display:grid;grid-template-columns:repeat(10,1fr);gap:0}
.path-line{
  position:absolute;top:19px;left:0;right:0;height:2px;background:rgba(96,25,116,.16);
}
.path-line .fill{
  position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,var(--sapphire),var(--sapphire) 88%,var(--beacon));
  transition:width .55s cubic-bezier(.7,0,.2,1);
}
.step-pin{
  position:relative;z-index:2;background:none;border:0;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:.8rem;padding:0 0 .4rem;
  font-family:var(--sans);
}
.step-pin .dot{
  width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  border:1.5px solid rgba(96,25,116,.34);background:var(--ivory-soft);
  font-size:.68rem;font-weight:600;letter-spacing:.08em;color:var(--purple);
  transition:all .3s ease;
}
.step-pin .lbl{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;font-weight:520;color:rgba(96,25,116,.62);max-width:9ch;text-align:center;line-height:1.5}
.step-pin:hover .dot{border-color:var(--sapphire);color:var(--sapphire)}
.step-pin[aria-selected="true"] .dot{background:var(--sapphire);border-color:var(--sapphire);color:var(--ivory);box-shadow:0 0 0 6px rgba(19,65,205,.16)}
.step-pin.done .dot{border-color:var(--sapphire);color:var(--sapphire)}
.step-pin.arrival[aria-selected="true"] .dot{background:var(--beacon);border-color:var(--beacon);box-shadow:0 0 0 6px rgba(255,107,53,.18),0 0 26px rgba(255,107,53,.5)}

.step-detail{
  position:relative;overflow:hidden;
  margin-top:2.6rem;background:var(--ivory);border:1px solid rgba(96,25,116,.14);
  padding:clamp(1.8rem,4vw,3rem);display:grid;grid-template-columns:auto 1fr;gap:clamp(1.4rem,3.5vw,3rem);align-items:start;
}
.step-detail .big-num{
  font-family:var(--display);font-size:clamp(3.4rem,7vw,6rem);line-height:.9;color:var(--sapphire);font-weight:400;
}
.step-detail.arrival{
  border-color:rgba(255,107,53,.5);
  box-shadow:0 0 0 1px rgba(255,107,53,.18),0 30px 70px rgba(255,107,53,.14);
  background:linear-gradient(140deg,#FFF9F2 0%,var(--ivory) 42%);
}
.step-detail.arrival .big-num{color:var(--beacon);animation:num-pop .9s cubic-bezier(.2,1.4,.35,1) both}
@keyframes num-pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
.step-detail.arrival h3{animation:rise-in .7s .1s cubic-bezier(.2,.7,.2,1) both}
.step-detail.arrival .fin{animation:rise-in .8s .28s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.arrival-halo{
  position:absolute;left:-8%;top:-30%;width:46%;aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,107,53,.22),rgba(255,107,53,0) 66%);
  animation:halo-bloom 1.4s ease-out both;
}
@keyframes halo-bloom{from{transform:scale(.4);opacity:0}60%{opacity:1}to{transform:scale(1);opacity:.85}}
.sparks{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.spark{
  position:absolute;left:14%;top:34%;width:7px;height:7px;border-radius:1px;opacity:0;
  animation:spark-fly 1.7s cubic-bezier(.12,.7,.25,1) both;
}
@keyframes spark-fly{
  0%{opacity:0;transform:translate3d(0,0,0) rotate(0deg) scale(.3)}
  10%{opacity:1}
  100%{opacity:0;transform:translate3d(var(--tx),var(--ty),0) rotate(var(--rot)) scale(1)}
}
.replay-row{margin-top:1.2rem}
.replay{
  background:none;border:0;font-family:var(--sans);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--sapphire);border-bottom:1px solid rgba(19,65,205,.4);padding-bottom:.25rem;cursor:pointer;
  transition:color .3s ease,border-color .3s ease;
}
.replay:hover{color:var(--beacon);border-color:var(--beacon)}
.step-detail h3{font-size:clamp(1.5rem,2.6vw,2.2rem);margin-bottom:.9rem}
.step-detail .body{max-width:60ch;color:rgba(96,25,116,.86)}
.step-detail .note{
  margin-top:1.2rem;padding:1rem 1.2rem;background:rgba(19,65,205,.07);border-left:2px solid var(--sapphire);
  font-size:.86rem;color:rgba(96,25,116,.8);max-width:60ch;
}
.step-detail .fin{
  margin-top:1.4rem;font-family:var(--display);font-size:clamp(1.6rem,3vw,2.4rem);color:var(--beacon);
}
.step-detail .cta-row{margin-top:1.6rem}
.step-nav{display:flex;gap:.8rem;margin-top:1.8rem}
.step-nav button{
  background:none;border:1px solid rgba(96,25,116,.3);border-radius:2px;cursor:pointer;color:var(--purple);
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;font-weight:560;padding:.7rem 1.2rem;font-family:var(--sans);
  transition:all .25s ease;
}
.step-nav button:hover:not(:disabled){border-color:var(--sapphire);color:var(--sapphire)}
.step-nav button:disabled{opacity:.35;cursor:default}
.process-disclaimer{margin-top:2.4rem;font-size:.82rem;color:rgba(96,25,116,.66);max-width:70ch}

/* --------------------------------------------------------------- pathways */
.pathways{background:var(--purple);color:var(--ivory)}
.pathways .eyebrow{color:rgba(244,239,231,.85)}
.pathways h2{font-size:clamp(2.4rem,5.6vw,4.6rem);color:var(--ivory);max-width:18ch}
.pathways h2 em{font-style:normal;color:var(--beacon)}
.pathways-lede{max-width:52ch;color:rgba(244,239,231,.82);margin-top:1.4rem}
.pathway-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,3vw,2.5rem);margin-top:3.4rem;align-items:stretch}
.pathway{position:relative;background:rgba(244,239,231,.035);border:1px solid rgba(244,239,231,.28);padding:2.8rem 2.4rem 2.4rem;display:flex;flex-direction:column}
.pathway.alt{background:rgba(19,65,205,.16);border-color:rgba(122,156,255,.55)}
.pathway .tag{position:absolute;top:0;left:2.4rem;transform:translateY(-50%);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;font-weight:600;padding:.5rem .9rem;background:var(--purple);border:1px solid rgba(244,239,231,.4);color:rgba(244,239,231,.85)}
.pathway.alt .tag{background:var(--beacon);border-color:var(--beacon);color:var(--ivory)}
.pathway h3{color:var(--ivory);font-size:clamp(1.6rem,2.6vw,2.2rem)}
.pathway .sub{color:rgba(244,239,231,.72);font-size:.95rem;margin-top:.5rem}
.pathway ul{list-style:none;margin-top:1.8rem;flex:1}
.pathway li{position:relative;padding:.95rem 0 .95rem 1.5rem;color:rgba(244,239,231,.88);font-size:.94rem;border-bottom:1px solid rgba(244,239,231,.14)}
.pathway li::before{content:"◆";position:absolute;left:0;top:1.05rem;font-size:.55rem;color:var(--beacon)}
.pathway.alt li::before{color:#9FB6FF}
.pathway .tradeoff{margin-top:1.6rem;font-size:.85rem;line-height:1.65;color:rgba(244,239,231,.74);border-left:2px solid rgba(244,239,231,.4);padding-left:1rem}
.pathway .tradeoff b{color:var(--ivory);font-weight:600}
.pathway .btn{margin-top:1.8rem;align-self:flex-start}
.pathway .btn-ghost{border-color:rgba(244,239,231,.5);color:var(--ivory)}
.pathway .btn-ghost:hover,.pathway .btn-ghost:focus-visible{border-color:var(--ivory);color:var(--ivory);background:rgba(244,239,231,.08)}
.pathway.alt .btn-gold{background:var(--beacon);color:var(--purple-deep)}
.pathway.alt .btn-gold:hover,.pathway.alt .btn-gold:focus-visible{background:#E85A24;color:var(--purple-deep)}
@media (max-width:860px){.pathway-grid{grid-template-columns:1fr}}
.capacity-note{
  margin-top:2.4rem;border:1px solid rgba(244,239,231,.3);padding:1.4rem 1.6rem;max-width:78ch;
  font-size:.85rem;color:rgba(244,239,231,.82);
}
.capacity-note b{color:var(--ivory)}

/* ----------------------------------------------------------------- consult */
.consult{
  background:
    radial-gradient(120% 140% at 85% -10%,rgba(255,107,53,.35),rgba(255,107,53,0) 44%),
    var(--sapphire);
  color:var(--ivory);
}
.consult-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2.4rem,6vw,5.5rem);align-items:start}
.consult h2{font-size:clamp(2.8rem,6.4vw,5.4rem);color:var(--ivory)}
.consult h2 em{font-style:normal;color:#FFD9C2}
.consult-lede{margin-top:1.6rem;max-width:40ch;color:rgba(244,239,231,.9);font-size:1.04rem}
.consult-lede p+p{margin-top:.9rem}
.consult .eyebrow{color:var(--ivory)}

form.lead{display:grid;gap:1.15rem;background:rgba(20,32,84,.22);padding:clamp(1.6rem,3.5vw,2.6rem);border:1px solid rgba(244,239,231,.3)}
.field{display:grid;gap:.45rem}
.field label{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:560;}
.field label .opt{color:#FFD9C2;text-transform:none;letter-spacing:.05em;font-weight:480;font-size:.72rem}
.field input,.field select,.field textarea{
  font-family:var(--sans);font-size:.98rem;color:var(--purple);
  background:var(--ivory);border:1px solid transparent;border-radius:2px;padding:.85rem 1rem;width:100%;
}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 49%,var(--purple) 50%),linear-gradient(-45deg,transparent 49%,var(--purple) 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--beacon);outline:none;box-shadow:0 0 0 3px rgba(255,107,53,.3)}
.field .err{display:none;font-size:.78rem;color:#FFD9C2;font-weight:520}
.field.invalid input,.field.invalid select{border-color:var(--beacon)}
.field.invalid .err{display:block}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.15rem}
.sms-disclosure{
  font-size:.76rem;line-height:1.65;color:rgba(244,239,231,.88);
  border-left:2px solid #FFD9C2;padding-left:1rem;
}
.sms-disclosure a{color:var(--ivory);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.sms-disclosure a:hover{color:#FFD9C2}
.form-status{display:none;padding:1.1rem 1.3rem;font-size:.92rem;border-radius:2px;line-height:1.6}
.form-status.show{display:block}
.form-status.ok{background:var(--ivory);color:var(--purple)}
.form-status.ok b{font-family:var(--display);font-size:1.2rem;display:block;margin-bottom:.2rem}
.form-status.fail{background:rgba(96,25,116,.55);color:var(--ivory);border:1px solid #FFD9C2}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.btn-submit{justify-content:center}
.btn-submit[disabled]{opacity:.6;cursor:wait}

/* The Open House sign-in form reuses the same form.lead markup/JS as the
   #consult form, but sits on the light modal card instead of the dark
   #consult section — the base rules above assume ivory text on a dark
   background, so invert what's needed here for legibility. */
.modal-card.light form.lead{background:rgba(96,25,116,.045);border-color:rgba(96,25,116,.22);color:var(--purple)}
.modal-card.light .sms-disclosure{color:rgba(96,25,116,.82);border-left-color:var(--beacon)}
.modal-card.light .sms-disclosure a{color:var(--sapphire)}
.modal-card.light .sms-disclosure a:hover{color:var(--beacon)}
.modal-card.light .field .err{color:var(--sapphire);font-weight:600}
.modal-card.light .field.invalid input,
.modal-card.light .field.invalid select{border-color:var(--sapphire);border-width:2px}
.modal-card.light .field label .opt{color:var(--beacon)}
.modal-card.light .form-status.fail{background:rgba(96,25,116,.08);color:var(--purple);border:1px solid var(--beacon)}
.modal-card.light .form-status.ok{background:var(--purple);color:var(--ivory)}
/* Open House sign-in panel — same light ivory/purple/blue/orange theme as
   the rest of the site (no dark/black treatment). */
.oh-modal-logo{height:36px;width:auto;display:block;margin:.1rem 0 1.5rem}
.oh-modal-sub{color:rgba(96,25,116,.75);margin:-.4rem 0 2rem;font-size:1.02rem}
.oh-yesno{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:.3rem}
.oh-yesno-btn{
  padding:.9rem 1rem;border:1px solid rgba(96,25,116,.3);background:#fff;
  color:var(--purple);font-family:var(--sans);font-size:.85rem;font-weight:560;
  letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border-radius:2px;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.oh-yesno-btn:hover{border-color:var(--sapphire)}
.oh-yesno-btn.active{background:var(--beacon);color:#fff;border-color:var(--beacon)}
.field.invalid .oh-yesno-btn{border-color:var(--sapphire);border-width:2px}

/* ------------------------------------------------------------------ footer */
footer.site{background:var(--purple-deep);color:var(--ivory);padding:4.5rem var(--pad) 2rem}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:2.5rem;padding-bottom:3rem;border-bottom:1px solid rgba(244,239,231,.18)}
/* no divider here: in the header the border-left separates the wordmark from
   the eXp mark beside it, but in the footer the lockup starts its own grid
   column with nothing to its left, so the rule was just a stray line. */
.foot-brand .brand-word{color:var(--ivory);border-left:0;padding-left:0}
.foot-brand .led{margin-top:1.1rem;font-size:.9rem;color:rgba(244,239,231,.8)}
.foot-brand .led b{color:var(--ivory);font-weight:600}
.foot-h{font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;font-weight:560;color:rgba(244,239,231,.6);margin-bottom:1.1rem;}
.foot-links{list-style:none;display:grid;gap:.55rem}
.foot-links a{text-decoration:none;font-size:.9rem;color:rgba(244,239,231,.85)}
.foot-links a:hover{color:var(--beacon)}
.foot-brokerage img{height:52px;width:auto;margin-bottom:1.1rem}
.foot-brokerage address{font-style:normal;font-size:.9rem;line-height:1.8;color:rgba(244,239,231,.85)}
.foot-brokerage .lbl{font-weight:600;color:var(--ivory)}
.compliance-bar{
  display:flex;flex-wrap:wrap;align-items:center;gap:1.6rem;justify-content:space-between;
  padding-top:1.8rem;font-size:.76rem;color:rgba(244,239,231,.7);
}
.compliance-bar .legal-links{display:flex;gap:1.3rem;flex-wrap:wrap}
.compliance-bar a{color:rgba(244,239,231,.8);text-decoration:none}
.compliance-bar a:hover{color:var(--beacon)}
.eho-chip{display:inline-flex}
.eho-chip img{height:40px;width:auto;display:block}
.compliance-line{margin-top:1.6rem;font-size:.74rem;color:rgba(244,239,231,.6);line-height:1.8}

/* ------------------------------------------------------------- reveal anim */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.5,0,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

/* -------------------------------------------------------------- responsive */
@media (max-width:1080px){
  .hero{grid-template-columns:1fr;padding-top:7.5rem;min-height:auto;row-gap:0}
  .hero{min-height:100svh;padding-top:7.5rem;padding-bottom:6rem;align-items:flex-start}
  .hero-copy{max-width:none;padding-top:6vh}
  .hero-ctas{width:auto}
  .hero::after{background:linear-gradient(180deg,rgba(30,13,40,.95) 0%,rgba(30,13,40,.82) 42%,rgba(30,13,40,.25) 68%,rgba(30,13,40,.55) 100%)}
  .holo-stage{transform:translate(0,14%) scale(.74);perspective-origin:50% 50%}
  .holo{margin-top:150px}
  .intro-grid,.emma-grid,.consult-grid{grid-template-columns:1fr}
  .svc-grid{grid-template-columns:1fr}
  .pathway-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  nav.primary .navlink{display:none}
  .nav-toggle{display:block}
  .header-cta{display:none}
}
@media (max-width:760px){
  .process-head{grid-template-columns:1fr}
  /* vertical mobile path */
  .path-rail{grid-template-columns:auto;gap:0;padding-left:6px}
  .path-line{top:0;bottom:0;left:19px;right:auto;width:2px;height:auto}
  .path-line .fill{width:100%!important;height:var(--vfill,0%);transition:height .55s cubic-bezier(.7,0,.2,1)}
  .step-pin{flex-direction:row;align-items:center;gap:1.1rem;padding:.55rem 0;text-align:left}
  .step-pin .lbl{max-width:none;text-align:left;font-size:.7rem}
  .step-detail{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .exp-mark{height:36px}
  .brand-word{font-size:.9rem;letter-spacing:.1em}
  .hero-baseline{display:none}
  .hero-statement{letter-spacing:.16em;margin-top:1rem}
  .hero-statement::before{width:1.5rem;margin-right:.7rem}
}


/* ============================================================
   Compliance & listings modals (Privacy / Terms / SMS / Open
   Houses) — single-file overlays so the whole site stays one
   index.html with no separate pages to deploy or break.
   ============================================================ */
.modal-overlay{
  position:fixed;inset:0;z-index:300;
  background:rgba(10,10,10,.72);
  display:none;
  align-items:flex-start;justify-content:center;
  padding:clamp(1.25rem,4vw,4rem) clamp(1rem,3vw,1.5rem);
  overflow-y:auto;
}
.modal-overlay.open{display:flex}
body.modal-open{overflow:hidden}

.modal-card{
  width:100%;max-width:820px;margin:auto;position:relative;
  background:#0b0b0b;color:rgba(255,255,255,.82);
  border:1px solid rgba(186,172,74,.55);
  padding:clamp(1.75rem,4vw,3.25rem);
  font-family:var(--sans);font-weight:340;line-height:1.7;
}
.modal-card.light{
  background:var(--ivory);color:var(--purple);
  border:1px solid rgba(96,25,116,.28);
}
/* Open House sign-in reads as its own dedicated page, not a floating
   pop-up card over a dimmed homepage — full-bleed background, no border,
   no backdrop dimming. Still the same single-file show/hide + URL-hash
   system under the hood (#open-house), just styled to not look like a
   modal at all. */
.modal-overlay.fullpage{background:var(--ivory);padding:0;align-items:flex-start}
.modal-overlay.fullpage .modal-card{
  max-width:none;width:100%;min-height:100vh;margin:0;border:none;
  padding:clamp(1.5rem,4vw,3rem) clamp(1.25rem,5vw,0) clamp(3rem,6vw,4rem);
}
.modal-overlay.fullpage .modal-card > *{max-width:820px;margin-left:auto;margin-right:auto}
.modal-overlay.fullpage .modal-top,
.modal-overlay.fullpage .oh-modal-logo,
.modal-overlay.fullpage .oh-modal-lockup{max-width:820px;margin-left:auto;margin-right:auto}
.oh-modal-lockup{display:flex;align-items:center;gap:1rem;margin:.1rem 0 1.5rem}
.oh-modal-lockup .oh-exp-logo{height:30px;width:auto}
.oh-modal-lockup .oh-lockup-divider{width:1px;height:26px;background:rgba(96,25,116,.28)}
.modal-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;margin-bottom:1.6rem}
.modal-updated{font-size:.72rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.42)}
.modal-card.light .modal-updated{color:rgba(96,25,116,.55)}
.modal-close{
  flex:0 0 auto;font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:#baac4a;background:none;text-decoration:none;
  border:1px solid rgba(186,172,74,.55);padding:.55rem 1.3rem;cursor:pointer;
  font-family:var(--sans);
}
.modal-close:hover,.modal-close:focus-visible{background:rgba(186,172,74,.1);outline:none}
.modal-card.light .modal-close{color:var(--purple);border-color:rgba(96,25,116,.35)}
.modal-card.light .modal-close:hover{background:rgba(96,25,116,.08)}
.modal-card h2.modal-title{
  font-family:var(--display);font-weight:400;color:#fff;
  font-size:clamp(1.7rem,4vw,2.3rem);font-variant:small-caps;letter-spacing:.01em;
  margin-bottom:2rem;
}
.modal-card.light h2.modal-title{color:var(--purple)}
.modal-card section{margin-bottom:0}
.modal-card h3{
  font-family:var(--sans);font-size:.82rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:#baac4a;margin:1.9rem 0 .7rem;
}
.modal-card section:first-of-type h3{margin-top:0}
.modal-card.light h3{color:var(--beacon)}
.modal-card p{font-size:.98rem;margin-bottom:.85rem}
.modal-card ul{margin:0 0 .85rem 1.25rem}
.modal-card li{margin-bottom:.5rem}
.modal-card a{color:#baac4a;text-decoration:underline;text-underline-offset:2px}
.modal-card a:hover{color:#fff}
.modal-card.light a{color:var(--sapphire)}
.modal-card.light a:hover{color:var(--beacon)}
.modal-card blockquote{
  border-left:2px solid #baac4a;padding:.15rem 0 .15rem 1.05rem;margin:.85rem 0 1.1rem;
  font-style:italic;color:rgba(255,255,255,.7);font-size:.92rem;
}
.modal-card.light blockquote{border-left-color:var(--beacon);color:rgba(96,25,116,.78);background:rgba(96,25,116,.05)}
.modal-note{
  font-size:.82rem;color:rgba(255,255,255,.42);border-top:1px solid rgba(255,255,255,.1);
  margin-top:2.2rem;padding-top:1.3rem;
}
.modal-card.light .modal-note{color:rgba(96,25,116,.55);border-top-color:rgba(96,25,116,.15)}
@media (max-width:640px){.modal-top{flex-direction:column;align-items:flex-start;gap:.85rem}}

/* ------------------------------------------------------------------
   Added by the multi-page split.
   1. The open house sign-in was a full-screen overlay; as a real page
      at /open-house it flows in the document instead of floating over
      one. Same ivory full-bleed look, just not fixed-position.
   2. .navlink.current marks the page you are on in the nav.
   ------------------------------------------------------------------ */
.modal-overlay.fullpage.oh-page{position:static;display:block;z-index:auto;overflow:visible;inset:auto}
.modal-overlay.fullpage.oh-page .modal-card{min-height:auto}
.oh-page .modal-back{
  font-family:var(--sans);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--purple);border:1px solid rgba(96,25,116,.35);padding:.45rem .9rem;
  text-decoration:none;background:none;cursor:pointer;transition:background .2s ease
}
.oh-page .modal-back:hover{background:rgba(96,25,116,.08)}
.navlink.current{color:var(--beacon)}
.mobile-nav a.current{color:var(--beacon)}
/* Service pages reuse the .intro block for their heading + copy. */
.page-lede .intro-copy p:last-child{margin-bottom:0}
.page-cta{margin-top:1.6rem}

/* The services grid is navigation on every page. On the page a card points
   at, the link becomes a plain marker instead — no self-link, and the visitor
   can see where they are without reading the URL. */
.svc .link.is-here{
  color:var(--ink-3,#8a8178);
  cursor:default;
  font-style:italic;
}
.svc .link.is-here::after{display:none}


/* ============================================================
   v9: questionnaire page + the fuller Buy / Sell / Invest pages
   ============================================================ */

/* ------------------------------------------------ how it works (journey) */
.journey{background:var(--ivory-soft)}
.journey h2{font-size:clamp(2.4rem,5.4vw,4.4rem);max-width:18ch}
.journey h2 em{font-style:normal;color:var(--sapphire)}
.journey-lede{max-width:56ch;color:rgba(96,25,116,.84);margin-top:1.4rem;font-size:1.02rem}
.journey-list{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(2rem,5vw,4.5rem);margin-top:3.2rem}
.journey-list li{display:grid;grid-template-columns:3.4rem minmax(0,1fr);gap:1.1rem;padding:1.8rem 0;border-top:1px solid rgba(96,25,116,.16)}
.journey-list .n{font-family:var(--display);font-size:2rem;line-height:1;color:var(--beacon)}
.journey-list h3{font-size:clamp(1.35rem,2vw,1.7rem);color:var(--purple);line-height:1.1}
.journey-list p{margin-top:.6rem;color:rgba(96,25,116,.84);font-size:.96rem}
.journey-list .note{font-size:.84rem;color:rgba(96,25,116,.7);border-left:2px solid var(--beacon);padding-left:.9rem;margin-top:.8rem}
.journey-foot{margin-top:2.4rem;font-size:.82rem;color:rgba(96,25,116,.66);max-width:74ch}
.journey-foot a{color:var(--sapphire);font-weight:560}

/* ------------------------------------------------------- what to prepare */
.prep{background:var(--ivory)}
.prep-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.prep h2{font-size:clamp(2.2rem,4.6vw,3.8rem);max-width:14ch}
.prep h2 em{font-style:normal;color:var(--sapphire)}
.prep-copy{margin-top:1.4rem;max-width:44ch;color:rgba(96,25,116,.84)}
.prep-list{list-style:none;display:grid;gap:0}
.prep-list li{position:relative;padding:1.05rem 0 1.05rem 1.8rem;border-bottom:1px solid rgba(96,25,116,.14);color:rgba(96,25,116,.9);font-size:.97rem}
.prep-list li::before{content:"◆";position:absolute;left:0;top:1.2rem;font-size:.55rem;color:var(--beacon)}
.prep-list b{font-weight:600;color:var(--purple)}

/* ------------------------------------------------ strategy cards (invest) */
.strategy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(244,239,231,.28);border:1px solid rgba(244,239,231,.28);margin-top:3.2rem}
.strategy{background:var(--purple);padding:2.2rem 2rem}
.strategy h3{color:var(--ivory);font-size:clamp(1.4rem,2vw,1.8rem)}
.strategy p{color:rgba(244,239,231,.84);font-size:.94rem;margin-top:.8rem}

/* --------------------------------------------------- questionnaire band */
.q-band{background:
    radial-gradient(120% 140% at 85% -10%,rgba(255,107,53,.32),rgba(255,107,53,0) 44%),
    var(--purple);color:var(--ivory)}
.q-band-inner{display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:2rem;align-items:end}
.q-band h2{font-size:clamp(2.2rem,4.8vw,3.9rem);color:var(--ivory);max-width:17ch}
.q-band h2 em{font-style:normal;color:#FFD9C2}
.q-band p{margin-top:1.2rem;max-width:50ch;color:rgba(244,239,231,.88)}
.q-band .btns{display:flex;flex-wrap:wrap;gap:.8rem}

/* ------------------------------------------------------ questionnaire page */
.q-intro .mode-switch{margin-top:2.4rem}
.q-forms .consult-grid{align-items:start}
.q-aside{position:sticky;top:7.5rem}
.q-aside h2{font-size:clamp(2.4rem,5vw,4.2rem);color:var(--ivory)}
.q-aside h2 em{font-style:normal;color:#FFD9C2}
.q-next{list-style:none;margin-top:2.2rem;display:grid;gap:0;max-width:42ch}
.q-next li{display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:.8rem;padding:1rem 0;border-top:1px solid rgba(244,239,231,.24);color:rgba(244,239,231,.88);font-size:.95rem}
.q-next .n{font-family:var(--display);font-size:1.5rem;line-height:1;color:#FFD9C2}
.q-next b{color:var(--ivory);font-weight:600;display:block;margin-bottom:.15rem}
.q-private{margin-top:1.6rem;font-size:.82rem;color:rgba(244,239,231,.72);max-width:42ch}

.q-section{font-family:var(--display);font-size:1.5rem;line-height:1.1;color:var(--ivory);padding-top:1.3rem;border-top:1px solid rgba(244,239,231,.26);margin-top:.4rem}
.q-section:first-child{border-top:0;padding-top:0;margin-top:0}
fieldset.field{border:0;padding:0;margin:0;min-width:0}
fieldset.field legend{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:560;padding:0;margin-bottom:.6rem}
.field .hint{font-size:.8rem;color:rgba(244,239,231,.72);text-transform:none;letter-spacing:0}
.choices{display:flex;flex-wrap:wrap;gap:.5rem}
.choice{position:relative;display:inline-flex}
.choice input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.choice span{display:inline-block;padding:.62rem 1rem;border:1px solid rgba(244,239,231,.45);border-radius:2px;font-size:.9rem;line-height:1.3;color:var(--ivory);cursor:pointer;transition:background .25s ease,color .25s ease,border-color .25s ease}
.choice:hover span{border-color:var(--ivory)}
.choice input:checked + span{background:var(--ivory);color:var(--purple);border-color:var(--ivory);font-weight:560}
.choice input:focus-visible + span{outline:2px solid var(--beacon);outline-offset:2px}
.field.invalid .choice span{border-color:#FFD9C2}
.field.invalid input[type="text"]{border-color:var(--beacon)}
.three-col{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.15rem}

@media (max-width:1080px){
  .q-aside{position:static}
  .prep-grid{grid-template-columns:1fr}
  .strategy-grid{grid-template-columns:1fr}
  .q-band-inner{grid-template-columns:1fr}
}
@media (max-width:760px){
  .journey-list{grid-template-columns:1fr}
  .journey-list li{grid-template-columns:2.6rem minmax(0,1fr)}
  .three-col{grid-template-columns:1fr}
}
.page-cta{display:flex;flex-wrap:wrap;gap:.8rem}
.q-band .btn-ghost{border-color:rgba(244,239,231,.55);color:var(--ivory)}
.q-band .btn-ghost:hover,.q-band .btn-ghost:focus-visible{border-color:var(--ivory);color:var(--ivory);background:rgba(244,239,231,.08)}
/* Answer chips sit inside .field, whose label rule is the uppercase eyebrow
   style meant for question labels. Answers read in normal case. */
.field label.choice{text-transform:none;letter-spacing:0;font-weight:inherit;font-size:inherit}
.choice span{font-weight:460;letter-spacing:.01em}

/* ============================================================
   v10: paper questionnaire (/questionnaire)
   The page is a sheet of paper on a desk: ink on cream, underline
   fields, small round tick boxes, script accents. Scoped to .paper
   so none of it leaks into the site's other forms.
   ============================================================ */
.page-questionnaire{--script:"Pinyon Script","Snell Roundhand",cursive;--ink:#2B2330;--rule:#CFC6BC;--tab:#EFE9E1;--paper:#FFFDF9}
.pf-desk{background:radial-gradient(120% 80% at 50% 0%,#F3EFE9 0%,#E6E0D8 70%);padding:clamp(6.5rem,12vh,8.5rem) clamp(.75rem,3vw,2rem) 5rem}
.pf-tabs{max-width:920px;margin:0 auto;display:flex;gap:.3rem;padding-left:clamp(1rem,5vw,3rem)}
.pf-tabs button{font-family:var(--sans);font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;font-weight:560;border:0;cursor:pointer;
  padding:.85rem 1.6rem .75rem;background:rgba(255,253,249,.5);color:rgba(43,35,48,.55);transition:background .25s ease,color .25s ease}
.pf-tabs button[aria-pressed="true"]{background:var(--paper);color:var(--purple)}
.pf-tabs button:hover{color:var(--purple)}
.paper{max-width:920px;margin:0 auto;background:var(--paper);color:var(--ink);
  box-shadow:0 1px 0 rgba(0,0,0,.04),0 30px 70px rgba(43,35,48,.16),0 6px 16px rgba(43,35,48,.06);
  position:relative}
.paper::before{content:"";position:absolute;inset:14px;border:1px solid rgba(96,25,116,.12);pointer-events:none}
.paper form.lead.pf-form{display:block;background:none;border:0;padding:clamp(1.6rem,6vw,4.2rem) clamp(1.25rem,6vw,4.4rem) 0;color:var(--ink);gap:0}

/* header: date, title, seal */
.pf-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:1rem;margin-bottom:2.2rem}
.pf-date{font-size:.78rem;letter-spacing:.06em;color:rgba(43,35,48,.7);padding-top:.6rem}
.pf-date span{display:inline-block;min-width:9rem;border-bottom:1px solid var(--rule);padding:0 .2rem .1rem}
.pf-title{text-align:center;line-height:1;position:relative;padding-bottom:1.6rem}
.pf-title .big{display:block;font-family:var(--display);font-weight:400;font-size:clamp(3rem,8vw,5rem);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.pf-title .script{position:absolute;left:52%;bottom:-.1rem;transform:translateX(-30%);white-space:nowrap;font-family:var(--script);font-weight:400;
  font-size:clamp(2rem,5.4vw,3.3rem);letter-spacing:0;color:var(--purple)}
.pf-seal{justify-self:end;width:74px;height:74px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px rgba(96,25,116,.15),0 0 0 5px var(--paper),0 0 0 6px rgba(96,25,116,.12)}
.pf-seal img{width:100%;height:100%;display:block}

/* sections */
.pf-sec{margin-top:2.4rem}
.pf-h{display:inline-block;font-family:var(--display);font-weight:400;font-size:1.02rem;letter-spacing:.2em;text-transform:uppercase;
  background:var(--tab);color:var(--ink);padding:.45rem 1rem .4rem;margin-bottom:1.3rem}
.pf-row{display:grid;grid-template-columns:1fr 1fr;gap:.2rem 2.4rem}
.pf-row > .pf-wide{grid-column:1 / -1}
.paper .field{display:block;gap:0;margin:0 0 1.05rem;position:relative}
.paper .field label,.paper fieldset.field legend{font-size:.84rem;letter-spacing:.01em;text-transform:none;font-weight:460;color:var(--ink)}
.paper .field label i,.paper legend i,.paper .pf-fine i{font-style:normal;color:var(--beacon);margin-left:.15rem}

/* underline lines: label and blank on one line, like a printed form */
.pf-line{display:flex!important;align-items:flex-end;gap:.7rem;flex-wrap:wrap}
.pf-line > label{white-space:nowrap;flex:0 0 auto;padding-bottom:.35rem}
.paper .pf-line input,.paper .pf-line select,.paper .pf-area textarea,.paper .pf-inline input{
  flex:1 1 8rem;min-width:6rem;font-family:var(--sans);font-size:.95rem;color:var(--ink);
  background:transparent;border:0;border-bottom:1px solid var(--rule);border-radius:0;padding:.35rem .1rem;box-shadow:none;transform:none!important}
.paper .pf-line select{padding-right:1.6rem;background-position:calc(100% - 12px) 60%,calc(100% - 6px) 60%}
.paper .pf-line input:focus,.paper .pf-line select:focus,.paper .pf-area textarea:focus,.paper .pf-inline input:focus{outline:none;border-bottom-color:var(--purple);box-shadow:0 1px 0 var(--purple)}
.paper input::placeholder{color:rgba(43,35,48,.35)}
.pf-area label{display:block;margin-bottom:.1rem}
.paper .pf-area textarea{width:100%;min-height:0;resize:vertical;line-height:2.05rem;padding:0 .1rem;
  background-image:repeating-linear-gradient(transparent 0,transparent calc(2.05rem - 1px),var(--rule) calc(2.05rem - 1px),var(--rule) 2.05rem);
  background-attachment:local;border-bottom:0}
.paper .pf-area textarea:focus{box-shadow:none;background-image:repeating-linear-gradient(transparent 0,transparent calc(2.05rem - 1px),var(--purple) calc(2.05rem - 1px),var(--purple) 2.05rem)}

/* round tick boxes */
.paper fieldset.field{border:0;padding:0;min-width:0}
.paper fieldset.field legend{float:left;margin:0 1rem .35rem 0;padding:.12rem 0 0}
.pcs{display:flex;flex-wrap:wrap;gap:.45rem 1.25rem;align-items:center}
.pf-pick::after{content:"";display:block;clear:both}
.pc{position:relative;display:inline-flex;align-items:center;gap:.45rem;font-size:.9rem;color:var(--ink);cursor:pointer;
  text-transform:none!important;letter-spacing:0!important;font-weight:400!important}
.pc input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.pc .o{width:14px;height:14px;border-radius:50%;border:1px solid rgba(43,35,48,.55);flex:0 0 14px;background:var(--paper);transition:box-shadow .2s ease,border-color .2s ease}
.pc:hover .o{border-color:var(--purple)}
.pc input:checked + .o{border-color:var(--purple);box-shadow:inset 0 0 0 3px var(--paper),inset 0 0 0 7px var(--purple)}
.pc input:focus-visible + .o{outline:2px solid var(--beacon);outline-offset:2px}
.pf-inline{display:inline-flex;align-items:flex-end;gap:.5rem;font-size:.9rem}
.paper .pf-inline input{width:7rem;flex:0 0 7rem}
.pf-scale{flex-basis:100%;display:flex;justify-content:space-between;max-width:30rem;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(43,35,48,.55)}

/* errors on paper */
.paper .field .err{display:none;flex-basis:100%;font-size:.76rem;color:var(--beacon);font-weight:560;margin-top:.25rem;clear:both}
.paper .field.invalid .err{display:block}
.paper .field.invalid input,.paper .field.invalid select{border-bottom-color:var(--beacon)}
.paper .field.invalid .pc .o{border-color:var(--beacon)}

/* rating grid */
.pf-note{font-size:.86rem;color:rgba(43,35,48,.78);margin:-.3rem 0 1.2rem;max-width:62ch}
.rate-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.8rem 2.2rem;align-items:start}
.rate-head{display:flex;align-items:flex-end;justify-content:space-between;border-bottom:1px solid var(--rule);background:linear-gradient(90deg,var(--tab),transparent);padding:0 .1rem .1rem .4rem;margin-bottom:.4rem}
.rate-head .script{font-family:var(--script);font-size:1.75rem;line-height:1.2;color:var(--purple)}
.rate-head .nums,.rate-row{display:grid;grid-template-columns:1fr repeat(3,22px);align-items:center}
.rate-head .nums{grid-template-columns:repeat(3,22px);font-size:.7rem;color:rgba(43,35,48,.6)}
.rate-head .nums b{font-weight:500;text-align:center}
.rate-row{padding:.18rem 0;font-size:.8rem}
.rate-row .rl{text-align:right;padding-right:.55rem;color:var(--ink);line-height:1.25}
.rate-row .pc{justify-content:center;gap:0}
.rate-row .pc .o{width:13px;height:13px;flex-basis:13px}
.rate-row:hover .rl{color:var(--purple)}

/* footer strip and submit */
.pf-fine{font-size:.72rem;line-height:1.6;color:rgba(43,35,48,.62);margin:0 0 1.4rem}
.paper .sms-disclosure{border-left:1px solid var(--rule);padding-left:.9rem;color:rgba(43,35,48,.62)}
.paper .sms-disclosure a{color:var(--purple)}
.pf-submit{margin-top:1.6rem;text-align:center}
.pf-submit .btn-submit{min-width:min(100%,22rem);justify-content:center;background:var(--purple);color:var(--ivory)}
.pf-submit .btn-submit:hover{background:var(--ink);color:var(--ivory)}
.pf-submit .pf-fine{margin-top:1rem}
.paper .form-status{text-align:left;margin-bottom:1rem}
.paper .form-status.ok{background:var(--tab);color:var(--ink)}
.paper .form-status.fail{background:#FFF1EA;color:var(--ink);border:1px solid var(--beacon)}
.pf-foot{margin:2.6rem calc(-1 * clamp(1.25rem,6vw,4.4rem)) 0;padding:1.1rem clamp(1.25rem,6vw,4.4rem);background:var(--tab);
  display:grid;grid-template-columns:auto auto 1fr;gap:1.1rem;align-items:center}
.pf-face{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 18%;box-shadow:0 0 0 3px var(--paper)}
.pf-sig .script{display:block;font-family:var(--script);font-size:1.7rem;line-height:1;color:var(--purple)}
.pf-sig small{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(43,35,48,.7)}
.pf-contact{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.3rem 1.4rem;font-size:.78rem}
.pf-contact a{color:var(--ink);text-decoration:none}
.pf-contact a:hover{color:var(--purple)}
.pf-legal{max-width:920px;margin:1.6rem auto 0;text-align:center;font-size:.78rem;color:rgba(43,35,48,.62)}
.pf-legal a{color:var(--purple)}

@media (max-width:860px){
  .rate-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .pf-top{grid-template-columns:1fr auto}
  .pf-date{grid-column:1;grid-row:1}
  .pf-seal{grid-column:2;grid-row:1;width:56px;height:56px}
  .pf-title{grid-column:1 / -1;grid-row:2}
  .pf-row{grid-template-columns:1fr}
  .pf-line > label{white-space:normal}
  .paper fieldset.field legend{float:none;display:block;margin-bottom:.5rem}
  .rate-grid{grid-template-columns:1fr}
  .pf-foot{grid-template-columns:auto 1fr}
  .pf-contact{grid-column:1 / -1;justify-content:flex-start}
  .paper::before{inset:8px}
}
@media print{
  header.site,.mobile-nav,footer.site,.pf-tabs,.pf-submit,.pf-legal{display:none!important}
  .pf-desk{background:none;padding:0}
  .paper{box-shadow:none}
}
.pf-seal{background:var(--paper);display:grid;place-items:center}
.pf-seal svg{width:78%;height:78%}
.paper .pf-area textarea{resize:none}
.rate-head .script{white-space:nowrap;font-size:clamp(1.35rem,2.2vw,1.75rem)}


/* ============================================================
   LUXE LAYER (v10)
   One block, last in the file, so the whole look can be switched
   off by deleting everything from this comment down to the end
   marker. Moves the site from royal blue to deep aubergine, ivory
   and champagne; brand fonts unchanged (Bona Nova + TT Norms Pro).
   ============================================================ */
:root{
  --sapphire:#3A1248;          /* was royal blue #1341CD: sections + buttons now aubergine */
  --sapphire-deep:#2A0C35;
  --champagne:#E9CDB2;         /* soft metallic accent on dark */
  --mauve:#8C5A9E;             /* italic accent on light */
  --hair-dark:rgba(233,205,178,.22);
}
body{letter-spacing:.005em}
p{line-height:1.78}

/* type: italic serif accents instead of a colour switch */
.intro h2 em,.emma h2 em,.process h2 em,.journey h2 em,.prep h2 em{font-style:italic;color:var(--mauve)}
.services h2 em,.pathways h2 em,.consult h2 em,.q-band h2 em,.q-aside h2 em{font-style:italic;color:var(--champagne)}
.hero h1 .ln2{font-style:italic}
h1,h2{letter-spacing:-.02em}
.eyebrow{font-size:.64rem;letter-spacing:.36em;font-weight:500}
.eyebrow .tick{font-size:.5rem;vertical-align:middle;margin-right:.35rem}

/* more air */
.section-pad{padding-top:clamp(6rem,14vh,10.5rem);padding-bottom:clamp(6rem,14vh,10.5rem)}

/* navigation: quieter, tracked small caps */
nav.primary{gap:1.35rem}
nav.primary a.navlink{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;white-space:nowrap}
nav.primary a.navlink::after{background:var(--purple);height:1px}
@media (max-width:1280px){
  nav.primary .navlink{display:none}
  .nav-toggle{display:block}
}

/* buttons: square, tracked, calm hovers */
.btn{font-size:.72rem;letter-spacing:.24em;font-weight:500;padding:1.05rem 1.9rem;border-radius:0}
.btn-primary{background:var(--sapphire);color:var(--ivory)}
.btn-primary:hover,.btn-primary:focus-visible{background:var(--purple);color:var(--ivory)}
.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--purple);color:var(--purple)}
.btn-ivory:hover,.btn-ivory:focus-visible{background:var(--champagne);color:var(--sapphire-deep)}
.hero .btn-primary{background:var(--ivory);color:var(--sapphire-deep)}
.hero .btn-primary:hover,.hero .btn-primary:focus-visible{background:var(--champagne);color:var(--sapphire-deep)}

/* dark sections: aubergine with a low warm glow, champagne hairlines */
.services,.consult{background:
    radial-gradient(90% 120% at 90% -20%,rgba(233,205,178,.14),rgba(233,205,178,0) 55%),
    linear-gradient(180deg,#34103F 0%,#260A2F 100%)}
.pathways,.q-band{background:
    radial-gradient(90% 120% at 10% -20%,rgba(233,205,178,.12),rgba(233,205,178,0) 55%),
    linear-gradient(180deg,#4A1559 0%,#3A1046 100%)}
.svc-grid,.strategy-grid{background:var(--hair-dark);border-color:var(--hair-dark)}
.svc{background:#2E0D38}
.svc:hover{background:#3A1248}
.strategy{background:#43134F}
.svc .link:hover{color:var(--champagne);border-color:var(--champagne)}
.pathway{border-color:var(--hair-dark)}
.pathway.alt{background:rgba(233,205,178,.06);border-color:rgba(233,205,178,.4)}
.pathway li::before,.pathway.alt li::before{color:var(--champagne)}
.consult h2 em,.q-aside h2 em{color:var(--champagne)}

/* light sections: numerals and rules in the quieter palette */
.journey-list .n{font-style:italic;color:var(--mauve)}
.journey-list .note{border-left-color:var(--champagne)}
.journey-foot a{color:var(--purple)}
.prep-list li::before{color:var(--mauve)}
.mode-switch button[aria-pressed="true"]{background:var(--purple)}
.mode-switch button:not([aria-pressed="true"]):hover{color:var(--purple)}
.step-nav button:hover:not(:disabled){border-color:var(--purple);color:var(--purple)}
.path-line .fill{background:linear-gradient(90deg,var(--purple),var(--purple) 85%,var(--champagne))}
.emma-social a{border-bottom-color:var(--purple)}
.chrome-rule{opacity:.7}

/* questionnaire: submit button in the same aubergine */
.pf-submit .btn-submit{background:var(--sapphire)}
.pf-submit .btn-submit:hover{background:var(--purple)}
/* ====================== END LUXE LAYER ====================== */