/* The standard look (owner's gold standard, modeled on berkshireparadise.com): Fraunces + Instrument Sans, birch paper,
   pine sections, pill buttons, no arrows. One property accent (presentation.accent) carries the main ask; the build
   writes it as --accent / --accent-soft. Loaded last, so it restyles every template without editing each one. */
:root{
 --birch:#f4efe6;--ink:#1c1a16;--ink-soft:#615c52;--pine:#1f3a2d;--pine-deep:#132419;--ochre:#c8842a;--ochre-soft:#f3e2c6;
 --lake:#2f6f8f;--lake-soft:#dbe8ee;--r:10px;
 --accent:var(--ochre);--accent-soft:var(--ochre-soft);--accent-ink:#fff;
 --serif:'Fraunces',Georgia,'Times New Roman',serif;--sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
 --paper:var(--birch);--muted:var(--ink-soft);--line:rgba(28,26,22,.13);--gold:var(--accent)
}
body{font-family:var(--sans);font-size:16px;line-height:1.65;background:var(--birch);color:var(--ink)}
h1,h2,h3,.parcel-card h3,.parcel-price strong,.map-enter strong,.arrival-inside-heading>p,.opening-copy h1,.opening-chapters strong,
.closing-invitation h2,#cinema-title,.cinema-scene-caption h3,.pg-heading h2,#guide-question,#guide-result-title,#connect-title{
 font-family:var(--serif);font-weight:300;letter-spacing:-.015em;font-optical-sizing:auto}
h1 em,h2 em,h3 em{font-style:italic;font-weight:300}
.eyebrow,.pg-eyebrow,.connect-eyebrow,.opening-eyebrow,.parcel-lot,.parcels-table caption{
 font-family:var(--sans);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--accent)}
.opening-eyebrow,.closing-invitation .eyebrow,.map-experience .eyebrow,.cinema .eyebrow{color:var(--accent-soft)}
::selection{background:var(--accent-soft);color:var(--ink)}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
header{background:var(--birch);border-bottom:1px solid var(--line)}
#brand{font-family:var(--serif);font-size:20px;font-weight:400;letter-spacing:-.01em;text-transform:none}
nav{font-size:14px;font-weight:500}

/* Buttons: one solid pill for the main ask, quiet outlines for everything else. */
.btn,.gold,#header-visit,.parcel-ask,.pg-primary,.connect-submit,.arrival-button,.button-gold{
 display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:52px;min-width:0;padding:.85rem 1.6rem;
 border-radius:999px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);
 font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;box-shadow:none;
 transition:filter .2s,transform .2s,background .2s}
.btn:hover,.gold:hover,#header-visit:hover,.parcel-ask:hover,.pg-primary:hover,.connect-submit:hover,.arrival-button:hover,.button-gold:hover{
 filter:brightness(1.08);background:var(--accent);transform:translateY(-1px)}
#header-visit{min-height:44px;padding:.6rem 1.3rem;font-size:14px}
#header-visit.quiet{background:transparent;color:var(--ink);border-color:var(--line)}
.closing-invitation .gold{background:var(--accent);max-width:360px;width:auto}
.btn.ghost,.pg-secondary,.button-outline-light{background:transparent;color:inherit;border:1px solid currentColor;border-radius:999px;
 min-height:52px;padding:.85rem 1.6rem;font-weight:600;font-size:15px}
.film-opening .btn.ghost{color:#fff;border-color:#ffffffa0}
.film-opening .btn.ghost:hover{background:#ffffff1a}
button{border-radius:999px;font-family:var(--sans)}
.parcels-chips button{border-radius:999px;background:#13241ae6;border-color:var(--accent-soft)}
.parcels-chips button strong{color:var(--accent-soft)}
.parcels-chips button[aria-pressed="true"]{background:var(--accent-soft);color:var(--ink);border-color:var(--accent-soft)}
.chapters button,.opening-chapters button,.cinema-chapters button,.pg-option,.pg-options button{border-radius:0}
.pg-options button,.pg-option{border-radius:var(--r)}

/* Sections */
.details{background:#ece5d8}
.parcels{background:var(--birch)}
.parcels h2 em{color:var(--accent)}
.parcel-card{background:#fbf8f2;border-radius:var(--r);border-color:var(--line)}
.parcel-photos figure{border-radius:6px}
.parcels-map{border-radius:var(--r)}
.parcels-map svg polygon{stroke:var(--accent-soft)}
.parcels-map svg polygon.is-selected{fill:rgba(219,230,234,.28);stroke:#fff}
.parcels-table tbody tr.is-selected{background:var(--accent-soft)}
.arrival,.hero,.closing,.closing-invitation,.film-opening,.map-experience{background:var(--pine-deep)}
.closing-invitation h2 em,.opening-copy h1 em,.arrival-copy h1 em{color:var(--ochre-soft)}
.closing-scene-label{border-radius:999px}
footer{font-size:13px;color:var(--ink-soft)}
@media(max-width:760px){#brand{font-size:16px}.btn,.gold,.parcel-ask,.pg-primary,.connect-submit,.arrival-button,.button-gold{width:100%}
 .opening-actions .btn{width:auto;flex:1 1 auto}#header-visit{width:auto;padding:.5rem 1rem;font-size:13px}}
#cinema-screen-play{border-radius:999px;color:var(--ink)}
.property-guide,.cinema,.panorama-intro{--serif:'Fraunces',Georgia,'Times New Roman',serif}
.pg-heading h2,.pg-conversation h3,.panorama-intro h2,.cinema h2,.cinema h3{font-weight:300;letter-spacing:-.015em}
/* Playback (playback.js): fade in once playing, soft loop over the matching poster. */
video{transition:opacity .5s ease}video[data-reveal]{opacity:0}video[data-reveal].is-playing{opacity:1}video.is-looping{opacity:0!important}
@media(prefers-reduced-motion:reduce){video{transition:none}}
/* Phone layout QA fixes (owner, 13 Oct 2026: "The Farmhouse" bled into the next block). */
h1,h2,h3,.eyebrow,.opening-eyebrow,.pg-eyebrow,.parcel-lot{text-wrap:balance}
.cinema-chapter strong,.parcel-card h3,.chapters button strong{overflow-wrap:break-word;hyphens:manual}
/* Scene titles scale with the window: six 32 px titles bled into each other at a ~1,000 px laptop/Lovable pane (owner, 14 Oct). */
@media(min-width:761px){.cinema-chapters .cinema-chapter strong,.cinema .cinema-chapter strong{font-size:clamp(16px,calc(3.1vw - 15px),32px)}
 /* Where the browser can measure the card itself, size from the card: the longest word ("Farmhouse") fits whole. */
 @supports (container-type:inline-size){.cinema-chapter{container-type:inline-size}.cinema-chapters .cinema-chapter strong,.cinema .cinema-chapter strong{font-size:clamp(16px,10.5cqi,32px)}}}
.cinema-chapter,.cinema-chapter>span:not(.cinema-chapter-number):not(.cinema-chapter-duration){min-width:0}
@media(max-width:760px){
 .closing-invitation h2,.map-intro h2,#cinema-title,.pg-heading h2,.panorama-intro h2,.parcels h2,#detail-title{font-size:clamp(34px,10.5vw,44px);line-height:1.05}
 .opening-copy h1{font-size:clamp(34px,9.6vw,48px)}
 .cinema-chapters .cinema-chapter strong,.cinema .cinema-chapter strong{font-size:18px;line-height:1.2}
 .cinema-chapter{align-content:start}
 .parcels-table{min-width:0}
 .parcels-table th:nth-child(3),.parcels-table td:nth-child(3){display:none}
}
/* The 3D tour, full screen on the listing page (tour.js). */
.tour-dialog{width:100vw;height:100svh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--pine-deep);color:#fff;display:none}
.tour-dialog[open]{display:grid;grid-template-rows:auto 1fr}
.tour-dialog::backdrop{background:var(--pine-deep)}
.tour-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 10px}
.tour-bar p{margin:0;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-soft)}
.tour-bar div{display:flex;gap:10px;align-items:center}
.tour-bar a{font-size:13px;text-decoration:underline;color:#fff}
.tour-bar button{min-height:40px;padding:.4rem 1.1rem;border-radius:999px;border:1px solid #ffffff80;background:transparent;color:#fff}
.tour-dialog iframe{width:100%;height:100%;border:0;display:block;background:#0b1712}
.tour-status{position:absolute;inset:50% 0 auto;text-align:center;font-size:14px;color:#dfe8e2;margin:0}
body.tour-open{overflow:hidden}
/* History, unmissable (owner, 13 Oct 2026): a seal on the opening and a band right after it. */
.opening-seal{display:inline-flex;align-items:baseline;gap:.6rem;margin:0 0 18px;padding:.45rem 1rem;border:1px solid var(--accent-soft);border-radius:999px;background:#0d1d15b3;color:#fff;backdrop-filter:blur(4px)}
.opening-seal strong{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1;letter-spacing:.02em}
.opening-seal span{white-space:nowrap;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-soft)}
.history{position:relative;overflow:hidden;background:var(--birch);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center}
.history-year{position:absolute;right:-1vw;top:50%;transform:translateY(-50%);font-family:var(--serif);font-weight:300;font-size:clamp(160px,26vw,380px);line-height:.8;color:color-mix(in srgb,var(--accent) 9%,transparent);pointer-events:none;letter-spacing:-.04em}
.history-copy,.history-timeline{position:relative}
.history h2{font-size:clamp(40px,4.6vw,68px);line-height:1.02;margin:12px 0 18px}
.history h2 em{color:var(--accent)}
.history-lead{font-size:18px;line-height:1.6;max-width:44ch;color:var(--ink-soft)}
.history-timeline{list-style:none;margin:0;padding:0;display:grid;gap:0;border-left:1px solid var(--line)}
.history-timeline li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;padding:14px 0 14px 22px;position:relative}
.history-timeline li::before{content:'';position:absolute;left:-5px;top:24px;width:9px;height:9px;border-radius:50%;background:var(--accent)}
.history-timeline strong{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.1;color:var(--ink)}
.history-timeline span{font-size:15px;line-height:1.55;color:var(--ink-soft);padding-top:4px}
.history-timeline li:first-child strong{color:var(--accent)}
@media(max-width:860px){.history{grid-template-columns:1fr;gap:26px}.history-year{top:14%;right:-6vw;font-size:42vw}.history-lead{font-size:16px}.history-timeline li{grid-template-columns:64px minmax(0,1fr)}.history-timeline strong{font-size:22px}.opening-seal strong{font-size:22px}}
@media(max-width:760px){.history h2{font-size:clamp(30px,9vw,38px)}}
/* The live 3D parcel plan (parcels.js): the tour in plan mode over the static aerial, which shows until it is ready. */
.parcels-3d{position:absolute;inset:0;width:100%;height:100%;border:0;opacity:0;transition:opacity .6s ease;z-index:2;background:transparent}
.parcels-map.is-3d .parcels-3d{opacity:1}
.parcels-map.is-3d #parcels-chips,.parcels-map.is-3d #parcels-svg{visibility:hidden}
.parcels-map.is-3d figcaption{z-index:3;pointer-events:none}
.parcels-full-tour{position:absolute;top:12px;right:12px;z-index:4;min-height:40px!important;padding:.5rem 1.1rem!important;font-size:13px!important;
 background:#0d1d15cc!important;color:#fff!important;border-color:#ffffff80!important;backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .4s}
.parcels-map.is-3d .parcels-full-tour{opacity:1;pointer-events:auto}
.parcels-map.is-3d{overflow:visible}
.parcels-map.is-3d figcaption{position:static;background:none;color:var(--ink-soft);padding:10px 2px 0;transform:translateY(100%);position:absolute;top:100%;bottom:auto}
@media(max-width:760px){.parcels-full-tour{width:auto!important}.parcels-map.is-3d{margin-bottom:84px}}
@media(min-width:761px){.parcels-map.is-3d{margin-bottom:70px}}
/* The aerial plan is the cover; the 3D emblem opens the live 3D plan (parcels.js). */
.parcels-map:has(.parcels-3d-cover){overflow:visible;margin-bottom:70px}
.parcels-map:has(.parcels-3d-cover) figcaption{position:absolute;top:100%;bottom:auto;background:none;color:var(--ink-soft);padding:10px 2px 0}
.parcels-3d-cover{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:14px;
 padding:12px 22px 12px 12px;border-radius:999px;border:1px solid #ffffffb3;background:#0d1d15cc;color:#fff;backdrop-filter:blur(8px);
 box-shadow:0 10px 40px #0007;cursor:pointer;transition:transform .25s,background .25s}
.parcels-3d-cover:hover{transform:translateX(-50%) scale(1.04);background:#0d1d15ee}
.p3d-emblem{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,var(--accent-soft),var(--accent));box-shadow:inset 0 0 0 1px #fff6}
.p3d-emblem svg{width:44px;height:44px;overflow:visible}
.p3d-emblem path{fill:none;stroke:#fff;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.p3d-emblem{perspective:160px}
.p3d-spin{transform-origin:50% 60%;animation:p3dturn 5s ease-in-out infinite;will-change:transform}
.p3d-hill{stroke:var(--ochre-soft)!important}
@keyframes p3dturn{0%,100%{transform:rotateX(18deg) rotateY(-32deg)}50%{transform:rotateX(26deg) rotateY(32deg)}}
.p3d-text{display:grid;text-align:left;line-height:1.2}
.p3d-text strong{font-family:var(--serif);font-weight:400;font-size:24px;letter-spacing:-.01em}
.p3d-text small{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-soft);margin-top:4px}
.parcels-3d-cover.is-loading .p3d-text small::after{content:' · loading';}
.parcels-3d-cover.is-loading .p3d-emblem{animation:p3dpulse 1.2s ease-in-out infinite}
@keyframes p3dpulse{50%{box-shadow:inset 0 0 0 1px #fff6,0 0 0 10px #ffffff22}}
.parcels-flat{position:absolute;top:12px;left:12px;z-index:4;min-height:40px!important;padding:.5rem 1.1rem!important;font-size:13px!important;background:#0d1d15cc!important;color:#fff!important;border:1px solid #ffffff80!important;border-radius:999px;backdrop-filter:blur(6px)}
@media(prefers-reduced-motion:reduce){.p3d-spin,.parcels-3d-cover.is-loading .p3d-emblem{animation:none}}
@media(max-width:760px){.parcels-map:has(.parcels-3d-cover){margin-bottom:90px}.parcels-3d-cover{bottom:10px;white-space:nowrap;padding:9px 16px 9px 9px;gap:10px}.p3d-emblem{width:46px;height:46px}.p3d-emblem svg{width:34px;height:34px}.p3d-text strong{font-size:19px}.p3d-text small{font-size:.62rem}}
/* The land band (land_band_html): the American dream of land, one tile per land parcel. */
.land-band{background:var(--pine-deep);color:#f6f1e7}
.land-band-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px;align-items:end;margin-bottom:36px}
.land-band-head .eyebrow{grid-column:1/-1;margin:0;color:var(--accent-soft)}
.land-band h2{font-size:clamp(40px,4.8vw,70px);line-height:1.02;margin:0}
.land-band h2 em{color:var(--ochre-soft)}
.land-band-head p:last-child{font-size:17px;line-height:1.6;color:#d9dfd6;max-width:46ch;margin:0}
.land-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.land-tile{position:relative;display:block;padding:0;border:0;border-radius:var(--r);overflow:hidden;text-align:left;color:#fff;background:#0b1712;aspect-ratio:4/5;cursor:pointer}
.land-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.land-tile:hover img{transform:scale(1.04)}
.land-tile::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#08130ee6 0%,#08130e80 38%,transparent 65%)}
.land-tile-copy{position:absolute;left:0;right:0;bottom:0;z-index:1;display:grid;gap:4px;padding:20px}
.land-tile-copy small{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-soft)}
.land-tile-copy strong{font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.05}
.land-tile-copy span{font-size:15px;color:#e4e8e1}
.land-tile-copy em{font-style:normal;font-size:14px;color:var(--ochre-soft);margin-top:4px}
@media(max-width:760px){.land-band-head{grid-template-columns:1fr;gap:16px}.land-band h2{font-size:clamp(34px,10.5vw,44px)}.land-tile{aspect-ratio:16/11}.land-tile-copy strong{font-size:26px}}
@media(prefers-reduced-motion:reduce){.land-tile img{transition:none}}
/* The house band (house_band_html). */
.house-band{background:var(--birch);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:48px;align-items:center}
.house-gallery{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:10px;aspect-ratio:4/3}
.house-pic{margin:0;overflow:hidden;border-radius:var(--r);background:#ddd}
.house-pic:first-child{grid-row:1/3}
.house-pic img{width:100%;height:100%;object-fit:cover;display:block}
.house-band h2{font-size:clamp(40px,4.6vw,66px);line-height:1.02;margin:10px 0 16px}
.house-band h2 em{color:var(--accent)}
.house-lead{font-size:17px;line-height:1.6;color:var(--ink-soft);max-width:46ch}
.house-facts{list-style:none;padding:0;margin:18px 0;display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
.house-facts li{font-size:15px;padding-left:16px;position:relative}
.house-facts li::before{content:'';position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.house-price{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;margin:6px 0 18px}
.house-price strong{font-family:var(--serif);font-weight:400;font-size:32px}
.house-price span{color:var(--ink-soft);font-size:14px}
@media(max-width:860px){.house-band{grid-template-columns:1fr;gap:24px}.house-facts{grid-template-columns:1fr}.house-band h2{font-size:clamp(30px,9.2vw,44px)}}

#closing-contact-note:empty{display:none}

/* A phone held upright plays the opening film's own 9:16 slice, cut at x = focus * (width - slice): with the same
   object-position focus it frames exactly as the full film did, so no override here. */