:root{
    --charcoal:#1B1E1A;
    --charcoal-soft:#2A2D28;
    --cream:#F4EFE4;
    --cream-dim:#EAE3D3;
    --maroon:#1F2A44;
    --maroon-dark:#161E33;
    --gold:#C9A227;
    --ink:#262822;
    --muted:#6B6F64;
    --line:#DAD2BC;
    --white:#FFFFFF;
    box-sizing:border-box;
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --cream:#1B1E1A;
      --cream-dim:#222520;
      --ink:#EDE8DC;
      --muted:#A9A79A;
      --line:#3A3D35;
      --white:#242620;
    }
  }
  :root[data-theme="dark"]{
    --cream:#1B1E1A;
    --cream-dim:#222520;
    --ink:#EDE8DC;
    --muted:#A9A79A;
    --line:#3A3D35;
    --white:#242620;
  }
  html{ scroll-behavior:smooth; scroll-padding-top: calc(86px + env(safe-area-inset-top,0px)); }
  *{ box-sizing:border-box; }
  body{
    margin:0;
    background:var(--cream);
    color:var(--ink);
    font-family:'Work Sans', Arial, sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{ font-family:'Fraunces', Georgia, serif; font-weight:600; margin:0; color:var(--ink); }
  p{ margin:0; }
  a{ color:inherit; }
  img{ max-width:100%; display:block; }
  .wrap{ max-width:1180px; margin:0 auto; padding:0 28px; }

  /* ---------- NAV ---------- */
  nav{
    position:sticky; top:0; z-index:50;
    background:var(--cream);
    border-bottom:1px solid var(--line);
    padding-top: env(safe-area-inset-top, 0px);
  }
  .navrow{
    max-width:1180px; margin:0 auto; padding:16px 28px;
    display:flex; align-items:center; justify-content:space-between; gap:20px;
  }
  .brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
  .brand img{ width:40px; height:auto; }
  .brand .name{ font-family:'Fraunces',serif; font-weight:600; font-size:19px; color:var(--ink); line-height:1.1; }
  .brand .loc{ font-size:11px; letter-spacing:.04em; color:var(--maroon); }
  .navlinks{ display:flex; gap:30px; font-size:15px; }
  .navlinks a{ text-decoration:none; color:var(--ink); }
  .navlinks a:hover{ color:var(--maroon); }
  .navcall{
    background:var(--maroon); color:var(--white); text-decoration:none;
    padding:10px 18px; border-radius:3px; font-size:15px; font-weight:600;
    white-space:nowrap;
  }
  .navcall:hover{ background:var(--maroon-dark); }
  .burger{ display:none; }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    display:flex; align-items:flex-start;
    background: var(--cream);
    border-bottom:1px solid var(--line);
  }
  .herocontent{ position:relative; z-index:2; padding:76px 28px 64px; max-width:1180px; margin:0 auto; width:100%; }
  .hero h1{
    color:var(--ink); font-size:clamp(36px,6vw,64px); line-height:1.04; max-width:11ch;
  }
  .hero .sub{
    color:var(--muted); font-size:18px; line-height:1.55; max-width:46ch; margin-top:18px;
  }
  .herobtns{ display:flex; gap:16px; margin-top:32px; flex-wrap:wrap; }
  .btn{
    display:inline-block; padding:15px 28px; border-radius:3px; text-decoration:none;
    font-weight:600; font-size:15.5px; border:1.5px solid transparent;
  }
  .btn-primary{ background:var(--maroon); color:#fff; }
  .btn-primary:hover{ background:var(--maroon-dark); }
  .btn-ghost{ border-color:var(--ink); color:var(--ink); }
  .btn-ghost:hover{ background:var(--ink); color:var(--cream); }

  /* ---------- SECTION HEADS ---------- */
  .section{ padding:88px 0; }
  .sectionhead{ max-width:640px; margin-bottom:52px; }
  .sectionhead h2{ font-size:clamp(28px,4vw,40px); line-height:1.12; }
  .sectionhead p{ color:var(--muted); font-size:16.5px; margin-top:14px; line-height:1.6; }

  /* ---------- SERVICES ---------- */
  .services{ background:var(--cream); }
  .svcgrid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
    background:var(--line); border:1px solid var(--line);
  }
  .svc{ background:var(--cream); padding:34px 30px; }
  .svc .num{ color:var(--maroon); font-family:'Fraunces',serif; font-size:15px; margin-bottom:14px; }
  .svc h3{ font-size:20px; margin-bottom:10px; }
  .svc p{ color:var(--muted); font-size:14.5px; line-height:1.55; }

  /* ---------- GALLERY ---------- */
  .gallery{ background:var(--cream-dim); }
  .galgrid{
    display:grid; grid-template-columns: 1.4fr 1fr; grid-template-rows: 1fr 1fr; gap:14px;
    height:560px;
  }
  .galgrid .g1{ grid-row:1 / 3; }
  .galgrid img{ width:100%; height:100%; object-fit:cover; border-radius:2px; }
  .gallery .sectionhead{ display:flex; align-items:flex-end; justify-content:space-between; max-width:none; gap:20px; flex-wrap:wrap; }
  .gallery .sectionhead p{ margin-top:0; }

  /* ---------- CONTACT ---------- */
  .contact{ background:var(--charcoal); color:#fff; }
  .contact h2{ color:#fff; font-size:clamp(28px,4vw,42px); max-width:14ch; }
  .contactgrid{ display:grid; grid-template-columns:1.2fr 1fr; gap:60px; align-items:start; }
  .contact .lede{ color:#C9C6B9; font-size:17px; line-height:1.6; margin-top:18px; max-width:46ch; }
  .contactbtns{ display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; }
  .infolist{ border-top:1px solid #3A3D35; }
  .infoitem{ border-bottom:1px solid #3A3D35; padding:20px 0; }
  .infoitem .label{ font-size:12.5px; color:#9B9888; margin-bottom:6px; }
  .infoitem .val{ font-size:19px; font-family:'Fraunces',serif; color:#fff; }
  .infoitem a{ text-decoration:none; }
  .infoitem a:hover{ color:var(--gold); }

  /* ---------- FOOTER ---------- */
  footer{ background:var(--charcoal); border-top:1px solid #3A3D35; padding:30px 0; }
  .footrow{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
  .footbrand{ display:flex; align-items:center; gap:10px; color:#C9C6B9; font-size:14px; }
  .footbrand img{ width:26px; }
  .footnote{ color:#7E7B6E; font-size:13px; }

  @media (max-width: 860px){
    .navlinks{ display:none; }
    .svcgrid{ grid-template-columns:1fr 1fr; }
    .galgrid{ grid-template-columns:1fr; grid-template-rows:none; height:auto; }
    .galgrid .g1{ grid-row:auto; }
    .galgrid img{ height:260px; }
    .contactgrid{ grid-template-columns:1fr; gap:36px; }
  }
  @media (max-width: 520px){
    .svcgrid{ grid-template-columns:1fr; }
    .herocontent{ padding:50px 20px 44px; }
    .wrap{ padding:0 20px; }
  }

/* ---------- CLICKABLE SERVICE CARDS ---------- */
a.svc{ display:flex; flex-direction:column; text-decoration:none; color:inherit; transition:background .15s ease; }
a.svc .more{ margin-top:auto; padding-top:18px; font-size:14px; font-weight:600; color:var(--maroon); }
a.svc:hover{ background:var(--cream-dim); }
a.svc:hover .more{ text-decoration:underline; }
a.svc:focus-visible{ outline:2px solid var(--maroon); outline-offset:-2px; }

/* ---------- SERVICE PAGES ---------- */
.crumbs{ font-size:13.5px; color:var(--muted); margin-bottom:22px; }
.crumbs a{ color:var(--maroon); text-decoration:none; }
.crumbs a:hover{ text-decoration:underline; }
.svchero{ background:var(--cream); border-bottom:1px solid var(--line); padding:76px 0 64px; }
.svchero h1{ font-size:clamp(34px,5.5vw,56px); line-height:1.05; max-width:16ch; }
.svchero .sub{ color:var(--muted); font-size:18px; line-height:1.6; max-width:56ch; margin-top:18px; }
.svchero .herobtns{ margin-top:30px; }
.inclgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.incl{ background:var(--cream); padding:26px 28px; }
.incl h3{ font-size:18px; margin-bottom:8px; }
.incl p{ color:var(--muted); font-size:14.5px; line-height:1.55; }
.steps{ background:var(--cream-dim); }
.stepgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:28px; counter-reset:step; }
.step{ border-top:2px solid var(--maroon); padding-top:18px; }
.step::before{ counter-increment:step; content:"0" counter(step); display:block; font-family:'Fraunces',serif; color:var(--maroon); font-size:15px; margin-bottom:10px; }
.step h3{ font-size:18px; margin-bottom:8px; }
.step p{ color:var(--muted); font-size:14.5px; line-height:1.55; }
.others{ display:flex; flex-wrap:wrap; gap:12px; }
.others a{ border:1px solid var(--line); padding:12px 18px; border-radius:3px; text-decoration:none; color:var(--ink); font-size:15px; background:var(--cream); }
.others a:hover{ border-color:var(--maroon); color:var(--maroon); }
@media (max-width: 860px){
  .stepgrid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 520px){
  .inclgrid, .stepgrid{ grid-template-columns:1fr; }
  .svchero{ padding:52px 0 44px; }
}

/* Ghost button on the dark contact section */
.contact .btn-ghost{ border-color:#C9C6B9; color:#fff; }
.contact .btn-ghost:hover{ background:#fff; color:var(--charcoal); }

/* ---------- SERVICE GRID: centered last row, no empty box ---------- */
.svcgrid{ grid-template-columns:repeat(6,1fr); background:none; border:none; }
.svcgrid .svc{ grid-column:span 2; box-shadow:0 0 0 1px var(--line); }
.svcgrid .svc:nth-child(4){ grid-column:2 / span 2; }
.svcgrid .svc:nth-child(5){ grid-column:4 / span 2; }
@media (max-width: 860px){
  .svcgrid{ grid-template-columns:repeat(4,1fr); }
  .svcgrid .svc:nth-child(4){ grid-column:span 2; }
  .svcgrid .svc:nth-child(5){ grid-column:2 / span 2; }
}
@media (max-width: 520px){
  .svcgrid{ grid-template-columns:1fr; }
  .svcgrid .svc, .svcgrid .svc:nth-child(4), .svcgrid .svc:nth-child(5){ grid-column:auto; }
}

/* Dark-mode accents: navy text is too dark on dark backgrounds */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) a.svc .more, :root:not([data-theme="light"]) .crumbs a{ color:#A9BCE3; }
}
:root[data-theme="dark"] a.svc .more, :root[data-theme="dark"] .crumbs a{ color:#A9BCE3; }

a[href^="tel:"]{ white-space:nowrap; }

/* ---------- POP-UP LEAD FORM ---------- */
dialog.lead{ border:0; padding:0; width:min(520px, calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow:auto; background:var(--cream); color:var(--ink); border-radius:4px; box-shadow:0 24px 60px rgba(0,0,0,.28); }
dialog.lead::backdrop{ background:rgba(20,22,20,.55); }
.lead-body{ padding:34px 32px 28px; }
.lead-body h2{ font-size:28px; line-height:1.15; margin-bottom:8px; padding-right:28px; }
.lead-sub{ color:var(--muted); font-size:15px; line-height:1.55; margin-bottom:22px; }
.lead-close{ position:absolute; top:12px; right:14px; width:36px; height:36px; border:0; background:none; font-size:28px; line-height:1; color:var(--muted); cursor:pointer; }
.lead-close:hover{ color:var(--ink); }
.lead-form{ display:flex; flex-direction:column; gap:14px; }
.lead-form label{ display:flex; flex-direction:column; gap:6px; font-size:13.5px; color:var(--muted); }
.lead-opt{ font-size:12.5px; }
.lead-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.lead-form input, .lead-form select, .lead-form textarea{ font:inherit; font-size:15.5px; color:var(--ink); background:var(--white); border:1px solid var(--line); border-radius:3px; padding:11px 12px; width:100%; }
.lead-form input:focus, .lead-form select:focus, .lead-form textarea:focus{ outline:none; border-color:var(--maroon); }
.lead-hp{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.lead-error{ color:#A3322B; font-size:14px; line-height:1.5; }
.lead-error:empty{ display:none; }
.lead-error a, .lead-note a, .lead-sub a{ color:var(--maroon); }
.lead-send, .lead-done{ width:100%; cursor:pointer; font-family:inherit; border:0; margin-top:4px; }
.lead-send:disabled{ opacity:.65; cursor:wait; }
.lead-note{ text-align:center; font-size:13.5px; color:var(--muted); }
@media (max-width: 520px){
  .lead-row{ grid-template-columns:1fr; }
  .lead-body{ padding:28px 20px 22px; }
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .lead-error{ color:#E8847C; }
  :root:not([data-theme="light"]) .lead-error a, :root:not([data-theme="light"]) .lead-note a, :root:not([data-theme="light"]) .lead-sub a{ color:#A9BCE3; }
}
:root[data-theme="dark"] .lead-error{ color:#E8847C; }
:root[data-theme="dark"] .lead-error a, :root[data-theme="dark"] .lead-note a, :root[data-theme="dark"] .lead-sub a{ color:#A9BCE3; }

/* ---------- PHOTOS ---------- */
.herocontent{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:56px; align-items:center; }
.svcherogrid{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:56px; align-items:center; }
.heroimg{ margin:0; aspect-ratio:4/3.4; overflow:hidden; border-radius:3px; background:var(--cream-dim); }
.heroimg img{ width:100%; height:100%; object-fit:cover; display:block; }
.svcimg{ display:block; margin:-34px -30px 24px; aspect-ratio:16/10; overflow:hidden; background:var(--cream-dim); }
.svcimg img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
a.svc:hover .svcimg img{ transform:scale(1.04); }
.noimg{ display:none !important; }
@media (max-width: 860px){
  .herocontent, .svcherogrid{ grid-template-columns:1fr; gap:32px; }
  .heroimg{ aspect-ratio:16/10; }
}
@media (max-width: 520px){
  .svcimg{ margin:-34px -30px 20px; }
}
.footnote a{ color:#C9C6B9; text-decoration:none; } .footnote a:hover{ color:#fff; text-decoration:underline; }

/* ---------- PRICING ---------- */
.pricing{ background:var(--white); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.pricegrid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:56px; align-items:center; }
.pricecard{ background:var(--cream); border:1px solid var(--line); border-top:3px solid var(--maroon); padding:36px 34px; }
.pricelabel{ font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); font-weight:600; }
.priceamt{ font-family:'Fraunces',serif; font-weight:600; font-size:clamp(34px,4.6vw,46px); line-height:1.1; color:var(--ink); margin:12px 0 14px; white-space:nowrap; }
.pricenote{ color:var(--muted); font-size:15px; line-height:1.6; margin-bottom:24px; }
.pricecard .btn{ width:100%; text-align:center; }
.pricefactors h2{ font-size:clamp(26px,3.4vw,34px); line-height:1.15; margin-bottom:18px; }
.pricefactors ul{ list-style:none; padding:0; margin:0 0 20px; }
.pricefactors li{ padding:12px 0; border-top:1px solid var(--line); color:var(--muted); font-size:15.5px; line-height:1.5; }
.pricefactors li:last-child{ border-bottom:1px solid var(--line); }
.pricefactors li strong{ color:var(--ink); font-weight:600; }
.pricefine{ color:var(--muted); font-size:14px; line-height:1.6; }
@media (max-width: 860px){ .pricegrid{ grid-template-columns:1fr; gap:36px; } }
@media (max-width: 520px){ .pricecard{ padding:28px 22px; } .priceamt{ white-space:normal; } }
.othersec{ padding-top:0; }

/* ---------- THE CREST BATH ---------- */
.eyebrow{ font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--maroon); font-weight:600; margin-bottom:10px; }
.fromprice{ margin-top:22px; font-size:17px; color:var(--muted); }
.fromprice strong{ font-family:'Fraunces',serif; font-size:26px; color:var(--ink); font-weight:600; margin-left:4px; }
.whypkg{ background:var(--charcoal); color:#E8E5DA; padding:44px 0; }
.whygrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
.why h3{ color:#fff; font-size:18px; margin-bottom:8px; }
.why p{ color:#B8B5A8; font-size:14.5px; line-height:1.55; }
.packages{ background:var(--cream); }
.pkggrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch; }
.pkg{ position:relative; display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line); padding:34px 28px 28px; border-radius:3px; }
.pkg-feat{ border:2px solid var(--maroon); box-shadow:0 18px 40px rgba(0,0,0,.08); }
.pkgbadge{ position:absolute; top:-13px; left:28px; background:var(--maroon); color:#fff; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding:5px 12px; border-radius:2px; }
.pkg h3{ font-size:24px; }
.pkgprice{ font-family:'Fraunces',serif; font-weight:600; font-size:40px; line-height:1.1; margin:10px 0 8px; color:var(--ink); }
.pkgtag{ color:var(--muted); font-size:15px; line-height:1.5; margin-bottom:20px; min-height:3em; }
.pkg ul{ list-style:none; padding:0; margin:0 0 26px; flex:1; }
.pkg li{ position:relative; padding:9px 0 9px 26px; border-top:1px solid var(--line); font-size:14.5px; line-height:1.45; color:var(--muted); }
.pkg li::before{ content:""; position:absolute; left:2px; top:15px; width:12px; height:7px; border-left:2px solid var(--maroon); border-bottom:2px solid var(--maroon); transform:rotate(-45deg); }
.pkg li.hl{ color:var(--ink); font-weight:600; }
.pkgbtn{ width:100%; text-align:center; }
.addons{ background:var(--white); border-top:1px solid var(--line); }
.addongrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.addon{ background:var(--cream); padding:22px 22px; }
.addon h3{ font-size:17px; margin-bottom:6px; }
.addon p{ color:var(--muted); font-size:14px; line-height:1.5; }
.faqs{ max-width:780px; }
.faq{ border-top:1px solid var(--line); padding:4px 0; }
.faq:last-child{ border-bottom:1px solid var(--line); }
.faq summary{ cursor:pointer; list-style:none; font-family:'Fraunces',serif; font-weight:600; font-size:18px; padding:16px 36px 16px 0; position:relative; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; position:absolute; right:4px; top:12px; font-size:24px; color:var(--maroon); font-family:'Work Sans',sans-serif; font-weight:400; }
.faq[open] summary::after{ content:"\2013"; }
.faq p{ color:var(--muted); font-size:15.5px; line-height:1.6; padding:0 0 18px; max-width:64ch; }
@media (max-width: 960px){
  .pkggrid{ grid-template-columns:1fr; max-width:520px; }
  .pkgtag{ min-height:0; }
  .whygrid, .addongrid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 520px){
  .whygrid, .addongrid{ grid-template-columns:1fr; gap:22px; }
  .addongrid{ gap:1px; }
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .eyebrow{ color:#A9BCE3; }
}
:root[data-theme="dark"] .eyebrow{ color:#A9BCE3; }
.lead-form label[hidden]{ display:none; }
.wasprice{ font-size:22px; color:var(--muted); text-decoration:line-through; text-decoration-thickness:2px; font-weight:400; margin-right:6px; vertical-align:middle; }
.pkgdeal{ display:inline-block; align-self:flex-start; margin-top:10px; background:#F3E4C4; color:#6B4A12; font-size:12.5px; font-weight:600; letter-spacing:.03em; padding:4px 10px; border-radius:2px; }
.pkgdeal + .pkgprice{ margin-top:8px; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .pkgdeal{ background:#4A3A1A; color:#F3DFAE; } }
:root[data-theme="dark"] .pkgdeal{ background:#4A3A1A; color:#F3DFAE; }
.pkgsize{ font-size:13px; color:var(--muted); background:var(--cream); border:1px solid var(--line); border-radius:2px; padding:6px 10px; margin:-6px 0 18px; align-self:flex-start; }
