/* ============================================================
   SNAKE RIVER TINY HOMES — shared site stylesheet
   Single source of truth for header, footer, buttons and the
   general content-page format. Edit here, rebuild, done.
============================================================ */

:root{
  --bg:        #F4F8F2;
  --bg-2:      #E9F1E5;
  --card:      #FFFFFF;
  --pine:      #0D2417;
  --pine-2:    #12301F;
  --ink:       #132A1C;
  --ink-soft:  #4F6557;
  --ink-mute:  #7E9486;
  --line:      rgba(19,42,28,.13);
  --line-soft: rgba(19,42,28,.07);
  --green:      #2F8B4B;
  --green-deep: #1F6B38;
  --leaf:       #8FC43F;
  --leaf-soft:  #DDEFC2;
  --grad:       linear-gradient(90deg, #2F8B4B, #8FC43F);
  --maxw: 1220px;
  --pad:  clamp(20px, 5vw, 56px);
  --r-lg: 28px;
  --r-md: 18px;
  --display: "Schibsted Grotesk", system-ui, sans-serif;
  --body:    "Inter", system-ui, sans-serif;
  --ease:    cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  background:var(--bg); color:var(--ink); font-family:var(--body);
  font-size:16.5px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; }
::selection{ background:var(--green); color:#fff; }
h1,h2,h3,h4{ font-family:var(--display); font-weight:500; letter-spacing:-.02em; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--display); font-weight:600; font-size:16px;
  padding:15px 30px; border-radius:999px; text-decoration:none; border:1px solid transparent; cursor:pointer;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
  will-change:transform;
}
.btn:hover{ transform:translateY(-2px); }
.btn-green{ background:var(--green); color:#fff; }
.btn-green:hover{ background:var(--green-deep); box-shadow:0 14px 32px rgba(31,107,56,.35); }
.btn-light{ background:#fff; color:var(--ink); }
.btn-light:hover{ box-shadow:0 14px 34px rgba(0,0,0,.25); }
.btn-ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.45); }
.btn-ghost:hover{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.7); }

/* ============================================================
   HEADER / NAV
============================================================ */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:60; color:#fff;
  border-bottom:1px solid transparent;
  transition:background .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease);
}
.nav-inner{
  max-width:var(--maxw); margin:0 auto; padding:14px var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand{ display:flex; align-items:center; text-decoration:none; flex:0 0 auto; transition:opacity .3s var(--ease); }
.brand:hover{ opacity:.88; }
.brand img{ height:78px; width:auto; max-width:none; flex:0 0 auto; display:block; aspect-ratio:860 / 316; }
.brand .logo-white{ filter:drop-shadow(0 2px 10px rgba(7,22,13,.5)); }
.brand .logo-color{ display:none; }
body.past-stage .brand .logo-white{ display:none; }
body.past-stage .brand .logo-color{ display:block; }

.nav-links{ display:flex; gap:30px; list-style:none; align-items:center; }
.nav-links > li{ position:relative; }
.nav-links a, .nav-trigger{
  text-decoration:none; font-family:var(--body); font-size:15px; font-weight:500; opacity:.88; color:inherit; transition:opacity .25s;
}
.nav-links a:hover{ opacity:1; }
.nav-links a[aria-current="page"]{ opacity:1; }
.nav-trigger{ background:none; border:0; padding:0; cursor:pointer; display:inline-flex; align-items:center; gap:6px; line-height:1; }
.nav-trigger .caret{ width:11px; height:11px; transition:transform .25s var(--ease); }
.has-menu:hover .nav-trigger, .has-menu:focus-within .nav-trigger{ opacity:1; }
.has-menu:hover .caret, .has-menu:focus-within .caret{ transform:rotate(180deg); }

.dropdown{
  position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(10px);
  min-width:200px; margin:0; padding:9px; list-style:none;
  background:#fff; border:1px solid var(--line-soft); border-radius:14px; box-shadow:0 18px 46px rgba(19,42,28,.18);
  opacity:0; visibility:hidden; pointer-events:none; z-index:70;
  transition:opacity .2s var(--ease), transform .2s var(--ease);
}
.dropdown::before{ content:""; position:absolute; top:-12px; left:0; right:0; height:12px; }
.has-menu:hover .dropdown, .has-menu:focus-within .dropdown{ opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(5px); }
.dropdown a{ display:block; padding:9px 14px; border-radius:9px; font-size:14.5px; font-weight:500; color:var(--ink); opacity:1; white-space:nowrap; transition:background .18s, color .18s; }
.dropdown a:hover{ background:var(--bg-2); color:var(--green-deep); opacity:1; }

.nav .btn{ padding:11px 22px; font-size:14.5px; }
.btn-phone{ gap:9px; letter-spacing:.01em; white-space:nowrap; }
.btn-phone svg{ width:18px; height:18px; flex:0 0 auto; }
.nav .btn-phone{ font-size:15.5px; padding:11px 24px; }

body.past-stage .nav{
  background:rgba(244,248,242,.85); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  color:var(--ink); border-bottom-color:var(--line-soft);
}

.btn-outline-green{ background:transparent; color:var(--green-deep); border-color:rgba(31,107,56,.4); }
.btn-outline-green:hover{ border-color:var(--green-deep); background:rgba(47,139,75,.07); }

/* ---------- hamburger button (mobile only) ---------- */
.nav-toggle{
  display:none; flex:0 0 auto; width:46px; height:46px; padding:0;
  background:none; border:0; cursor:pointer; position:relative; color:inherit;
}
.nav-toggle span{
  position:absolute; left:11px; right:11px; height:2.4px; border-radius:2px; background:currentColor;
  transition:transform .3s var(--ease), opacity .2s var(--ease), top .3s var(--ease);
}
.nav-toggle span:nth-child(1){ top:15px; }
.nav-toggle span:nth-child(2){ top:22px; }
.nav-toggle span:nth-child(3){ top:29px; }
body.menu-open .nav-toggle span:nth-child(1){ top:22px; transform:rotate(45deg); }
body.menu-open .nav-toggle span:nth-child(2){ opacity:0; }
body.menu-open .nav-toggle span:nth-child(3){ top:22px; transform:rotate(-45deg); }

@media (max-width: 880px){
  .nav-links{ display:none; }
  .nav .btn-phone{ display:none; }
  .nav-toggle{ display:inline-flex; }
  .brand img{ height:66px; }
}
@media (max-width: 480px){ .brand img{ height:58px; } }
@media (max-width: 380px){ .brand img{ height:50px; } }

/* ---------- mobile menu panel ---------- */
.mobile-menu{
  position:fixed; inset:0; z-index:120; background:var(--bg);
  display:flex; flex-direction:column; padding:0 var(--pad) calc(28px + env(safe-area-inset-bottom));
  transform:translateX(100%); visibility:hidden;
  transition:transform .4s var(--ease), visibility .4s;
  overflow-y:auto; overscroll-behavior:contain;
}
body.menu-open{ overflow:hidden; }
body.menu-open .mobile-menu{ transform:none; visibility:visible; }
.mobile-menu-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 0 8px; position:sticky; top:0; background:var(--bg); }
.mobile-menu-head .brand img{ height:62px; }
.mobile-close{ width:46px; height:46px; border:0; background:none; cursor:pointer; color:var(--ink); display:inline-flex; align-items:center; justify-content:center; }
.mobile-close svg{ width:26px; height:26px; }

.mobile-nav{ display:flex; flex-direction:column; padding:10px 0 4px; }
.mobile-nav .m-link, .m-group-toggle{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  font-family:var(--display); font-weight:600; font-size:21px; color:var(--ink);
  text-decoration:none; background:none; border:0; cursor:pointer;
  padding:16px 2px; border-bottom:1px solid var(--line-soft); text-align:left;
}
.mobile-nav a[aria-current="page"]{ color:var(--green-deep); }
.m-group-toggle .caret{ width:14px; height:14px; transition:transform .3s var(--ease); }
.m-group.open .m-group-toggle .caret{ transform:rotate(180deg); }
.m-sub{ max-height:0; overflow:hidden; transition:max-height .35s var(--ease); }
.m-sub a{ display:block; font-size:17px; color:var(--ink-soft); text-decoration:none; padding:11px 2px 11px 16px; }
.m-sub a:active, .m-sub a[aria-current="page"]{ color:var(--green-deep); }

.mobile-cta{ display:flex; flex-direction:column; gap:12px; margin-top:24px; }
.mobile-cta .btn{ width:100%; padding:16px; font-size:16px; }

/* ============================================================
   PAGE HERO BANNER
============================================================ */
.page-hero{
  position:relative; background:var(--pine); color:#fff; overflow:hidden;
  padding:calc(96px + clamp(40px,7vw,80px)) 0 clamp(48px,7vw,84px);
}
.page-hero::after{
  content:""; position:absolute; inset:auto -10% -60% 40%; height:120%;
  background:radial-gradient(ellipse at center, rgba(143,196,63,.16), transparent 62%); pointer-events:none;
}
.page-hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.page-hero-overlay{ position:absolute; inset:0; z-index:1; background:linear-gradient(to right, rgba(7,22,13,.82), rgba(7,22,13,.55) 60%, rgba(7,22,13,.4)); }
.page-hero-inner{ position:relative; z-index:2; }
.crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:9px; font-size:13.5px; color:rgba(255,255,255,.72); margin-bottom:20px; }
.crumbs a{ text-decoration:none; color:rgba(255,255,255,.72); transition:color .2s; }
.crumbs a:hover{ color:#fff; }
.crumb-current{ color:var(--leaf); }
.page-hero h1{ font-size:clamp(38px, 5.6vw, 72px); line-height:1.04; letter-spacing:-.025em; max-width:15em; }
.page-hero-sub{ margin-top:16px; font-size:clamp(16px,1.7vw,20px); color:rgba(255,255,255,.88); max-width:38ch; }
.page-hero .btn{ margin-top:30px; }

/* ============================================================
   PAGE BODY
============================================================ */
.page-body{ padding:clamp(56px, 8vw, 96px) 0; }
.page-lede{ font-size:clamp(19px, 2.1vw, 24px); line-height:1.5; color:var(--ink); max-width:40ch + 10ch; max-width:62ch; margin:0 auto clamp(48px,6vw,72px); font-family:var(--display); font-weight:400; }

.prose{ max-width:760px; margin:0 auto clamp(44px,6vw,68px); }
.prose:last-child{ margin-bottom:0; }
.prose.prose-left{ text-align:left; margin-left:0; margin-right:auto; max-width:820px; }
.prose h2{ font-size:clamp(26px,3vw,38px); line-height:1.12; margin-bottom:18px; }
.prose p{ color:var(--ink-soft); margin-bottom:16px; }
.prose p:last-child{ margin-bottom:0; }

.checks{ list-style:none; display:flex; flex-direction:column; gap:14px; margin-top:6px; }
.checks li{ display:flex; gap:14px; align-items:flex-start; font-weight:500; color:var(--ink); }
.checks svg{ flex:0 0 auto; width:22px; height:22px; margin-top:2px; }

.split{
  display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(32px,5vw,72px); align-items:center;
  max-width:var(--maxw); margin:0 auto clamp(48px,6vw,80px);
}
.split.flip .split-text{ order:2; }
.split h2{ font-size:clamp(26px,3vw,38px); line-height:1.12; margin-bottom:18px; }
.split p{ color:var(--ink-soft); margin-bottom:16px; }
.split p:last-child{ margin-bottom:0; }
.split-media img{ width:100%; aspect-ratio:4/3.1; object-fit:cover; border-radius:var(--r-lg); box-shadow:0 24px 60px rgba(19,42,28,.16); }
.split-media.wide img{ aspect-ratio:16/10; }
@media (max-width: 860px){
  .split{ grid-template-columns:1fr; gap:26px; }
  .split.flip .split-text{ order:0; }
}

/* The closing "summary" sections (checklist + final copy) sit centered
   in the middle of the page on desktop. Everything above them keeps its
   original wider layout, and mobile is left untouched. */
@media (min-width: 861px){
  .prose{ text-align:center; }
  .prose .checks{ width:fit-content; margin-left:auto; margin-right:auto; }
}

/* ---------- FAQ accordion ---------- */
.faq{ max-width:820px; margin:clamp(20px,3vw,40px) auto 0; }
.faq h2{ font-size:clamp(26px,3vw,38px); margin-bottom:24px; text-align:center; }
.acc{ border-top:1px solid var(--line); }
.acc details{ border-bottom:1px solid var(--line); }
.acc summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:20px;
  font-family:var(--display); font-weight:500; font-size:clamp(17px,1.9vw,21px); padding:20px 2px; transition:color .25s;
}
.acc summary::-webkit-details-marker{ display:none; }
.acc summary:hover{ color:var(--green); }
.acc summary .ic{ width:22px; height:22px; position:relative; flex:0 0 auto; }
.acc summary .ic::before, .acc summary .ic::after{ content:""; position:absolute; background:currentColor; border-radius:2px; transition:transform .35s var(--ease); }
.acc summary .ic::before{ left:0; top:10px; width:22px; height:2px; }
.acc summary .ic::after{ left:10px; top:0; width:2px; height:22px; }
.acc details[open] summary .ic::after{ transform:scaleY(0); }
.acc .acc-body{ padding:0 2px 22px; color:var(--ink-soft); max-width:64ch; }

/* ---------- CTA ---------- */
.page-cta-wrap{ padding:0 0 clamp(72px,9vw,120px); }
.cta-panel{
  background:var(--pine); color:#F0F6EE; border-radius:calc(var(--r-lg) + 6px);
  padding:clamp(52px,7vw,96px) clamp(28px,6vw,90px); position:relative; overflow:hidden; text-align:center;
}
.cta-panel::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--grad); }
.cta-panel::after{ content:""; position:absolute; inset:auto -20% -60% -20%; height:90%; background:radial-gradient(ellipse at center, rgba(143,196,63,.18), transparent 65%); pointer-events:none; }
.cta-panel h2{ font-size:clamp(32px,4.6vw,60px); line-height:1.06; }
.cta-panel p{ color:rgba(240,246,238,.72); max-width:42ch; margin:18px auto 32px; }
.cta-panel .row{ position:relative; z-index:2; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ============================================================
   FOOTER
============================================================ */
footer{ border-top:1px solid var(--line-soft); background:var(--bg-2); padding:clamp(56px,7vw,84px) 0 40px; color:var(--ink-soft); font-size:14.5px; }
.foot-top{ display:grid; grid-template-columns:1.1fr 2fr; gap:clamp(40px,6vw,80px); padding-bottom:clamp(40px,5vw,60px); }
.foot-brand img{ height:74px; width:auto; max-width:none; aspect-ratio:860 / 316; margin-bottom:20px; }
.foot-brand p{ color:var(--ink-soft); max-width:30ch; margin-bottom:24px; line-height:1.6; }
.foot-brand .btn{ padding:13px 24px; font-size:15px; }
.foot-contact{ display:flex; flex-direction:column; gap:6px; margin-top:18px; }
.foot-phone{ display:block; text-decoration:none; font-family:var(--display); font-weight:600; font-size:20px; color:var(--ink); }
.foot-phone:hover{ color:var(--green-deep); }
.foot-email{ text-decoration:none; color:var(--ink-soft); font-size:15px; }
.foot-email:hover{ color:var(--green-deep); }
.foot-social{ display:flex; gap:11px; margin-top:18px; }
.foot-social a{ width:34px; height:34px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center; background:var(--bg-2); color:var(--ink-soft); border:1px solid var(--line-soft); transition:color .18s, border-color .18s, transform .18s; }
.foot-social a:hover{ color:var(--green-deep); border-color:var(--green); transform:translateY(-2px); }
.foot-social svg{ width:18px; height:18px; }
.legal-left{ display:flex; flex-direction:column; gap:6px; }
.legal-links a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }
.legal-links a:hover{ color:var(--green-deep); }
.legal-links i{ opacity:.5; font-style:normal; }
.foot-cols{ display:grid; grid-template-columns:repeat(4,1fr); gap:32px 24px; }
.foot-col{ display:flex; flex-direction:column; gap:11px; }
.foot-col h4{ font-family:var(--display); font-weight:600; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:5px; }
.foot-col a{ text-decoration:none; color:var(--ink-soft); font-size:14.5px; transition:color .18s; }
.foot-col a:hover{ color:var(--green-deep); }
.legal{ padding-top:26px; border-top:1px solid var(--line-soft); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; color:var(--ink-mute); font-size:13.5px; }
.legal-links{ display:inline-flex; gap:8px; flex-wrap:wrap; align-items:center; }
.legal-links a{ color:var(--ink-mute); text-decoration:none; }
.legal-links a:hover{ color:var(--green-deep); }
.legal-links i{ font-style:normal; opacity:.5; }
@media (max-width: 880px){ .foot-top{ grid-template-columns:1fr; gap:44px; } .foot-cols{ grid-template-columns:1fr 1fr; } .foot-brand{ text-align:center; } .foot-brand > a{ display:inline-block; } .foot-brand p{ max-width:none; } .foot-contact{ align-items:center; } .foot-social{ justify-content:center; } }
@media (max-width: 460px){ .foot-cols{ grid-template-columns:1fr 1fr; gap:28px 18px; } }

/* ---------- reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1 !important; transform:none !important; transition:none !important; } html{ scroll-behavior:auto; } }

/* ============================================================
   BLOG INDEX — grid of post cards
============================================================ */
.blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(24px,3vw,36px); margin:clamp(32px,5vw,56px) 0; }
.blog-card{ background:var(--bg-2); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--line-soft); transition:box-shadow .22s; }
.blog-card:hover{ box-shadow:0 12px 40px rgba(19,42,28,.13); }
.blog-card-img-wrap{ display:block; overflow:hidden; aspect-ratio:4/3; }
.blog-card-img-wrap img{ width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.blog-card:hover .blog-card-img-wrap img{ transform:scale(1.04); }
.blog-card-body{ padding:22px 24px 26px; display:flex; flex-direction:column; flex:1; }
.blog-card-meta{ font-size:12.5px; text-transform:uppercase; letter-spacing:.1em; color:var(--ink-mute); margin-bottom:10px; }
.blog-card h2{ font-size:clamp(17px,1.6vw,21px); line-height:1.26; margin-bottom:12px; }
.blog-card h2 a{ text-decoration:none; color:var(--ink); }
.blog-card h2 a:hover{ color:var(--green-deep); }
.blog-card > .blog-card-body > p{ font-size:14.5px; color:var(--ink-soft); line-height:1.65; flex:1; margin-bottom:16px; }
.blog-card-more{ font-size:14px; font-weight:600; color:var(--green-deep); text-decoration:none; }
.blog-card-more:hover{ text-decoration:underline; }
@media (max-width:900px){ .blog-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .blog-grid{ grid-template-columns:1fr; } }

/* ============================================================
   BLOG POST
============================================================ */
.blog-post-hero-img{ margin:clamp(24px,4vw,40px) auto; max-width:860px; border-radius:var(--r-lg); overflow:hidden; }
.blog-post-hero-img img{ width:100%; aspect-ratio:16/9; object-fit:cover; display:block; }

/* ============================================================
   GALLERY PAGE
============================================================ */
.gallery-section{ margin-bottom:clamp(44px,6vw,64px); }
.gallery-section h2{ font-size:clamp(22px,2.4vw,30px); margin-bottom:20px; }
.gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.gallery-item{ overflow:hidden; border-radius:var(--r); cursor:pointer; }
.gallery-item img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; transition:transform .35s; }
.gallery-item:hover img{ transform:scale(1.05); }
@media (max-width:900px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:500px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); gap:6px; } }

/* lightbox */
.lb-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.88); z-index:1000; display:none; align-items:center; justify-content:center; }
.lb-overlay.open{ display:flex; }
.lb-overlay img{ max-width:92vw; max-height:90vh; border-radius:var(--r); box-shadow:0 24px 80px rgba(0,0,0,.5); }
.lb-close{ position:absolute; top:18px; right:22px; background:none; border:none; color:#fff; font-size:36px; cursor:pointer; line-height:1; }

/* ============================================================
   INVENTORY PAGE
============================================================ */
.inventory-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:clamp(24px,3vw,36px); margin:clamp(32px,5vw,56px) 0; }
.inv-card{ background:var(--bg-2); border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line-soft); display:flex; flex-direction:column; }
.inv-card-img{ aspect-ratio:4/3; overflow:hidden; }
.inv-card-img img{ width:100%; height:100%; object-fit:cover; }
.inv-card-body{ padding:22px 24px 26px; flex:1; display:flex; flex-direction:column; }
.inv-card-badge{ display:inline-block; font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; background:var(--green); color:#fff; border-radius:4px; padding:3px 9px; margin-bottom:12px; }
.inv-card h2{ font-size:clamp(19px,1.8vw,23px); margin-bottom:8px; }
.inv-card-price{ font-family:var(--display); font-size:22px; font-weight:700; color:var(--green-deep); margin-bottom:10px; }
.inv-card-specs{ font-size:13.5px; color:var(--ink-mute); margin-bottom:12px; }
.inv-card p{ font-size:14.5px; color:var(--ink-soft); line-height:1.65; flex:1; margin-bottom:18px; }

/* ============================================================
   VIDEOS PAGE
============================================================ */
.video-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:clamp(24px,3vw,36px); margin:clamp(32px,5vw,56px) 0; }
.video-card{ background:var(--bg-2); border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line-soft); }
.video-embed{ position:relative; aspect-ratio:16/9; }
.video-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:none; }
.video-card-body{ padding:18px 20px 22px; }
.video-card-body h2{ font-size:clamp(17px,1.5vw,20px); margin-bottom:8px; }
.video-card-body p{ font-size:14px; color:var(--ink-soft); }

/* ============================================================
   CONTACT PAGE
============================================================ */
.contact-layout{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,80px); margin:clamp(36px,5vw,60px) 0; align-items:start; }
.contact-info h2{ font-size:clamp(22px,2.4vw,30px); margin-bottom:16px; }
.contact-info p{ color:var(--ink-soft); margin-bottom:16px; }
.contact-info a{ color:var(--green-deep); text-decoration:none; }
.contact-info a:hover{ text-decoration:underline; }
.contact-details{ margin-top:28px; display:flex; flex-direction:column; gap:14px; }
.contact-detail{ display:flex; align-items:flex-start; gap:12px; }
.contact-detail svg{ flex:0 0 22px; margin-top:2px; color:var(--green); }
.contact-detail span{ font-size:15px; color:var(--ink-soft); }
.contact-detail strong{ display:block; color:var(--ink); margin-bottom:2px; font-size:15px; }
.contact-booking{ background:var(--bg-2); border-radius:var(--r-lg); border:1px solid var(--line-soft); overflow:hidden; }
.contact-booking iframe{ width:100%; min-height:580px; border:none; display:block; }
@media (max-width:860px){ .contact-layout{ grid-template-columns:1fr; } .contact-booking{ order:-1; } }

/* video poster cards (no real embed yet) */
.video-poster{ position:relative; display:block; aspect-ratio:16/9; overflow:hidden; }
.video-poster img{ width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.video-poster:hover img{ transform:scale(1.04); }
.video-play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.video-play svg{ width:62px; height:62px; filter:drop-shadow(0 6px 16px rgba(0,0,0,.35)); transition:transform .2s; }
.video-poster:hover .video-play svg{ transform:scale(1.08); }

/* ============================================================
   MODEL PAGES
============================================================ */
.spec-bar{ background:var(--green-deep); color:#fff; }
.spec-bar-inner{ display:flex; flex-wrap:wrap; justify-content:space-around; gap:18px 12px; padding:26px 0; }
.spec{ display:flex; flex-direction:column; align-items:center; text-align:center; min-width:96px; }
.spec-val{ font-family:var(--display); font-weight:700; font-size:clamp(20px,2.2vw,28px); line-height:1; }
.spec-label{ font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-top:7px; }

/* ===== model page (redesigned: photo, specs, collage, embedded quote form) ===== */
.model-head{ padding:calc(96px + clamp(22px,3vw,40px)) 0 clamp(30px,4vw,48px); }
.model-head h1{ max-width:none; }
.model-page{ padding-top:clamp(34px,5vw,54px); }
.model-lead{ margin:0 auto clamp(22px,3vw,32px); max-width:900px; }
.model-lead img{ width:100%; display:block; border-radius:var(--r-lg); border:1px solid var(--line-soft); box-shadow:0 12px 36px rgba(19,42,28,.12); }
.model-specs{ display:flex; flex-wrap:wrap; max-width:900px; margin:0 auto clamp(28px,4vw,40px); border:1px solid var(--line-soft); border-radius:var(--r-lg); background:var(--bg-2); overflow:hidden; }
.model-spec{ flex:1 1 130px; text-align:center; padding:16px 12px; border-right:1px solid var(--line-soft); }
.model-spec:last-child{ border-right:0; }
.model-spec-val{ display:block; font-family:var(--display); font-weight:700; font-size:clamp(17px,2vw,22px); color:var(--green-deep); line-height:1.1; }
.model-spec-label{ display:block; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); margin-top:5px; }
@media (max-width:620px){ .model-spec{ flex-basis:33.33%; border-bottom:1px solid var(--line-soft); } }
.model-collage{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.model-collage .gallery-item img{ aspect-ratio:4/3; }
@media (max-width:500px){ .model-collage{ gap:8px; } }
.model-quote{ margin:clamp(46px,6vw,74px) 0; scroll-margin-top:86px; text-align:center; }
.model-quote h2{ font-size:clamp(27px,3.4vw,40px); line-height:1.1; margin-bottom:10px; }
.model-quote-sub{ color:var(--ink-soft); font-size:17px; max-width:46ch; margin:0 auto 26px; }
.ghl-embed{ max-width:760px; margin:0 auto; background:#fff; border:1px solid var(--line-soft); border-radius:16px; box-shadow:0 12px 40px rgba(19,42,28,.08); overflow:hidden; }
.ghl-embed iframe{ display:block; width:100%; min-height:640px; }
.model-cta{ text-align:center; margin:clamp(28px,4vw,42px) 0; }

/* areas we serve (markets page) */
.areas-section{ text-align:left; max-width:var(--maxw); margin-left:auto; margin-right:auto; }
.areas-grid{ display:grid; grid-template-columns:repeat(5, 1fr); gap:28px 24px; margin-top:26px; }
.area-state h3{ font-family:var(--display); font-size:19px; color:var(--green-deep); margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--line-soft); }
.area-state h3 a{ color:inherit; text-decoration:none; }
.area-state h3 a:hover{ text-decoration:underline; text-underline-offset:3px; }
.area-state ul{ list-style:none; display:flex; flex-direction:column; gap:8px; }
.area-state li{ font-size:14.5px; color:var(--ink-mute); }
.area-state li a{ color:var(--ink); text-decoration:none; font-weight:500; border-bottom:1px solid transparent; transition:border-color .18s, color .18s; }
.area-state li a:hover{ color:var(--green-deep); border-bottom-color:var(--green); }
@media (max-width:900px){ .areas-grid{ grid-template-columns:repeat(3, 1fr); } }
@media (max-width:560px){ .areas-grid{ grid-template-columns:repeat(2, 1fr); gap:24px 18px; } }

/* lender cards (financing page) */
.lenders-section{ text-align:left; }
.lender-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:24px 0 6px; }
.lender-card{ background:var(--bg-2); border:1px solid var(--line-soft); border-radius:var(--r-lg); padding:28px 28px 30px; display:flex; flex-direction:column; align-items:flex-start; }
.lender-card h3{ font-family:var(--display); font-size:20px; color:var(--green-deep); margin-bottom:10px; }
.lender-card p{ color:var(--ink-soft); font-size:15px; line-height:1.6; margin-bottom:20px; flex:1; }
.lender-note{ color:var(--ink-mute); font-size:14px; margin-top:16px; }
@media (max-width:680px){ .lender-grid{ grid-template-columns:1fr; } }

.checks-2col{ display:block; column-count:2; column-gap:36px; }
.checks-2col li{ break-inside:avoid; -webkit-column-break-inside:avoid; margin-bottom:14px; }
.checks-2col li:last-child{ margin-bottom:0; }
@media (max-width:680px){ .checks-2col{ column-count:1; } }

.model-callout{ background:var(--bg-2); border:1px solid var(--line-soft); border-left:4px solid var(--green);
  border-radius:var(--r-lg); padding:clamp(24px,3vw,34px); margin:0 auto clamp(44px,6vw,68px); max-width:820px; }
.model-callout h3{ font-family:var(--display); font-size:clamp(19px,2vw,24px); margin-bottom:10px; color:var(--green-deep); }
.model-callout p{ color:var(--ink-soft); line-height:1.65; }

.model-floorplan{ margin:0 0 clamp(44px,6vw,68px); }
.model-floorplan h2{ font-size:clamp(26px,3vw,38px); margin-bottom:22px; }
.floorplan-layout{ display:grid; grid-template-columns:1.35fr 1fr; gap:clamp(26px,3.5vw,44px); align-items:center; }
.floorplan-layout.no-callout{ grid-template-columns:1fr; max-width:820px; }
.floorplan-media img{ width:100%; border-radius:var(--r-lg); border:1px solid var(--line-soft); background:#fff; display:block; }
.floorplan-zoom{ display:block; width:100%; padding:0; margin:0; border:0; background:none; cursor:zoom-in; }
.floorplan-zoom img{ transition:opacity .2s var(--ease); }
.floorplan-zoom:hover img{ opacity:.9; }
.floorplan-enlarge{ display:inline-block; margin-top:12px; font-family:var(--display); font-weight:600; font-size:14px; color:var(--green-deep); text-decoration:none; cursor:zoom-in; }
.floorplan-enlarge::before{ content:"\1F50D  "; }
.floorplan-enlarge:hover{ text-decoration:underline; }
.floorplan-callout{ display:flex; flex-direction:column; gap:20px; }
.fp-point strong{ display:block; font-family:var(--display); font-weight:700; font-size:16.5px; color:var(--green-deep); margin-bottom:4px; }
.fp-point em{ display:block; color:var(--ink-soft); font-size:15px; line-height:1.6; font-style:italic; }
.floorplan-cap{ color:var(--ink-mute); font-size:13.5px; margin-top:16px; font-style:italic; }
@media (max-width:820px){ .floorplan-layout{ grid-template-columns:1fr; gap:26px; } }

/* ============================================================
   MODELS HUB  (/models/)
============================================================ */
.model-hub-hero .row{ display:flex; gap:14px; flex-wrap:wrap; }

/* customization callout */
.custom-callout{
  display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(28px,5vw,64px);
  align-items:center;
  background:var(--bg-2); border:1px solid var(--line-soft);
  border-radius:var(--r-lg); padding:clamp(28px,4vw,52px);
  margin:0 auto clamp(56px,8vw,90px); max-width:1120px;
}
.custom-callout .eyebrow{ display:flex; align-items:center; gap:12px; font-family:var(--display); font-weight:600; font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--green-deep); margin-bottom:16px; }
.custom-callout .eyebrow span{ width:28px; height:2px; border-radius:2px; background:var(--grad); }
.custom-callout h2{ font-size:clamp(24px,3vw,36px); line-height:1.14; margin-bottom:14px; }
.custom-callout p{ color:var(--ink-soft); line-height:1.65; }
.custom-callout-points{ margin-top:0; }
.custom-callout-aside{ display:flex; flex-direction:column; align-items:flex-start; }
.custom-callout-btn{ margin-top:26px; }

/* model rows (alternating photo / detail) */
.model-row{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px);
  align-items:center; margin-bottom:clamp(56px,9vw,110px);
}
.model-row:last-of-type{ margin-bottom:0; }
.model-row.flip .model-row-media{ order:2; }
.model-row-media{ position:relative; }
.model-row-media img{ width:100%; aspect-ratio:4/3.2; object-fit:cover; border-radius:var(--r-lg); box-shadow:0 24px 60px rgba(19,42,28,.16); }
.model-row-badge{
  position:absolute; top:18px; left:18px;
  background:var(--green); color:#fff; font-family:var(--display); font-weight:600; font-size:13px;
  padding:7px 15px; border-radius:999px; box-shadow:0 6px 18px rgba(19,42,28,.22);
}
.model-row-body h2{ font-size:clamp(28px,3.4vw,44px); line-height:1.08; margin-bottom:12px; }
.model-row-tagline{ font-family:var(--display); font-weight:400; font-size:clamp(17px,1.8vw,20px); color:var(--green-deep); margin-bottom:14px; line-height:1.4; }
.model-row-body > p{ color:var(--ink-soft); line-height:1.65; margin-bottom:22px; }

/* mini spec chips */
.model-mini-specs{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; }
.model-mini-specs li{ display:flex; flex-direction:column; gap:3px; background:var(--bg-2); border:1px solid var(--line-soft); border-radius:var(--r-md); padding:12px 16px; min-width:94px; }
.mini-val{ font-family:var(--display); font-weight:600; font-size:18px; color:var(--ink); line-height:1; }
.mini-label{ font-size:11.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-mute); }

.model-row-features{ margin-bottom:26px; }
.model-row .row{ display:flex; gap:14px; flex-wrap:wrap; }

/* comparison table */
.compare{ max-width:980px; margin:clamp(24px,4vw,48px) auto 0; }
.compare > h2{ font-size:clamp(26px,3vw,38px); line-height:1.12; margin-bottom:26px; text-align:center; }
.compare-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:var(--r-lg); border:1px solid var(--line-soft); box-shadow:0 18px 46px rgba(19,42,28,.08); }
.compare-table{ width:100%; border-collapse:collapse; min-width:640px; background:#fff; }
.compare-table th, .compare-table td{ padding:15px 18px; text-align:left; border-bottom:1px solid var(--line-soft); font-size:15px; }
.compare-table thead th{ background:var(--pine); color:#fff; font-family:var(--display); font-weight:600; font-size:16px; }
.compare-table thead th:first-child{ background:var(--pine-2); }
.compare-table tbody th{ font-family:var(--display); font-weight:600; color:var(--ink); background:var(--bg-2); white-space:nowrap; }
.compare-table tbody td{ color:var(--ink-soft); }
.compare-table tbody tr:last-child th, .compare-table tbody tr:last-child td{ border-bottom:none; }

@media (max-width: 860px){
  .custom-callout{ grid-template-columns:1fr; }
  .model-row{ grid-template-columns:1fr; gap:26px; }
  .model-row.flip .model-row-media{ order:0; }
}
