/* ==========================================================================
   Serenity Spa — multi-page template stylesheet
   Design contract: spa.json — "Japanese Wabi-Sabi Minimalism"
   organic asymmetry · warm earthy tones · generous negative space · slow reveals
   ========================================================================== */

:root{
  --bg:#f8f5ee; --linen:#f0ebe0; --card:#f3efe6;
  --ink:#33312c; --muted:#7d786d; --hair:#ddd6c8;
  --sage:#8b9d7c; --sage-deep:#6c7f5d; --clay:#b98a6b; --stone:#b8ae9e;
  --display:'Cormorant Garamond',Georgia,serif;
  --body:'DM Sans',system-ui,sans-serif;
  --arch:14rem 14rem .25rem .25rem;
  --ease:cubic-bezier(.22,1,.36,1);
  --nav-h:92px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-weight:300;
  font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
/* paper grain */
body::before{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.32;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
::selection{background:var(--sage);color:#fff}

h1,h2,h3,h4{font-family:var(--display);font-weight:300;letter-spacing:-.01em;margin:0;line-height:1.08}
h1{font-size:clamp(2.6rem,5.6vw,4.75rem)}
h2{font-size:clamp(2.1rem,4.2vw,3.5rem)}
h3{font-size:1.5rem}
h4{font-size:1.25rem}
p{margin:0}
a{color:inherit;text-decoration:none}
em{font-style:italic;color:var(--sage-deep)}
img{display:block;max-width:100%}
svg.i{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;flex:none}

.wrap{max-width:1200px;margin:0 auto;padding:0 28px}
.narrow{max-width:820px;margin:0 auto}
.pad{padding:7rem 0}
.pad-sm{padding:5rem 0}
.linen{background:var(--linen)}
.rule{height:1px;background:var(--hair);border:0;margin:0}
.eyebrow{font-size:.6875rem;letter-spacing:.42em;text-transform:uppercase;color:var(--muted);font-weight:400}
.lead{font-size:1.0625rem;color:var(--muted);max-width:48ch}
.muted{color:var(--muted)}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}
section[id]{scroll-margin-top:calc(var(--nav-h) + 16px)}

/* ---------------------------------------------------------------- buttons */
.btn{display:inline-flex;align-items:center;gap:.6rem;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;
  padding:1.05rem 2.1rem;border-radius:999px;transition:.45s var(--ease);font-weight:400;white-space:nowrap;cursor:pointer}
.btn-solid{background:var(--sage-deep);color:#f8f5ee;border:1px solid var(--sage-deep)}
.btn-solid:hover{background:var(--ink);border-color:var(--ink);transform:translateY(-2px)}
.btn-ghost{border:1px solid var(--hair);color:var(--ink);background:transparent}
.btn-ghost:hover{border-color:var(--sage-deep);color:var(--sage-deep);background:#fff}
.btn-sm{padding:.75rem 1.5rem}
.tlink{display:inline-flex;align-items:center;gap:.5rem;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--sage-deep);border-bottom:1px solid transparent;padding-bottom:2px;transition:.3s}
.tlink:hover{border-color:var(--sage-deep);gap:.85rem}

/* ------------------------------------------------- announcement + navbar */
.announce{background:var(--ink);color:#e9e4d8;font-size:.6875rem;letter-spacing:.22em;text-transform:uppercase;
  display:flex;align-items:center;justify-content:center;gap:1rem;padding:.7rem 1.25rem;text-align:center}
.announce b{color:var(--sage);font-weight:400}
.announce a{border-bottom:1px solid rgba(233,228,216,.4);padding-bottom:1px}
.announce a:hover{border-color:var(--sage);color:var(--sage)}
.announce .sep{width:3px;height:3px;border-radius:999px;background:rgba(233,228,216,.45);flex:none}

.nav{position:sticky;top:0;z-index:60;background:rgba(248,245,238,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--hair)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:2rem;max-width:1200px;margin:0 auto;padding:1.35rem 28px}
.brand{display:flex;align-items:center;gap:.8rem}
.brand-mark{width:36px;height:36px;border:1px solid var(--sage);border-radius:999px;display:grid;place-items:center;color:var(--sage-deep);flex:none}
.brand-mark--image{border:0;border-radius:0;background:transparent;overflow:hidden}
.brand-mark--image img{width:100%;height:100%;object-fit:contain}
.brand--logo{gap:0}
.brand-logo{display:block;height:40px;width:auto;max-width:180px;object-fit:contain}
.brand-name{font-family:var(--display);font-size:1.4rem;letter-spacing:.04em;line-height:1;display:block}
.brand-sub{font-size:.5625rem;letter-spacing:.36em;text-transform:uppercase;color:var(--muted);white-space:nowrap;display:block}
.nav-links{display:flex;align-items:center;gap:1.9rem;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.nav-links>li{list-style:none;position:relative}
.nav-links a{position:relative;padding:.35rem 0;display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.nav-links>li>a::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--sage-deep);transition:.4s var(--ease)}
.nav-links>li>a:hover{color:var(--ink)}
.nav-links>li>a:hover::after{width:100%}
.nav-links>li.current>a{color:var(--ink)}
.nav-links>li.current>a::after{width:100%;background:var(--sage)}
.nav-links ul{list-style:none;margin:0;padding:.6rem;position:absolute;left:-1rem;top:calc(100% + 1.05rem);min-width:16rem;
  background:var(--bg);border:1px solid var(--hair);box-shadow:0 30px 60px -40px rgba(51,49,44,.55);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.3s var(--ease)}
.nav-links li:hover>ul,.nav-links li:focus-within>ul{opacity:1;visibility:visible;transform:none}
.nav-links ul a{display:flex;flex-direction:column;gap:.15rem;padding:.7rem .9rem;letter-spacing:.1em;color:var(--ink)}
.nav-links ul a small{font-family:var(--body);font-size:.625rem;letter-spacing:.14em;color:var(--muted);text-transform:none}
.nav-links ul a:hover{background:var(--linen);color:var(--sage-deep)}
.nav-links .caret{transition:.3s}
.nav-links li:hover .caret{transform:rotate(180deg)}
.nav-right{display:flex;align-items:center;gap:1.4rem}
.nav-phone{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:var(--muted);white-space:nowrap}
.burger{display:none;background:none;border:1px solid var(--hair);border-radius:999px;width:44px;height:44px;
  color:var(--ink);cursor:pointer;place-items:center;font-size:1.1rem}
@media(max-width:1080px){
  .nav-links,.nav-phone{display:none}
  .burger{display:grid}
}
/* mobile sheet */
.sheet{position:fixed;inset:0;z-index:90;background:rgba(248,245,238,.98);backdrop-filter:blur(18px);
  display:none;flex-direction:column;padding:1.5rem 28px 2.5rem;overflow-y:auto}
.sheet.open{display:flex}
.sheet-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}
.sheet nav a{display:block;font-family:var(--display);font-size:1.75rem;padding:.65rem 0;border-bottom:1px solid var(--hair)}
.sheet nav a small{display:block;font-family:var(--body);font-size:.625rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.sheet .sheet-cta{margin-top:2rem;display:grid;gap:.8rem}

/* ------------------------------------------------------- page header/hero */
.phead{padding:4.5rem 0 4rem;border-bottom:1px solid var(--hair)}
.phead .crumbs{display:flex;align-items:center;gap:.6rem;font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin-bottom:2rem;flex-wrap:wrap}
.phead .crumbs svg{transform:rotate(-90deg);opacity:.7}
.phead .crumbs a:hover{color:var(--sage-deep)}
.phead-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:4rem;align-items:end}
.phead h1{margin-top:1.4rem}
.phead .lead{margin-top:1.6rem}
.phead-meta{display:flex;gap:2.5rem;flex-wrap:wrap;padding-top:1.6rem;border-top:1px solid var(--hair);margin-top:2.4rem}
.phead-meta b{font-family:var(--display);font-size:1.9rem;font-weight:300;display:block;line-height:1}
.phead-meta span{font-size:.625rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.phead-media{border-radius:11rem 11rem .25rem .25rem;overflow:hidden}
.phead-media img{width:100%;height:360px;object-fit:cover}
@media(max-width:960px){.phead-grid{grid-template-columns:1fr;gap:2.5rem}.phead-media{display:none}}

/* --------------------------------------------------------------- home hero */
.hero{position:relative;padding:5.5rem 0 6rem}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:4.5rem;align-items:center}
.hero h1{font-size:clamp(3rem,7vw,5.75rem);margin:1.6rem 0 0}
.hero h1 em{display:block;padding-left:2.2rem}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2.6rem}
.hero-meta{display:flex;align-items:center;gap:1.5rem;margin-top:3.2rem;padding-top:1.6rem;border-top:1px solid var(--hair)}
.avatars{display:flex}
.avatars img{width:38px;height:38px;border-radius:999px;border:2px solid var(--bg);object-fit:cover;margin-left:-12px}
.avatars img:first-child{margin-left:0}
.stars{display:flex;gap:2px;color:var(--clay)}
.stars svg{width:13px;height:13px;fill:currentColor;stroke:none}
.hero-media{position:relative}
.hero-media .shot{border-radius:var(--arch);overflow:hidden;box-shadow:0 40px 80px -50px rgba(51,49,44,.55)}
.hero-media .shot img{width:100%;height:min(74vh,660px);object-fit:cover}
.hero-inset{position:absolute;left:-3.2rem;bottom:3.5rem;width:170px;border-radius:.25rem;overflow:hidden;
  box-shadow:0 24px 50px -28px rgba(51,49,44,.5);border:8px solid var(--bg)}
.hero-inset img{height:190px;width:100%;object-fit:cover}
.hero-ring{position:absolute;right:-3.5rem;top:-2.5rem;width:190px;height:190px;border:1px solid var(--hair);border-radius:999px;z-index:-1}
.hero-badge{position:absolute;right:1.6rem;top:1.6rem;background:rgba(248,245,238,.92);backdrop-filter:blur(8px);
  border-radius:999px;padding:.7rem 1.15rem;display:flex;align-items:center;gap:.6rem;font-size:.75rem}
.vert{position:absolute;left:-2.6rem;top:34%;writing-mode:vertical-rl;font-size:.625rem;letter-spacing:.5em;
  text-transform:uppercase;color:var(--stone)}
@media(max-width:960px){.hero-grid{grid-template-columns:1fr;gap:3rem}.hero h1 em{padding-left:0}.hero-inset,.hero-ring,.vert{display:none}}

/* ------------------------------------------------------------ trust strip */
.trust{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);background:var(--linen)}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);max-width:1200px;margin:0 auto;padding:0 28px}
.trust-item{padding:2.2rem 1.5rem;display:flex;gap:.9rem;align-items:flex-start;border-left:1px solid var(--hair)}
.trust-item:first-child{border-left:0;padding-left:0}
.trust-item svg{font-size:1.25rem;color:var(--sage-deep);margin-top:.15rem}
.trust-item b{font-family:var(--display);font-size:1.15rem;font-weight:400;display:block;line-height:1.3}
.trust-item span{font-size:.8125rem;color:var(--muted)}
@media(max-width:860px){.trust-grid{grid-template-columns:1fr 1fr}.trust-item:nth-child(3){border-left:0;padding-left:0}.trust-item:nth-child(n+3){border-top:1px solid var(--hair)}}

/* ----------------------------------------------------------- section heads */
.head{max-width:640px}
.head .eyebrow{display:block;margin-bottom:1.3rem}
.head p{margin-top:1.4rem}
.head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:3rem;flex-wrap:wrap}

/* ---------------------------------------------------------- treatment card */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:4rem}
.cards.three{grid-template-columns:repeat(3,1fr)}
.card-media{border-radius:11rem 11rem .25rem .25rem;overflow:hidden;position:relative}
.card-media img{height:320px;width:100%;object-fit:cover;transition:1.1s var(--ease)}
.card:hover .card-media img{transform:scale(1.06)}
.card-tag{position:absolute;top:1rem;left:1rem;background:rgba(248,245,238,.92);border-radius:999px;
  padding:.35rem .8rem;font-size:.625rem;letter-spacing:.2em;text-transform:uppercase}
.card-body{padding:1.5rem .3rem 0}
.card-body h3{font-size:1.4rem}
.card-body .meta{display:flex;align-items:center;gap:.6rem;font-size:.75rem;color:var(--muted);margin-top:.6rem;flex-wrap:wrap}
.dot{width:3px;height:3px;border-radius:999px;background:var(--stone)}
.card-body p{font-size:.9375rem;color:var(--muted);margin-top:.9rem}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.4rem;padding-top:1.1rem;border-top:1px solid var(--hair)}
.price{font-family:var(--display);font-size:1.5rem}
@media(max-width:1100px){.cards,.cards.three{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.cards,.cards.three{grid-template-columns:1fr}}

/* --------------------------------------------------------------- steps row */
.steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:4rem}
.step{padding:0 2rem;border-left:1px solid var(--hair)}
.step:first-child{border-left:0;padding-left:0}
.step-n{font-family:var(--display);font-size:3.5rem;color:var(--stone);line-height:1}
.step h4{margin:1rem 0 .7rem}
.step p{font-size:.9375rem;color:var(--muted)}
@media(max-width:860px){.steps{grid-template-columns:1fr 1fr;gap:2.5rem 0}}

/* ------------------------------------------------------------ split feature */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.feature.flip .feature-media{order:2}
.feature-media{border-radius:.25rem 14rem 14rem .25rem;overflow:hidden}
.feature.flip .feature-media{border-radius:14rem .25rem .25rem 14rem}
.feature-media img{height:540px;width:100%;object-fit:cover}
.checks{list-style:none;padding:0;margin:2.2rem 0 0;display:grid;gap:1rem}
.checks li{display:flex;gap:.85rem;align-items:flex-start;font-size:.9375rem}
.checks svg{color:var(--sage-deep);font-size:1.05rem;margin-top:.2rem}
.pricebox{margin-top:2.8rem;background:var(--bg);border:1px solid var(--hair);border-radius:.25rem;padding:1.6rem 1.8rem;
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.pricebox .was{color:var(--stone);text-decoration:line-through;font-size:.9375rem;margin-left:.6rem}
@media(max-width:960px){.feature{grid-template-columns:1fr;gap:3rem}.feature.flip .feature-media{order:0}
  .feature-media,.feature.flip .feature-media{border-radius:.25rem}.feature-media img{height:360px}}

/* --------------------------------------------------------------- mosaic */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:150px;gap:1.1rem;margin-top:3.5rem}
.mosaic a{overflow:hidden;position:relative;display:block}
.mosaic img{width:100%;height:100%;object-fit:cover;transition:1.2s var(--ease)}
.mosaic a:hover img{transform:scale(1.07)}
.mosaic a::after{content:"";position:absolute;inset:0;background:var(--sage-deep);opacity:0;transition:.4s}
.mosaic a:hover::after{opacity:.14}
.m1{grid-column:span 2;grid-row:span 2;border-radius:9rem 9rem .25rem .25rem}
.m2{border-radius:.25rem}
.m3{grid-row:span 2;border-radius:.25rem .25rem 6rem 6rem}
.m4{border-radius:.25rem}
.m5{grid-column:span 2;border-radius:.25rem}
@media(max-width:760px){.mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:130px}.m1,.m5{grid-column:span 2}}

/* --------------------------------------------------------------- reviews */
.gwrap{display:flex;align-items:center;gap:1rem;margin-top:2rem;flex-wrap:wrap}
.gbadge{display:flex;align-items:center;gap:.65rem;background:#fff;border:1px solid var(--hair);border-radius:999px;padding:.5rem 1rem;font-size:.8125rem}
.gbadge b{font-family:var(--display);font-size:1.15rem;font-weight:400}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:3.5rem}
.review{background:var(--bg);border:1px solid var(--hair);border-radius:.25rem;padding:2.1rem 1.9rem;display:flex;flex-direction:column;gap:1.1rem}
.review .q{font-family:var(--display);font-size:1.2rem;line-height:1.5;font-style:italic;flex:1}
.review .who{display:flex;align-items:center;gap:.8rem;padding-top:1.1rem;border-top:1px solid var(--hair)}
.review .who img{width:40px;height:40px;border-radius:999px;object-fit:cover}
.review .who b{font-weight:400;font-size:.9375rem;display:block}
.review .who span{font-size:.75rem;color:var(--muted)}
@media(max-width:900px){.reviews{grid-template-columns:1fr}}

/* ------------------------------------------------------------------- team */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;margin-top:4rem}
.member figure{margin:0;border-radius:12rem 12rem .25rem .25rem;overflow:hidden;position:relative}
.member img{width:100%;height:380px;object-fit:cover;filter:saturate(.9);transition:1s var(--ease)}
.member:hover img{filter:saturate(1.05);transform:scale(1.04)}
.member .socials{position:absolute;inset:auto 0 0;display:flex;justify-content:center;gap:.6rem;padding:1.2rem;
  background:linear-gradient(to top,rgba(51,49,44,.72),transparent);opacity:0;transform:translateY(8px);transition:.45s var(--ease)}
.member:hover .socials{opacity:1;transform:none}
.socials a{width:34px;height:34px;border-radius:999px;background:rgba(248,245,238,.9);display:grid;place-items:center;color:var(--ink);transition:.3s}
.socials a:hover{background:var(--sage);color:#fff}
.member h4{margin:1.3rem 0 .3rem;font-size:1.3rem}
.member .role{font-size:.6875rem;letter-spacing:.26em;text-transform:uppercase;color:var(--sage-deep)}
.member p{font-size:.9375rem;color:var(--muted);margin-top:.8rem}
@media(max-width:860px){.team{grid-template-columns:1fr}}

/* -------------------------------------------------------------- price tiers */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:4rem}
.tier{border:1px solid var(--hair);border-radius:.25rem;padding:2.4rem 2rem;background:var(--bg);display:flex;flex-direction:column;transition:.45s var(--ease);position:relative}
.tier:hover{transform:translateY(-6px);box-shadow:0 30px 60px -45px rgba(51,49,44,.5)}
.tier.hot{background:var(--ink);color:#eee8db;border-color:var(--ink)}
.tier.hot .eyebrow,.tier.hot .tprice small,.tier.hot li,.tier.hot p{color:#bdb6a6}
.tier.hot .btn-ghost{border-color:rgba(255,255,255,.28);color:#f8f5ee}
.tier.hot .btn-ghost:hover{background:var(--sage);border-color:var(--sage);color:#fff}
.ribbon{position:absolute;top:1.4rem;right:1.4rem;font-size:.5625rem;letter-spacing:.24em;text-transform:uppercase;
  background:var(--sage);color:#fff;padding:.3rem .7rem;border-radius:999px}
.tprice{font-family:var(--display);font-size:3rem;font-weight:300;line-height:1;margin:1.2rem 0 .3rem}
.tprice small{font-family:var(--body);font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.tier ul{list-style:none;padding:0;margin:1.8rem 0 2.2rem;display:grid;gap:.8rem;font-size:.9375rem;color:var(--muted);flex:1}
.tier li{display:flex;gap:.7rem;align-items:flex-start}
.tier li svg{color:var(--sage);font-size:1rem;margin-top:.2rem}
@media(max-width:900px){.tiers{grid-template-columns:1fr}}

/* -------------------------------------------------------------- price list */
.plist{margin-top:3.5rem;border-top:1px solid var(--hair)}
.plist-row{display:grid;grid-template-columns:1fr auto auto;gap:2rem;align-items:baseline;padding:1.5rem 0;border-bottom:1px solid var(--hair)}
.plist-row h4{font-size:1.35rem}
.plist-row p{font-size:.9375rem;color:var(--muted);margin-top:.35rem;max-width:60ch}
.plist-row .dur{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.plist-row .amt{font-family:var(--display);font-size:1.6rem;white-space:nowrap}
@media(max-width:700px){.plist-row{grid-template-columns:1fr auto}.plist-row .dur{grid-column:1;order:3}}

/* --------------------------------------------------------------------- faq */
.faq{max-width:840px;margin:3.5rem auto 0}
details{border-bottom:1px solid var(--hair)}
details:first-of-type{border-top:1px solid var(--hair)}
summary{cursor:pointer;list-style:none;padding:1.5rem 0;display:flex;align-items:center;justify-content:space-between;gap:2rem;font-family:var(--display);font-size:1.3rem}
summary::-webkit-details-marker{display:none}
summary svg{color:var(--sage-deep);transition:.4s var(--ease);font-size:1.1rem}
details[open] summary svg{transform:rotate(45deg)}
details .ans{padding:0 3rem 1.6rem 0;color:var(--muted);max-width:66ch;font-size:.9375rem}
.faq-foot{margin-top:3rem;display:flex;align-items:center;justify-content:center;gap:1.2rem;flex-wrap:wrap;font-size:.9375rem;color:var(--muted)}

/* ---------------------------------------------------------------- location */
.loc{display:grid;grid-template-columns:1.1fr .9fr;gap:4rem;align-items:start}
.hours{width:100%;border-collapse:collapse;margin-top:2.2rem;font-size:.9375rem}
.hours td{padding:.85rem 0;border-bottom:1px solid var(--hair);color:var(--muted)}
.hours td:last-child{text-align:right;color:var(--ink)}
.hours tr.today td{color:var(--sage-deep)}
.nap{display:grid;gap:1.1rem;margin-top:2.4rem}
.nap div{display:flex;gap:.9rem;align-items:flex-start;font-size:.9375rem}
.nap svg{color:var(--sage-deep);font-size:1.1rem;margin-top:.2rem}
.mapbox{border-radius:.25rem;overflow:hidden;border:1px solid var(--hair);background:var(--linen);position:relative;min-height:440px}
.mapbox img{width:100%;height:100%;min-height:440px;object-fit:cover;opacity:.55;filter:grayscale(1) contrast(.9)}
.pin{position:absolute;inset:0;display:grid;place-items:center}
.pin span{background:var(--bg);border:1px solid var(--hair);border-radius:999px;padding:.7rem 1.2rem;font-size:.8125rem;
  display:flex;align-items:center;gap:.55rem;box-shadow:0 18px 40px -28px rgba(51,49,44,.6)}
@media(max-width:960px){.loc{grid-template-columns:1fr;gap:2.5rem}}

/* location index cards */
.loccards{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3.5rem}
.loccard{border:1px solid var(--hair);background:var(--bg);border-radius:.25rem;overflow:hidden;transition:.45s var(--ease);display:flex;flex-direction:column}
.loccard:hover{transform:translateY(-6px);box-shadow:0 30px 60px -45px rgba(51,49,44,.5)}
.loccard img{height:210px;width:100%;object-fit:cover}
.loccard .lc{padding:1.7rem 1.6rem;display:flex;flex-direction:column;flex:1}
.loccard h3{font-size:1.45rem}
.loccard .addr{font-size:.875rem;color:var(--muted);margin-top:.7rem;flex:1}
.loccard .lc-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.4rem;padding-top:1.1rem;border-top:1px solid var(--hair);font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
@media(max-width:1000px){.loccards{grid-template-columns:1fr 1fr}}
@media(max-width:660px){.loccards{grid-template-columns:1fr}}

/* ------------------------------------------------------------------- blog */
.bfeat{display:grid;grid-template-columns:1.15fr .85fr;gap:3.5rem;align-items:center;margin-top:3.5rem}
.bfeat figure{margin:0;border-radius:.25rem;overflow:hidden}
.bfeat img{width:100%;height:420px;object-fit:cover}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;margin-top:3.5rem}
.post figure{margin:0;overflow:hidden;border-radius:.25rem}
.post img{width:100%;height:240px;object-fit:cover;transition:1.1s var(--ease)}
.post:hover img{transform:scale(1.05)}
.post .pmeta{display:flex;align-items:center;gap:.6rem;font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:1.3rem 0 .8rem;flex-wrap:wrap}
.post h3{font-size:1.4rem}
.post p{font-size:.9375rem;color:var(--muted);margin-top:.8rem}
.chip{display:inline-flex;align-items:center;border:1px solid var(--hair);border-radius:999px;padding:.3rem .8rem;
  font-size:.625rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.chip.on{background:var(--sage-deep);border-color:var(--sage-deep);color:#fff}
.chiprow{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:2.5rem}
.pager{display:flex;align-items:center;justify-content:center;gap:.6rem;margin-top:4rem}
.pager a,.pager span{min-width:42px;height:42px;border:1px solid var(--hair);border-radius:999px;display:grid;place-items:center;font-size:.875rem;padding:0 .8rem}
.pager .on{background:var(--ink);border-color:var(--ink);color:var(--bg)}
@media(max-width:1000px){.posts{grid-template-columns:1fr 1fr}.bfeat{grid-template-columns:1fr;gap:2rem}}
@media(max-width:660px){.posts{grid-template-columns:1fr}}

/* article body */
.article{max-width:720px;margin:0 auto}
.article p,.article ul,.article ol{font-size:1.0625rem;line-height:1.85;color:#4a473f;margin:1.5rem 0}
.article h2{font-size:2rem;margin-top:3.2rem}
.article h3{font-size:1.5rem;margin-top:2.4rem}
.article blockquote{margin:2.5rem 0;padding-left:1.8rem;border-left:2px solid var(--sage);font-family:var(--display);
  font-size:1.5rem;font-style:italic;line-height:1.45}
.article figure{margin:2.5rem 0}
.article figure img{border-radius:.25rem;width:100%;max-height:460px;object-fit:cover}
.article figcaption{font-size:.8125rem;color:var(--muted);margin-top:.7rem}
.article ul{padding-left:1.2rem}
.article a{color:var(--sage-deep);border-bottom:1px solid var(--hair)}
.author{display:flex;align-items:center;gap:1rem;padding:1.8rem 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin:3rem 0}
.author img{width:56px;height:56px;border-radius:999px;object-fit:cover}
.author b{font-weight:400;font-family:var(--display);font-size:1.2rem;display:block}
.author span{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* ---------------------------------------------------------------- contact */
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
form.sform{background:var(--linen);border:1px solid var(--hair);border-radius:.25rem;padding:2.5rem}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.1rem}
.field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.1rem}
.field label{font-size:.625rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{font:inherit;font-family:var(--body);font-size:.9375rem;padding:.9rem 1.1rem;
  border:1px solid var(--hair);border-radius:.25rem;background:var(--bg);color:var(--ink);outline:none;transition:.25s}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--sage-deep);background:#fff}
.checkline{display:flex;gap:.7rem;align-items:flex-start;font-size:.8125rem;color:var(--muted);margin:.4rem 0 1.4rem}
.checkline input{margin-top:.25rem;accent-color:var(--sage-deep)}
form.sform .btn{width:100%;justify-content:center}
.contact-cards{display:grid;gap:1rem}
.ccard{border:1px solid var(--hair);border-radius:.25rem;padding:1.5rem 1.6rem;display:flex;gap:1rem;align-items:flex-start;background:var(--bg)}
.ccard svg{color:var(--sage-deep);font-size:1.2rem;margin-top:.15rem}
.ccard b{font-family:var(--display);font-size:1.2rem;font-weight:400;display:block}
.ccard span,.ccard a{font-size:.9375rem;color:var(--muted)}
.ccard a:hover{color:var(--sage-deep)}
@media(max-width:960px){.cgrid{grid-template-columns:1fr;gap:2.5rem}.frow{grid-template-columns:1fr}}

/* ------------------------------------------------------------------- misc */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3.5rem;padding-top:2.5rem;border-top:1px solid var(--hair)}
.stats b{font-family:var(--display);font-size:2.75rem;font-weight:300;display:block;line-height:1}
.stats span{font-size:.6875rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
blockquote.pull{margin:0;font-family:var(--display);font-size:clamp(1.6rem,2.6vw,2.3rem);line-height:1.35;font-style:italic}
.sig{margin-top:2rem;font-family:var(--display);font-size:1.35rem;font-style:italic;color:var(--sage-deep)}
.sig small{display:block;font-family:var(--body);font-style:normal;font-size:.6875rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);margin-top:.35rem}
.timeline{list-style:none;padding:0;margin:3.5rem 0 0}
.timeline li{display:grid;grid-template-columns:110px 1fr;gap:2rem;padding:1.6rem 0;border-top:1px solid var(--hair)}
.timeline b{font-family:var(--display);font-size:1.6rem;font-weight:300;color:var(--sage-deep)}
.timeline p{font-size:.9375rem;color:var(--muted);margin-top:.3rem}
.timeline h4{font-size:1.2rem}
@media(max-width:620px){.timeline li{grid-template-columns:1fr;gap:.4rem}}
.philo{display:grid;grid-template-columns:.85fr 1.15fr;gap:5rem;align-items:center}
.philo-media{position:relative;padding-bottom:4rem}
.philo-media .a{border-radius:var(--arch);overflow:hidden}
.philo-media .a img{height:520px;width:100%;object-fit:cover}
.philo-media .b{position:absolute;right:-3rem;bottom:0;width:58%;border:8px solid var(--bg);border-radius:.25rem;overflow:hidden}
.philo-media .b img{height:220px;width:100%;object-fit:cover}
@media(max-width:960px){.philo{grid-template-columns:1fr;gap:3.5rem}.philo-media .b{display:none}.philo-media{padding-bottom:0}}

/* internal-link cluster (SEO pages) */
.linkgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2.5rem}
.linkgrid a{border:1px solid var(--hair);border-radius:.25rem;padding:1.1rem 1.3rem;display:flex;align-items:center;
  justify-content:space-between;gap:1rem;font-size:.9375rem;transition:.3s var(--ease);background:var(--bg)}
.linkgrid a:hover{border-color:var(--sage-deep);color:var(--sage-deep);transform:translateY(-3px)}
.linkgrid svg{color:var(--stone);font-size:1rem}
@media(max-width:860px){.linkgrid{grid-template-columns:1fr}}

/* --------------------------------------------------------------------- cta */
.cta{background:var(--ink);color:#f1ece0;text-align:center;padding:7rem 0;position:relative;overflow:hidden}
.cta::after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(241,236,224,.1);border-radius:999px;left:50%;top:50%;transform:translate(-50%,-50%)}
.cta h2,.cta>*{position:relative}
.cta .lead{color:#b6afa0;margin:1.6rem auto 2.8rem;text-align:center}
.cta .btn-solid{background:var(--sage);color:#22241d;border-color:var(--sage)}
.cta .btn-solid:hover{background:#f8f5ee;color:var(--ink);border-color:#f8f5ee}
.cta .btn-ghost{border-color:rgba(255,255,255,.24);color:#f1ece0}
.cta .btn-ghost:hover{background:rgba(255,255,255,.08);color:#fff}

/* ------------------------------------------------------------------ footer */
footer{background:#2b2a26;color:#a8a294;padding:5rem 0 0;font-size:.875rem}
.f-top{display:grid;grid-template-columns:1.4fr .7fr .7fr 1.2fr;gap:3rem;padding-bottom:3.5rem}
footer .brand-name,footer h5{color:#f1ece0}
footer h5{font-family:var(--body);font-size:.625rem;letter-spacing:.3em;text-transform:uppercase;margin:0 0 1.3rem;font-weight:500}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.8rem}
footer a:hover{color:#f1ece0}
.news{display:flex;border:1px solid rgba(241,236,224,.18);border-radius:999px;overflow:hidden;margin-top:1.2rem}
.news input{flex:1;background:transparent;border:0;color:#f1ece0;padding:.9rem 1.2rem;font-family:var(--body);font-size:.875rem;outline:none}
.news input::placeholder{color:#7d786d}
.news button{background:var(--sage);border:0;color:#22241d;padding:0 1.4rem;cursor:pointer;font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;font-family:var(--body)}
.f-contact{display:grid;gap:.4rem;margin-top:1.2rem;font-size:.8125rem;color:#c8c2b4}
.f-contact a{color:inherit}
.f-contact a:hover{color:#f1ece0}
.f-social{display:flex;gap:.6rem;margin-top:1.6rem}
.f-social a{width:36px;height:36px;border:1px solid rgba(241,236,224,.18);border-radius:999px;display:grid;place-items:center;transition:.3s}
.f-social a:hover{background:var(--sage);border-color:var(--sage);color:#22241d}
.f-bot{border-top:1px solid rgba(241,236,224,.12);padding:1.6rem 0;display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;font-size:.75rem}
@media(max-width:900px){.f-top{grid-template-columns:1fr 1fr}}

/* -------------------------------------------------------- sticky mobile bar */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:80;display:none;gap:.7rem;padding:.8rem 1rem;
  background:rgba(248,245,238,.95);backdrop-filter:blur(14px);border-top:1px solid var(--hair)}
.mbar .btn{flex:1;justify-content:center;padding:.9rem 1rem}
@media(max-width:720px){.mbar{display:flex}body{padding-bottom:4.5rem}}

/* ----------------------------------------------------------------- reveal
   Visible by default so a missing site.js (editor saves used to drop it)
   never blanks the page. `html.rv-ready` is set by a head script / site.js
   when scroll reveals are actually wired up. */
.rv{transition:1.1s var(--ease)}
html.rv-ready .rv{opacity:0;transform:translateY(26px)}
html.rv-ready .rv.in, .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .rv, html.rv-ready .rv{opacity:1;transform:none;transition:none}
}