/* Segura's Painting — 2026 redesign.
   Warm white backgrounds, charcoal text, brand green for actions and details.
   Headings use Fraunces (self-hosted); body text uses each device's system font. */

@font-face {
  font-family:"Fraunces";
  src:url("/assets/fonts/fraunces-latin.woff2") format("woff2");
  font-weight:300 700;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  --bg:#faf8f3;
  --surface:#fff;
  --sand:#f2eee5;
  --sand-2:#e8e2d5;
  --ink:#1d2320;
  --ink-soft:#363d39;
  --muted:#5a625d;
  --line:#e3ddd1;
  --line-strong:#cbc3b3;
  --field-border:#858a82;
  --green:#7ed957;
  --green-hover:#93e270;
  --green-deep:#2c6434;
  --green-tint:#e9f5e1;
  --charcoal:#1b201d;
  --charcoal-2:#262c28;
  --on-dark:#f4f1ea;
  --on-dark-muted:#b9beb7;
  --star:#d89a13;
  --error:#a11b1b;
  --display:"Fraunces","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --max:1320px;
  --gutter:clamp(20px,4vw,48px);
  --section:clamp(76px,5vw + 48px,136px);
  --radius-sm:10px;
  --radius:16px;
  --radius-lg:24px;
  --shadow-sm:0 1px 2px #1d23200d,0 6px 16px -8px #1d232014;
  --shadow-md:0 2px 4px #1d23200a,0 22px 44px -22px #1d232040;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- Base ---------- */
*,*::before,*::after {box-sizing:border-box}
[hidden] {display:none!important}

html {
  scroll-padding-top:96px;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
@media (prefers-reduced-motion:no-preference) {
  html {scroll-behavior:smooth}
}

body {
  margin:0;
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.65;
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,p,figure,blockquote {margin:0}
h1,h2,h3 {
  font-family:var(--display);
  font-weight:420;
  font-optical-sizing:auto;
  color:var(--ink);
  text-wrap:balance;
}
h1 {
  font-size:clamp(2.6rem,1.5rem + 4.6vw,5.4rem);
  line-height:1.02;
  letter-spacing:-.028em;
}
h2 {
  font-size:clamp(2.05rem,1.45rem + 2.5vw,3.55rem);
  line-height:1.07;
  letter-spacing:-.022em;
}
h3 {
  font-size:clamp(1.22rem,1.1rem + .4vw,1.45rem);
  line-height:1.25;
  font-weight:480;
  letter-spacing:-.01em;
}
p {text-wrap:pretty}

img,svg {display:block;max-width:100%}
img {height:auto}
a svg,button svg,li svg,.contact-list svg {display:inline-block;flex-shrink:0}

a {color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover {text-decoration-thickness:2px}

button,input,select,textarea {font:inherit;color:inherit}
button {cursor:pointer}
button,a,input,select,textarea,summary {-webkit-tap-highlight-color:transparent}

::selection {background:var(--green);color:var(--ink)}

/* Two-colour focus ring: visible on light, dark and photographic backgrounds. */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--ink);
  outline-offset:3px;
  box-shadow:0 0 0 3px #fff;
}
.dark a:focus-visible,.dark button:focus-visible,.dark summary:focus-visible,
.site-footer a:focus-visible,.estimate-banner a:focus-visible,.lightbox button:focus-visible {
  outline-color:var(--green);
  box-shadow:0 0 0 3px var(--charcoal);
}
:where(a,button,input,select,textarea,summary,[tabindex]) {scroll-margin-block:120px 100px}

.skip-link {
  position:fixed;
  top:-100px;
  left:16px;
  z-index:200;
  padding:12px 20px;
  background:var(--surface);
  color:var(--ink);
  border:2px solid var(--ink);
  border-radius:999px;
  font-weight:600;
  text-decoration:none;
}
.skip-link:focus {top:12px}

.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.js-only {display:none}
.js .js-only {display:block}
.nojs-only {display:block}
.js .nojs-only {display:none}

.wrap {
  width:100%;
  max-width:calc(var(--max) + var(--gutter)*2);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* ---------- Shared text pieces ---------- */
.eyebrow,.service-title,.panel-title {
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px;
  font-family:var(--sans);
  font-size:.78rem;
  font-weight:650;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--green-deep);
}
.eyebrow::before,.service-title::before {
  content:"";
  width:28px;
  height:2px;
  border-radius:2px;
  background:var(--green);
}
.dark .eyebrow,.estimate-banner .eyebrow {color:var(--green)}

.lead {
  font-size:clamp(1.08rem,1rem + .3vw,1.22rem);
  line-height:1.6;
  color:var(--muted);
  max-width:62ch;
}
.dark .lead {color:var(--on-dark-muted)}

.actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}

/* ---------- Buttons & links ---------- */
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:52px;
  padding:14px 26px;
  border:1.5px solid var(--green);
  border-radius:999px;
  background:var(--green);
  color:var(--ink);
  font-family:var(--sans);
  font-size:.98rem;
  font-weight:650;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  white-space:nowrap;
  transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
}
.button:hover {
  background:var(--green-hover);
  border-color:var(--green-hover);
  box-shadow:0 10px 24px -12px #2c643480;
  transform:translateY(-1px);
}
.button:active {transform:translateY(0)}
.button svg {transition:transform .25s var(--ease)}
.button:hover svg {transform:translateX(3px)}
.button.outline {
  background:transparent;
  border-color:var(--line-strong);
  color:var(--ink);
}
.button.outline:hover {
  background:var(--surface);
  border-color:var(--ink);
  box-shadow:none;
}
.dark .button.outline {border-color:#ffffff40;color:var(--on-dark)}
.dark .button.outline:hover {background:#ffffff12;border-color:var(--on-dark)}
.button.small {min-height:44px;padding:10px 20px;font-size:.92rem}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  color:var(--green-deep);
  font-weight:650;
  text-decoration:underline;
  text-decoration-color:transparent;
  text-underline-offset:.3em;
  transition:text-decoration-color .2s var(--ease),color .2s var(--ease);
}
.text-link:hover {text-decoration-color:currentColor}
.text-link svg {transition:transform .25s var(--ease)}
.text-link:hover svg {transform:translateX(3px)}
.dark .text-link,.site-footer .text-link {color:var(--green)}

/* ---------- Top line & header ---------- */
.topline {
  background:var(--charcoal);
  color:var(--on-dark-muted);
  font-size:.82rem;
}
.topline .wrap {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:38px;
}
.topline a {
  display:inline-flex;
  align-items:center;
  min-height:32px;
  color:var(--on-dark);
  font-weight:600;
  text-decoration:none;
}
.topline a:hover {text-decoration:underline}

.site-header {
  position:sticky;
  top:0;
  z-index:60;
  background:#faf8f3eb;
  border-bottom:1px solid transparent;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease);
}
@supports (backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px)) {
  .site-header {
    background:#faf8f3cc;
    -webkit-backdrop-filter:saturate(1.4) blur(14px);
    backdrop-filter:saturate(1.4) blur(14px);
  }
}
.site-header[data-scrolled="true"] {
  border-bottom-color:var(--line);
  box-shadow:0 8px 24px -20px #1d232060;
}
.nav-wrap {
  display:flex;
  align-items:center;
  gap:24px;
  min-height:78px;
}
.brand {
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-right:auto;
  text-decoration:none;
  color:inherit;
  min-height:44px;
}
.brand img {
  width:46px;
  height:46px;
  border-radius:10px;
  flex-shrink:0;
}
.brand > span {display:flex;flex-direction:column;line-height:1.2}
.brand-name {
  font-family:var(--display);
  font-size:1.2rem;
  font-weight:520;
  letter-spacing:-.01em;
}
.brand-location {font-size:.76rem;color:var(--muted);margin-top:2px}

.desktop-nav ul {
  display:flex;
  align-items:center;
  gap:6px;
  margin:0;
  padding:0;
  list-style:none;
}
.desktop-nav a {
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 14px;
  font-size:.96rem;
  font-weight:550;
  text-decoration:none;
  white-space:nowrap;
  color:var(--ink-soft);
  transition:color .2s var(--ease);
}
.desktop-nav a::after {
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:8px;
  height:2px;
  border-radius:2px;
  background:var(--green);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .3s var(--ease);
}
.desktop-nav a:hover {color:var(--ink)}
.desktop-nav a:hover::after,.desktop-nav a[aria-current="page"]::after {transform:scaleX(1)}

.language-switch {
  display:inline-flex;
  padding:3px;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:var(--surface);
}
.language-switch a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  min-height:36px;
  padding:0 10px;
  border-radius:999px;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.04em;
  text-decoration:none;
  color:var(--muted);
}
.language-switch a:hover {color:var(--ink)}
.language-switch a[aria-current="true"] {background:var(--ink);color:#fff}

.menu-toggle {
  display:none;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  padding:0;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:var(--surface);
  color:var(--ink);
}
.menu-toggle[aria-expanded="true"] {background:var(--ink);color:#fff;border-color:var(--ink)}

.mobile-nav {display:none}
.nojs-nav {display:none}

/* ---------- Sections ---------- */
.section {padding-block:var(--section)}
.paper {background:var(--sand)}
.dark {background:var(--charcoal);color:var(--on-dark)}
.dark h1,.dark h2,.dark h3 {color:#fff}

.section-top {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px 48px;
  margin-bottom:clamp(36px,4vw,64px);
}
.section-top > div {max-width:760px}
.section-top h2 + .lead {margin-top:20px}
.section-top > .text-link {flex-shrink:0}

/* Numbered statements on the homepage */
.home-numbered {
  display:grid;
  grid-template-columns:minmax(80px,180px) 1fr;
  gap:24px clamp(24px,4vw,64px);
  align-items:start;
}
.home-section-number {
  font-family:var(--display);
  font-size:clamp(3rem,2rem + 3vw,5rem);
  font-weight:300;
  line-height:.9;
  letter-spacing:-.04em;
  color:var(--green-deep);
}
.home-numbered .section-top {margin-bottom:0}
.home-statement h2 {max-width:18ch}
.home-statement .lead {margin-top:24px}
.home-why .home-numbered {margin-bottom:clamp(36px,4vw,64px)}
.home-types .home-numbered .lead {margin-top:20px}

/* ---------- Homepage hero (light, editorial) ---------- */
.signature-hero {
  padding-top:clamp(40px,3vw + 28px,96px);
  padding-bottom:clamp(56px,6vw,96px);
}
.signature-hero-content {
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);
  gap:28px clamp(32px,5vw,96px);
  align-items:end;
}
.signature-hero h1 {font-weight:400}
.signature-hero h1 .line {display:block}
.hero-aside {padding-bottom:6px}
.hero-aside .lead {margin-bottom:28px}
.hero-aside .signature-work-link {margin-top:8px}
.signature-work-link svg {transform:rotate(90deg)}
.signature-work-link:hover svg {transform:rotate(90deg) translateX(3px)}

.hero-media {margin-top:clamp(36px,4vw,64px)}
.signature-hero-photo {
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--sand-2);
  aspect-ratio:16/8.4;
}
.signature-hero-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 62%;
}
.hero-review-badge,.signature-photo-credit {
  position:absolute;
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:44px;
  padding:10px 18px;
  border-radius:999px;
  background:#fffffff0;
  color:var(--ink);
  font-size:.86rem;
  font-weight:600;
  text-decoration:none;
  box-shadow:var(--shadow-sm);
  transition:transform .25s var(--ease),background-color .25s var(--ease);
}
.hero-review-badge:hover,.signature-photo-credit:hover {transform:translateY(-2px);background:#fff}
.hero-review-badge {left:20px;top:20px}
.signature-photo-credit {right:20px;bottom:20px}
.hero-review-stars {display:inline-flex;gap:1px;color:var(--star)}

.proof-list {
  display:flex;
  flex-wrap:wrap;
  gap:10px 28px;
  margin:0;
  padding:0;
  list-style:none;
}
.proof-list li {
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:.95rem;
  font-weight:550;
  color:var(--ink-soft);
}
.proof-list svg {
  width:22px;
  height:22px;
  padding:4px;
  border-radius:50%;
  background:var(--green);
  color:var(--ink);
  stroke-width:2.4;
}
.hero-media .proof-list {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin-top:28px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.hero-media .proof-list li {
  justify-content:center;
  padding:20px 12px;
}
.hero-media .proof-list li + li {border-left:1px solid var(--line)}

/* ---------- Moving service ribbon (pausable) ---------- */
.motion-band {
  display:flex;
  align-items:stretch;
  background:var(--surface);
  border-block:1px solid var(--line);
  color:var(--ink);
}
.motion-window {
  flex:1;
  min-width:0;
  overflow-x:auto;
  scrollbar-width:thin;
}
.motion-track {display:flex;width:max-content}
.motion-group {
  display:flex;
  align-items:center;
  justify-content:space-around;
  flex-shrink:0;
  min-width:100vw;
  gap:30px;
  padding:20px 30px 20px 0;
  font-family:var(--display);
  font-size:1.18rem;
  font-weight:400;
  letter-spacing:-.005em;
  white-space:nowrap;
}
.motion-dot {color:var(--green-deep);font-size:.8rem}
.motion-copy {display:none}
.motion-band[data-motion-enabled="true"] .motion-window {overflow:hidden}
.motion-band[data-motion-enabled="true"] .motion-copy {display:block}
.motion-band[data-motion-enabled="true"] .motion-track {animation:service-drift 60s linear infinite}
.motion-band[data-paused="true"] .motion-track,
.motion-band[data-frozen="true"] .motion-track {animation-play-state:paused}
.motion-toggle {
  flex-shrink:0;
  min-height:56px;
  min-width:132px;
  padding:12px 20px;
  border:0;
  border-left:1px solid var(--line);
  background:var(--surface);
  color:var(--ink-soft);
  font-size:.78rem;
  font-weight:650;
}
.motion-toggle:hover:not(:disabled) {background:var(--sand);color:var(--ink)}
.motion-toggle:focus-visible {outline-offset:-5px;box-shadow:none}
.motion-toggle:disabled {cursor:default;color:var(--muted)}
@keyframes service-drift {
  from {transform:translateX(-50%)}
  to {transform:translateX(0)}
}

/* ---------- Service cards ---------- */
.service-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}
.service-card {
  position:relative;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  color:inherit;
  text-decoration:none;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
}
a.service-card:hover {
  transform:translateY(-4px);
  border-color:var(--line-strong);
  box-shadow:var(--shadow-md);
}
.service-card-copy {
  position:relative;
  display:flex;
  flex-direction:column;
  flex:1;
  padding:30px 28px 22px;
}
.service-card .number {
  position:absolute;
  top:28px;
  right:28px;
  font-family:var(--display);
  font-size:.95rem;
  color:var(--muted);
}
.service-card .icon {
  width:52px;
  height:52px;
  padding:12px;
  margin-bottom:26px;
  border-radius:50%;
  background:var(--green-tint);
  color:var(--green-deep);
  transition:background-color .35s var(--ease),color .35s var(--ease);
}
a.service-card:hover .icon {background:var(--green);color:var(--ink)}
.service-card-title {margin-bottom:10px;padding-right:28px}
.service-card-description {color:var(--muted);font-size:.98rem;margin-bottom:18px}
.service-card .text-link {margin-top:auto;min-height:32px}
.service-card-image {
  display:block;
  overflow:hidden;
  aspect-ratio:4/3;
  background:var(--sand-2);
}
.service-card-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease);
}
a.service-card:hover .service-card-image img {transform:scale(1.045)}
.service-card.has-photo .icon {display:none}
.service-card.has-photo .number {
  top:auto;
  bottom:auto;
  position:static;
  margin-bottom:10px;
  font-size:.9rem;
}
.service-card-wide {
  justify-content:space-between;
  gap:24px;
  padding:30px 28px;
  border-color:var(--charcoal);
  background:var(--charcoal);
  color:var(--on-dark);
}
.service-card-wide h3 {color:#fff;margin-bottom:10px}
.service-card-wide p {color:var(--on-dark-muted)}
.service-card-wide .icon {
  width:52px;
  height:52px;
  padding:12px;
  margin:0;
  border-radius:50%;
  background:var(--green);
  color:var(--ink);
}
.service-card-wide .button {align-self:flex-start}
.service-card-wide .button:focus-visible {outline-color:var(--green);box-shadow:0 0 0 3px var(--charcoal)}

/* ---------- Feature grid (why choose us) ---------- */
.feature-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(24px,3vw,44px);
  counter-reset:feature;
}
.feature-grid article {
  padding-top:26px;
  border-top:1px solid var(--line-strong);
  counter-increment:feature;
}
.feature-grid article::before {
  content:counter(feature,decimal-leading-zero);
  display:block;
  margin-bottom:22px;
  font-family:var(--display);
  font-size:1rem;
  color:var(--green-deep);
}
.feature-grid h3 {margin-bottom:12px}
.feature-grid p {color:var(--muted)}
.dark .feature-grid article {border-top-color:#ffffff2e}
.dark .feature-grid article::before {color:var(--green)}
.dark .feature-grid p {color:var(--on-dark-muted)}

/* ---------- Project types rail ---------- */
.home-types .wrap {position:relative}
.rail-controls {
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin:-8px 0 22px;
}
.rail-controls button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  padding:0;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:var(--surface);
  color:var(--ink);
  transition:background-color .2s var(--ease),border-color .2s var(--ease);
}
.rail-controls button:hover:not(:disabled) {border-color:var(--ink)}
.rail-controls button:disabled {opacity:.4;cursor:default}
.rail-controls .rail-motion-toggle {
  width:auto;
  padding:0 20px;
  margin-right:auto;
  font-size:.8rem;
  font-weight:650;
}
.reverse-arrow {transform:rotate(180deg)}
.project-types-rail {
  display:flex;
  gap:20px;
  overflow-x:auto;
  padding:4px 4px 22px;
  margin:-4px -4px 0;
  scroll-snap-type:x proximity;
  scroll-padding-inline:4px;
  scrollbar-width:thin;
  scrollbar-color:var(--line-strong) transparent;
}
.home-types[data-rail-running="true"] .project-types-rail {scroll-snap-type:none;scroll-behavior:auto}
.type-item {
  display:flex;
  flex-direction:column;
  flex:0 0 clamp(260px,26vw,320px);
  min-height:280px;
  padding:30px 28px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  color:inherit;
  text-decoration:none;
  scroll-snap-align:start;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
}
.type-item:hover {transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--line-strong)}
.type-num {
  margin-bottom:40px;
  font-family:var(--display);
  font-size:2.4rem;
  font-weight:300;
  line-height:1;
  color:var(--green-deep);
}
.type-item h3 {margin-bottom:10px}
.type-item p {color:var(--muted);font-size:.97rem;margin-bottom:18px}
.type-item svg {margin-top:auto;color:var(--green-deep);transition:transform .25s var(--ease)}
.type-item:hover svg {transform:translateX(4px)}

/* ---------- Luxury feature (dark) ---------- */
.luxury-feature-grid {
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:clamp(40px,6vw,104px);
  align-items:center;
}
.luxury-feature-images {position:relative;padding-bottom:64px}
.luxury-feature-images figure {position:relative;overflow:hidden;border-radius:var(--radius)}
.luxury-feature-images img {width:100%;height:100%;object-fit:cover}
.luxury-feature-main {aspect-ratio:4/3}
.luxury-feature-images .luxury-feature-detail {
  position:absolute;
  right:-24px;
  bottom:0;
  width:38%;
  aspect-ratio:3/4;
  border:6px solid var(--charcoal);
  border-radius:calc(var(--radius) + 6px)!important;
}
.luxury-feature-images figcaption,.craft-grid figcaption {
  position:absolute;
  left:12px;
  bottom:12px;
  padding:6px 12px;
  border-radius:999px;
  background:#1b201dd9;
  color:var(--on-dark);
  font-size:.76rem;
  font-weight:600;
}
.luxury-feature-copy h2 {margin-bottom:22px}
.luxury-feature-copy .lead {margin-bottom:28px}
.luxury-points {
  display:grid;
  gap:14px;
  margin:0 0 36px;
  padding:0;
  list-style:none;
}
.luxury-points li {display:flex;align-items:center;gap:12px;color:var(--on-dark)}
.luxury-points svg {
  width:24px;
  height:24px;
  padding:4px;
  border-radius:50%;
  background:var(--green);
  color:var(--ink);
  stroke-width:2.4;
}

/* ---------- Project gallery ---------- */
.project-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(24px,3vw,40px) 24px;
}
.project-grid.natural-gallery {
  display:block;
  columns:3;
  column-gap:24px;
}
.natural-gallery .project-card {
  break-inside:avoid;
  margin-bottom:clamp(28px,3vw,44px);
}
.project-card {display:flex;flex-direction:column}
.project-card[hidden] {display:none!important}
.project-photo {
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:var(--radius);
  background:var(--sand-2);
}
.project-grid:not(.natural-gallery) .project-photo {aspect-ratio:4/3}
.project-grid:not(.natural-gallery) .project-photo img {width:100%;height:100%;object-fit:cover}
.project-photo img {
  width:100%;
  transition:transform .9s var(--ease),filter .6s var(--ease);
}
.project-photo:hover img {transform:scale(1.04)}
.photo-open {
  position:absolute;
  right:14px;
  bottom:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:50%;
  background:#fffffff0;
  color:var(--ink);
  box-shadow:var(--shadow-sm);
  opacity:0;
  transform:translateY(6px);
  transition:opacity .3s var(--ease),transform .3s var(--ease);
}
.project-photo:hover .photo-open,.project-photo:focus-visible .photo-open {opacity:1;transform:none}
@media (hover:none) {.photo-open {opacity:1;transform:none}}
.project-copy {padding-top:18px}
.project-category {
  margin-bottom:6px;
  font-size:.76rem;
  font-weight:650;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--green-deep);
}
.project-copy h3 {margin-bottom:8px}
.project-desc {color:var(--muted);font-size:.97rem}
.project-copy .text-link {min-height:40px;margin-top:4px}
.photo-note {margin-top:28px;color:var(--muted);font-size:.92rem}

.filter-bar {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.filter-button {
  min-height:44px;
  padding:8px 18px;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:var(--surface);
  color:var(--ink-soft);
  font-size:.9rem;
  font-weight:600;
  transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease);
}
.filter-button:hover {border-color:var(--ink);color:var(--ink)}
.filter-button[aria-pressed="true"] {background:var(--ink);border-color:var(--ink);color:#fff}
.filter-count {margin:16px 0 32px;color:var(--muted);font-size:.9rem}
#portfolio .js-only {margin-bottom:8px}

/* ---------- Reviews ---------- */
.review-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
  margin:0;
  padding:0;
  list-style:none;
}
.review-card {
  display:flex;
  flex-direction:column;
  padding:clamp(28px,3vw,40px);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.review-card:hover {transform:translateY(-3px);box-shadow:var(--shadow-md)}
.review-card figure {display:flex;flex-direction:column;height:100%}
.review-stars {display:flex;gap:3px;margin-bottom:22px;color:var(--star)}
.review-card blockquote {flex:1;margin-bottom:28px}
.review-card blockquote p {
  font-family:var(--display);
  font-size:clamp(1.12rem,1.02rem + .35vw,1.3rem);
  font-weight:380;
  line-height:1.5;
  letter-spacing:-.005em;
  color:var(--ink);
}
.review-card figcaption {
  display:flex;
  align-items:center;
  gap:14px;
  padding-top:22px;
  border-top:1px solid var(--line);
}
.review-avatar {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:46px;
  height:46px;
  border-radius:50%;
  background:var(--green-tint);
  color:var(--green-deep);
  font-family:var(--display);
  font-size:1.2rem;
  font-weight:500;
}
.review-card figcaption strong {display:block;font-weight:650}
.review-meta {display:block;font-size:.86rem;color:var(--muted)}
.review-note {margin-top:24px;color:var(--muted);font-size:.9rem}
.google-g {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:50%;
  background:var(--surface);
  border:1px solid var(--line);
  font-family:var(--sans);
  font-weight:800;
  font-size:.85rem;
  color:#4285f4;
}

/* ---------- Before & after ---------- */
.compare-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(28px,3vw,44px) 24px;
}
.compare-list > :only-child {grid-column:1/-1}
.compare-frame {
  --pos:50%;
  position:relative;
  overflow:hidden;
  border-radius:var(--radius);
  background:var(--sand-2);
  aspect-ratio:4/3;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
}
.compare-list > :only-child .compare-frame {aspect-ratio:16/9;max-height:78vh;width:100%}
.compare-frame img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
}
.compare-after {
  position:absolute;
  inset:0;
  clip-path:inset(0 0 0 var(--pos));
}
.compare-label {
  position:absolute;
  top:16px;
  z-index:2;
  padding:6px 12px;
  border-radius:999px;
  background:#1b201dd0;
  color:#fff;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  pointer-events:none;
}
.compare-label-before {left:16px}
.compare-label-after {right:16px;background:var(--green);color:var(--ink)}
.compare-divider {
  position:absolute;
  top:0;
  bottom:0;
  left:var(--pos);
  z-index:3;
  width:2px;
  margin-left:-1px;
  background:#fff;
  box-shadow:0 0 12px #0004;
  pointer-events:none;
}
.compare-handle {
  position:absolute;
  top:50%;
  left:var(--pos);
  z-index:4;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  margin:-26px 0 0 -26px;
  border-radius:50%;
  background:#fff;
  color:var(--ink);
  box-shadow:0 6px 20px #0004;
  cursor:ew-resize;
  touch-action:none;
  transition:transform .2s var(--ease);
}
.compare-frame[data-dragging="true"] .compare-handle,.compare-handle:hover {transform:scale(1.08)}
.compare-frame[data-dragging="true"] {cursor:ew-resize}
.compare figcaption {padding-top:18px}
.compare figcaption h3 {margin-bottom:6px}
.compare figcaption p {color:var(--muted);font-size:.97rem}

/* ---------- Process ---------- */
.process-section h2 {max-width:20ch;margin-bottom:clamp(40px,5vw,72px)}
.process-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(24px,3vw,40px);
  margin:0;
  padding:0;
  list-style:none;
}
.process-grid li {position:relative;padding-top:28px;border-top:1px solid var(--line-strong)}
.process-grid li::before {
  content:"";
  position:absolute;
  top:-1px;
  left:0;
  width:48px;
  height:2px;
  background:var(--green-deep);
}
.step-number {
  display:block;
  margin-bottom:20px;
  font-family:var(--display);
  font-size:clamp(2.6rem,2rem + 1.6vw,3.6rem);
  font-weight:300;
  line-height:1;
  letter-spacing:-.03em;
  color:var(--green-deep);
}
.process-grid h3 {margin-bottom:12px}
.process-grid p {color:var(--muted)}

/* ---------- Team ---------- */
.team-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}
.team-card {
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.team-card img {width:100%;height:100%;min-height:100%;object-fit:cover;aspect-ratio:4/5}
.team-copy {padding:clamp(24px,3vw,36px)}
.team-copy h3 {font-size:clamp(1.4rem,1.2rem + .6vw,1.75rem);margin-bottom:6px}
.team-role {font-weight:650;color:var(--ink-soft);margin-bottom:6px}
.team-detail {
  display:inline-block;
  margin-bottom:16px;
  padding:4px 12px;
  border-radius:999px;
  background:var(--green-tint);
  color:var(--green-deep);
  font-size:.82rem;
  font-weight:650;
}
.team-bio {color:var(--muted);font-size:.96rem;margin-bottom:18px}
.team-contacts {display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.team-contacts a {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:32px;
  color:var(--green-deep);
  font-weight:600;
  font-size:.95rem;
  overflow-wrap:anywhere;
}

/* ---------- FAQ ---------- */
.faq-layout {
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:40px clamp(40px,6vw,104px);
  align-items:start;
}
.faq-heading {position:sticky;top:120px}
.faq-heading h2 {margin-bottom:20px}
.faq-heading p {color:var(--muted);margin-bottom:12px}
.faq-list {border-top:1px solid var(--line-strong)}
.faq-list details {border-bottom:1px solid var(--line-strong)}
.faq-list summary {
  position:relative;
  display:flex;
  align-items:center;
  min-height:76px;
  padding:20px 56px 20px 0;
  font-family:var(--display);
  font-size:clamp(1.12rem,1.04rem + .3vw,1.28rem);
  font-weight:450;
  line-height:1.35;
  list-style:none;
  cursor:pointer;
}
.faq-list summary::-webkit-details-marker {display:none}
.faq-list summary::before,.faq-list summary::after {
  content:"";
  position:absolute;
  right:12px;
  top:50%;
  width:16px;
  height:1.5px;
  background:var(--ink);
  transition:transform .3s var(--ease);
}
.faq-list summary::after {transform:rotate(90deg)}
.faq-list details[open] summary::after {transform:rotate(0)}
.faq-list summary:hover {color:var(--green-deep)}
.faq-list details p {padding:0 56px 26px 0;color:var(--muted)}
.dark .faq-list,.dark .faq-list details {border-color:#ffffff2e}

/* ---------- Estimate banner ---------- */
/* The banner sits between sections; surrounding section padding provides the space.
   Next to a sand section it continues that background or keeps a gap before it. */
.estimate-banner {padding-block:0}
.paper + .estimate-banner {background:var(--sand);padding-bottom:clamp(56px,6vw,96px)}
.estimate-banner:has(+ .paper) {padding-bottom:clamp(56px,6vw,96px)}
.estimate-banner .wrap > * {position:relative}
.estimate-banner .wrap {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px 48px;
  padding-block:clamp(44px,5vw,72px);
  padding-inline:clamp(28px,5vw,72px);
  border-radius:var(--radius-lg);
  background:var(--charcoal);
  color:var(--on-dark);
  max-width:calc(var(--max));
  width:calc(100% - var(--gutter)*2);
  overflow:hidden;
  position:relative;
}
.estimate-banner .wrap::after {
  content:"";
  position:absolute;
  right:-120px;
  top:-160px;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(closest-side,#7ed95733,#7ed95700);
  pointer-events:none;
}
.estimate-banner h2 {color:#fff;margin-bottom:12px;max-width:18ch}
.estimate-banner p {color:var(--on-dark-muted)}

/* ---------- Contact & form ---------- */
.contact-grid {
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:48px clamp(40px,6vw,96px);
  align-items:start;
}
.contact-copy h2 {margin-bottom:20px}
.contact-copy .lead {margin-bottom:32px}
.contact-list {display:grid;gap:12px;margin-bottom:24px}
.contact-list a {
  display:flex;
  align-items:center;
  gap:16px;
  min-height:64px;
  padding:10px 18px 10px 10px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  font-weight:600;
  text-decoration:none;
  overflow-wrap:anywhere;
  transition:border-color .2s var(--ease),transform .25s var(--ease);
}
.contact-list a:hover {border-color:var(--ink);transform:translateX(3px)}
.contact-list svg {
  width:44px;
  height:44px;
  padding:11px;
  border-radius:50%;
  background:var(--green-tint);
  color:var(--green-deep);
}
.contact-small {color:var(--muted);font-size:.93rem}

.estimate-form {
  padding:clamp(26px,4vw,48px);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-sm);
}
.estimate-form h3 {font-size:clamp(1.5rem,1.3rem + .8vw,2rem);margin-bottom:12px}
.form-intro {color:var(--muted);margin-bottom:8px}
.form-required {color:var(--muted);font-size:.88rem;margin-bottom:26px}
.form-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px 18px;
}
.field {display:flex;flex-direction:column;gap:7px;min-width:0}
.field.full {grid-column:1/-1}
.field label {font-size:.9rem;font-weight:650;color:var(--ink-soft)}
.field input,.field select,.field textarea,.request-message {
  width:100%;
  min-height:52px;
  padding:13px 16px;
  border:1px solid var(--field-border);
  border-radius:var(--radius-sm);
  background:var(--bg);
  color:var(--ink);
  font-size:1rem;
  transition:border-color .2s var(--ease),background-color .2s var(--ease),box-shadow .2s var(--ease);
}
.field select {
  appearance:none;
  -webkit-appearance:none;
  padding-right:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231d2320' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
}
.field textarea {min-height:120px;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover {border-color:var(--ink-soft)}
.field input:focus,.field select:focus,.field textarea:focus {background:var(--surface);border-color:var(--green-deep)}
.field small {color:var(--muted);font-size:.84rem;line-height:1.45}
.field [aria-invalid="true"] {border:2px solid var(--error);background:#fff}
.field-error {color:var(--error);font-size:.86rem;font-weight:650;line-height:1.45}
.required-marker {color:var(--error)}
.form-error-summary {
  margin-bottom:24px;
  padding:16px 18px;
  border:2px solid var(--error);
  border-radius:var(--radius-sm);
  background:#fff;
  color:var(--error);
  font-size:.92rem;
}
.form-error-summary p {font-weight:700}
.form-error-summary ul {margin:10px 0 0;padding-left:20px}
.form-error-summary li {padding-block:4px}
.form-error-summary a {color:var(--error)}
.form-actions {display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.form-actions .button {flex:1 1 220px}
.form-privacy {margin-top:18px;color:var(--muted);font-size:.86rem}
.form-privacy a {color:var(--green-deep);font-weight:600}
.request-ready {
  margin-top:24px;
  padding:20px;
  border:1px solid var(--green);
  border-radius:var(--radius);
  background:var(--green-tint);
}
.request-ready:focus {outline:3px solid var(--ink);outline-offset:3px}
.request-ready p {font-weight:600;margin-bottom:12px}
.request-message {min-height:140px;background:#fff;font-size:.92rem;resize:vertical}
.request-ready .actions {margin-top:10px;gap:4px 20px}
.request-copy {
  min-height:44px;
  padding:8px 18px;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:#fff;
  font-weight:650;
  font-size:.9rem;
}
.request-copy:hover {border-color:var(--ink)}
.nojs-only.estimate-form .actions {margin-top:20px}

/* ---------- Service area & hours ---------- */
.service-area-grid {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
  gap:40px clamp(40px,6vw,96px);
  align-items:center;
}
.area-copy h2 {margin-bottom:20px}
.town-list {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:28px 0 0;
  padding:0;
  list-style:none;
}
.town-list li {
  padding:8px 16px;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:var(--surface);
  font-size:.92rem;
  font-weight:600;
}
.hours-card {
  padding:clamp(26px,3vw,40px);
  border-radius:var(--radius-lg);
  background:var(--surface);
  border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
}
.hours-card h3 {margin-bottom:18px}
.hours-row {
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:14px 0;
  border-bottom:1px solid var(--line);
  font-size:.97rem;
}
.hours-row span {color:var(--muted)}
.hours-row strong {font-weight:650;text-align:right}
.hours-card .text-link {margin-top:14px}

/* ---------- Google card (fallback) ---------- */
.google-card {
  display:flex;
  align-items:center;
  gap:24px;
  padding:clamp(24px,3vw,36px);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.google-card > div {flex:1}
.google-card h3 {margin-bottom:6px}
.google-card p {color:var(--muted)}
.google-mark {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  border-radius:50%;
  background:var(--sand);
  font-weight:800;
  font-size:1.4rem;
  color:#4285f4;
}

/* ---------- Inner page heroes ---------- */
.page-hero {padding-block:clamp(36px,4vw,64px) clamp(56px,6vw,96px)}
.breadcrumb {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px 10px;
  margin-bottom:clamp(28px,4vw,52px);
  font-size:.86rem;
  color:var(--muted);
}
.breadcrumb a {
  display:inline-flex;
  align-items:center;
  min-height:32px;
  text-decoration:none;
  color:var(--muted);
}
.breadcrumb a:hover {color:var(--ink);text-decoration:underline}
.breadcrumb a + a::before,.breadcrumb a + span[aria-current]::before {
  content:"/";
  margin-right:10px;
  color:var(--line-strong);
}
.breadcrumb [aria-current] {color:var(--ink);font-weight:600}
.breadcrumb > span[aria-hidden] {color:var(--line-strong)}

.text-hero .wrap > h1 {max-width:18ch}
.text-hero .lead {margin-top:24px}
.text-hero .actions {margin-top:32px}

.hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:40px clamp(40px,5vw,88px);
  align-items:center;
}
.hero-copy h1 {font-size:clamp(2.5rem,1.6rem + 3.4vw,4.4rem)}
.hero-copy .lead {margin-top:24px}
.hero-copy .actions {margin-top:32px}
.hero-copy .proof-list {margin-top:32px;padding-top:24px;border-top:1px solid var(--line)}
.hero-image {position:relative;overflow:hidden;border-radius:var(--radius-lg);aspect-ratio:4/4.4;background:var(--sand-2)}
.hero-image img {width:100%;height:100%;object-fit:cover}
.hero-image figcaption {
  position:absolute;
  left:16px;
  bottom:16px;
  padding:8px 14px;
  border-radius:999px;
  background:#fffffff0;
  font-size:.8rem;
  font-weight:600;
  box-shadow:var(--shadow-sm);
}
.finish-panel {
  position:relative;
  display:flex;
  align-items:flex-end;
  min-height:clamp(340px,40vw,520px);
  padding:clamp(28px,4vw,48px);
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--charcoal);
  color:var(--on-dark);
}
.finish-panel::before {
  content:"";
  position:absolute;
  inset:-40% -30% auto auto;
  width:80%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(closest-side,#7ed95740,#7ed95700);
}
.finish-panel > div {position:relative}
.finish-panel .panel-title {color:var(--green);margin-bottom:14px}
.finish-panel p:not(.panel-title) {
  font-family:var(--display);
  font-size:clamp(1.3rem,1.1rem + .8vw,1.8rem);
  line-height:1.35;
  color:#fff;
  max-width:24ch;
}
.finish-panel .big-icon {
  position:absolute;
  top:clamp(28px,4vw,48px);
  left:clamp(28px,4vw,48px);
  width:72px;
  height:72px;
  padding:16px;
  border-radius:50%;
  background:var(--green);
  color:var(--ink);
}
.finish-swatches {display:flex;gap:8px;margin-top:24px}
.finish-swatches span {width:44px;height:44px;border-radius:50%;border:2px solid #ffffff30}
.finish-swatches span:nth-child(1) {background:#efe9dc}
.finish-swatches span:nth-child(2) {background:#c9c1ae}
.finish-swatches span:nth-child(3) {background:var(--green)}

/* "On this page" links on service pages */
.page-sections {
  position:relative;
  border-bottom:1px solid var(--line);
  background:var(--bg);
}
.page-sections .wrap {
  display:flex;
  align-items:center;
  gap:6px;
  min-height:60px;
  overflow-x:auto;
  scrollbar-width:none;
}
.page-sections .wrap::-webkit-scrollbar {display:none}
.page-sections span {
  flex-shrink:0;
  margin-right:12px;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
.page-sections a {
  display:inline-flex;
  align-items:center;
  flex-shrink:0;
  min-height:40px;
  padding:0 14px;
  border-radius:999px;
  font-size:.9rem;
  font-weight:600;
  text-decoration:none;
  color:var(--ink-soft);
  white-space:nowrap;
}
.page-sections a:hover {background:var(--sand);color:var(--ink)}

/* Service scope */
.scope-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}
.scope-card {
  padding:clamp(26px,3vw,36px);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  transition:border-color .3s var(--ease);
}
.scope-card:hover {border-color:var(--line-strong)}
.scope-card h3 {display:flex;align-items:center;gap:12px;margin-bottom:12px}
.scope-card h3::before {
  content:"";
  flex-shrink:0;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--green);
}
.scope-card p {color:var(--muted)}
.service-note {
  margin-top:28px;
  padding:20px 24px;
  border-left:3px solid var(--green);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  background:var(--sand);
  color:var(--ink-soft);
}
.service-group + .service-group {padding-top:0}

/* ---------- Custom homes page ---------- */
.luxury-hero {padding-block:clamp(36px,4vw,64px) clamp(56px,6vw,96px)}
.luxury-hero-copy {
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:28px clamp(32px,5vw,96px);
  align-items:end;
}
.luxury-hero h1 span {display:block}
.luxury-hero-copy .lead {margin-bottom:28px}
.luxury-panorama {
  position:relative;
  width:calc(100% - var(--gutter)*2);
  max-width:var(--max);
  margin:clamp(36px,4vw,64px) auto 0;
  overflow:hidden;
  border-radius:var(--radius-lg);
  aspect-ratio:16/8;
  background:var(--sand-2);
}
.luxury-panorama img {width:100%;height:100%;object-fit:cover}
.luxury-panorama figcaption {
  position:absolute;
  left:16px;
  right:16px;
  bottom:16px;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:8px 16px;
  font-size:.8rem;
  font-weight:600;
}
.luxury-panorama figcaption > * {
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:6px 14px;
  border-radius:999px;
  background:#fffffff0;
  color:var(--ink);
}
.luxury-hero .proof-list {margin-top:28px}

.builder-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(28px,3vw,44px) 24px;
}
.builder-card {
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.builder-card .project-photo {border-radius:0;aspect-ratio:3/2}
.builder-card .project-photo img {width:100%;height:100%;object-fit:cover}
.builder-card-copy {display:flex;flex-direction:column;flex:1;padding:clamp(22px,3vw,32px)}
.builder-card-heading {display:flex;justify-content:space-between;gap:16px;margin-bottom:18px}
.builder-byline {font-size:.8rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.builder-number {font-family:var(--display);font-size:2rem;font-weight:300;line-height:1;color:var(--green-deep)}
.builder-scope {
  display:grid;
  gap:2px;
  padding:14px 16px;
  margin-bottom:16px;
  border-radius:var(--radius-sm);
  background:var(--sand);
}
.builder-scope p {font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.builder-scope span {color:var(--muted);font-size:.93rem}
.project-award {
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-bottom:12px;
  font-weight:650;
  font-size:.95rem;
}
.project-award > span:first-child {color:var(--star)}
.project-award small {display:block;font-weight:500;color:var(--muted);font-size:.8rem}
.builder-card .text-link {margin-top:auto}

.craft-grid {
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.8fr) minmax(0,.7fr);
  gap:24px;
  align-items:end;
}
.craft-grid > div {align-self:center;padding-right:clamp(0px,3vw,40px)}
.craft-grid h2 {margin-bottom:20px}
.craft-grid .lead {margin-bottom:20px}
.craft-grid figure {position:relative;overflow:hidden;border-radius:var(--radius)}
.craft-grid figure img {width:100%;aspect-ratio:3/4;object-fit:cover}
.craft-grid figure:last-child {margin-bottom:56px}

/* ---------- Policy & simple pages ---------- */
.prose > * {max-width:760px}
.prose h2 {font-size:clamp(1.5rem,1.3rem + .8vw,2rem);margin:44px 0 14px}
.prose p {color:var(--ink-soft);margin-bottom:14px}
.prose a {color:var(--green-deep);font-weight:600}
.policy-updated {color:var(--muted);font-size:.9rem;margin-bottom:24px}
.policy-related {margin-top:44px;padding-top:24px;border-top:1px solid var(--line)}
.policy-related ul {display:flex;flex-wrap:wrap;gap:8px 28px;margin:0;padding:0;list-style:none}
.policy-related a {display:inline-flex;align-items:center;min-height:44px}

.not-found {padding-block:clamp(80px,12vw,160px)}
.not-found h1 {max-width:14ch;margin-bottom:24px}
.not-found .actions {margin-top:36px}

/* ---------- Footer ---------- */
.site-footer {
  padding-block:clamp(64px,7vw,104px) 32px;
  background:var(--charcoal);
  color:var(--on-dark-muted);
  font-size:.95rem;
}
.footer-grid {
  display:grid;
  grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));
  gap:40px clamp(28px,4vw,64px);
  padding-bottom:clamp(40px,5vw,64px);
  border-bottom:1px solid #ffffff1f;
}
.footer-brand .brand {margin-bottom:20px;color:#fff}
.footer-brand .brand-location {color:var(--on-dark-muted)}
.footer-brand p {max-width:36ch}
.site-footer h2 {
  margin-bottom:16px;
  font-family:var(--sans);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--green);
}
.site-footer ul {margin:0;padding:0;list-style:none}
.footer-col a,.footer-bottom a {
  display:inline-flex;
  align-items:center;
  min-height:32px;
  color:var(--on-dark);
  text-decoration:none;
  overflow-wrap:anywhere;
}
.footer-col a:hover,.footer-bottom a:hover {color:#fff;text-decoration:underline}
.social-heading {margin-top:28px}
.social-links {display:flex;flex-wrap:wrap;gap:0 16px}
.footer-bottom {
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:8px 24px;
  padding-top:24px;
  font-size:.86rem;
}

/* ---------- Mobile quick contact ---------- */
.mobile-contact {display:none}

/* ---------- Lightbox ---------- */
.lightbox {
  width:min(1120px,calc(100vw - 32px));
  max-width:none;
  max-height:calc(100dvh - 32px);
  padding:0;
  border:0;
  border-radius:var(--radius-lg);
  background:var(--charcoal);
  color:var(--on-dark);
  overflow:auto;
}
.lightbox::backdrop {background:#0f1210e0}
@supports (backdrop-filter:blur(6px)) {.lightbox::backdrop {backdrop-filter:blur(6px)}}
.lightbox-frame {position:relative;padding:20px 20px 24px}
.lightbox img {
  width:100%;
  max-height:calc(100dvh - 260px);
  object-fit:contain;
  border-radius:var(--radius);
  background:#0f1210;
  margin-bottom:18px;
}
.lightbox h3 {color:#fff;margin-bottom:6px;padding-right:110px}
.lightbox p {color:var(--on-dark-muted);font-size:.95rem}
.lightbox-close {
  position:absolute;
  top:30px;
  right:30px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:8px 16px;
  border:0;
  border-radius:999px;
  background:#fff;
  color:var(--ink);
  font-weight:650;
  font-size:.9rem;
}
.lightbox-control {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid #ffffff1f;
}
.lightbox-control button {
  min-height:44px;
  padding:8px 18px;
  border:1px solid #ffffff40;
  border-radius:999px;
  background:transparent;
  color:#fff;
  font-weight:600;
  font-size:.9rem;
}
.lightbox-control button:hover:not(:disabled) {background:#ffffff14}
.lightbox-control button:disabled {opacity:.35;cursor:default}
.lightbox-index {font-size:.86rem;color:var(--on-dark-muted)}
body.lightbox-open {overflow:hidden}

/* ---------- Scroll reveal (added by script only when motion is welcome) ---------- */
/* Hidden instantly (no fade-out); only the fade-in is animated. */
.reveal-ready [data-reveal] {
  opacity:0;
  transform:translateY(22px);
}
.reveal-ready [data-reveal].is-visible {
  opacity:1;
  transform:none;
  transition:opacity .9s var(--ease),transform .9s var(--ease);
  transition-delay:var(--reveal-delay,0s);
}

/* =========================================================
   Responsive
   ========================================================= */
/* Small laptops and tablets held sideways: keep the full menu on one line. */
@media (min-width:981px) and (max-width:1180px) {
  .nav-wrap {gap:14px}
  .brand-location {display:none}
  .desktop-nav ul {gap:0}
  .desktop-nav a {padding:0 10px;font-size:.92rem}
  .desktop-nav a::after {left:10px;right:10px}
  .header-cta {padding-inline:16px}
  .header-cta svg {display:none}
}
@media (min-width:981px) and (max-width:1100px) {
  html[lang="es"] .header-cta {display:none}
}

@media (max-width:1180px) {
  .feature-grid {grid-template-columns:repeat(2,minmax(0,1fr));row-gap:44px}
  .process-grid {grid-template-columns:repeat(2,minmax(0,1fr));row-gap:44px}
  .footer-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer-brand {grid-column:1/-1}
  .team-card {grid-template-columns:1fr}
  .team-card img {aspect-ratio:3/2;height:auto}
  .craft-grid {grid-template-columns:1fr 1fr}
  .craft-grid > div {grid-column:1/-1;padding-right:0;max-width:720px}
  .craft-grid figure:last-child {margin-bottom:0}
}

@media (max-width:980px) {
  html {scroll-padding-top:84px}
  .nav-wrap {min-height:70px;gap:12px}
  .desktop-nav {display:none}
  .menu-toggle {display:inline-flex}
  .mobile-nav {
    display:block;
    border-top:1px solid var(--line);
    background:var(--bg);
    max-height:calc(100dvh - 70px);
    overflow-y:auto;
    overscroll-behavior:contain;
    box-shadow:0 24px 40px -24px #1d232060;
  }
  .mobile-nav .wrap {padding-block:12px 28px}
  .mobile-nav ul {margin:0;padding:0;list-style:none}
  .mobile-nav li a {
    display:flex;
    align-items:center;
    min-height:60px;
    border-bottom:1px solid var(--line);
    font-family:var(--display);
    font-size:1.55rem;
    font-weight:420;
    letter-spacing:-.01em;
    text-decoration:none;
  }
  .mobile-nav li a:hover {color:var(--green-deep)}
  .mobile-nav .actions {margin-top:24px}
  .mobile-nav .button {width:100%}
  .nojs-nav {display:block}

  .signature-hero-content,.luxury-hero-copy {grid-template-columns:1fr;align-items:start}
  .signature-hero-photo {aspect-ratio:4/3}
  .hero-media .proof-list {grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-media .proof-list li:nth-child(3) {border-left:0}
  .hero-media .proof-list li:nth-child(n+3) {border-top:1px solid var(--line)}

  .service-grid,.project-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .project-grid.natural-gallery {columns:2}
  .luxury-feature-grid,.contact-grid,.faq-layout,.service-area-grid,.hero-grid {grid-template-columns:1fr}
  .faq-heading {position:static}
  .luxury-feature-images {margin-right:24px}
  .hero-image {aspect-ratio:4/3}
  .finish-panel {min-height:300px}
  .team-grid {grid-template-columns:1fr}
  .team-card {grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  .team-card img {aspect-ratio:auto;height:100%}
  .home-numbered {grid-template-columns:1fr;gap:12px}
  .home-section-number {font-size:3rem}
  .section-top {flex-direction:column;align-items:flex-start}
  .estimate-banner .wrap {flex-direction:column;align-items:flex-start}
  .review-grid {grid-template-columns:1fr 1fr}
  .luxury-panorama {aspect-ratio:4/3}
}

@media (max-width:760px) {
  body {font-size:1rem;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .topline span {display:none}
  .topline .wrap {justify-content:center}
  .brand img {width:42px;height:42px}
  .brand-name {font-size:1.08rem}
  .brand-location {display:none}
  .header-cta {display:none}

  .signature-hero {padding-top:28px}
  .hero-aside .actions .button,.hero-copy .actions .button,.luxury-hero-copy .actions .button {flex:1 1 100%}
  .signature-hero-photo {aspect-ratio:4/5;border-radius:var(--radius)}
  .signature-hero-photo img {object-position:60% 60%}
  .hero-review-badge {left:12px;top:12px;font-size:.8rem;padding:8px 14px}
  .signature-photo-credit {right:12px;bottom:12px;left:12px;justify-content:space-between;font-size:.8rem}
  .hero-media .proof-list li {justify-content:flex-start;padding:16px 4px 16px 14px;font-size:.88rem}

  .service-grid,.project-grid,.scope-grid,.builder-grid,.compare-list {grid-template-columns:1fr}
  .project-grid.natural-gallery {columns:1}
  .feature-grid,.process-grid {grid-template-columns:1fr;row-gap:36px}
  .service-card-copy {padding:26px 22px 18px}
  .service-card .number {top:24px;right:22px}
  .service-card-wide {padding:26px 22px}

  /* Reviews become a swipeable row with a peek of the next card. */
  .reviews .wrap {padding-inline:0}
  .reviews .section-top {padding-inline:var(--gutter)}
  .review-grid {
    display:flex;
    gap:14px;
    overflow-x:auto;
    padding:4px var(--gutter) 18px;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:var(--gutter);
    scrollbar-width:none;
  }
  .review-grid::-webkit-scrollbar {display:none}
  .review-card {flex:0 0 86%;scroll-snap-align:start}
  .review-note {padding-inline:var(--gutter)}

  .team-card {grid-template-columns:1fr}
  .team-card img {aspect-ratio:4/3;height:auto}
  .luxury-feature-images {margin-right:0;padding-bottom:48px}
  .luxury-feature-images .luxury-feature-detail {right:-4px;width:42%}
  .luxury-feature-main figcaption {top:12px;bottom:auto}
  .luxury-feature-detail figcaption {left:8px;right:8px;bottom:8px;font-size:.7rem}
  .craft-grid {grid-template-columns:1fr 1fr;gap:14px}

  .form-grid {grid-template-columns:1fr}
  .estimate-form {padding:24px 20px;border-radius:var(--radius)}
  .form-actions .button {flex-basis:100%}
  .contact-list a {min-height:60px}
  .estimate-banner .wrap {width:calc(100% - var(--gutter)*2);padding:36px 24px;border-radius:var(--radius)}
  .estimate-banner .button {width:100%}
  .google-card {flex-direction:column;align-items:flex-start}

  .footer-grid {grid-template-columns:1fr 1fr}
  .footer-col:last-child {grid-column:1/-1}
  .footer-bottom {flex-direction:column}

  .faq-list summary {min-height:68px;padding-right:44px}
  .faq-list summary::before,.faq-list summary::after {right:6px}
  .faq-list details p {padding-right:8px}

  .motion-group {font-size:1rem;gap:22px;padding-block:16px}
  .motion-toggle {min-width:96px;padding:10px 14px;font-size:.72rem}

  .compare-list > :only-child .compare-frame,.compare-frame {aspect-ratio:4/3}

  /* Fixed call / estimate bar */
  .mobile-contact {
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:55;
    display:grid;
    grid-template-columns:1fr 1.3fr;
    gap:10px;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    background:#faf8f3f2;
    border-top:1px solid var(--line);
    box-shadow:0 -12px 28px -20px #1d232070;
  }
  @supports (backdrop-filter:blur(12px)) {
    .mobile-contact {background:#faf8f3d9;backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
  }
  .mobile-contact a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:52px;
    border-radius:999px;
    border:1.5px solid var(--line-strong);
    background:var(--surface);
    font-weight:650;
    font-size:.95rem;
    text-decoration:none;
  }
  .mobile-contact a:last-child {background:var(--green);border-color:var(--green)}

  .lightbox {width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:var(--radius)}
  .lightbox-frame {padding:12px 12px 16px}
  .lightbox-close {top:20px;right:20px}
  .lightbox h3 {padding-right:0}
  .lightbox-control {display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .lightbox-control button {white-space:nowrap;padding-inline:12px}
  .lightbox-index {grid-column:1/-1;grid-row:1;text-align:center}
  .lightbox img {max-height:calc(100dvh - 300px)}
}

@media (max-width:420px) {
  .topline {font-size:.78rem}
  .language-switch a {min-width:36px;padding:0 8px}
  .hero-media .proof-list {grid-template-columns:1fr 1fr}
  .footer-grid {grid-template-columns:1fr}
  .mobile-contact {grid-template-columns:1fr 1.2fr;gap:8px;padding-inline:10px}
  .review-card {flex-basis:90%}
}

/* ---------- Preferences & media ---------- */
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .motion-copy {display:none!important}
  .motion-band .motion-window {overflow-x:auto}
  .motion-band .motion-track {animation:none!important;transform:none}
  .project-types-rail {scroll-snap-type:none}
  .reveal-ready [data-reveal] {opacity:1;transform:none}
}

@media (forced-colors:active) {
  a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,
  select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible {
    outline:3px solid Highlight;
    box-shadow:none;
  }
  .button,.filter-button,.language-switch a {border:1px solid ButtonText}
}

@media print {
  .topline,.site-header,.motion-band,.mobile-contact,.lightbox,.rail-controls,.estimate-form,.page-sections {display:none!important}
  body {background:#fff;padding:0}
  .section {padding-block:24px}
  .dark,.site-footer,.estimate-banner .wrap {background:#fff!important;color:#000!important}
  .reveal-ready [data-reveal] {opacity:1!important;transform:none!important}
}