@font-face {
  font-family: 'Inter';
  src: url('/fonts/inter-latin-variable.woff2') format('woff2');
  font-weight: 100 900;
  font-display: swap;
}
[data-reveal] { opacity:0; translate:0 28px; }
[data-reveal].is-revealed { opacity:1; translate:none; transition:opacity .7s var(--ease) var(--reveal-delay,0ms),translate .9s var(--ease) var(--reveal-delay,0ms); }
.faq-item[data-reveal]:not(.is-revealed) { translate:0 14px; }
.work-project[data-reveal] img { scale:1.08; }
.work-project[data-reveal].is-revealed img { scale:1; transition:scale 1.4s var(--ease) var(--reveal-delay,0ms); }
@media (prefers-reduced-motion:reduce) { [data-reveal] { opacity:1; translate:none; } }
:root { --ink:#202727; --muted:#687171; --line:#dce0de; --paper:#fafbf8; --ease:cubic-bezier(.22,1,.36,1); --section-title-size:clamp(30px,2.8vw,40px); --page-title-size:clamp(38px,4vw,56px); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
/* Lenis owns easing. Native anchor easing would start a competing animation. */
html.lenis { scroll-behavior:auto!important; overscroll-behavior-y:none; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'Inter',Arial,sans-serif; font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased; }
body.menu-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; color:inherit; }
button:disabled { cursor:wait; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p { margin:0; }
h1,h2,h3 { font-weight:550; line-height:1.04; letter-spacing:-.06em; }
h2 { font-size:var(--section-title-size); font-weight:500; line-height:1.15; letter-spacing:-.04em; }
p { color:var(--muted); }
[hidden] { display:none!important; }
::selection { background:#cbd6d8; color:#1d3032; }
:focus-visible { outline:2px solid #476872; outline-offset:5px; border-radius:3px; }
.icon { width:20px; height:20px; flex-shrink:0; }
.container { width:calc(100% - 120px); max-width:1320px; margin-inline:auto; }
.section { padding-block:132px; }
.eyebrow { display:block; font-size:10px; font-weight:550; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:25px; }
.skip-link { position:fixed; z-index:1000; top:14px; left:14px; background:var(--ink); color:white; border-radius:30px; padding:12px 22px; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
a[href^="tel:"] { white-space:nowrap; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:32px; background:var(--ink); color:white; padding:16px 25px; border:1px solid var(--ink); border-radius:32px; font-size:12px; font-weight:450; transition:background .25s,transform .4s var(--ease); }
.button:hover { background:#485e59; transform:translateY(-2px); }
.button .icon { width:17px; }
.button-outline { color:var(--ink); background:transparent; border-color:#c5cdca; }
.button-outline:hover { background:#e5ebe7; }
.text-link { display:inline-flex; gap:28px; align-items:center; font-size:12px; font-weight:450; }
.text-link .icon { width:16px; transition:transform .3s; }
.text-link:hover .icon { transform:translate(3px,-3px); }

/* New navigation floats above the entire scroll scene. */
.site-header { height:76px; position:fixed; inset:0 0 auto; z-index:50; background:#f5f7f56e; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid #e2e8e257; }
.header-inner { height:100%; width:calc(100% - 120px); max-width:1600px; margin:auto; display:flex; align-items:center; gap:35px; }
.brand { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.brand-symbol { width:31px; height:28px; }
.brand>span { font-size:14px; letter-spacing:-.055em; font-weight:650; }
.brand>span>span { font-weight:400; letter-spacing:-.045em; margin-left:3px; }
.desktop-nav { display:flex; gap:37px; position:absolute; left:50%; transform:translateX(-50%); }
.desktop-nav>a { font-size:11px; color:#5c6968; transition:color .2s; }
.desktop-nav>a:hover,.desktop-nav>a[aria-current] { color:#172a29; }
.header-cta { display:flex; gap:21px; align-items:center; font-size:11px; font-weight:450; margin-left:auto; border:1px solid #bfcaca; border-radius:25px; padding:10px 17px; transition:background .2s; }
.header-cta:hover { background:#e3eae7; }
.header-cta .icon { width:13px; height:13px; }
.menu-toggle { display:none; background:none; border:0; padding:13px 4px; width:26px; height:40px; position:relative; }
.menu-toggle span { display:block; width:22px; height:1px; background:var(--ink); margin:5px 0; transition:transform .2s; }
.menu-toggle[aria-expanded=true] span:first-child { transform:translateY(3px) rotate(45deg); }
.menu-toggle[aria-expanded=true] span:last-child { transform:translateY(-3px) rotate(-45deg); }
.mobile-menu { position:absolute; left:0; right:0; top:100%; background:#f8faf7; box-shadow:0 20px 25px #2229230a; padding:16px 24px 35px; }
.mobile-menu a { padding:16px 2px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; font-size:18px; }

/* Clouds frame a fixed house and wordmark; the final bank covers both. */
.home-preview { background:#93b1c7; }
.home-preview .site-header { background:#b6cad773; border-color:#e2edf12b; }
.home-preview .desktop-nav>a { color:#294456; }
.home-preview .header-cta { border-color:#42627966; }
.hero { position:relative; height:128svh; }
.hero-viewport { position:fixed; inset:0; height:100svh; overflow:hidden; z-index:0; pointer-events:none; }
.hero-sky { position:absolute; inset:0; background:radial-gradient(ellipse at 48% 78%,#b7cdd8a6,transparent 62%),linear-gradient(170deg,#6f93b1 0%,#92b1c9 53%,#acc5d2 100%); }
.hero-wordmark { position:fixed; z-index:20; left:0; right:0; top:18svh; text-align:center; white-space:nowrap; font-size:9.5vw; font-weight:620; letter-spacing:-.071em; line-height:1; color:#f3f5ef; pointer-events:none; }
.hero-wordmark>span { font-weight:530; }
/* A frame is placed at the scroll position at which it was rendered. Between
   WebGL frames, native scrolling carries it with the following page surface. */
.house-stage { position:absolute; inset:0 0 auto; height:100svh; overflow-x:clip; z-index:21; pointer-events:none; will-change:transform; }
.hero.scene-past .house-stage,.hero.scene-past .hero-wordmark,.hero.scene-past .hero-viewport { visibility:hidden; }
.side-clouds { position:absolute; inset:0; transform:translateY(var(--cloud-parallax,0px)); }
.side-cloud { position:absolute; max-width:none; width:clamp(280px,38vw,740px); filter:brightness(1.12); opacity:.88; animation:cloud-drift 15s ease-in-out infinite alternate; }
.side-cloud-1 { left:-22%; top:28%; }
.side-cloud-2 { right:-22%; top:43%; animation-delay:-7s; }
.side-cloud-3 { left:-25%; top:69%; width:34vw; opacity:.55; animation-delay:-4s; }
.side-cloud-4 { right:-25%; top:11%; width:34vw; opacity:.52; animation-delay:-11s; }
@keyframes cloud-drift { to { translate:12px -9px; } }
.hero-handoff { position:absolute; z-index:30; left:0; right:0; bottom:-2px; height:65svh; overflow:hidden; pointer-events:none; }
.hero-handoff>img { position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; }
.cloud-foundation { position:absolute; inset:56% 0 0; background:var(--paper); }
.cloud-foundation:before { content:''; position:absolute; left:0; right:0; bottom:100%; height:24svh; background:linear-gradient(transparent,var(--paper)); }
.house-poster { position:absolute; left:50%; top:28%; transform:translateX(-50%); width:min(1050px,96vw); height:70%; max-width:none; object-fit:contain; }
.house-canvas { position:absolute; inset:0; display:block; width:100%; height:100%; visibility:hidden; }
.hero.scene-ready .house-poster { visibility:hidden; }
.hero.scene-ready .house-canvas { visibility:visible; }
.hero.scene-past .house-stage { opacity:0; }
.hero.scene-past .side-cloud { animation-play-state:paused; }
.home-preview .services-section,.home-preview .work-section,.home-preview .footer { position:relative; z-index:30; background:var(--paper); }
.home-preview .services-section { margin-top:-28svh; padding-top:24px; }
.services-section,.work-section { position:relative; z-index:5; background:var(--paper); }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:30px; margin-bottom:32px; }
.layout-note { font-size:11px; color:var(--muted); }
.service-preview { border-top:1px solid var(--line); }
.service-preview>a { display:flex; align-items:center; justify-content:space-between; padding:34px 0; border-bottom:1px solid var(--line); }
.service-preview h3 { font-size:clamp(25px,3vw,43px); font-weight:450; letter-spacing:-.045em; }
.service-preview .icon { width:25px; height:25px; transition:transform .3s; }
.service-preview>a:hover .icon { transform:translate(3px,-3px); }
.work-section { padding-top:20px; }
.work-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.project-placeholder { position:relative; aspect-ratio:1.25; display:flex; align-items:center; justify-content:center; background:#e8ede7; color:#89928b; font-size:12px; border-radius:3px; }
.work-card:nth-child(2) .project-placeholder { background:#e8ecee; }
.project-placeholder .icon { position:absolute; bottom:22px; right:22px; color:#52645b; }
.work-caption { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:22px; }
.work-caption h3 { font-size:19px; letter-spacing:-.035em; }
.footer { position:relative; z-index:5; padding-top:40px; background:var(--paper); }
.footer-main { display:flex; align-items:center; justify-content:space-between; padding-bottom:40px; gap:30px; }
.footer-main nav { display:flex; gap:25px; font-size:10px; color:#606e66; }
.footer-contact { display:flex; flex-wrap:wrap; align-items:center; gap:12px 26px; padding-bottom:28px; color:var(--muted); font-size:12px; line-height:1.6; }
.footer-contact nav { display:flex; gap:20px; }
.footer-contact a { display:inline-flex; align-items:center; min-height:32px; text-decoration:underline; text-underline-offset:4px; }
@media(max-width:760px) { .footer-contact { justify-content:center; text-align:center; gap:8px 22px; } .footer-contact>span { width:100%; } .footer-contact a { min-height:40px; } }
.back-top { display:flex; align-items:center; gap:12px; font-size:10px; }
.back-top .icon { width:15px; transform:rotate(-90deg); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:25px; padding-block:23px; border-top:1px solid var(--line); color:#6d786d; font-size:9px; }

/* Matching, deliberately unfinished pages. */
.page-intro { padding:125px 0 84px; background:#ecf1ed; }
.breadcrumb { display:inline-flex; align-items:center; gap:12px; font-size:10px; color:#637368; margin-bottom:64px; }
.breadcrumb .icon { width:15px; transform:rotate(180deg); }
.page-intro h1 { font-size:var(--page-title-size); font-weight:500; line-height:1.12; letter-spacing:-.04em; max-width:1080px; }
.page-intro p { margin-top:27px; font-size:14px; max-width:455px; }
.page-intro .button { margin-top:30px; }
.placeholder-section { padding-block:60px 100px; }
.placeholder-panel { background:#e7eee6; border-radius:4px; min-height:420px; display:grid; grid-template-columns:1fr 1fr; align-items:center; overflow:hidden; }
.placeholder-panel-copy { padding:55px; }
.placeholder-panel-copy h2 { font-size:var(--section-title-size); }
.placeholder-panel-copy p { margin-top:18px; font-size:13px; max-width:300px; }
.placeholder-panel-copy .button { margin-top:28px; font-size:11px; }
.placeholder-panel img { width:110%; max-width:none; margin-left:-10%; }
.placeholder-links { margin-top:34px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px 40px; }
.placeholder-links>a { padding-block:20px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:13px; }
.placeholder-links .icon { width:15px; }
.prose { max-width:780px; }
.prose h2 { font-size:28px; margin:40px 0 18px; }
.prose h2:first-child { margin-top:0; }
.prose p { font-size:14px; line-height:1.9; }
.prose a { text-decoration:underline; text-underline-offset:4px; }
.inbox-toolbar { display:flex; justify-content:space-between; margin-bottom:30px; }
.inbox-list { display:grid; gap:20px; }
.inbox-card { display:flex; justify-content:space-between; gap:30px; padding:30px; background:white; border:1px solid var(--line); border-radius:5px; }
.inbox-card h2 { font-size:25px; margin:12px 0; }.inbox-card p { font-size:13px; }
.request-meta { font-size:10px; color:var(--muted); }.request-notes { white-space:pre-wrap; overflow-wrap:anywhere; margin-top:14px; }
.inbox-status { display:flex; flex-direction:column; gap:10px; min-width:140px; font-size:12px; }
.inbox-status select { padding:10px; background:var(--paper); border:1px solid var(--line); border-radius:4px; }
.inbox-empty { text-align:center; padding-block:50px; }.inbox-empty h2 { margin-block:20px; font-size:35px; }.inbox-empty .button { margin-top:25px; }
.status-feedback { max-width:240px; }.inbox-card a { overflow-wrap:anywhere; }

@media(max-width:1100px) {
  .container,.header-inner { width:calc(100% - 72px); }
  .desktop-nav { gap:25px; }
  .section { padding-block:95px; }.work-section { padding-top:20px; }
  .footer-main nav { gap:16px; }.footer-main .brand>span>span { display:none; }
}
@media(max-width:760px) {
  html { scroll-padding-top:78px; }.container { width:calc(100% - 40px); }.section { padding-block:72px; }
  .site-header { height:65px; }.header-inner { width:calc(100% - 40px); gap:19px; }
  .brand-symbol { width:27px; }.brand>span { font-size:13px; }.brand>span>span { font-size:11px; }
  .desktop-nav { display:none; }.header-cta { padding:8px 13px; font-size:9px; gap:9px; }.header-cta .icon { width:12px; }.menu-toggle { display:block; }
  .hero-wordmark { top:21svh; font-size:9.6vw; }
  .side-cloud { width:70vw; }.side-cloud-1 { left:-48%; top:32%; }.side-cloud-2 { right:-48%; top:62%; }
  .side-cloud-3,.side-cloud-4 { display:none; }

  .house-poster { top:29%; width:115vw; height:57%; }
  .eyebrow { font-size:9px; margin-bottom:20px; }.section-heading { margin-bottom:24px; gap:15px; }
  .layout-note { font-size:9px; }.section-heading>.text-link { font-size:10px; gap:12px; }
  .service-preview>a { padding-block:27px; }.service-preview h3 { font-size:25px; }.service-preview .icon { width:19px; }
  .work-section { padding-top:10px; }.work-grid { grid-template-columns:1fr; gap:39px; }.work-caption { margin-top:18px; }.work-caption h3 { font-size:18px; }
  .footer { padding-top:31px; }.footer-main { flex-wrap:wrap; gap:27px; padding-bottom:31px; }.footer-main .brand>span>span { display:inline; }
  .footer-main nav { order:3; width:100%; justify-content:space-between; gap:10px; font-size:9px; }.back-top { font-size:9px; }
  .footer-bottom { flex-wrap:wrap; gap:12px; font-size:8px; }.footer-credit { order:3; width:100%; }
  .page-intro { padding-block:97px 55px; }.breadcrumb { margin-bottom:44px; font-size:9px; }.page-intro p { font-size:12px; }
  .placeholder-section { padding-block:31px 65px; }.placeholder-panel { grid-template-columns:1fr; }.placeholder-panel-copy { padding:30px 25px 0; }
  .placeholder-panel-copy p { font-size:12px; }.placeholder-panel img { width:100%; margin:0; }
  .placeholder-links { grid-template-columns:1fr 1fr; gap:0 22px; }.placeholder-links>a { font-size:11px; }.prose h2 { font-size:26px; }.prose p { font-size:13px; }
  .inbox-card { padding:22px; flex-direction:column; gap:24px; }.inbox-status { min-width:0; }.inbox-toolbar { gap:20px; font-size:12px; }
}
@media(max-width:390px) {
  .header-cta { font-size:8px; padding:7px 10px; gap:6px; }.header-inner { gap:13px; }.brand { gap:6px; }.brand>span>span { font-size:10px; }.brand-symbol { width:25px; }
  .placeholder-links { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; } *,*:before,*:after { animation:none!important; transition:none!important; }
  .side-clouds { transform:none; }
}

/* Real project photography, organized by town. */
figure { margin:0; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.collection-intro,.town-intro { padding-top:126px; }
.collection-intro .breadcrumb,.town-intro .breadcrumb { margin-bottom:58px; }
.collection-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:48px; padding-bottom:40px; }
.collection-heading h1,.town-title h1 { font-size:var(--page-title-size); font-weight:500; letter-spacing:-.04em; line-height:1.12; }
.collection-heading p { max-width:315px; font-size:14px; padding-bottom:8px; }
.town-collection { padding-bottom:120px; }
.town-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:64px 28px; }
.town-card { display:block; min-width:0; }
.town-card-image { position:relative; aspect-ratio:1.55; overflow:hidden; border-radius:12px; background:#e5e9e4; }
.town-card-image img { width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.town-card:hover img { transform:scale(1.025); }
.town-card-arrow { position:absolute; right:20px; bottom:20px; display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:#fafbf8eb; color:var(--ink); }
.town-card-caption { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:12px; margin-top:22px; }
.town-card-caption h3 { font-size:31px; letter-spacing:-.055em; font-weight:500; }
.town-card-caption>span { color:var(--muted); font-size:11px; }
.town-title { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; }
.town-title .eyebrow { margin-bottom:24px; }
.gallery-jumps { display:flex; gap:22px; padding-bottom:10px; white-space:nowrap; font-size:12px; }
.gallery-jumps a { display:inline-flex; align-items:center; gap:7px; border-bottom:1px solid #bac3bc; padding-bottom:6px; }
.gallery-jumps .icon { width:14px; height:14px; }
.town-switcher { display:flex; flex-wrap:wrap; gap:8px; margin:43px 0 48px; padding-top:22px; border-top:1px solid var(--line); }
.town-switcher a { font-size:11px; padding:9px 17px; border-radius:24px; color:var(--muted); transition:background .2s; }
.town-switcher a:hover { background:#e9eeea; }
.town-switcher a[aria-current] { background:var(--ink); color:var(--paper); }
.town-feature { display:grid; grid-template-columns:minmax(0,1.85fr) minmax(280px,1fr); gap:60px; align-items:start; }
.town-cover { border-radius:12px; overflow:hidden; background:#e8ece7; }
.town-cover img { width:100%; height:auto; }
.gallery-photo-link { position:relative; display:block; }
.photo-enlarge { position:absolute; right:14px; bottom:14px; display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#fafbf8dd; color:var(--ink); opacity:0; transform:translateY(4px); transition:opacity .2s,transform .2s; }
.photo-enlarge .icon { width:16px; height:16px; }
.gallery-photo-link:hover .photo-enlarge,.gallery-photo-link:focus-visible .photo-enlarge { opacity:1; transform:none; }
.town-materials { padding-block:5px; }
.town-materials .eyebrow { margin-bottom:21px; }
.town-materials h2 { font-size:clamp(29px,3vw,42px); font-weight:500; letter-spacing:-.055em; line-height:1.1; }
.town-materials ul { list-style:none; padding:0; margin:28px 0 0; }
.town-materials li { display:flex; align-items:center; justify-content:space-between; gap:15px; padding-block:16px; border-top:1px solid var(--line); }
.town-materials li h3 { font-size:14px; letter-spacing:-.025em; line-height:1.4; font-weight:520; }
.town-materials li p { font-size:12px; margin-top:3px; }
.material-class { display:inline-block; flex-shrink:0; border:1px solid #cbd4cd; border-radius:30px; padding:4px 9px; font-size:10px; color:#50645b; }
.town-photos { padding-bottom:95px; }
.gallery-count { color:var(--muted); font-size:12px; white-space:nowrap; }
.photo-grid { --row:360px; display:flex; flex-wrap:wrap; gap:34px 18px; }
.photo-grid::after { content:""; flex-grow:999; }
.photo-tile { flex:1 1 auto; min-width:0; margin:0; }
.photo-tile .gallery-photo-link,.build-tile .gallery-photo-link { overflow:hidden; border-radius:8px; background:#e8ece7; }
.photo-tile img { display:block; width:100%; height:var(--row); object-fit:cover; }
.photo-tile figcaption { width:0; min-width:100%; }
.photo-tile figcaption,.build-tile figcaption { padding-top:9px; color:var(--muted); font-size:11.5px; line-height:1.4; }
.build-tile figcaption strong { color:var(--ink); font-weight:560; }
.photo-tile figcaption>span,.build-tile figcaption>span { display:block; }
.photo-material { margin-top:2px; color:#7b857f; font-size:10.5px; }
.photo-tile.is-collapsed { display:none; }
.gallery-more { display:flex; margin:16px auto 0; }
.town-build { display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:clamp(28px,4vw,64px); align-items:center; padding-bottom:120px; }
.town-build.is-stacked { grid-template-columns:1fr; gap:28px; padding-block:0 110px; }
.town-build-copy h2 { margin:0 0 14px; }
.town-build-copy p { max-width:380px; margin:0; font-size:14px; line-height:1.65; }
.town-build.is-stacked .town-build-copy { display:flex; justify-content:space-between; align-items:baseline; gap:40px; }
.town-build.is-stacked .town-build-copy p { max-width:460px; }
.town-build-photos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.town-build-1 .town-build-photos { grid-template-columns:minmax(0,440px); }
.town-build-2 .town-build-photos { grid-template-columns:repeat(2,minmax(0,1fr)); }
.town-build-4 .town-build-photos { grid-template-columns:repeat(4,minmax(0,1fr)); }
.build-tile { min-width:0; margin:0; }
.build-tile .gallery-photo-link { aspect-ratio:4/5; border-radius:14px; }
.build-tile img { width:100%; height:100%; object-fit:cover; }
.video-frame { position:relative; }
.video-open { position:absolute; inset:0; display:grid; place-items:center; width:100%; padding:0; border:0; border-radius:10px; background:linear-gradient(transparent 55%,#0b18164d); color:var(--ink); cursor:pointer; }
.video-open[hidden] { display:none; }
.video-open-icon { display:grid; place-items:center; width:50px; height:50px; border-radius:50%; background:#ffffffd9; backdrop-filter:blur(8px); transition:scale .35s var(--ease),background .2s; }
.video-open-icon .icon { width:18px; height:18px; margin-left:2px; }
.video-open:hover .video-open-icon { scale:1.08; background:#fff; }
.video-open:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.viewer-caption { min-height:18px; margin:10px 0 0; text-align:center; color:#c9d4cd; font-size:12px; }
.viewer-video-stage { display:grid; place-items:center; }
.viewer-video { display:block; width:100%; height:calc(100svh - 198px); object-fit:contain; border-radius:8px; background:#0b1210; }
.town-videos { background:#e9eee9; }
.town-videos .eyebrow { margin-bottom:15px; }
.video-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:42px 24px; align-items:start; }
.video-grid-pair { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1000px; margin-inline:auto; }
.video-tile { min-width:0; }
.video-tile video { display:block; width:100%; height:auto; background:#17211c; border-radius:10px; }
.video-landscape { grid-column:span 2; }
.video-tile figcaption { display:flex; justify-content:space-between; gap:12px; color:#667169; font-size:10px; padding-top:13px; }
.next-town { padding-block:100px 110px; }
.next-town>a:not(.text-link) { display:flex; align-items:center; justify-content:space-between; padding-bottom:35px; margin-bottom:25px; border-bottom:1px solid var(--line); }
.next-town>a>.icon { width:48px; height:48px; }
.more-areas { padding-top:0; }
.more-areas .section-heading { margin-bottom:20px; }
body.gallery-open { overflow:hidden; }
.photo-viewer { border:0; padding:0; background:#111a17; color:#f6f8f3; border-radius:14px; width:min(1320px,calc(100vw - 48px)); max-width:none; max-height:calc(100svh - 32px); overflow:auto; }
.photo-viewer::backdrop { background:#0c1717ed; backdrop-filter:blur(10px); }
.photo-viewer-panel { padding:14px 24px; }
.viewer-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:12px; margin-bottom:12px; }
.photo-viewer button { display:grid; place-items:center; width:42px; height:42px; padding:0; border:1px solid #80988b50; border-radius:50%; background:transparent; color:#f6f8f3; }
.photo-viewer button:hover { background:#293831; }
.viewer-image { width:100%; height:calc(100svh - 226px); object-fit:contain; }
.viewer-navigation { display:flex; justify-content:center; align-items:center; gap:26px; padding-top:15px; font-size:12px; }
[data-viewer-prev] .icon { transform:rotate(180deg); }
@media(max-width:1000px) {
  .town-feature { grid-template-columns:minmax(0,1.4fr) minmax(240px,1fr); gap:30px; }
  .town-title { align-items:flex-start; flex-direction:column; gap:25px; }
  .town-switcher { margin-top:24px; }
  .photo-grid { --row:280px; }
  .video-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .town-build { grid-template-columns:1fr; gap:28px; }
}
@media(max-width:760px) {
  .collection-intro,.town-intro { padding-top:98px; }
  .collection-intro .breadcrumb,.town-intro .breadcrumb { margin-bottom:40px; }
  .collection-heading { flex-direction:column; align-items:flex-start; gap:20px; padding-bottom:32px; }
  .collection-heading p { font-size:13px; max-width:300px; }
  .town-card-grid { grid-template-columns:1fr; gap:38px; }
  .town-card-caption { margin-top:17px; }
  .town-card-caption h3 { font-size:28px; }
  .town-card-caption>span { font-size:10px; }
  .town-card-image { border-radius:8px; }
  .town-card-arrow { width:36px; height:36px; right:14px; bottom:14px; }
  .town-collection { padding-bottom:72px; }
  .town-feature { grid-template-columns:1fr; gap:35px; }
  .town-materials h2 br { display:none; }
  .town-materials h2 { font-size:29px; }
  .town-materials ul { margin-top:23px; }
  .town-materials li { padding-block:13px; }
  .town-switcher { gap:4px; margin-bottom:30px; }
  .town-switcher a { font-size:10px; padding:8px 12px; }
  .gallery-jumps { font-size:11px; padding-bottom:0; }
  .photo-grid { --row:190px; gap:24px 10px; }
  .photo-tile { border-radius:5px; }
  .gallery-count { font-size:10px; }
  .video-grid { gap:28px 14px; }
  .town-build,.town-build.is-stacked { gap:22px; padding-bottom:80px; }
  .town-build.is-stacked .town-build-copy { display:block; }
  .town-build-photos,.town-build-2 .town-build-photos,.town-build-4 .town-build-photos { display:flex; gap:12px; margin-inline:-20px; padding-inline:20px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:20px; scrollbar-width:none; }
  .town-build-photos::-webkit-scrollbar { display:none; }
  .build-tile { flex:0 0 72%; scroll-snap-align:start; }
  .town-build-1 .build-tile { flex-basis:100%; }
  .video-tile figcaption { font-size:9px; gap:7px; flex-wrap:wrap; }
  .next-town { padding-block:70px; }
  .next-town>a>.icon { width:30px; height:30px; }
  .photo-viewer { width:calc(100vw - 16px); border-radius:8px; }
  .photo-viewer-panel { padding:10px 12px 15px; }
  .viewer-bar { font-size:11px; }
  .viewer-image { height:calc(100svh - 223px); }
}

/* Phones: headings that introduce a section, and a section's closing actions,
   are centered. Paragraphs, cards, lists and forms keep a left edge for reading. */
@media(max-width:760px) {
  .section-heading { flex-direction:column; align-items:center; gap:10px; text-align:center; }
  .town-build-copy { text-align:center; }
  .town-build-copy p { margin-inline:auto; }
  .footer-main { flex-direction:column; gap:24px; text-align:center; }
  .footer-main nav { order:0; width:auto; max-width:320px; flex-wrap:wrap; justify-content:center; gap:14px 22px; font-size:12px; }
  .back-top { font-size:11px; }
  .footer-bottom { flex-direction:column; gap:8px; font-size:10px; text-align:center; }
  .footer-credit { order:0; width:auto; }
}