@font-face{font-family:Bodoni;src:url(/assets/fonts/bodoni-moda-latin-standard-normal.woff2) format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:Bodoni;src:url(/assets/fonts/bodoni-moda-latin-standard-italic.woff2) format("woff2");font-style:italic;font-weight:400 900;font-display:swap}
@font-face{font-family:Corm;src:url(/assets/fonts/cormorant-garamond-latin-300-italic.woff2) format("woff2");font-style:italic;font-weight:300;font-display:swap}
@font-face{font-family:Hanken;src:url(/assets/fonts/hanken-grotesk-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--ink:#060504;--ink2:#0d0a08;--bronze:#a8825a;--bronze2:#d9b88f;--bone:#ece4d6;--mute:#8d8174;--line:rgba(217,184,143,.16);--pad:clamp(20px,4vw,64px)}
.winter{--bronze:#9fb1c1;--bronze2:#dfe8ef;--line:rgba(223,232,239,.16)}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--ink);color:var(--bone);-webkit-text-size-adjust:100%}
body{font:400 17px/1.6 Hanken,system-ui,sans-serif;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.mono{font-family:Hanken,system-ui,sans-serif;font-weight:300;font-size:13px;letter-spacing:.2em;text-transform:uppercase}
.disp{font-kerning:normal;font-feature-settings:"kern";font-family:Bodoni,Didot,serif;font-weight:400;letter-spacing:-.02em;line-height:.95}
.disp em{font-family:Corm,Bodoni,serif;font-style:italic;font-weight:500;color:var(--bronze2);letter-spacing:-.01em}
.k{color:var(--bronze);display:block;margin-bottom:22px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:fixed;left:-999px;top:8px;z-index:200;background:var(--bone);color:#000;padding:10px 14px}.skip:focus{left:8px}
.wrap{max-width:1440px;margin:0 auto;padding:0 var(--pad)}
:focus-visible{outline:1px solid var(--bronze2);outline-offset:4px}
.label{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:150;background:rgba(6,5,4,.72);border:1px solid var(--line);padding:7px 12px;color:var(--bronze2);font-size:9.5px;pointer-events:none;white-space:nowrap;backdrop-filter:blur(6px)}
.grain{position:fixed;inset:-10%;z-index:120;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:gr 1s steps(4) infinite}
@keyframes gr{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}
.snow{position:fixed;inset:0;width:100%;height:100%;z-index:110;pointer-events:none;opacity:0;transition:opacity 1.2s}.winter .snow{opacity:1}
.themed .snow{opacity:1}
.patriot{--bronze:#E8E9F0;--bronze2:#B22234;--label:#FFFFFF;--line:rgba(178,34,52,.5)}
.fall{--bronze:#BF5700;--bronze2:#CC5500;--line:rgba(204,85,0,.3)}
.holiday{--bronze:#146B3A;--bronze2:#C8102E;--label:#FFFFFF;--line:rgba(20,107,58,.55)}

/* loader */
.ld{position:fixed;inset:0;z-index:300;background:var(--ink);display:grid;place-items:center;align-content:center;gap:26px;transition:opacity .8s,visibility .8s}
.no-load .ld,.ld.out{opacity:0;visibility:hidden}
.dial{width:132px;height:132px;border-radius:50%;border:1px solid var(--line);position:relative;display:grid;place-items:center}
.dial::before,.dial::after{content:"";position:absolute;background:var(--line)}.dial::before{left:50%;top:-30px;bottom:-30px;width:1px}.dial::after{top:50%;left:-30px;right:-30px;height:1px}
.sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(rgba(168,130,90,.4) var(--a,0deg),transparent 0)}
.dial .n{font:400 64px/1 Bodoni,serif;position:relative;color:var(--bone)}
.word{width:min(760px,86vw);height:auto;overflow:visible}
.word text{font:italic 300 112px Corm,serif;fill:transparent;stroke:var(--bronze2);stroke-width:.8;stroke-dasharray:900;stroke-dashoffset:900;animation:wd 2.2s ease forwards}
@keyframes wd{70%{stroke-dashoffset:0;fill:transparent}100%{stroke-dashoffset:0;fill:var(--bronze2)}}
.ld .pct{color:var(--mute);position:absolute;top:28px;left:var(--pad)}.ld .cap{color:var(--mute)}
/* header */
.hdr{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px var(--pad);transition:background .5s,padding .5s}
.hdr.sc{background:rgba(6,5,4,.78);backdrop-filter:blur(10px);padding-block:10px;border-bottom:1px solid var(--line)}
.brand img{width:260px;height:auto}
.hdr nav{display:flex;gap:30px}.hdr nav a{opacity:.78;transition:opacity .3s}.hdr nav a:hover{opacity:1;color:var(--bronze2)}
.tools{display:flex;gap:10px;align-items:center}
.cta{display:inline-block;border:1px solid var(--bronze);padding:12px 18px;color:var(--bone);transition:background .4s,color .4s}.cta:hover{background:var(--bronze2);color:#120d09}
.tbtn{padding:12px 10px;color:var(--mute);border:1px solid transparent}.tbtn[aria-pressed=true]{color:var(--bronze2);border-color:var(--line)}
/* hero */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;background:#000}
.hero .ph,.hero .ph img,.hero .ph video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hero .ph video{opacity:0;transition:opacity 1.2s}.hero .ph video.on{opacity:1}
/* slow push-in: 1920 source stays above 1:1 at 1440 even at 1.1x */
/* slow push-in on the still poster only: the film carries its own camera move, and scaling a playing video doubles the motion and costs a GPU pass every frame */
.motion .hero .ph picture{position:absolute;inset:0;animation:pushin 26s ease-in-out infinite alternate}@keyframes pushin{from{transform:scale(1)}to{transform:scale(1.08)}}
.hero .ph.von picture{animation:none;visibility:hidden}
.shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,5,4,.55),rgba(6,5,4,0) 30%,rgba(6,5,4,.1) 55%,rgba(6,5,4,.92)),radial-gradient(120% 80% at 50% 40%,transparent 50%,rgba(0,0,0,.55))}
.cp{position:absolute;left:var(--pad);right:var(--pad);bottom:120px;max-width:980px}
.hero h1{font-size:clamp(64px,13vw,210px)}
.hero h1{font-optical-sizing:none;font-variation-settings:"opsz" 28;font-weight:460;text-shadow:0 1px 2px rgba(0,0,0,.45),0 0 24px rgba(0,0,0,.35)}.hero h1 .ln{display:inline-block;overflow:hidden;vertical-align:top;padding:.12em .04em .08em;margin:-.12em -.04em -.02em}.hero h1 .ln i{display:inline-block;font-style:normal}
.motion .hero h1 .ln i{transform:translateY(105%);transition:transform 1.4s cubic-bezier(.2,.7,.1,1)}
.motion .hero h1 .ln+.ln i{transition-delay:.12s}
.motion.go .hero h1 .ln i{transform:none}
.sub{max-width:520px;margin-top:22px;color:#d8cfc1;font-size:18px}
.ft{position:absolute;left:var(--pad);right:var(--pad);bottom:60px;display:flex;justify-content:space-between;color:var(--mute)}
.scr{display:flex;gap:12px;align-items:center}.scr i{width:44px;height:1px;background:var(--bronze);transform-origin:left;animation:ln 2.4s ease-in-out infinite}
@keyframes ln{0%{transform:scaleX(0)}50%{transform:scaleX(1)}100%{transform:scaleX(0);transform-origin:right}}
/* manifest */
.manifest{height:330vh;position:relative}
.mf-stick{position:sticky;top:0;height:100svh;display:grid;place-items:center;overflow:hidden}
.mf-line{grid-area:1/1;text-align:center;padding:0 var(--pad);transition:opacity .9s,transform 1.1s cubic-bezier(.2,.7,.1,1),filter .9s;opacity:0;transform:translateY(40px);filter:blur(8px)}
.mf-line.on{opacity:1;transform:none;filter:none}.mf-line.past{opacity:0;transform:translateY(-40px);filter:blur(8px)}
.mf-line .disp{font-size:clamp(54px,10vw,168px);display:block}
.mf-line p{margin:26px auto 0;max-width:460px;color:var(--mute)}
.mf-dots{position:absolute;bottom:56px;display:flex;gap:10px}.mf-dots i{width:28px;height:1px;background:var(--line);transition:background .5s}.mf-dots i.on{background:var(--bronze2)}
.rm .manifest{height:auto;padding:14vh 0}.rm .mf-stick{position:static;height:auto;gap:12vh}.rm .mf-line{grid-area:auto;opacity:1;transform:none;filter:none}.rm .mf-dots{display:none}
/* premieres map */
.premieres{height:200vh;position:relative;background:radial-gradient(90% 60% at 60% 50%,#140f0b,var(--ink))}
.pr-stick{position:sticky;top:0;height:100svh;overflow:hidden}
.pr-stick .gl{position:absolute;inset:0;width:100%;height:100%}
.map-fallback{position:absolute;inset:12vh 21vw 16vh 31vw;display:none;place-items:center}.map-fallback svg{width:100%;height:100%}
.no-gl .map-fallback,.rm .map-fallback{display:grid}
.pr-copy{position:absolute;left:var(--pad);top:22vh;max-width:430px;z-index:2}
.pr-copy h2{font-size:clamp(46px,6vw,96px);display:grid}
.pr-copy h2>span,.pr-copy p>span{grid-area:1/1;opacity:0;transform:translateY(24px);transition:opacity .8s,transform .9s}
.pr-copy h2>span.on,.pr-copy p>span.on{opacity:1;transform:none}
.pr-copy p{display:grid;margin-top:24px;color:#cfc5b6;max-width:360px}
.pr-list{position:absolute;right:var(--pad);top:50%;transform:translateY(-50%);list-style:none;z-index:2;columns:1;text-align:right}
.pr-list li{font:400 15px/1.95 Bodoni,serif;color:rgba(236,228,214,.32);transition:color .4s,transform .4s}
.pr-list li .mono{font-size:13px;margin-right:12px;color:var(--mute);opacity:.6}
.pr-list li.lit{color:var(--bone)}.pr-list li.cur{color:var(--bronze2);transform:translateX(-10px)}
.pr-labels{position:absolute;inset:0;pointer-events:none;z-index:1}
.pr-labels span{position:absolute;left:0;top:0;white-space:nowrap;font:italic 300 22px Corm,serif;color:var(--bone);transform:translate(-50%,-140%);opacity:0;transition:opacity .4s;text-shadow:0 2px 14px #000}
.pr-labels span.studio{font:400 13px Hanken,system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze2)}
.pr-labels span.on{opacity:1}
.pr-note{position:absolute;left:var(--pad);bottom:60px;color:var(--mute);font-size:9.5px;max-width:330px;z-index:2}
.rm .premieres,.no-gl .premieres{height:auto}.rm .pr-stick,.no-gl .pr-stick{position:relative;height:auto;min-height:100svh;padding:16vh 0 18vh}
.rm .pr-copy h2>span,.rm .pr-copy p>span,.no-gl .pr-copy h2>span,.no-gl .pr-copy p>span{opacity:0}
.rm .pr-copy [data-s="0"],.no-gl .pr-copy [data-s="0"]{opacity:1;transform:none}
.rm .pr-list li,.no-gl .pr-list li{color:var(--bone)}
/* credits */
.credits{padding:22vh var(--pad) 18vh}
.credits h2{font-size:clamp(42px,5.6vw,92px);max-width:1100px}
.cg{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:11vh;border-top:1px solid var(--line)}
.cg>div{padding:34px 28px 10px 0;border-right:1px solid var(--line);margin-right:28px}.cg>div:last-child{border:0}
.cg .r{color:var(--bronze);display:block;margin-bottom:28px}
.cg b{display:block;font:400 clamp(26px,2.3vw,36px)/1.05 Bodoni,serif}
.cg p{color:var(--mute);margin-top:16px;font-size:15px}
.motion .rv{opacity:0;transform:translateY(34px);transition:opacity 1s,transform 1.2s cubic-bezier(.2,.7,.1,1)}.motion .rv.in{opacity:1;transform:none}
/* finale */
.finale{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;overflow:hidden}
.finale .media,.finale .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.finale .media::after{content:"";position:absolute;inset:0;background:rgba(6,5,4,.72)}
.finale .inner{position:relative;padding:0 var(--pad)}
.finale h2{font-size:clamp(64px,11vw,180px)}
.finale p{color:#d8cfc1;margin:22px auto 36px;max-width:420px}
.foot{border-top:1px solid var(--line);padding:12vh 0 90px}
.fgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:40px 60px;align-items:end}
.fgrid .disp{font-size:clamp(48px,6vw,96px)}.foot address{font-style:normal;line-height:2.1;color:#cfc5b6}.foot .small{grid-column:1/-1;color:var(--mute);font-size:9.5px;line-height:1.9}
@media (max-width:900px){.hdr nav{display:none}.cg{grid-template-columns:1fr 1fr}.cg>div:nth-child(2){border:0}
 .pr-list{top:auto;bottom:96px;transform:none;left:var(--pad);right:var(--pad);text-align:left;display:flex;gap:2px 16px;flex-wrap:wrap;font-size:13px}
 .pr-list li{font-size:13px;line-height:1.6}.pr-list li .mono{display:none}.pr-list li.cur{transform:none}
 .pr-copy{top:14vh;right:var(--pad)}.pr-note{bottom:52px}.map-fallback{inset:40vh 4vw 30vh}}
@media (max-width:600px){.brand img{width:170px}.tbtn{display:none}.cta{padding:10px 12px;font-size:10px}.cp{bottom:110px}.sub{font-size:16px}
 .ft>:first-child{display:none}.cg{grid-template-columns:1fr}.cg>div{border-right:0;border-bottom:1px solid var(--line);margin:0;padding:28px 0}
 .fgrid{grid-template-columns:1fr}.rm .pr-list,.no-gl .pr-list{position:static;margin:36px var(--pad) 0}.rm .map-fallback,.no-gl .map-fallback{position:relative;inset:auto;margin:40px 4vw 0}.rm .pr-copy,.no-gl .pr-copy{position:relative;top:0;left:0;padding:0 var(--pad)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* map list waits for the premieres stage so it never crowds the Iowa outline */
.gl-on:not(.rm) .pr-list{transition:opacity .7s,transform .7s}
.gl-on:not(.rm) .pr-stick:not(.st-2) .pr-list{opacity:0;transform:translateX(24px);pointer-events:none}
.hero .k{display:inline-block}.hero .k:hover{color:var(--bronze2)}
.pr-list li a{border-bottom:1px solid var(--line)}.pr-list li a:hover{color:var(--bronze2)}

.foot .fnav{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:1.1em 2.2em;margin:8px 0 0;font-size:11px;letter-spacing:.14em;text-transform:uppercase}.foot .fnav a{color:#cfc5b6;text-decoration:none}.foot .fnav a:hover,.foot .fnav a:focus-visible{color:var(--bronze2)}

/* launch: legible small text on phones (Lighthouse font-size, >=12px) */
@media (max-width:760px){.mono,.foot .fnav{font-size:13px}.foot .small,.pr-note,.bl-det figcaption,.dr figcaption .mono,.tm .mono,.pr-list li .mono{font-size:13px}}

/* small-text scale 10/28 — Matt (t121u): "all the small wording needs increased in size".
   Floors: no visible text under 13px desktop / 12.5px phone. Mono labels 13-15px, brighter, soft shadow over photos.
   Display headings and logo (.brand img 260/170px) intentionally untouched. Appended block only. */
:root{--st-label:#cbc1b3;--st-shadow:0 1px 2px rgba(0,0,0,.85),0 2px 16px rgba(0,0,0,.65)}
.mono{font-size:13px;letter-spacing:.2em}
.k{font-size:14px;color:var(--bronze2)}
header nav,header nav.mono{font-size:13px}
nav a{opacity:.92}
.cta{font-size:13px}
.tbtn{font-size:13px;color:var(--st-label)}
.label{font-size:13px}
.cp .k,.cp .crumbs{text-shadow:var(--st-shadow)}
.ft{color:var(--st-label);text-shadow:var(--st-shadow)}
.ld .pct,.ld .cap{color:var(--st-label)}
.pr-list li .mono{font-size:13px;opacity:.85}
.pr-note{font-size:13px;color:var(--st-label)}
.cg p{font-size:17px}
.foot address{font-size:14px}
.foot .fnav{font-size:13px}
.foot .small{font-size:13px;line-height:1.8;color:#a99d8f}
@media (max-width:760px){
 .mono,.foot .fnav,.foot .small,.foot address,.pr-note,.pr-list li .mono{font-size:13px}
 .k{font-size:13px}
}
@media (max-width:600px){.cta{font-size:13px;padding:10px 12px;letter-spacing:.12em}}

/* map: every home at its true spot, 10/28 — Matt (pt125u): "every house we have ever built on this map with their floorplan names".
   One card per town cluster, placed by v2.js?v=20261103s so cards never collide. Text floor 13px. Appended block only. */
.pr-labels span.studio{font-size:13px;letter-spacing:.16em;text-shadow:var(--st-shadow,0 2px 14px #000)}
.pr-labels .hm{position:absolute;left:0;top:0;opacity:0;transition:opacity .45s;padding:7px 11px 8px;background:rgba(10,8,6,.74);border:1px solid rgba(217,184,143,.26);border-radius:2px;white-space:nowrap;will-change:transform;pointer-events:none}
.pr-labels .hm.on{opacity:1}
.pr-labels .hm b{display:block;font:400 13px/1.35 Hanken,system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze2)}
.pr-labels .hm i{display:block;font:italic 400 17px/1.32 Corm,serif;color:var(--bone);opacity:.15;transition:opacity .4s}
.pr-labels .hm i.on{opacity:1}
.pr-labels .hm i em{font:300 13px Hanken,system-ui,sans-serif;font-style:normal;letter-spacing:.02em;color:var(--st-label,#cbc1b3);margin-left:.7em}
.pr-labels .hm i.bld em{color:var(--bronze2)}
.pr-labels .hm-ld{position:absolute;left:0;top:0;height:1px;background:rgba(242,234,222,.5);transform-origin:0 50%;opacity:0;transition:opacity .45s;pointer-events:none}
.pr-labels .hm-ld.on{opacity:1}
.pr-labels .hm.hm-fold{pointer-events:auto;cursor:pointer}
.pr-labels .hm.hm-fold b::after{content:" +";color:var(--bone)}
.pr-labels .hm.hm-fold.open b::after{content:" \2212"}
.pr-labels .hm.hm-fold:not(.open) i{display:none}
.pr-labels .hm.hm-fold.open{z-index:3}

/* tagline 10/28 */
.fgrid .tagline{font-family:Corm,serif;font-style:italic;font-weight:300;font-size:clamp(24px,2.4vw,40px);line-height:1.25;color:#ece4d6;max-width:640px;margin:22px 0 0}

/* gate 10/28 — reviewed fixes (Chief of Staff list + Canva suggestions + AISV), local build. Appended block only. */
@font-face{font-family:Corm;src:url(/assets/fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2");font-style:italic;font-weight:500;font-display:swap}
:root{--mute:#a99d8f;--label:#c3a272}
.winter,.fall{--label:var(--bronze2)}
.disp,.prose h2,.prose h3{font-optical-sizing:none;font-variation-settings:"opsz" 28}
.disp,h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}
.k,.thero .k,.pd-dl dt,.specs dt,.tm .mono,.iq-form>.k,.lc-h .k,.cg .r,.iq-stage .mono,main dl dt.mono{color:var(--label)}
.brand{flex:none}
.pr-labels .hm i{font-weight:500}
.pr-list li{color:rgba(236,228,214,.6)}
.pr-list li>a{display:inline-block;padding:12px 0}
.mf-line p{position:relative;z-index:2;text-shadow:0 1px 2px rgba(0,0,0,.9),0 2px 16px rgba(0,0,0,.8)}
.cta{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.foot .small{font-family:Hanken,system-ui,sans-serif;text-transform:none;letter-spacing:.005em;font-size:14px;line-height:1.7;max-width:96ch}
.foot .f-towns{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:0 .6em;color:var(--mute);font-family:Hanken,system-ui,sans-serif;font-size:14px;line-height:1.6}
.foot .f-towns .mono{color:var(--label);margin-right:.6em}
.foot .f-towns a{color:#cfc5b6;display:inline-block;padding:12px 0}.foot .f-towns a:hover,.foot .f-towns a:focus-visible{color:var(--bronze2)}
.h1-kicker{display:block;font-family:Hanken,system-ui,sans-serif;font-size:13px;font-style:normal;font-weight:300;line-height:1.5;letter-spacing:.2em;text-transform:uppercase;color:var(--label);margin:0 0 .9em;font-variation-settings:normal;text-shadow:var(--st-shadow,none)}
.h1-kicker.h1-after{margin:.9em 0 0}
.pr-copy p>span{visibility:hidden;transition:opacity .8s,transform .9s,visibility 0s .9s}
.pr-copy p>span.on,.rm .pr-copy p>[data-s="0"],.no-gl .pr-copy p>[data-s="0"]{visibility:visible;transition:opacity .8s,transform .9s,visibility 0s}
.pr-copy p a{color:var(--bone);border-bottom:1px solid var(--line)}.pr-copy p a:hover,.pr-copy p a:focus-visible{color:var(--bronze2)}
body:has(.phero.lite) .hdr .cta{background:rgba(6,5,4,.42);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
body:has(.phero.lite) .hdr nav a{opacity:1}
@media (max-width:760px){
 .foot .fnav a,.foot address a{display:inline-block;padding:12px 0}
 .hdr{gap:12px}
 .hdr .cta{white-space:nowrap;letter-spacing:.04em;padding:10px 10px}
 .h1-kicker{font-size:13px;letter-spacing:.2em}
 .foot .f-towns{font-size:14px}
}
/* gate 10/28 #9: 44px crumb tap area on every page without moving the layout */
.crumbs a{display:inline-block;padding-block:12px;margin-block:-12px}
/* map labels: plan name only, one line per home (10/28) */
.pr-labels .hm{padding:3px 10px 4px;background:rgba(10,8,6,.7)}
.pr-labels .hm i{font:italic 500 19px/1.3 Corm,serif;letter-spacing:.005em}
.pr-labels .hm i.bld{color:var(--bronze2)}
.pr-labels .hm i.bld::before{content:"";display:inline-block;width:6px;height:6px;margin:0 7px 2px 0;border:1px solid var(--bronze2);border-radius:50%;vertical-align:middle}
/* NOW BUILDING on the home map (#premieres). Matt approved 10/28 8:50 PM CT */

/* Decided: no side list on the map, and plan names stay hidden until each pin rises */
.gl-on:not(.rm) .pr-list{display:none}
.pr-labels .hm i:not(.on){opacity:0}

/* Building label: plan name + a small "Now building" tag */
.pr-labels .hm i.bld{pointer-events:auto;cursor:pointer}
.pr-labels .hm i .nb-tag{font:400 13px/1 Hanken,system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze2);margin-left:.8em;vertical-align:2px;white-space:nowrap}
/* the site already marks building names with a small ring (v2.css?v=20261103s .hm i.bld::before); it now pulses */
.pr-labels .hm i.bld::before{animation:nb-pulse 1.8s ease-in-out infinite}
.nb-card .nb-k i{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--bronze2);margin-right:.6em;vertical-align:2px;animation:nb-pulse 1.8s ease-in-out infinite}
@keyframes nb-pulse{0%,100%{box-shadow:0 0 0 0 rgba(217,184,143,.55)}50%{box-shadow:0 0 0 5px rgba(217,184,143,0)}}

/* Card */
.nb-card{position:absolute;left:0;top:0;z-index:4;opacity:0;pointer-events:none;transition:opacity .3s;padding:13px 18px 14px;background:rgba(10,8,6,.88);border:1px solid rgba(217,184,143,.34);border-radius:2px;white-space:nowrap;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.6)}
.nb-card.on{opacity:1;pointer-events:auto}
.nb-card .nb-k{display:block;font:400 13px/1 Hanken,system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze2)}
.nb-card b{display:block;margin-top:9px;font:italic 500 28px/1.1 Corm,serif;color:var(--bone)}
.nb-card::after{content:"";position:absolute;left:calc(50% + var(--nb-ax,0px));bottom:-6px;width:10px;height:10px;background:rgba(10,8,6,.96);border:solid rgba(217,184,143,.34);border-width:0 1px 1px 0;transform:translateX(-50%) rotate(45deg)}

/* Phones: 16px+ for small text; the tag drops to its own line under the name */
@media (max-width:760px){
 .pr-labels .hm i .nb-tag{display:block;margin:2px 0 1px 13px;font-size:16px;font-weight:400;letter-spacing:.05em}
 .nb-card .nb-k{font-size:16px;letter-spacing:.1em}
 .nb-card b{font-size:30px}
}
@media (prefers-reduced-motion:reduce){.pr-labels .hm i.bld::before,.nb-card .nb-k i{animation:none}}

/* map labels: one name per frame on long leaders (Matt 10/28 8:53 PM) */
.pr-labels .hm-ld{background:rgba(242,234,222,.42)}

/* 10/28 Matt — phone menu, Variant A (approved 8:24 PM CT): full "Begin your feature" + "Menu"; full-screen menu. From drafts/phone-menu.html. */
.mbtn{display:none;min-height:44px;min-width:44px;padding:0 12px;border:1px solid var(--line);font-family:Hanken,system-ui,sans-serif;font-weight:300;font-size:16px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone);align-items:center;justify-content:center;gap:9px}
.mbtn i{display:inline-block;width:14px;height:9px;border-block:1px solid currentColor;position:relative}
.mbtn i::after{content:"";position:absolute;left:0;right:0;top:3px;border-top:1px solid currentColor}
.mbtn:hover,.mbtn:focus-visible{color:var(--bronze2);border-color:var(--bronze)}
.cta,.tbtn{white-space:nowrap}
@media (max-width:900px){
  .mbtn{display:inline-flex}
  .cta{min-height:44px}
}
/* Variant A (Matt 10/28 8:24 PM: full "Begin your feature" + "Menu", logo stays 170px):
   CTA stacks onto two lines on phones */
.cta .cta-b::before{content:"\a0"}
@media (max-width:600px){
  .hdr{gap:6px;padding-inline:14px}
  .tools{gap:6px}
  .hdr .cta{flex-direction:column;align-items:flex-start;justify-content:center;font-size:14px;line-height:1.2;letter-spacing:0;padding:6px 8px;min-height:48px}
  .hdr .cta .cta-b::before{content:none}
  .mbtn{font-size:15px;padding:0 8px;letter-spacing:.04em}
  .mbtn i{display:none}
}
@media (max-width:374px){
  .hdr{padding-inline:10px}
  .hdr .cta{padding:6px 6px}
  .mbtn{padding:0 6px;font-size:14px}
}
/* overlay */
.pmenu{position:fixed;inset:0;z-index:160;background:radial-gradient(120% 70% at 50% 30%,#14100c,var(--ink) 75%);color:var(--bone);display:flex;flex-direction:column;padding:0 20px;overflow-y:auto;overscroll-behavior:contain;visibility:hidden;opacity:0;transition:opacity .45s ease,visibility 0s linear .7s}
.pmenu.open{visibility:visible;opacity:1;transition:opacity .45s ease,visibility 0s}
/* letterbox bars: start closed, slide away to open the frame */
.pmenu::before,.pmenu::after{content:"";position:fixed;left:0;right:0;height:50vh;background:#000;z-index:2;pointer-events:none;transition:transform .7s cubic-bezier(.7,0,.2,1)}
.pmenu::before{top:0;transform:translateY(0)}
.pmenu::after{bottom:0;transform:translateY(0)}
.pmenu.open::before{transform:translateY(-100%)}
.pmenu.open::after{transform:translateY(100%)}
.pm-top{display:flex;align-items:center;justify-content:space-between;min-height:72px;border-bottom:1px solid var(--line)}
.pm-top .k{margin:0;color:var(--bronze);font-size:16px;letter-spacing:.14em}
.pm-close{min-height:44px;min-width:44px;padding:0 12px;border:1px solid var(--line);font-family:Hanken,system-ui,sans-serif;font-weight:300;font-size:16px;letter-spacing:.2em;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px}
.pm-close:hover,.pm-close:focus-visible{color:var(--bronze2);border-color:var(--bronze)}
.pm-list{list-style:none;margin:22px 0 0;padding:0;counter-reset:reel}
.pm-list li{border-bottom:1px solid var(--line);opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
.pmenu.open .pm-list li{opacity:1;transform:none}
.pmenu.open .pm-list li:nth-child(1){transition-delay:.35s}.pmenu.open .pm-list li:nth-child(2){transition-delay:.42s}
.pmenu.open .pm-list li:nth-child(3){transition-delay:.49s}.pmenu.open .pm-list li:nth-child(4){transition-delay:.56s}
.pm-list a{display:flex;align-items:baseline;gap:16px;padding:16px 0 14px;min-height:44px}
.pm-list .n{font-family:Hanken,system-ui,sans-serif;font-weight:400;font-size:16px;letter-spacing:.02em;color:var(--bronze);min-width:2.4em}
/* Bodoni at a low optical size and medium weight so t/e hairlines stay visible on phones */
.pm-list .t{font-family:Bodoni,Didot,serif;font-optical-sizing:none;font-variation-settings:"opsz" 11;font-weight:500;font-size:clamp(40px,11vw,58px);line-height:1;letter-spacing:-.01em}
.pm-list a:hover .t,.pm-list a:focus-visible .t{color:var(--bronze2)}
.pm-list a[aria-current] .t{font-family:Corm,Bodoni,serif;font-style:italic;font-weight:500;color:var(--bronze2)}
.pm-list a[aria-current] .n::after{content:" ●";font-size:12px}
.pm-foot{margin-top:auto;padding:28px 0 34px;display:grid;gap:18px}
.pm-cta{display:flex;align-items:center;justify-content:center;min-height:56px;border:1px solid var(--bronze);font-family:Hanken,system-ui,sans-serif;font-weight:300;font-size:16px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone)}
.pm-cta:hover,.pm-cta:focus-visible{background:var(--bronze2);color:#120d09}
.pm-contact{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 18px;font-family:Hanken,system-ui,sans-serif;font-weight:300;font-size:16px;letter-spacing:.02em;color:#cfc5b6}
.pm-contact a{display:inline-flex;align-items:center;min-height:44px}
.pm-contact a:hover,.pm-contact a:focus-visible{color:var(--bronze2)}
.pm-tag{font-family:Corm,serif;font-style:italic;font-weight:500;font-size:20px;line-height:1.3;color:var(--mute)}
html.pm-lock,html.pm-lock body{overflow:hidden!important;overscroll-behavior:none}
@media (min-width:901px){.pmenu{display:none}}
@media (prefers-reduced-motion:reduce){.pmenu::before,.pmenu::after{display:none}}
/* Phones: tap any pin for its name (Matt 10/28 10:16 PM). Built homes use the Now building card without its tag line. */
.nb-card.nb-built .nb-k{display:none}
.nb-card.nb-built b{margin-top:0}
/* ---- batch 10/28: map labels link to the home; in-design pins lighter; lot/spec pins; building = plan name only */
.pr-labels .hm i.bld::before{content:none;display:none}
.pr-labels .hm i.bld{pointer-events:none;cursor:default}
.pr-labels .hm i a{color:inherit;text-decoration:none;pointer-events:auto;cursor:pointer;border-bottom:1px solid transparent;transition:border-color .25s,color .25s}
.pr-labels .hm i a:hover,.pr-labels .hm i a:focus-visible{border-bottom-color:currentColor;color:#fff}
.pr-labels .hm i.dsn{color:#cbc1b3}
.pr-labels .hm i.dsn.on{opacity:.78}
.pr-labels .hm i.dsn .nb-tag{color:var(--mute)}
.pr-labels .hm i.av{color:#fff}
.pr-labels .hm i.av::before{content:"";display:inline-block;width:6px;height:6px;margin:0 7px 2px 0;background:#f2eade;border-radius:50%;vertical-align:middle}
.nb-card b a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(217,184,143,.5)}
.nb-card .nb-k i{display:none}
/* footer socials + Google reviews */
.foot .f-soc{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:0 2em;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.foot .f-soc a{color:#cfc5b6;text-decoration:none;display:inline-block;padding:12px 0}.foot .f-soc a:hover,.foot .f-soc a:focus-visible{color:var(--bronze2)}
@media (max-width:760px){.foot .f-soc{font-size:12px;gap:0 1.4em}}
/* phone menu: five entries when Now Available is on */
.pmenu.open .pm-list li:nth-child(5){transition-delay:.63s}
@media (max-height:700px){.pm-list .t{font-size:clamp(34px,9vw,48px)}.pm-list a{padding:12px 0 10px}}
/* sticky phone CTA */
.scta{display:none}
@media (max-width:900px){
 .scta{display:flex;align-items:center;justify-content:center;gap:.6em;position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:60;min-height:52px;background:var(--bone);color:#0a0908;font-size:13px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;box-shadow:0 10px 30px rgba(0,0,0,.5);transform:translateY(140%);opacity:0;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s;pointer-events:none}
 .scta.on{transform:none;opacity:1;pointer-events:auto}
 html.pm-lock .scta{display:none}
 .foot{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
}
/* ---- Now Available (Option B): home section + /now-available/ */
.na-home{padding:12vh var(--pad) 4vh}
.na-prod{display:flex;align-items:baseline;gap:1.2em;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:3.2vh 0;margin-bottom:9vh}
.na-prod .k{margin:0}
.na-prod p{display:flex;align-items:baseline;gap:.35em .5em;flex-wrap:wrap;margin:0}
.na-prod b.disp{font-size:clamp(56px,6vw,96px);line-height:.9;font-weight:400}
.na-prod span.disp{font-size:clamp(30px,3vw,48px)}
.na-prod .mono{color:var(--mute);margin-left:.6em}
.na-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:5vh}
.na-head h2{font-size:clamp(46px,5.4vw,92px)}
.na-head .go,.na-page .go{color:var(--bronze2);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:6px}
.na-cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,48px)}
.na-card{display:flex;flex-direction:column;min-width:0}
.na-ph{position:relative;margin:0;aspect-ratio:4/3;overflow:hidden;background:#0d0a08;border:1px solid var(--line)}
.na-ph picture,.na-ph img{display:block;width:100%;height:100%;object-fit:cover}
.na-play{position:absolute;left:20px;bottom:20px;display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 20px 0 8px;border-radius:999px;background:rgba(10,8,6,.72);border:1px solid rgba(236,228,214,.4);color:var(--bone);font-size:13px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.na-play i{width:34px;height:34px;border-radius:50%;background:var(--bone);position:relative;flex:none}
.na-play i::after{content:"";position:absolute;left:13px;top:10px;border:solid transparent;border-width:7px 0 7px 11px;border-left-color:#0a0908}
.na-play:hover,.na-play:focus-visible{border-color:var(--bronze2);color:#fff}
.na-soon{display:grid;place-items:center;text-align:center;background:linear-gradient(160deg,#15110d,#0a0806);border-style:dashed;border-color:rgba(217,184,143,.3)}
.na-soon .mono{display:block;color:var(--bronze);margin-bottom:14px}
.na-soon b.disp{font-size:clamp(30px,3vw,46px);font-weight:400}
.na-cp{padding-top:22px}
.na-k{display:block;color:var(--bronze);margin-bottom:12px}
.na-cp h2,.na-cp h3{font-size:clamp(32px,3vw,52px);line-height:1}
.na-ln{margin:14px 0 0;font:400 clamp(17px,1.3vw,20px)/1.5 Hanken,system-ui,sans-serif;color:var(--bone)}
.na-fx{margin:14px 0 0;color:#cbc1b3}
.na-nt{margin:10px 0 0;color:var(--mute);font-size:15px;line-height:1.55}
.na-cp .cta{margin-top:22px;display:inline-flex}
.na-card.sold .na-k{color:var(--mute)}
.na-card.sold .na-ph{filter:grayscale(.6) brightness(.7)}
.na-page{padding:2vh var(--pad) 10vh}
.na-who{display:flex;align-items:center;gap:20px;margin-top:9vh;padding-top:5vh;border-top:1px solid var(--line)}
.na-hs{margin:0;width:88px;height:88px;border-radius:50%;overflow:hidden;flex:none;border:1px solid var(--line)}
.na-hs img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.na-who .mono{display:block;color:var(--mute)}
.na-who b.disp{display:block;font-size:clamp(28px,2.4vw,38px);font-weight:400;margin:6px 0 4px}
.na-who .r{color:var(--bronze)}
@media (max-width:760px){.na-cards{grid-template-columns:1fr}.na-prod .mono{margin-left:0;flex-basis:100%}.na-home{padding-top:9vh}}
/* reel player: full screen on phones, a pop-up on desktop */
.na-pl{padding:0;border:0;background:transparent;max-width:none;max-height:none;color:var(--bone)}
.na-pl::backdrop{background:rgba(4,3,2,.88)}
.na-pl-in{position:relative;background:#000}
.na-pl video{display:block;width:100%;height:100%;object-fit:contain;background:#000}
.na-snd,.na-x{position:absolute;top:14px;min-height:44px;padding:0 14px;border:1px solid rgba(236,228,214,.4);background:rgba(10,8,6,.6);color:var(--bone);font-size:12px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.na-snd{left:14px}.na-x{right:14px}
.na-snd[aria-pressed=true]{border-color:var(--bronze2);color:var(--bronze2)}
.na-pl-go{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);white-space:nowrap}
@media (min-width:761px){.na-pl[open]{width:min(440px,88vw);height:min(782px,88vh);aspect-ratio:9/16;margin:auto}.na-pl-in{width:100%;height:100%}}
@media (max-width:760px){.na-pl[open]{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;margin:0}.na-pl-in{width:100%;height:100%}.na-snd,.na-x{top:max(14px,env(safe-area-inset-top))}.na-pl-go{bottom:max(26px,env(safe-area-inset-bottom))}}
.credits .cr-more{margin-top:5vh}.credits .cr-more .go{color:var(--bronze2)}
/* Built to Last link over the logo's tagline (Matt, 10/29 12:20 AM) */
.brandwrap{position:relative;flex:none;display:flex;align-items:center}
.btl-tag{position:absolute;left:51%;top:76%;width:49%;height:26%;border-radius:2px}
.btl-tag:focus-visible{outline:1px solid var(--bronze2);outline-offset:2px}
/* Seasonal looks, true colours (Matt 10/29 7:10 AM). Small text on ink stays white (true red/blue/evergreen fail small-text contrast there);
   red/evergreen carry the large italic, the stars, the lights and the lines. Patriotic adds Old Glory Blue as a field and a US flag in the hero. */
.patriot :is(.pm-top .k,.pm-list .n,.na-soon .mono,.na-k,.na-who .r),.holiday :is(.pm-top .k,.pm-list .n,.na-soon .mono,.na-k,.na-who .r){color:var(--label)}
.patriot .cta:hover{background:#B22234;border-color:#B22234;color:#fff}.holiday .cta:hover{background:#146B3A;border-color:#146B3A;color:#fff}
.patriot .tbtn[aria-pressed=true]{background:#3C3B6E;color:#fff;border-color:#B22234}
.holiday .tbtn[aria-pressed=true]{background:#146B3A;color:#fff;border-color:#C8102E}
.fall .tbtn[aria-pressed=true]{color:#CC5500;border-color:#BF5700}
.patriot .hero .shade{background:linear-gradient(180deg,rgba(60,59,110,.42),rgba(60,59,110,.14) 40%,rgba(60,59,110,0) 70%),linear-gradient(180deg,rgba(6,5,4,.55),rgba(6,5,4,0) 30%,rgba(6,5,4,.1) 55%,rgba(6,5,4,.92)),radial-gradient(120% 80% at 50% 40%,transparent 50%,rgba(0,0,0,.55))}
.hero .flag{position:absolute;top:118px;right:var(--pad);z-index:2;pointer-events:none;filter:drop-shadow(0 6px 18px rgba(0,0,0,.45));animation:flagin 1.6s ease both}
@keyframes flagin{from{opacity:0}to{opacity:.94}}.hero .flag{opacity:.94}
@media (max-width:600px){.hero .flag{top:150px}}   /* phones: below the 44px season button that hangs under Menu (v2.js?v=20261103s also measures it) */
@media (prefers-reduced-motion:reduce){.hero .flag{animation:none}}
/* Italic size (Matt approved 10/29 7:19 AM CT, "Yes, sitewide"): Cormorant x-height 386/1000 vs Bodoni 920/2000 -> 0.460/0.386 = 1.19 */
.disp em{font-size:1.19em;line-height:0}
@media(max-width:430px){.mf-line .disp{font-size:clamp(44px,12.6vw,54px)}}
.mf-line p{margin-top:clamp(26px,3vw,44px)}

/* ---- Calm home hero (Matt 10/30 2:43 PM: "too informational, not luxurious and inviting"; approved 2:57 PM: "move the Built to Last down").
   Headline block sits ~8% above the bottom; one small-caps line; paragraph moved below the fold; film-still credit; faint scroll cue. ---- */
@font-face{font-family:CormText;src:url(/assets/fonts/cormorant-garamond-latin-400-italic.woff2?v=20261030c) format("woff2");font-style:italic;font-weight:400;font-display:swap}
/* header nav on one quiet line, every page */
html body .hdr nav{gap:clamp(22px,2.4vw,40px);flex-wrap:nowrap}
html body .hdr nav a{white-space:nowrap;font-size:13px;font-weight:300;letter-spacing:.26em;opacity:.7}
html body .hdr .cta{border-color:rgba(234,226,212,.32);font-weight:300;letter-spacing:.24em}
html body .hero.hc .shade{background:
  linear-gradient(180deg,rgba(6,5,4,.42) 0%,rgba(6,5,4,0) 22%),
  linear-gradient(0deg,rgba(6,5,4,.8) 0%,rgba(6,5,4,.36) 26%,rgba(6,5,4,0) 52%),
  radial-gradient(90% 60% at 0% 100%,rgba(6,5,4,.52),rgba(6,5,4,0) 70%)}
html body .hero.hc .cp{bottom:calc(8vh + clamp(26px,3.6vh,38px) + 18.2px);max-width:none}
html body .hero.hc h1{font-size:clamp(64px,11vw,176px);line-height:.92;text-shadow:0 1px 2px rgba(0,0,0,.3),0 0 40px rgba(0,0,0,.25)}
html body .hero.hc .hc-line{margin:14px 0 0;font:300 13px/1.4 Hanken,system-ui,sans-serif;letter-spacing:.42em;text-transform:uppercase;color:rgba(234,226,212,.82);text-shadow:0 1px 12px rgba(0,0,0,.5)}
html body .hero.hc .hc-line b{font-weight:300;color:var(--bronze2);margin:0 .5em}
.motion .hero.hc .hc-line{opacity:0;transition:opacity 1.6s ease 1.3s}.motion.go .hero.hc .hc-line{opacity:1}
/* "Read what it means to us" (Matt 10/30 3:16 PM; 3:23 PM: right under the headline, above the small-caps line). The .cp bottom
   still ends at the h1 bottom of the approved hero (8vh + the old line), and .hc-sub (link, then line) hangs below it absolutely,
   so the headline does not move. Hairline underline + hairline arrow that lengthens on hover/focus. */
html body .hero.hc .hc-sub{position:absolute;left:0;right:0;top:100%}
html body .hero.hc .hc-more{position:relative;margin-top:12px;display:inline-flex;align-items:center;gap:14px;padding:2px 0;pointer-events:auto;font:italic 400 19px/1.2 CormText,Georgia,serif;letter-spacing:.02em;color:rgba(234,226,212,.8);text-decoration:none;text-shadow:0 1px 12px rgba(0,0,0,.55);white-space:nowrap}
html body .hero.hc .hc-more span{background:linear-gradient(rgba(217,184,143,.42),rgba(217,184,143,.42)) 0 100%/100% 1px no-repeat;padding-bottom:3px;transition:background-size .5s ease,color .4s ease}
html body .hero.hc .hc-more i{position:relative;display:block;width:22px;height:1px;background:rgba(217,184,143,.6);transition:width .5s cubic-bezier(.2,.7,.2,1),background .4s ease}
html body .hero.hc .hc-more i::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;color:rgba(217,184,143,.75);transform:translateY(.5px) rotate(45deg);transform-origin:center}
html body .hero.hc .hc-more:hover,html body .hero.hc .hc-more:focus-visible{color:var(--bone)}
html body .hero.hc .hc-more:hover i,html body .hero.hc .hc-more:focus-visible i{width:38px;background:var(--bronze2)}
html body .hero.hc .hc-more:focus-visible{outline-offset:6px}
.motion .hero.hc .hc-more{opacity:0;transition:opacity 1.6s ease .9s,color .4s ease}.motion.go .hero.hc .hc-more,.motion .hero.hc .hc-more:focus-visible{opacity:1}
html body .hero.hc .ft.hc-ft{position:absolute;inset:0;display:block;pointer-events:none;z-index:2}
html body .hero.hc .hc-ft>*{display:block}
.hero.hc .hc-credit{position:absolute;right:var(--pad);bottom:28px;font:300 13px/1 Hanken,system-ui,sans-serif;letter-spacing:.3em;text-transform:uppercase;color:rgba(234,226,212,.5);text-shadow:0 1px 10px rgba(0,0,0,.5)}
.hero.hc .hc-cue{position:absolute;left:50%;bottom:0;width:1px;height:34px;overflow:hidden}
.hero.hc .hc-cue i{display:block;width:1px;height:100%;background:linear-gradient(rgba(217,184,143,0),rgba(217,184,143,.7));animation:hccue 2.8s cubic-bezier(.6,0,.3,1) infinite}
@keyframes hccue{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
@media (prefers-reduced-motion:reduce){.hero.hc .hc-cue i{animation:none}}
.hc-intro{position:relative;background:var(--ink);padding:clamp(96px,16vh,170px) var(--pad) clamp(72px,12vh,130px);text-align:center}
.hc-intro .hc-lede{max-width:720px;margin:0 auto;font:italic 400 clamp(21px,1.75vw,27px)/1.55 CormText,Georgia,serif;color:#d8cfc1}
/* 11/3/2026 5:11 PM CT Matt: "Put the seasonal button back in the top header" (supersedes the 10/30 footer move). Home only, in
   .tools before the CTA. Hanken (mono is retired), quieter than the nav: same size scale, lighter, no border until a look is on. */
html body .hdr .tbtn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 .9em;font-family:Hanken,system-ui,sans-serif;font-weight:300;font-size:13px;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;opacity:.9;transition:color .3s,border-color .3s,opacity .3s}
html body .hdr .tbtn:hover,html body .hdr .tbtn:focus-visible{opacity:1}html body .hdr .tbtn:not([aria-pressed=true]):hover,html body .hdr .tbtn:not([aria-pressed=true]):focus-visible{color:var(--bronze2);border-color:var(--line)}
@media (min-width:901px){html body .hdr .tbtn{font-size:clamp(12px,calc(6.4px + .42vw),15px)}html body .hdr .tools{display:flex;align-items:center;gap:clamp(4px,.6vw,14px)}}
html body .hdr .tbtn i{font-style:normal;margin-right:.55em}
@media (max-width:900px){html body .hdr .tools{display:flex;align-items:center;gap:6px}html body .hdr .tbtn{font-size:12px;letter-spacing:.12em;padding:0 8px}}
/* phones: the row is full (logo, Begin your feature, Menu), so the toggle is a 44px glyph button hanging under Menu, right-aligned; label stays for screen readers */
@media (max-width:600px){html body .hdr .tools{position:relative}
 html body .hdr .tbtn{position:absolute;right:0;top:calc(100% + 6px);width:44px;height:44px;padding:0;font-size:17px;letter-spacing:0;border-color:rgba(234,226,212,.18);background:rgba(6,5,4,.28);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
 html body .hdr .tbtn i{margin:0}
 html body .hdr .tbtn .tl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
@media (max-width:600px){
 html body .hero.hc .cp{bottom:calc(8svh + 36.2px)}
 html body .hero.hc .hc-line{letter-spacing:.17em;margin-top:10px;line-height:1.2;white-space:nowrap}
 html body .hero.hc .hc-line b{margin:0 .3em}
 html body .hero.hc .hc-more{font-size:17px;line-height:1.1;margin-top:8px;padding:0;gap:12px}
 html body .hero.hc .hc-more span{padding-bottom:2px}
 .hero.hc .hc-credit{bottom:20px}
 .hero.hc .hc-cue{height:26px}
 html body .hdr .cta{border-color:rgba(234,226,212,.26)}
 html body .hdr .mbtn{border-color:transparent}
 .hc-intro{padding:88px 28px 72px}.hc-intro .hc-lede{font-size:20px}
}

/* 10/30 descender clearance (Matt 3:36 PM: the f of "feature." bled into the line below). Bodoni g/y/p reach .26em below
   the baseline and its ascenders .76em above; the Cormorant italic em (1.19em) reaches .33em below and .86em above. At
   line-height .92-.95 that ink crossed onto the next line or element. Display headings get 1.07 (Bodoni over Bodoni clears
   by a hair), and the em gets its own line box (1.12 of its size) so only lines holding an em open up, by exactly its extra
   ascender/descender. Home hero (.hero.hc) is excluded and keeps its approved position. */
html body :is(h1,h2,h3).disp{line-height:1.07}
html body .disp em{line-height:1.12}
html body .hero.hc h1 em{line-height:0}
html body :is(h1,h2,h3).disp:has(em):not(:last-child):not(.hero.hc h1){padding-bottom:.06em}
html body .thero h1 .h1-after{margin-top:calc(.9em + clamp(56px,9vw,160px)*.18)}
html body .hero:not(.hc) h1 .ln{padding:.12em .08em .3em;margin:-.12em -.08em -.24em}
.motion .hero:not(.hc) h1 .ln i{transform:translateY(140%)}
.motion.go .hero:not(.hc) h1 .ln i{transform:none}
/* 10/30 6 PM hero QA: the descender clearance made inner-page hero h1s taller, and on some pages the bottom-anchored
   hero copy rose until the crumbs/kicker sat under the logo (Collection, 404, Saylorville, West Des Moines at 1440x900;
   journal posts and towns on shorter laptop screens). Headlines that wrapped only for want of a few px get room
   sideways (Collection "Now showing." back on one line like Method/Studio; long town and journal titles lose a line),
   and the inner-hero type also respects the screen height, so the copy never climbs into the header. Home hero excluded. */
html body .phero:not(.hc) .cp:has(> h1 > .h1-kicker){max-width:max(980px,72vw)}
html body .phero:not(.hc) .cp:has(> h1.h1-long){max-width:max(980px,80vw)}
@media (min-width:901px){
 html body .phero:not(.hc) h1:not(.h1-town):not(.h1-long){font-size:clamp(64px,min(12vw,19svh),200px)}
 html body .phero.e404:not(.hc) h1:not(.h1-town):not(.h1-long){font-size:clamp(64px,min(12vw,13.5svh),200px)}
}
@media (min-width:901px) and (max-height:820px){
 html body .phero:not(.hc) h1.h1-town{font-size:clamp(64px,min(14vw,13svh),200px)}
 html body .phero:not(.hc) h1.h1-long{font-size:clamp(54px,min(8.4vw,13svh),150px)}
}
@media (min-width:901px) and (max-height:700px){
 html body .phero:not(.hc):not(.e404) h1:not(.h1-town):not(.h1-long){font-size:clamp(64px,min(12vw,16svh),200px)}
 html body .phero:not(.hc) h1.h1-town{font-size:clamp(64px,min(14vw,10svh),200px)}
 html body .fhero:not(.hc) h1.h1-house{font-size:clamp(72px,min(14vw,17svh),150px)}
}
/* 10/30 8 PM: text-hero pages (.thero: plans, collection homes, FAQ, privacy, warranty, journal index, now available,
   where we build, accessibility, thank-you) put the crumbs at 22vh, which sat only 11-29px under the 147px logo on
   720-800px-tall laptop screens and 4px behind it at 650. A floor of 198px keeps the 1440x900 look and a 51px gap everywhere. */
@media (min-width:901px){html body .thero{padding-top:max(22vh,198px)}}
/* 11/2 Matt (5:53 PM: "I think the tabs at the top are too small"): desktop header nav + "Begin your feature" read as fine print,
   most of all on big monitors. Type now scales with the screen (13px at 1024, ~13.9 at 1440, 16 at 1920, 17 cap), regular weight,
   brighter, tracking .2em (was 13px/300/.26em/.7 at every width). The narrower tracking keeps the row the same width at 1440, so
   1024-1280 still fit on one line. The button follows the nav size with roomier padding. Logo size unchanged. Phones (<=900px: Menu button) untouched. */
@media (min-width:901px){
 html body .hdr nav{gap:clamp(22px,2.3vw,48px)}
 html body .hdr nav a{font-size:clamp(13px,calc(7.4px + .45vw),17px);font-weight:400;letter-spacing:.2em;opacity:.86}
 html body .hdr nav a:hover,html body .hdr nav a:focus-visible{opacity:1}
 html body .hdr .cta{font-size:clamp(13px,calc(7.4px + .45vw),17px);font-weight:400;letter-spacing:.2em;padding:.95em 1.55em;min-height:48px;border-color:rgba(234,226,212,.42)}
}
/* 11/2 Matt (6:00-6:01 PM: "a ton of black space on each side" on Method, the Studio story and the ethos list). His monitor is
   about 2560 wide, where every .wrap section stopped at 1440px and sat in the middle half of the screen. From 1680px up the page
   column grows with the screen (84vw: 1613 at 1920, 2150 at 2560); 1440 and below unchanged. Long town titles get room sideways on
   wide screens too ("Custom homes in Cumming." wrapped to 5 lines at 2560 and its crumbs sat behind the logo). */
@media (min-width:1680px){html body .wrap{max-width:max(1440px,84vw)}}
@media (min-width:1600px){html body .phero:not(.hc) .cp:has(> h1.h1-town){max-width:max(980px,62vw)}}
/* 11/2 d10 launch check: hero labels readable over bright photos (soft scrim behind the crumbs + kickers only, photo left as is) */
html body .phero:not(.hc) .cp{isolation:isolate}
html body .phero:not(.hc) .cp::before{content:"";position:absolute;z-index:-1;pointer-events:none;left:calc(-1 * var(--pad));top:-48px;width:min(1180px,96vw);height:230px;background:radial-gradient(ellipse 58% 62% at 30% 48%,rgba(6,5,4,.6),rgba(6,5,4,.34) 55%,rgba(6,5,4,0) 100%)}
html body .phero:not(.hc) .cp .crumbs,html body .phero:not(.hc) .cp>.k{color:#e4dbce;font-weight:400;text-shadow:0 1px 2px rgba(0,0,0,.95),0 0 14px rgba(0,0,0,.7)}
html body .phero:not(.hc) .h1-kicker{font-weight:400;text-shadow:0 1px 2px rgba(0,0,0,.95),0 0 14px rgba(0,0,0,.7)}
/* 11/2 d10: the fixed header slides away while the footer is in view, so it never covers "That's a wrap." (pmenu.js toggles .hdr-away) */
.hdr{transition:background .5s,padding .5s,transform .45s ease}
.hdr.hdr-away{transform:translateY(-100%)}
.hdr.hdr-away:focus-within{transform:none}
/* 11/2 d10: phone tap targets at least 44px tall */
@media (max-width:760px){.btl-tag{min-height:44px;margin-top:-11px}}

/* 11/2/2026 9:37 PM Matt: "words covering a lot of that beautiful photo". Photo heroes (inner pages, not the home hero):
   smaller capped headlines (long journal titles 2 lines max at 1440), text block kept low-left over a soft bottom/left
   gradient, crumb/kicker/byline stack tightened, and the mid-image label scrim removed so the photo breathes. */
html body .phero:not(.hc):not(#_h) .cp::before,html body .fhero:not(.hc):not(#_h) .cp::before{content:none;display:none}
html body .phero:not(.hc):not(#_h):not(.patriot) .shade,html body .fhero:not(.hc):not(#_h):not(.patriot) .shade{background:
  linear-gradient(180deg,rgba(6,5,4,.46) 0%,rgba(6,5,4,0) 19%),
  linear-gradient(0deg,rgba(6,5,4,.8) 0%,rgba(6,5,4,.42) 24%,rgba(6,5,4,0) 50%),
  radial-gradient(72% 62% at 0% 100%,rgba(6,5,4,.56),rgba(6,5,4,0) 72%)}
html body .phero:not(.hc):not(#_h) .cp,html body .fhero:not(.hc):not(#_h) .cp{max-width:min(940px,66vw)}
html body .phero:not(.hc):not(#_h) .cp:has(> h1.h1-long){max-width:min(860px,60vw)}
html body .phero:not(.hc):not(#_h) .cp:has(> h1.h1-xlong){max-width:min(1040px,72vw)}
html body .phero:not(.hc):not(#_h) .cp h1,html body .fhero:not(.hc):not(#_h) .cp h1{text-shadow:0 2px 28px rgba(0,0,0,.28)}
html body .phero:not(.hc):not(#_h) .cp .crumbs,html body .fhero:not(.hc):not(#_h) .cp .crumbs{margin-bottom:10px}
html body .phero:not(.hc):not(#_h) .cp>.k,html body .fhero:not(.hc):not(#_h) .cp>.k{margin-bottom:14px}
html body .phero:not(.hc):not(#_h) .cp>.sub,html body .fhero:not(.hc):not(#_h) .cp>.sub{margin-top:14px}
/* journal posts: the title is already the headline, so the crumb trail stops at Journal and the byline drops (author stays in the schema) */
html body .jr-hero:not(#_h) .crumbs [aria-current],html body .jr-hero:not(#_h) .crumbs .cs{display:none}
html body .jr-hero:not(#_h) .cp>.sub{display:none}
html body .jr-hero:not(#_h) .k .jk-sep{display:inline}
html body .jr-hero:not(#_h) .k time{display:inline;margin-top:0;white-space:nowrap}
@media (min-width:901px){
  html body .phero:not(.hc):not(#_h) h1:not(.h1-town):not(.h1-long):not(.h1-house),html body .phero.e404:not(.hc) h1:not(.h1-town):not(.h1-long){font-size:clamp(60px,min(7vw,12.5svh),128px)}
  html body .phero:not(.hc):not(#_h) h1.h1-long{font-size:clamp(44px,min(4.4vw,8.6svh),84px);line-height:1.04}
  html body .phero:not(.hc):not(#_h) h1.h1-long.h1-xlong{font-size:clamp(40px,min(3.7vw,7.4svh),70px)}
  html body .phero:not(.hc):not(#_h) h1.h1-town{font-size:clamp(56px,min(6.2vw,11svh),112px)}
  html body .phero:not(.hc):not(#_h) h1.h1-house,html body .fhero:not(.hc):not(#_h) h1.h1-house{font-size:clamp(64px,min(7.6vw,13.5svh),128px)}
}
@media (max-width:900px){
  html body .phero:not(.hc):not(#_h) .cp,html body .fhero:not(.hc):not(#_h) .cp,html body .phero:not(.hc):not(#_h) .cp:has(> h1.h1-long){max-width:none}
  html body .phero:not(.hc):not(#_h) h1:not(.h1-town):not(.h1-long):not(.h1-house):not(.h1-fit){font-size:clamp(42px,10.5vw,64px)}
  html body .phero:not(.hc):not(#_h) h1.h1-house,html body .fhero:not(.hc):not(#_h) h1.h1-house{font-size:clamp(48px,12vw,72px)}
  html body .phero:not(.hc):not(#_h) h1.h1-long{font-size:clamp(32px,7.6vw,48px);line-height:1.05}
  html body .phero:not(.hc):not(#_h) h1.h1-long.h1-xlong{font-size:clamp(29px,6.8vw,42px)}
  html body .phero:not(.hc):not(#_h) h1.h1-town{font-size:clamp(36px,9.4vw,52px);line-height:1.04}
  html body .phero:not(.hc):not(#_h) .cp .crumbs,html body .fhero:not(.hc):not(#_h) .cp .crumbs{margin-bottom:8px}
  html body .phero:not(.hc):not(#_h) .cp>.k,html body .fhero:not(.hc):not(#_h) .cp>.k{margin-bottom:12px}
}

/* d16 11/3/2026 (seasonal button back in the home header, Matt 5:11 PM CT). The d12 header-fit rules lived in pages.css, which the
   home page does not load, so the home header already ran past the right edge at 1024-1599 (CTA right edge 1273 at 1024 in release-v2)
   and the toggle pushed it further. Moved here so every page gets them; same values as d12. Under 1800 the toggle shows its glyph only
   (44px square, the label stays for screen readers), from 1800 the glyph and label (at 1600 the label pushed the CTA to 9px from the edge). */
@media (min-width:901px) and (max-width:1023px){html body .hdr nav{display:none}html body .hdr .mbtn{display:inline-flex}}
@media (min-width:1024px) and (max-width:1279px){html body .hdr .brand img{width:184px}html body .hdr nav{gap:clamp(16px,1.6vw,20px)}html body .hdr nav a{letter-spacing:.06em}html body .hdr .cta{letter-spacing:.1em;padding:.85em 1.05em}}
@media (min-width:1280px) and (max-width:1599px){html body .hdr .brand img{width:220px}html body .hdr nav{gap:clamp(20px,1.7vw,26px)}html body .hdr nav a{letter-spacing:.12em}html body .hdr .cta{letter-spacing:.14em;padding:.9em 1.3em}}
@media (min-width:1024px) and (max-width:1799px){
 html body .hdr .tbtn{width:44px;height:44px;padding:0;letter-spacing:0;font-size:16px}
 html body .hdr .tbtn:not([aria-pressed=true]){border-color:rgba(234,226,212,.2)}  /* a faint square so a lone glyph reads as a button */
 html body .hdr .tbtn i{margin:0}
 html body .hdr .tbtn .tl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
/* d16: with the toggle, the d12 1024-1279 values still ran 47px past the edge at 1024 (CTA right 1071). Tighter spacing that scales
   back up toward the d12 look by ~1180; type size untouched. */
@media (min-width:1024px) and (max-width:1279px){html body .hdr{gap:clamp(14px,1.6vw,20px);padding-inline:clamp(26px,2.6vw,40px)}html body .hdr .brand img{width:clamp(164px,16vw,184px)}html body .hdr nav{gap:clamp(12px,1.3vw,18px)}html body .hdr nav a{letter-spacing:.04em}html body .hdr .cta{letter-spacing:.06em;padding:.8em .85em}html body .hdr .tools{gap:4px}}
/* d16: at 360 and 375 the phone row (170px logo, Begin your feature, Menu) was ~383px wide, so Menu ran 12px past the edge on every page
   (pre-existing; the toggle hangs under Menu so it went too). Smaller logo and gaps on the narrowest phones only. */
@media (max-width:389px){html body .hdr{gap:5px}html body .hdr .brand img{width:144px}}
/* 11/3 8:49–8:51 PM (Matt): New Year + Valentine looks; Holiday italics alternate evergreen and red section by section down the home page (hero evergreen, then red, evergreen ...); Patriotic italics alternate red and navy.
   Large italic only (WCAG large-text 3:1 on ink #060504): red #C8102E 3.5, evergreen #1F7A47 3.8, Old Glory Red #B22234 3.1, navy #5B6FA8 4.2
   (true Old Glory Blue #3C3B6E is 2.0 on ink, so it is kept for light grounds, where it is 8.1). Small text stays white, as before. */
.newyear{--bronze:#C9A96E;--bronze2:#F1DDB0;--label:#E8D3A6;--line:rgba(241,221,176,.3)}
.valentine{--bronze:#C98B63;--bronze2:#E8B4AE;--label:#E8B4AE;--line:rgba(232,180,174,.3)}
.holiday main>section:is(:nth-of-type(1),:nth-of-type(4),:nth-of-type(6),:nth-of-type(8)) :is(.disp,h1) em{color:#1F7A47}
.patriot main>section:is(:nth-of-type(3),:nth-of-type(5),:nth-of-type(8)) :is(.disp,h1) em{color:#5B6FA8}   /* hero keeps Old Glory Red over the photo; navy takes the next section, and so on */
.newyear main>section:is(:nth-of-type(1),:nth-of-type(4),:nth-of-type(6),:nth-of-type(8)) :is(.disp,h1) em{color:#D9B26F}
.valentine main>section:is(:nth-of-type(1),:nth-of-type(4),:nth-of-type(6),:nth-of-type(8)) :is(.disp,h1) em{color:#C98B63}
.newyear .tbtn[aria-pressed=true]{color:#F1DDB0;border-color:rgba(241,221,176,.55)}
.valentine .tbtn[aria-pressed=true]{color:#E8B4AE;border-color:rgba(201,139,99,.6)}