/* ============ TOKENS ============ */
:root{
  color-scheme: light;                 /* committed light identity: a warm cream spa */
  --pine:#22402e;
  --olive:#3c4a29;
  --olive-dk:#2f3a20;
  --sage:#8b9a6d;
  --sage-soft:#c7d0b5;
  --cream:#f5efe2;
  --cream-2:#efe7d6;
  --white:#fffdf8;
  --ink:#32352c;
  --ink-soft:#63665a;
  --gold:#c69a43;
  --line:#e2dac7;

  --serif: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --script: "Snell Roundhand", "Segoe Script", "Brush Script MT", "Apple Chancery", cursive;

  --wrap: 1180px;
  --pad: clamp(1.25rem, 5vw, 2rem);
  --sticky-h: 0px;                      /* raised on mobile to clear the sticky bar */
}

/* ============ RESET ============ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:var(--sans); font-size:1.0625rem; line-height:1.7;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
  padding-bottom:var(--sticky-h);
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3{ font-family:var(--serif); font-weight:normal; line-height:1.12; text-wrap:balance; margin:0; }
p{ margin:0; }
:focus-visible{ outline:3px solid var(--sage); outline-offset:3px; border-radius:2px; }

/* ============ HELPERS ============ */
.wrap{ max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.eyebrow{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.22em;
  font-size:.72rem; font-weight:600; color:var(--sage);
}
.script{ font-family:var(--script); font-style:italic; color:var(--olive); }
.lede{ color:var(--ink-soft); }

/* image frame + labelled placeholder (swap the <img> src for a real photo) */
.frame{ position:relative; overflow:hidden; background:linear-gradient(150deg,var(--cream-2),var(--sage-soft)); }
.frame img{ width:100%; height:100%; object-fit:cover; }
.frame .tag{
  position:absolute; inset:auto 0 0 0; margin:0 auto 0; width:max-content; max-width:88%;
  transform:translateY(-1rem);
  font-family:var(--sans); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--olive); background:rgba(255,253,248,.82); backdrop-filter:blur(2px);
  padding:.4rem .7rem; border-radius:100px; text-align:center;
}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex; align-items:center; gap:.55rem; justify-content:center;
  font-family:var(--sans); font-weight:600; font-size:1rem; letter-spacing:.01em;
  padding:.95rem 1.5rem; border-radius:100px; text-decoration:none; cursor:pointer;
  border:1.5px solid transparent; transition:transform .18s ease, background .18s ease, color .18s ease;
}
.btn svg{ width:1.15em; height:1.15em; flex:none; }
.btn-primary{ background:var(--olive); color:#fff; }
.btn-primary:hover{ background:var(--olive-dk); transform:translateY(-2px); }
.btn-ghost{ background:transparent; color:var(--olive); border-color:var(--olive); }
.btn-ghost:hover{ background:var(--olive); color:#fff; transform:translateY(-2px); }
.btn-light{ background:rgba(255,253,248,.16); color:#fff; border-color:rgba(255,253,248,.55); backdrop-filter:blur(3px); }
.btn-light:hover{ background:#fff; color:var(--olive); }

/* ============ HEADER ============ */
.site-head{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.6rem var(--pad); background:rgba(245,239,226,.9); backdrop-filter:blur(8px);
  transition:box-shadow .25s ease, background .25s ease;
}
.site-head.scrolled{ box-shadow:0 6px 24px rgba(34,64,46,.08); background:rgba(245,239,226,.97); }
@font-face{ font-family:"Cinzel"; font-style:normal; font-weight:600; font-display:swap; src:url("../fonts/cinzel-600.woff2") format("woff2"); }
.brand{ display:flex; align-items:center; gap:.65rem; text-decoration:none; color:var(--pine); }
.brand img{ width:60px; height:60px; border-radius:50%; }
.brand b{ font-family:"Cinzel","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif; font-size:1.16rem; letter-spacing:.06em; line-height:1; color:var(--pine); font-weight:600; text-transform:uppercase; white-space:nowrap; }
.brand span{ display:block; font-family:var(--sans); font-size:.6rem; letter-spacing:.18em; text-transform:uppercase; color:var(--sage); margin-top:.2rem; }
.nav{ display:none; }
.nav a{ text-decoration:none; font-size:.95rem; color:var(--ink); padding:.4rem .1rem; position:relative; }
.nav a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:1.5px; background:var(--olive); transition:width .2s ease; }
.nav a:hover::after{ width:100%; }
.head-cta{ display:none; }
.burger{ background:none; border:0; padding:.4rem; cursor:pointer; color:var(--pine); }
.burger svg{ width:28px; height:28px; }

/* mobile drawer */
.drawer{
  position:fixed; inset:0; z-index:60; background:var(--cream);
  display:flex; flex-direction:column; padding:1.2rem var(--pad);
  transform:translateX(100%); transition:transform .3s ease; visibility:hidden;
}
.drawer.open{ transform:none; visibility:visible; }
.drawer-top{ display:flex; justify-content:space-between; align-items:center; }
.drawer nav{ display:flex; flex-direction:column; gap:.2rem; margin-top:2rem; }
.drawer nav a{ text-decoration:none; font-family:var(--serif); font-size:1.7rem; color:var(--pine); padding:.6rem 0; border-bottom:1px solid var(--line); }
.drawer .btn{ margin-top:2rem; }

/* ============ HERO ============ */
.hero{ position:relative; min-height:88vh; display:flex; align-items:flex-end; }
.hero .frame{ position:absolute; inset:0; background:linear-gradient(160deg,#d8dcc4,#9fae82); }
.hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(31,45,25,.72) 0%, rgba(31,45,25,.28) 45%, rgba(31,45,25,.05) 100%); }
.hero-inner{ position:relative; z-index:2; color:#fff; padding:0 var(--pad) clamp(2.5rem,7vw,4.5rem); max-width:var(--wrap); margin-inline:auto; width:100%; }
.hero .script{ color:#e8e2cf; font-size:clamp(1.4rem,6vw,2.1rem); display:block; margin-bottom:.4rem; }
.hero h1{ color:#fff; font-size:clamp(2.3rem,9vw,4.4rem); max-width:14ch; }
.hero p{ color:rgba(255,255,255,.92); margin-top:1.1rem; max-width:44ch; font-size:1.08rem; }
.hero-btns{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.8rem; }

/* ============ SECTIONS ============ */
section{ position:relative; }
.pad-y{ padding-block:clamp(3.5rem,10vw,6.5rem); }
.intro{ text-align:center; }
.intro .eyebrow{ display:block; margin-bottom:1rem; }
.intro h2{ font-size:clamp(1.8rem,6vw,3rem); max-width:20ch; margin-inline:auto; color:var(--pine); }
.intro p{ max-width:52ch; margin:1.4rem auto 0; }
.paw-rule{ display:flex; align-items:center; justify-content:center; gap:1rem; margin:0 auto 1.6rem; color:var(--sage); }
.paw-rule::before,.paw-rule::after{ content:""; height:1px; width:min(22vw,120px); background:var(--line); }

/* editorial service rows: full-bleed photo + airy text */
.svc{ display:flex; flex-direction:column; }
.svc .frame{ aspect-ratio:4/3; }
.svc .body{ padding:clamp(1.8rem,7vw,3rem) var(--pad); }
.svc .eyebrow{ display:block; margin-bottom:.7rem; }
.svc h2{ font-size:clamp(1.7rem,6vw,2.5rem); color:var(--pine); }
.svc .body>p{ margin-top:.9rem; max-width:46ch; color:var(--ink-soft); }
.svc ul{ list-style:none; margin:1.3rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem .9rem; }
.svc li{
  font-size:.92rem; color:var(--ink); background:var(--white);
  border:1px solid var(--line); border-radius:100px; padding:.32rem .85rem;
}
.svc .more{ display:inline-flex; align-items:center; gap:.4rem; margin-top:1.5rem; text-decoration:none; color:var(--olive); font-weight:600; }
.svc .more svg{ width:1em; transition:transform .2s ease; }
.svc .more:hover svg{ transform:translateX(4px); }
.svc.alt{ background:var(--cream-2); }

/* ============ WHY ============ */
.why{ background:var(--pine); color:#f3efe2; text-align:center; }
.why h2{ color:#fff; font-size:clamp(1.7rem,6vw,2.6rem); }
.why .grid{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem 1.4rem; margin-top:2.2rem; text-align:left; }
.why .grid p{ display:flex; gap:.6rem; align-items:flex-start; font-size:1rem; color:#e7e3d3; }
.why .grid svg{ width:1.2em; flex:none; color:var(--sage-soft); margin-top:.15rem; }

/* ============ WHY + GROOMING & SPA (merged two-column green section) ============ */
.why-cols{ display:grid; grid-template-columns:1fr; gap:clamp(2rem,5vw,3.4rem); margin-top:2.4rem; text-align:left; }
.why .why-cols .grid{ grid-template-columns:1fr 1fr; max-width:none; margin-inline:0; margin-top:1.6rem; }
/* Grooming & Spa column sits directly on the green (no white card) */
.why-cols .price-col{ background:transparent; border:0; border-radius:0; box-shadow:none; padding:0; transition:none; }
.why-cols .price-col:hover{ transform:none; box-shadow:none; }
.why-cols .price-col h3{ color:#fff; border-bottom-color:rgba(255,255,255,.22); }
.why-cols .price-row dt{ color:#e7e3d3; }
.why-cols .price-row dd{ color:#e3c37a; }
.why-cols .price-row .dots{ border-bottom-color:rgba(255,255,255,.28); }
.why-cols .price-note{ color:rgba(231,227,211,.82); }
@media (min-width:760px){
  .why-cols{ grid-template-columns:1.1fr .9fr; align-items:start; }
  .why-cols .price-col{ border-left:1px solid rgba(255,255,255,.14); padding-left:clamp(1.6rem,3vw,2.8rem); }
}

/* ============ PRICES (list) ============ */
.price-col h3{ font-family:var(--serif); font-size:1.35rem; color:var(--pine); padding-bottom:.7rem; border-bottom:2px solid var(--sage-soft); }
.price-col dl{ margin:1rem 0 0; }
.price-row{ display:flex; align-items:baseline; gap:.6rem; padding:.5rem 0; }
.price-row dt{ color:var(--ink); }
.price-row .dots{ flex:1; border-bottom:1px dotted #c8c0aa; transform:translateY(-4px); }
.price-row dd{ margin:0; font-variant-numeric:tabular-nums; font-weight:600; color:var(--pine); white-space:nowrap; }
.price-note{ margin-top:1rem; font-size:.85rem; color:var(--ink-soft); font-style:italic; }
.offer{ margin-top:2.4rem; text-align:center; font-family:var(--serif); font-size:1.15rem; color:var(--olive); }
.offer b{ color:var(--pine); }

/* ============ GALLERY ============ */
.gallery h2{ text-align:center; color:var(--pine); font-size:clamp(1.7rem,6vw,2.6rem); }
.rail{ display:flex; gap:.8rem; overflow-x:auto; padding:2rem var(--pad) .6rem; -webkit-overflow-scrolling:touch; scrollbar-width:none; -ms-overflow-style:none; }
.rail::-webkit-scrollbar{ display:none; }
.rail .frame{ flex:0 0 78%; max-width:340px; aspect-ratio:3/4; border-radius:14px; scroll-snap-align:center; }
.gallery .center{ text-align:center; margin-top:1rem; }

/* ============ REVIEWS ============ */
.reviews{ text-align:center; }
.reviews h2{ color:var(--pine); font-size:clamp(1.7rem,6vw,2.6rem); }
.rating-line{ margin-top:.8rem; color:var(--ink-soft); }
.rating-line b{ color:var(--pine); }
.quotes{ display:flex; gap:1.3rem; overflow-x:auto; align-items:stretch; padding:.3rem .1rem; -webkit-overflow-scrolling:touch; scrollbar-width:none; -ms-overflow-style:none; }
.quotes::-webkit-scrollbar{ display:none; }
.quotes::-webkit-scrollbar-thumb{ background:var(--sage-soft); border-radius:100px; }
.quote{ flex:0 0 86%; max-width:340px; scroll-snap-align:center; }
.quote .stars{ color:var(--gold); letter-spacing:.15em; font-size:1rem; }
.quote p{ font-family:var(--serif); font-size:1.02rem; line-height:1.55; color:var(--ink); margin:.7rem 0 0; text-align:left; }
.rv-meta{ margin-top:auto; padding-top:1.1rem; }
.rv-meta .stars{ margin-bottom:.45rem; }
.rv-name{ display:block; font-weight:600; color:var(--pine); font-size:.92rem; }
.rv-src{ display:block; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--sage); margin-top:.15rem; }

/* ============ CONTACT ============ */
.contact{ background:var(--cream-2); }
.contact .cols{ display:grid; grid-template-columns:1fr; gap:2rem; margin-top:2rem; align-items:start; }
.contact h2{ color:var(--pine); font-size:clamp(1.8rem,6vw,2.8rem); }
.contact .info{ display:flex; flex-direction:column; gap:1.1rem; margin-top:1.5rem; }
.contact .info .row, .contact-aside .info .row{ display:flex; gap:.75rem; align-items:flex-start; }
.contact .info svg, .contact-aside .info svg{ width:1.25em; height:1.25em; flex:none; color:var(--sage); margin-top:.2rem; }
.contact .info a{ text-decoration:none; }
.contact .hours{ font-variant-numeric:tabular-nums; }
.contact .map{ aspect-ratio:4/3; border-radius:16px; }
.contact .btn{ margin-top:1.6rem; }

/* ============ FOOTER ============ */
.foot{ background:var(--olive); color:#eef0e2; }
.foot-grid{ display:grid; grid-template-columns:1fr; gap:2.4rem; padding-block:clamp(2.8rem,8vw,4rem); }
.foot img.logo{ width:120px; height:120px; border-radius:50%; margin-bottom:1rem; }
.foot h3{ font-family:var(--serif); font-size:1.3rem; color:#fff; }
.foot p,.foot a{ color:#dfe2cf; text-decoration:none; font-size:.96rem; }
.foot .phone{ display:inline-flex; gap:.5rem; align-items:center; margin-top:1rem; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.3); padding:.55rem 1.1rem; border-radius:100px; font-weight:600; }
.foot .socials{ display:flex; gap:.7rem; margin-top:1.1rem; }
.foot .socials a{ width:42px; height:42px; border:1px solid rgba(255,255,255,.3); border-radius:50%; display:grid; place-items:center; }
.foot .socials svg{ width:20px; height:20px; }
.foot .socials a:hover{ background:rgba(255,255,255,.14); }
.legal{ border-top:1px solid rgba(255,255,255,.15); padding:1.2rem var(--pad); text-align:center; font-size:.8rem; color:#c3c8b2; }

/* ============ STICKY MOBILE WHATSAPP ============ */
.sticky-wa{
  position:fixed; left:0; right:0; bottom:0; z-index:55;
  padding:.6rem var(--pad) calc(.6rem + env(safe-area-inset-bottom));
  background:linear-gradient(to top, var(--cream) 60%, rgba(245,239,226,0));
}
.sticky-wa .btn{ width:100%; box-shadow:0 8px 24px rgba(34,64,46,.25); }

/* ============ MOTION (GSAP sets initial hidden state at runtime; no-JS shows all) ============ */
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
/* interactive gallery */
.rail .frame{ cursor:pointer; }
.rail .frame img{ transition:transform .5s cubic-bezier(.22,1,.36,1); }
.rail .frame:hover img{ transform:scale(1.06); }
/* interactive cards: prices + reviews */
.price-col{ background:var(--white); border:1px solid var(--line); border-radius:16px; padding:1.7rem 1.4rem; transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease; }
.price-col:hover{ transform:translateY(-6px); box-shadow:0 20px 44px rgba(34,64,46,.13); }
.quote{ background:var(--white); border:1px solid var(--line); border-radius:18px; padding:1.5rem 1.4rem 1.6rem; box-shadow:0 6px 22px rgba(34,64,46,.06); display:flex; flex-direction:column; text-align:left; transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease; }
.quote:hover{ transform:translateY(-8px); box-shadow:0 26px 52px rgba(34,64,46,.16); }

/* ============ RESPONSIVE (min-width = enhance up from mobile) ============ */
@media (min-width:600px){
  .why .grid{ gap:1rem 2rem; }
  .quote{ flex-basis:44%; }
  .rail .frame{ flex-basis:44%; }
}
@media (min-width:900px){
  body{ padding-bottom:0; }                 /* sticky bar hidden on desktop */
  .sticky-wa{ display:none; }
  .nav{ display:flex; gap:1.6rem; }
  .head-cta{ display:inline-flex; }
  .burger{ display:none; }
  .svc{ display:grid; grid-template-columns:1fr 1fr; align-items:center; }
  .svc .frame{ aspect-ratio:auto; height:100%; min-height:460px; }
  .svc .body{ padding:clamp(2rem,4vw,3.5rem); }
  .svc.rev .frame{ order:2; }
  .why .grid{ grid-template-columns:repeat(4,1fr); max-width:960px; margin-inline:auto; }
  .contact .cols{ grid-template-columns:1.05fr 1fr; gap:3rem; }
  .rail .frame{ flex-basis:24%; max-width:300px; }
  .foot-grid{ grid-template-columns:1.2fr 1fr auto; align-items:start; gap:3rem; }
}

/* ============ HERO BANNER (client-supplied banner with baked-in text) ============ */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hero-banner{background:var(--cream)}
.hero-banner-img{width:100%;height:auto;display:block}
.hero-cta{display:flex;flex-wrap:nowrap;gap:.8rem;justify-content:center;padding:clamp(1.3rem,4vw,2rem) var(--pad) 0}
.hero-cta .btn{white-space:nowrap}
@media (max-width:430px){
  .hero-cta{gap:.5rem}
  .hero-cta .btn{padding:.75rem .7rem;font-size:.86rem;gap:.4rem}
  .hero-cta .btn svg{width:1em;height:1em}
}

/* ============ UTILITIES (replacing former inline styles) ============ */
.tac{ text-align:center; }
.mt-1{ margin-top:1rem; }
.mt-2{ margin-top:2rem; }
.eyebrow-center{ display:block; text-align:center; margin-bottom:.8rem; }
.lbl-white{ color:#fff; font-weight:600; }
.btn-row{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem; }
.btn-row .btn{ margin-top:0; }

/* ============ ANCHOR SCROLL OFFSET (clear the sticky header) ============ */
:where(#top,#services,#gallery,#reviews,#contact,#prices){ scroll-margin-top:78px; }

/* ============ CONTACT FORM PAGE ============ */
.page-head{ background:var(--cream-2); text-align:center; padding:clamp(2.6rem,8vw,4.2rem) var(--pad); }
.page-head .eyebrow{ display:block; margin-bottom:.8rem; }
.page-head h1{ font-family:var(--serif); color:var(--pine); font-size:clamp(2rem,7vw,3rem); }
.page-head p{ max-width:52ch; margin:1rem auto 0; color:var(--ink-soft); }
.contact-form-grid{ display:grid; grid-template-columns:1fr; gap:2.4rem; }
.contact-form-grid form{ display:flex; flex-direction:column; gap:1.1rem; background:var(--white); border:1px solid var(--line); border-radius:18px; box-shadow:0 10px 30px rgba(34,64,46,.07); padding:clamp(1.5rem,4vw,2.2rem); }
.field-row{ display:grid; grid-template-columns:1fr; gap:1.1rem; }
.contact-form-grid form button[type="submit"]{ width:100%; margin-top:.3rem; }
@media (min-width:560px){ .field-row{ grid-template-columns:1fr 1fr; } }
.field{ display:flex; flex-direction:column; gap:.4rem; }
.field label{ font-size:.85rem; font-weight:600; color:var(--pine); letter-spacing:.02em; }
.field input,.field textarea{ font-family:var(--sans); font-size:16px; color:var(--ink); background:var(--white); border:1px solid var(--line); border-radius:12px; padding:.85rem 1rem; width:100%; transition:border-color .2s ease, box-shadow .2s ease; }
.field textarea{ min-height:150px; resize:vertical; }
.field input:focus,.field textarea:focus{ outline:none; border-color:var(--sage); box-shadow:0 0 0 3px rgba(139,154,109,.28); }
.form-status{ background:#e7efdd; border:1px solid var(--sage); color:var(--pine); border-radius:12px; padding:1rem 1.2rem; font-weight:600; }
.form-status.error{ background:#f8e3df; border-color:#c1554a; color:#7a2a20; }
.contact-aside{ background:var(--cream-2); border-radius:16px; padding:1.8rem 1.6rem; align-self:start; }
.contact-aside h2{ font-family:var(--serif); color:var(--pine); font-size:1.4rem; margin-bottom:.4rem; }
@media (min-width:900px){ .contact-form-grid{ grid-template-columns:1.3fr .9fr; gap:3rem; } }


/* ============ SERVICE CARDS (4-column) ============ */
.services-section{ background:var(--cream); }
.svc-grid{ display:grid; grid-template-columns:1fr; gap:1.5rem; margin-top:2.6rem; align-items:stretch; }
.svc-card{ background:var(--white); border:1px solid var(--line); border-radius:18px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 6px 22px rgba(34,64,46,.06); transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease; }
.svc-card:hover{ transform:translateY(-8px); box-shadow:0 26px 52px rgba(34,64,46,.16); }
.svc-card-img{ aspect-ratio:4/3; overflow:hidden; background:var(--sage-soft); }
.svc-card-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.22,1,.36,1); }
.svc-card:hover .svc-card-img img{ transform:scale(1.07); }
.svc-card-body{ padding:1.5rem 1.4rem 1.6rem; display:flex; flex-direction:column; flex:1; }
.svc-card-body h3{ font-family:var(--serif); color:var(--pine); font-size:1.32rem; }
.svc-card-body>p{ margin-top:.6rem; color:var(--ink-soft); font-size:.97rem; }
.svc-features{ list-style:none; margin:.95rem 0 0; padding:0; display:grid; gap:.5rem; }
.svc-features li{ position:relative; padding-left:1.55rem; font-size:.9rem; color:var(--ink-soft); line-height:1.4; }
.svc-features li::before{ content:""; position:absolute; left:0; top:.12em; width:1.05rem; height:1.05rem; background:var(--sage); -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/contain no-repeat; mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/contain no-repeat; }
.svc-link{ margin-top:auto; padding-top:1.2rem; display:inline-flex; align-items:center; gap:.4rem; text-decoration:none; color:var(--olive); font-weight:600; font-size:.95rem; }
.svc-link svg{ width:1em; transition:transform .2s ease; }
.svc-link:hover svg{ transform:translateX(4px); }
@media (min-width:560px){ .svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .svc-grid{ grid-template-columns:repeat(4,1fr); gap:1.3rem; } }


/* ============ HEADER ACTIONS (call + whatsapp + burger) ============ */
.head-actions{ display:flex; align-items:center; gap:.55rem; }
.site-head .head-call, .site-head .head-cta{ padding:.65rem 1.1rem; font-size:.94rem; }
.head-call{ white-space:nowrap; }
.head-call svg{ width:1.05em; height:1.05em; }
@media (max-width:430px){
  .site-head{ gap:.5rem; }
  .brand > span{ display:none; }
  .site-head .head-call{ padding:.5rem .72rem; font-size:.85rem; gap:.35rem; }
}


/* ============ SERVICE CARD ICON BADGES ============ */
.svc-card-icon{ width:56px; height:56px; border-radius:50%; color:#fff; display:grid; place-items:center; margin:-42px 0 .7rem; position:relative; z-index:1; overflow:hidden; border:3px solid var(--white);
  background:
    radial-gradient(120% 120% at 32% 20%, rgba(255,255,255,.6), rgba(255,255,255,0) 46%),
    linear-gradient(155deg, #3c6248 0%, var(--pine) 52%, #16281c 100%);
  box-shadow:0 10px 20px rgba(34,64,46,.30), inset 0 2px 2px rgba(255,255,255,.5), inset 0 -6px 10px rgba(0,0,0,.20);
  transition:transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease; }
.svc-card-icon::before{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:2;
  background:linear-gradient(72deg, rgba(255,255,255,0) 38%, rgba(255,255,255,.5) 50%, rgba(255,255,255,0) 62%);
  transform:translateX(-140%); transition:transform .7s cubic-bezier(.22,1,.36,1); }
.svc-card:hover .svc-card-icon{ transform:translateY(-4px) scale(1.08) rotate(-4deg); box-shadow:0 16px 30px rgba(34,64,46,.38), inset 0 2px 2px rgba(255,255,255,.55), inset 0 -6px 10px rgba(0,0,0,.22); }
.svc-card:hover .svc-card-icon::before{ transform:translateX(140%); }
.svc-card-icon svg{ width:27px; height:27px; position:relative; z-index:1; filter:drop-shadow(0 1px 1px rgba(0,0,0,.28)); }
@media (prefers-reduced-motion:reduce){ .svc-card-icon,.svc-card-icon::before{ transition:none; } }
/* ============ FOOTER call-above-whatsapp ============ */
.foot-cta{ display:flex; flex-direction:column; align-items:flex-start; gap:.8rem; margin-top:1rem; }
.foot-cta .phone,.foot-cta .btn{ margin-top:0; }
/* ============ EMBEDDED MAP ============ */
.map iframe{ width:100%; height:100%; border:0; display:block; }
.map-ph{ display:grid; place-items:center; width:100%; height:100%; background:linear-gradient(150deg,var(--cream-2),var(--sage-soft)); color:var(--olive); font-weight:600; text-decoration:none; text-align:center; padding:1rem; }

@media (min-width:1000px){ .quote{ flex-basis:23%; } }


/* ============ REVIEWS SLIDER (arrows + hidden scrollbar) ============ */
.reviews-slider{ position:relative; margin-top:2.6rem; }
.rv-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:rgba(255,253,248,.94); color:var(--pine); display:grid; place-items:center; cursor:pointer; box-shadow:0 6px 18px rgba(34,64,46,.15); transition:background .2s ease, color .2s ease; }
.rv-arrow:hover{ background:var(--pine); color:#fff; }
.rv-arrow svg{ width:22px; height:22px; }
.rv-prev{ left:-6px; }
.rv-next{ right:-6px; }
@media (max-width:560px){ .rv-arrow{ width:38px; height:38px; } .rv-arrow svg{ width:19px; height:19px; } .rv-prev{ left:2px; } .rv-next{ right:2px; } }


/* ============ LIVE "OPEN NOW" STATUS PILL ============ */
.open-status{ display:inline-flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:600; padding:.34rem .72rem; border-radius:999px; border:1px solid var(--line); background:var(--white); color:var(--ink); line-height:1; white-space:nowrap; vertical-align:middle; }
.open-status[hidden]{ display:none; }
.open-status .os-dot{ width:.58rem; height:.58rem; border-radius:50%; background:#9aa08f; flex:none; }
.open-status .os-sub{ font-weight:500; opacity:.72; }
.open-status.is-open{ color:#2f6b3a; border-color:#bfe0c4; background:#eef7ef; }
.open-status.is-open .os-dot{ background:#3fae5a; animation:osPulse 2.2s ease-out infinite; }
.open-status.is-closed{ color:#8a5a2a; border-color:#eadfce; background:#faf4ea; }
.open-status.is-closed .os-dot{ background:#c98b3f; }
.open-status--head{ margin-right:.15rem; }
@keyframes osPulse{ 0%{ box-shadow:0 0 0 0 rgba(63,174,90,.5);} 70%{ box-shadow:0 0 0 7px rgba(63,174,90,0);} 100%{ box-shadow:0 0 0 0 rgba(63,174,90,0);} }
.contact .row.hours .open-status{ margin-top:.55rem; }
@media (max-width:899px){ .open-status--head{ display:none; } }
@media (prefers-reduced-motion:reduce){ .open-status.is-open .os-dot{ animation:none; } }


/* ============ GLOSSY WHY-CHOOSE TICK CHIPS ============ */
.why .grid p{ align-items:center; }
.why .grid svg{ width:2em; height:2em; flex:none; padding:.46em; border-radius:50%; margin-top:0; color:#fff;
  background:
    radial-gradient(120% 120% at 32% 22%, rgba(255,255,255,.55), rgba(255,255,255,0) 46%),
    linear-gradient(155deg, #9aa87c 0%, var(--sage) 55%, #566040 100%);
  box-shadow:0 6px 14px rgba(0,0,0,.28), inset 0 1px 1px rgba(255,255,255,.55), inset 0 -4px 8px rgba(0,0,0,.2); }


/* ============ GLOSSY BUTTON SHINE SWEEP ============ */
.btn-primary{ position:relative; overflow:hidden; }
.btn-primary > *{ position:relative; z-index:1; }
.btn-primary::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:linear-gradient(72deg, rgba(255,255,255,0) 40%, rgba(255,255,255,.38) 50%, rgba(255,255,255,0) 60%);
  transform:translateX(-165%); transition:transform .75s cubic-bezier(.22,1,.36,1); }
.btn-primary:hover::after{ transform:translateX(165%); }
@media (prefers-reduced-motion:reduce){ .btn-primary::after{ transition:none; } }


/* ============ GALLERY DRAG-TO-SCROLL ============ */
.gallery .rail{ cursor:grab; }
.gallery .rail.dragging{ cursor:grabbing; scroll-snap-type:none; scroll-behavior:auto; user-select:none; }
.gallery .rail.dragging img{ pointer-events:none; }


/* ============ INTRO LOGO WATERMARK (desktop only) ============ */
.intro-watermark{ display:none; }
@media (min-width:1000px){
  .intro > .wrap{ position:relative; }
  .intro-watermark{ display:block; position:absolute; top:50%; right:0; transform:translateY(-50%);
    width:min(260px,24vw); height:auto; opacity:.1; border-radius:50%; pointer-events:none; z-index:0; }
  .intro > .wrap > :not(.intro-watermark){ position:relative; z-index:1; }
}


/* ============ 404 / PAGE NOT FOUND ============ */
.err404{ padding-block:clamp(2.25rem,6vw,4.5rem); }
.err404 > .wrap{ display:grid; gap:clamp(1.8rem,5vw,3rem); align-items:center; }
@media (min-width:820px){
  .err404 > .wrap{ grid-template-columns:0.92fr 1.08fr; gap:clamp(2.5rem,5vw,4.5rem);
    min-height:calc(100vh - 210px); }
}

/* the guilty puppy + chewed cable */
.err404-media{ position:relative; width:100%; max-width:440px; margin-inline:auto; }
.err404-media .frame{ aspect-ratio:4/5; border-radius:26px; border:6px solid var(--white);
  box-shadow:0 34px 60px -34px rgba(34,64,46,.5); will-change:transform; }
.err404-media .frame img{ width:100%; height:100%; object-fit:cover; }
.err404-bubble{ position:absolute; top:.9rem; right:.5rem; max-width:14.5rem;
  font-family:var(--serif); font-size:1.02rem; line-height:1.32; color:var(--pine);
  background:var(--white); border:1px solid var(--line); border-radius:16px 16px 16px 4px;
  padding:.65rem .95rem; box-shadow:0 16px 32px -16px rgba(34,64,46,.45);
  will-change:transform, opacity; }
.err404-bubble::after{ content:""; position:absolute; left:1.4rem; bottom:-8px; width:15px; height:15px;
  background:var(--white); border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  transform:rotate(45deg); }

/* the copy column */
.err404-copy .eyebrow{ display:block; margin-bottom:.55rem; }
.err404-num{ font-family:var(--serif); font-weight:700; line-height:.82; letter-spacing:-.02em;
  font-size:clamp(4.5rem,15vw,8.5rem); color:var(--pine);
  background:linear-gradient(158deg,var(--olive) 10%,var(--sage) 90%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.err404-copy h1{ color:var(--pine); font-size:clamp(1.85rem,5.5vw,2.9rem); margin-top:.35rem; }
.err404-copy .lede{ margin-top:1rem; max-width:46ch; }
.err404-btns{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.8rem; }
.err404-links{ display:flex; flex-wrap:wrap; align-items:center; gap:.45rem 1.1rem;
  margin-top:2rem; padding-top:1.35rem; border-top:1px solid var(--line); }
.err404-links-lbl{ font-family:var(--sans); text-transform:uppercase; letter-spacing:.16em;
  font-size:.68rem; font-weight:600; color:var(--sage); }
.err404-links a{ text-decoration:none; color:var(--olive); font-weight:600; font-size:.95rem; position:relative; }
.err404-links a::after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px;
  background:var(--olive); transition:width .2s ease; }
.err404-links a:hover::after{ width:100%; }
@media (max-width:520px){ .err404-bubble{ font-size:.92rem; max-width:12rem; } }
