/* Shared styles for the area landing pages — same palette and type as the homepage */
:root{
  --ivory:#fcf4ef;--linen:#f7e6df;--blush:#f0d6cf;--champagne:#ead1c3;
  --cocoa:#4a3430;--cocoa-2:#7d625a;--rose:#7c4c43;--rose-2:#663b33;
  --gold:#b98a63;--gold-2:#ecc9a8;--on-rose:#fdf2ec;
  --serif:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --script:"Pinyon Script","Snell Roundhand","Apple Chancery",cursive;
  --sans:"Jost","Futura","Century Gothic",system-ui,sans-serif;
  --g:clamp(20px,5vw,84px);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ivory);color:var(--cocoa);font-family:var(--serif);font-size:clamp(18px,1.3vw,21px);line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.08;text-wrap:balance;color:var(--rose)}
p{margin:0}
em{font-style:italic;color:var(--gold)}
.wrap{padding-left:max(var(--g),env(safe-area-inset-left,0px));padding-right:max(var(--g),env(safe-area-inset-right,0px))}
.lbl{font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:.32em;text-transform:uppercase;color:var(--gold)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-size:11px;letter-spacing:.26em;text-transform:uppercase;padding:17px 30px;border:1px solid var(--rose);color:var(--rose);transition:background .3s,color .3s}
.btn.solid{background:var(--rose);color:var(--on-rose)}
.btn.solid:hover{background:var(--rose-2)}
.btn:not(.solid):hover{background:var(--rose);color:var(--on-rose)}
a:focus-visible,button:focus-visible{outline:1px solid var(--gold);outline-offset:4px}

/* header */
.head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:76px;background:rgba(252,244,239,.95);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 1px 0 rgba(124,76,67,.1)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--ivory)}
.head .back{font-family:var(--sans);font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--cocoa)}
.head .back:hover{color:var(--gold)}
.head .logo{width:62px;height:62px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px var(--ivory),0 0 0 4px #e3bfae}
.head .logo img{width:100%;height:100%;object-fit:cover;transform:scale(1.07)}
.head .cta{justify-self:end;padding:13px 22px}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,100px);align-items:center;padding-block:clamp(50px,7vw,110px)}
.hero .copy{display:grid;gap:22px;justify-items:start}
.hero h1{font-size:clamp(44px,5vw,78px)}
.hero h1 .script{display:block;font-family:var(--script);font-size:1.15em;color:var(--gold);line-height:1.1}
.hero .lead{font-size:clamp(20px,1.6vw,24px);color:var(--cocoa-2);max-width:34ch}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.hero figure{margin:0;position:relative;padding:0 0 22px 22px;justify-self:center;width:100%;max-width:620px}
.hero figure::before{content:"";position:absolute;left:0;bottom:0;width:calc(100% - 22px);height:calc(100% - 22px);border:1px solid var(--gold)}
.hero figure img{position:relative;width:100%;box-shadow:0 30px 50px -30px rgba(74,52,48,.5)}

/* story + spots */
.story{background:var(--linen);padding-block:clamp(80px,9vw,140px)}
.story-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,120px);max-width:1240px;margin:0 auto}
.story .text{display:grid;gap:20px}
.story h2,.spots h2,.faq h2,.areas h2,.photos h2{font-size:clamp(34px,3.4vw,52px)}
.story .text p{color:var(--cocoa-2);max-width:56ch}
.spots{display:grid;gap:18px;align-content:start}
.spots ol{list-style:none;margin:0;padding:0;border-top:1px solid rgba(124,76,67,.28)}
.spots li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:16px;padding-block:22px;border-bottom:1px solid rgba(124,76,67,.28)}
.spots li span{font-style:italic;font-size:30px;color:var(--gold);line-height:1}
.spots h3{font-size:clamp(23px,1.8vw,28px);margin-bottom:4px}
.spots p{color:var(--cocoa-2);font-size:.95em}

/* photos */
.photos{padding-block:clamp(80px,9vw,140px);text-align:center}
.photos .shead{display:grid;gap:12px;justify-items:center;margin-bottom:44px}
.trio{columns:3;column-gap:clamp(10px,1.4vw,20px);text-align:left}
.trio img{width:100%;margin-bottom:clamp(10px,1.4vw,20px);break-inside:avoid}
.photos .more{margin-top:30px}

/* quote */
.quote{background:var(--blush);text-align:center;padding-block:clamp(80px,9vw,130px)}
.quote blockquote{margin:18px auto 0;max-width:30ch;font-style:italic;font-size:clamp(26px,2.6vw,38px);line-height:1.4;color:var(--rose)}
.quote cite{display:block;margin-top:26px;font-style:normal;font-family:var(--sans);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}

/* faq */
.faq{padding-block:clamp(80px,9vw,130px)}
.faq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(40px,7vw,120px);max-width:1240px;margin:0 auto}
.faq-grid>*,.story-grid>*,.hero>*{min-width:0}
.faq details{border-bottom:1px solid rgba(124,76,67,.28);padding-block:20px}
.faq details:first-of-type{border-top:1px solid rgba(124,76,67,.28)}
.faq summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:20px;font-size:clamp(21px,1.6vw,25px);color:var(--rose)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--sans);font-weight:300;color:var(--gold);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--cocoa-2);margin-top:10px;max-width:60ch}

/* closing cta */
.close{background:var(--rose);color:var(--on-rose);text-align:center;padding-block:clamp(80px,9vw,130px)}
.close .script{font-family:var(--script);font-size:clamp(56px,6vw,90px);color:var(--gold-2);line-height:1}
.close h2{color:var(--on-rose);font-size:clamp(30px,3vw,46px);margin-top:4px}
.close p{max-width:46ch;margin:18px auto 0;color:#f2d9cf}
.close .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.close .btn{border-color:var(--gold-2);color:var(--on-rose)}
.close .btn.solid{background:var(--gold-2);color:#3a2622}
.close .btn:not(.solid):hover{background:var(--gold-2);color:#3a2622}
.close .contact{margin-top:26px;font-family:var(--sans);font-size:13px;letter-spacing:.06em;color:#f2d9cf}

/* areas */
.areas{padding-block:clamp(70px,8vw,110px);text-align:center}
.areas ul{list-style:none;margin:26px auto 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:980px}
.areas a{display:inline-block;padding:10px 18px;border:1px solid rgba(124,76,67,.3);font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cocoa);transition:background .3s,color .3s,border-color .3s}
.areas a:hover,.areas a[aria-current]{background:var(--rose);border-color:var(--rose);color:var(--on-rose)}

/* footer */
footer{border-top:1px solid var(--champagne);padding-block:34px calc(34px + env(safe-area-inset-bottom,0px));display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 30px;font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--cocoa-2)}
footer a:hover{color:var(--gold)}

/* whatsapp */
.wa{position:fixed;right:max(18px,calc(env(safe-area-inset-right,0px) + 14px));bottom:max(18px,calc(env(safe-area-inset-bottom,0px) + 14px));z-index:25;width:58px;height:58px;border-radius:50%;background:var(--rose);color:var(--on-rose);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px var(--ivory),0 0 0 4px rgba(185,138,99,.6),0 12px 26px -8px rgba(74,52,48,.55);transition:transform .3s}
.wa:hover{transform:translateY(-3px)}
.wa svg{width:28px;height:28px}

@media (max-width:900px){
  .hero,.story-grid,.faq-grid{grid-template-columns:1fr}
  .hero figure{max-width:520px}
  .trio{columns:2}
}
@media (max-width:600px){
  body{font-size:17px}
  .head{height:64px}
  .head .logo{width:50px;height:50px}
  .head .back,.head .cta{font-size:10px;letter-spacing:.16em}
  .head .cta{padding:11px 14px}
  .hero{padding-block:36px 60px;gap:34px}
  .hero .copy{justify-items:center;text-align:center}
  .hero h1{font-size:40px}
  .hero .ctas{display:grid;grid-template-columns:1fr;width:100%}
  .hero figure{padding:0 0 14px 14px}
  .hero figure::before{width:calc(100% - 14px);height:calc(100% - 14px)}
  .trio{columns:1}.trio img{margin-bottom:10px}
  .spots li{grid-template-columns:40px minmax(0,1fr);gap:10px}
  .close .ctas{display:grid}
  footer{flex-direction:column;align-items:center;text-align:center;padding-bottom:calc(90px + env(safe-area-inset-bottom,0px))}
}
/* phone action bar */
.pbar{display:none}
@media (max-width:600px){
  .wa{display:none}
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  .pbar{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px max(12px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));background:rgba(252,244,239,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 -1px 0 rgba(124,76,67,.14)}
  .pbar a{display:flex;align-items:center;justify-content:center;gap:9px;height:48px;font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;border:1px solid var(--rose);color:var(--rose)}
  .pbar a.primary{background:var(--rose);color:var(--on-rose)}
  .pbar svg{width:18px;height:18px}
  .btn{letter-spacing:.16em;white-space:nowrap;padding:16px 18px}
  .head .logo{width:54px;height:54px}
  footer{padding-bottom:30px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}html{scroll-behavior:auto}}