/* Shady Waggers — shared site styles (homepage + neighborhood landing pages) */
:root{
  --teal:#17B2A2;
  --teal-deep:#0E8577;
  --teal-ink:#0A5C52;
  --gold:#C79A3B;
  --gold-soft:#E7CE86;
  --ink:#151515;
  --ink-soft:#4a4a4a;
  --muted:#6b7472;
  --cream:#FBFAF7;
  --paper:#ffffff;
  --line:#e7eae9;
  --shadow:0 18px 50px -20px rgba(14,133,119,.35);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Poppins',system-ui,sans-serif;line-height:1.15;margin:0 0 .4em;font-weight:700;letter-spacing:-.01em}
h1{font-size:clamp(2.3rem,5.4vw,4rem)}
h2{font-size:clamp(1.8rem,3.8vw,2.9rem)}
h3{font-size:clamp(1.15rem,2vw,1.4rem)}
p{margin:0 0 1rem}
a{color:var(--teal-deep);text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1140px;margin:0 auto;padding:0 22px}
.eyebrow{font-family:'Poppins';text-transform:uppercase;letter-spacing:.18em;font-size:.74rem;font-weight:700;color:var(--gold);margin-bottom:1rem}
.center{text-align:center}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;justify-content:center;
  font-weight:700;font-size:1.02rem;padding:1rem 1.7rem;border-radius:999px;
  border:2px solid transparent;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,background .2s;
  text-align:center;
}
.btn-primary{background:var(--gold);color:#2a2000;box-shadow:0 12px 30px -10px rgba(199,154,59,.7)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 36px -8px rgba(199,154,59,.85)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-dark{background:var(--teal-deep);color:#fff}
.btn-dark:hover{transform:translateY(-2px);background:var(--teal-ink)}
.btn-lg{font-size:1.12rem;padding:1.15rem 2.1rem}

/* Nav */
header.nav{position:sticky;top:0;z-index:50;background:rgba(251,250,247,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:.7rem 22px;max-width:1140px;margin:0 auto;gap:1rem}
.brand{display:flex;align-items:center;gap:.6rem;font-family:'Poppins';font-weight:700;font-size:1.25rem;color:var(--ink)}
.brand img{height:44px;width:auto}
.brand .mark{height:44px;width:44px;border-radius:12px;background:var(--teal);display:flex;align-items:center;justify-content:center;font-size:1.5rem}
.nav-links{display:flex;align-items:center;gap:1.4rem}
.nav-links a.nl{color:var(--ink-soft);font-weight:600;font-size:.95rem}
.nav-links a.nl:hover{color:var(--teal-deep)}
.nav-phone{font-weight:700;color:var(--ink)}
@media(max-width:860px){.nav-links a.nl,.nav-phone{display:none}}

/* Hero */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(1200px 500px at 80% -10%,rgba(23,178,162,.18),transparent 60%),
  linear-gradient(180deg,#0c6a5f 0%,#0E8577 55%,#0A5C52 100%);
  color:#fff}
.hero .wrap{position:relative;z-index:2;padding:clamp(3rem,7vw,5.5rem) 22px clamp(3.5rem,7vw,5rem)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:2rem}}
.fourseasons-badge{display:inline-flex;align-items:center;gap:.6rem;background:rgba(255,255,255,.12);border:1px solid rgba(231,206,134,.5);color:#fff;padding:.5rem .95rem;border-radius:999px;font-size:.82rem;font-weight:600;margin-bottom:1.4rem}
.fourseasons-badge b{color:var(--gold-soft)}
.hero h1{color:#fff}
.hero h1 .u{color:var(--gold-soft);position:relative;white-space:nowrap}
.hero .lede{font-size:clamp(1.05rem,1.6vw,1.28rem);color:rgba(255,255,255,.92);max-width:38ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.8rem 0 1.3rem}
.hero-sub{font-size:.9rem;color:rgba(255,255,255,.8)}
.hero-sub b{color:#fff}
.hero-card{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);border-radius:22px;padding:1.4rem;backdrop-filter:blur(6px)}
.hero-photo{aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:
  linear-gradient(135deg,rgba(231,206,134,.28),rgba(23,178,162,.15)),#0a5c52;
  display:flex;align-items:center;justify-content:center;text-align:center;color:rgba(255,255,255,.6);font-size:.85rem;padding:1rem}
.hero-photo img{width:100%;height:100%;object-fit:cover}

/* Trust bar */
.trustbar{background:var(--ink);color:#fff}
.trustbar .wrap{display:flex;flex-wrap:wrap;gap:1.2rem 2.4rem;justify-content:center;padding:1.05rem 22px;font-size:.9rem}
.trustbar span{display:inline-flex;align-items:center;gap:.5rem;color:rgba(255,255,255,.9);font-weight:600}
.trustbar b{color:var(--gold-soft)}

section{padding:clamp(3.2rem,6vw,5.5rem) 0}
.bg-cream{background:var(--cream)}
.bg-teal{background:linear-gradient(180deg,#0E8577,#0A5C52);color:#fff}
.lead-in{max-width:640px;margin:0 auto 2.8rem}

/* Problem/empathy */
.empathy{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center}
@media(max-width:820px){.empathy{grid-template-columns:1fr;gap:1.5rem}}
.pain-list{list-style:none;padding:0;margin:0}
.pain-list li{position:relative;padding:.55rem 0 .55rem 2rem;border-bottom:1px dashed var(--line);color:var(--ink-soft)}
.pain-list li::before{content:"";position:absolute;left:0;top:.95rem;width:12px;height:2px;background:var(--gold)}

/* Offer stack */
.offer{max-width:760px;margin:0 auto;background:var(--paper);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);overflow:hidden}
.offer-head{background:linear-gradient(135deg,var(--teal),var(--teal-deep));color:#fff;padding:2rem 2rem 1.6rem;text-align:center}
.offer-head .ribbon{display:inline-block;background:var(--gold);color:#2a2000;font-weight:700;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;padding:.35rem .8rem;border-radius:999px;margin-bottom:1rem}
.offer-head h3{color:#fff;font-size:clamp(1.6rem,3vw,2.1rem)}
.stack{list-style:none;margin:0;padding:1.4rem 1.6rem}
.stack li{display:flex;gap:.9rem;align-items:flex-start;padding:.85rem 0;border-bottom:1px solid var(--line)}
.stack li:last-child{border-bottom:none}
.stack .ck{flex:none;width:26px;height:26px;border-radius:50%;background:rgba(23,178,162,.14);color:var(--teal-deep);display:flex;align-items:center;justify-content:center;font-weight:800;margin-top:.15rem}
.stack .txt{flex:1}
.stack .txt b{display:block}
.stack .val{flex:none;color:var(--gold);font-weight:700;font-size:.9rem;white-space:nowrap}
.offer-foot{padding:1.4rem 1.6rem 2rem;text-align:center;background:var(--cream)}
.offer-foot .total{font-size:.95rem;color:var(--muted);margin-bottom:.2rem}
.offer-foot .today{font-family:'Poppins';font-size:1.9rem;font-weight:700;color:var(--ink);margin-bottom:1.2rem}
.offer-foot .today s{color:var(--muted);font-weight:500;font-size:1.2rem;margin-right:.4rem}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;counter-reset:s}
@media(max-width:780px){.steps{grid-template-columns:1fr}}
.step{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.7rem;position:relative}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:-16px;left:1.7rem;width:36px;height:36px;border-radius:50%;background:var(--gold);color:#2a2000;font-family:'Poppins';font-weight:700;display:flex;align-items:center;justify-content:center}
.step h3{margin-top:.6rem}

/* Safety / features grid */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media(max-width:820px){.grid3{grid-template-columns:1fr}}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem}
.bg-teal .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#fff}
.card .ic{font-size:1.7rem;margin-bottom:.6rem}
.card h3{margin-bottom:.35rem}
.card p{margin:0;color:var(--ink-soft);font-size:.96rem}
.bg-teal .card p{color:rgba(255,255,255,.85)}

/* Pricing */
.price-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;align-items:start}
@media(max-width:900px){.price-tabs{grid-template-columns:1fr}}
.price-col{background:var(--paper);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.price-col.feat{border:2px solid var(--teal);box-shadow:var(--shadow)}
.price-col .ph{padding:1.3rem 1.4rem .3rem}
.price-col .ph h3{margin:0}
.price-col .ph .sub{color:var(--muted);font-size:.9rem}
.price-rows{padding:.4rem 1.4rem 1.4rem}
.prow{padding:.85rem 0;border-bottom:1px solid var(--line)}
.prow:last-child{border-bottom:none}
.prow .top{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem}
.prow .name{font-weight:700}
.prow .mins{color:var(--muted);font-weight:500;font-size:.85rem}
.prow .cost{text-align:right;white-space:nowrap}
.prow .cost s{color:var(--muted);font-size:.85rem;margin-right:.35rem}
.prow .cost b{color:var(--teal-deep);font-size:1.15rem}
.prow .desc{color:var(--ink-soft);font-size:.88rem;margin:.3rem 0 0}
.tag{display:inline-block;background:rgba(23,178,162,.12);color:var(--teal-deep);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:.15rem .5rem;border-radius:6px;margin-left:.4rem}
.tag.gold{background:rgba(199,154,59,.15);color:#8a6a1e}
.fineprint{max-width:760px;margin:1.6rem auto 0;font-size:.85rem;color:var(--muted);text-align:center}

/* Guarantee */
.guarantee{max-width:840px;margin:0 auto;background:var(--paper);border:2px solid var(--gold);border-radius:24px;padding:2.4rem;text-align:center;position:relative}
.guarantee .seal{width:74px;height:74px;border-radius:50%;background:radial-gradient(circle at 30% 30%,var(--gold-soft),var(--gold));display:flex;align-items:center;justify-content:center;font-size:2rem;margin:-2.6rem auto 1rem;box-shadow:0 10px 24px -8px rgba(199,154,59,.7)}
.g-two{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:1.6rem;text-align:left}
@media(max-width:680px){.g-two{grid-template-columns:1fr}}
.g-two .gcard{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:1.1rem 1.2rem}
.g-two .gcard b{color:var(--teal-deep)}

/* Proof */
.proof-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:3rem}
@media(max-width:760px){.proof-nums{grid-template-columns:1fr 1fr}}
.stat{text-align:center;padding:1.2rem}
.stat .n{font-family:'Poppins';font-size:clamp(2rem,4vw,2.8rem);font-weight:700;color:var(--teal-deep);line-height:1}
.bg-teal .stat .n{color:var(--gold-soft)}
.stat .l{font-size:.85rem;color:var(--muted);margin-top:.3rem}
.bg-teal .stat .l{color:rgba(255,255,255,.8)}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media(max-width:820px){.quotes{grid-template-columns:1fr}}
.quote{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem}
.quote .stars{color:var(--gold);letter-spacing:2px;margin-bottom:.6rem}
.quote p{font-size:.98rem;color:var(--ink)}
.quote .who{font-weight:700;font-size:.9rem;color:var(--muted);margin:0}

/* About / Team */
.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:2.6rem;align-items:center}
@media(max-width:820px){.about{grid-template-columns:1fr;gap:1.6rem}}
.about-photo{aspect-ratio:1/1;border-radius:20px;overflow:hidden;background:
  linear-gradient(135deg,rgba(23,178,162,.18),rgba(231,206,134,.22)),var(--cream);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--muted);font-size:.85rem;padding:1rem}
.about-photo img{width:100%;height:100%;object-fit:cover}
.about .sig{font-family:'Poppins';font-size:1.3rem;color:var(--teal-deep);margin-top:.4rem}
.about .mini{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.1rem}
.about .mini span{background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:.4rem .9rem;font-size:.85rem;font-weight:600}

/* Area */
.hoods{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;max-width:760px;margin:1.4rem auto 0}
.hood{background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:.55rem 1.1rem;font-weight:600;font-size:.92rem;color:var(--ink);transition:border-color .2s,color .2s}
a.hood:hover{border-color:var(--teal);color:var(--teal-deep)}

/* Neighborhood cross-links */
.hoodlinks{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;max-width:900px;margin:1.6rem auto 0}
@media(max-width:760px){.hoodlinks{grid-template-columns:1fr 1fr}}
@media(max-width:460px){.hoodlinks{grid-template-columns:1fr}}
.hoodlink{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:.9rem 1.1rem;font-weight:700;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:.5rem;transition:border-color .2s,transform .15s}
.hoodlink:hover{border-color:var(--teal);transform:translateY(-2px);color:var(--teal-deep)}
.hoodlink .arrow{color:var(--gold)}

/* Breadcrumb */
.breadcrumb{font-size:.85rem;color:rgba(255,255,255,.75);margin-bottom:1rem}
.breadcrumb a{color:var(--gold-soft)}

/* FAQ */
.faq{max-width:800px;margin:0 auto}
details{background:var(--paper);border:1px solid var(--line);border-radius:14px;margin-bottom:.8rem;overflow:hidden}
details summary{cursor:pointer;padding:1.1rem 1.3rem;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";color:var(--teal);font-size:1.4rem;font-weight:400}
details[open] summary::after{content:"–"}
details .a{padding:0 1.3rem 1.2rem;color:var(--ink-soft)}

/* Booking */
.booking{max-width:720px;margin:0 auto;background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:1.6rem;box-shadow:var(--shadow)}
.booktabs{display:flex;gap:.5rem;background:var(--cream);padding:.35rem;border-radius:999px;margin-bottom:1.3rem}
.booktabs button{flex:1;border:none;background:transparent;padding:.7rem;border-radius:999px;font-weight:700;cursor:pointer;color:var(--muted);font-size:.95rem}
.booktabs button.active{background:var(--paper);color:var(--teal-deep);box-shadow:0 4px 12px -6px rgba(0,0,0,.2)}
.book-pane{display:none}
.book-pane.active{display:block}
.book-pane .hd{text-align:center;margin-bottom:1rem}
.tidycal-embed{min-height:520px}

/* Footer */
footer{background:var(--ink);color:rgba(255,255,255,.75);padding:3rem 0 2rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr;gap:1.4rem}}
footer h4{color:#fff;font-family:'Poppins';margin:0 0 .8rem;font-size:1.1rem}
footer a{color:var(--gold-soft)}
footer .brand{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:2rem;padding-top:1.2rem;font-size:.82rem;color:rgba(255,255,255,.55);display:flex;flex-wrap:wrap;gap:.6rem;justify-content:space-between}
/* Hiring sits on its own line under everything else, so it reads as an
   invitation rather than one more item in a list of links. */
.foot-apply{margin-top:1.1rem;padding-top:1.1rem;border-top:1px solid rgba(255,255,255,.08);text-align:center;font-size:.82rem}
.foot-apply a{color:var(--gold-soft);font-weight:600;letter-spacing:.03em}
.foot-apply a:hover{color:#fff}

/* Sticky mobile CTA */
.mobile-cta{position:fixed;bottom:0;left:0;right:0;z-index:60;background:rgba(21,21,21,.96);padding:.7rem 14px;display:none;gap:.6rem;backdrop-filter:blur(8px)}
.mobile-cta .btn{flex:1;padding:.85rem}
@media(max-width:860px){.mobile-cta{display:flex}body{padding-bottom:70px}}

/* Blog */
.blog-hero{background:linear-gradient(180deg,#0E8577,#0A5C52);color:#fff;padding:clamp(2.6rem,6vw,4rem) 0}
.blog-hero h1{color:#fff;max-width:20ch}
.blog-hero p{color:rgba(255,255,255,.9);max-width:56ch}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
@media(max-width:900px){.blog-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.blog-grid{grid-template-columns:1fr}}
.blogcard{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .15s,border-color .2s}
.blogcard:hover{transform:translateY(-3px);border-color:var(--teal)}
.blogcard .thumb{aspect-ratio:16/9;background:linear-gradient(135deg,rgba(23,178,162,.18),rgba(231,206,134,.25));display:flex;align-items:center;justify-content:center;font-size:2.4rem}
.blogcard .body{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;flex:1}
.blogcard .meta{font-size:.78rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem}
.blogcard h3{margin:0 0 .5rem;color:var(--ink)}
.blogcard p{color:var(--ink-soft);font-size:.95rem;margin:0 0 1rem}
.blogcard .more{margin-top:auto;font-weight:700;color:var(--teal-deep)}

/* Article */
.article{max-width:760px;margin:0 auto}
.article .meta{color:var(--muted);font-weight:600;font-size:.9rem;margin-bottom:1.2rem}
.prose{font-size:1.08rem;color:var(--ink)}
.prose h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin:2rem 0 .6rem}
.prose p{margin:0 0 1.1rem;color:var(--ink-soft)}
.prose ul{margin:0 0 1.2rem;padding-left:1.2rem;color:var(--ink-soft)}
.prose li{margin:.35rem 0}
.prose strong{color:var(--ink)}
.cta-band{background:var(--cream);border:1px solid var(--line);border-radius:20px;padding:1.8rem;text-align:center;margin:2.4rem 0 0}
.cta-band h3{margin:0 0 .4rem}
.cta-band p{color:var(--muted);margin:0 0 1.1rem}

/* Service cards */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media(max-width:820px){.svc-grid{grid-template-columns:1fr}}
.svc-card{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;transition:transform .15s,border-color .2s}
.svc-card:hover{transform:translateY(-3px);border-color:var(--teal)}
.svc-card .ic{font-size:2rem;margin-bottom:.5rem}
.svc-card h3{margin:0 0 .4rem}
.svc-card p{color:var(--ink-soft);font-size:.96rem;margin:0 0 1rem}
.svc-card .price{font-weight:700;color:var(--teal-deep);margin-bottom:1.1rem;font-size:.95rem}
.svc-card .price s{color:var(--muted);font-weight:500;margin-right:.35rem}
.svc-card .btn{margin-top:auto;align-self:flex-start}

/* Nav dropdown (built by site.js on desktop) */
.nav-dd{position:relative;display:inline-flex;align-items:center}
.nav-dd-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:.4rem;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:.4rem;min-width:220px;display:none;z-index:70}
.nav-dd:hover .nav-dd-menu{display:block}
.nav-dd-menu a{display:block;padding:.55rem .8rem;border-radius:9px;color:var(--ink);font-weight:600;font-size:.92rem}
.nav-dd-menu a:hover{background:var(--cream);color:var(--teal-deep)}

/* Contact cards */
.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media(max-width:760px){.contact-grid{grid-template-columns:1fr}}

/* Meet the team */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
@media(max-width:820px){.team-grid{grid-template-columns:1fr 1fr}}
@media(max-width:460px){.team-grid{grid-template-columns:1fr}}
.team-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem;text-align:center}
.team-photo{width:110px;height:110px;border-radius:50%;margin:0 auto .8rem;overflow:hidden;background:linear-gradient(135deg,rgba(23,178,162,.2),rgba(231,206,134,.28));display:flex;align-items:center;justify-content:center;font-size:1.9rem;color:var(--muted)}
.team-photo img{width:100%;height:100%;object-fit:cover}
.team-card h3{margin:0 0 .1rem;font-size:1.05rem}
.team-card .role{color:var(--teal-deep);font-weight:600;font-size:.84rem;margin-bottom:.5rem}
.team-card p{color:var(--ink-soft);font-size:.9rem;margin:0}

/* Report card showcase (Time To Pet) */
.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.6rem;align-items:center}
@media(max-width:820px){.report-grid{grid-template-columns:1fr;gap:1.6rem}}
.report-phones{display:flex;flex-wrap:nowrap;gap:1.2rem;justify-content:center;align-items:flex-start}
.report-phones img{width:min(42%,190px);height:auto;flex:0 0 auto;border-radius:22px;box-shadow:0 24px 60px -24px rgba(10,92,82,.5)}
.report-list{list-style:none;margin:1rem 0 1.4rem;padding:0}
.report-list li{position:relative;padding:.5rem 0 .5rem 2.1rem;color:var(--ink-soft);font-size:1.02rem}
.report-list li::before{content:"✓";position:absolute;left:0;top:.45rem;width:24px;height:24px;border-radius:50%;background:rgba(23,178,162,.14);color:var(--teal-deep);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.85rem}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:900px){.gallery{grid-template-columns:1fr 1fr}}
.gallery figure{margin:0;border-radius:16px;overflow:hidden;background:var(--cream);border:1px solid var(--line)}
.gallery img{width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .25s}
.gallery figure:hover img{transform:scale(1.04)}
.gallery figcaption{padding:.5rem .8rem;font-size:.85rem;font-weight:600;color:var(--ink-soft);background:var(--paper)}

/* Social links */
.socials{display:flex;gap:.7rem;margin-top:.8rem}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.05rem}
.socials a:hover{background:var(--teal)}

/* ============================================================
   Luxury polish layer: sleek, clean, airy. Overrides above rules.
   ============================================================ */
:root{
  --line:#eceeed;
  --cream:#FAF9F6;
  --shadow-soft:0 1px 2px rgba(15,23,22,.04), 0 8px 24px -12px rgba(15,23,22,.10);
  --shadow-lift:0 2px 4px rgba(15,23,22,.05), 0 18px 44px -18px rgba(10,92,82,.22);
}
body{line-height:1.7;color:#1c1c1c}
h1,h2,h3{letter-spacing:-.02em}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem)}
section{padding:clamp(4rem,7vw,6.5rem) 0}
.lead-in{margin-bottom:3.2rem}
.lead-in p,.hero .lede{color:var(--muted)}
.hero .lede{color:rgba(255,255,255,.88);font-weight:400}

/* Eyebrow: refined with gold hairline */
.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font-size:.7rem;letter-spacing:.22em}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--gold)}

/* Nav: airy and precise */
header.nav{background:rgba(250,249,246,.85);backdrop-filter:blur(14px)}
.nav-inner{padding:.85rem 22px}
.nav-links{gap:1.7rem}
.nav-links a.nl{font-weight:500;font-size:.92rem;letter-spacing:.01em}
.brand{letter-spacing:-.01em}

/* Buttons: slimmer, calmer, refined */
.btn{font-weight:600;font-size:.98rem;padding:.95rem 1.7rem;letter-spacing:.01em;transition:transform .18s ease,box-shadow .25s ease,background .2s,filter .2s}
.btn-primary{background:linear-gradient(135deg,#D5A94C,#C1912F);color:#241c04;box-shadow:0 10px 26px -12px rgba(199,154,59,.55)}
.btn-primary:hover{transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 14px 30px -12px rgba(199,154,59,.6)}
.btn-dark:hover{transform:translateY(-1px)}
.btn-lg{font-size:1.05rem;padding:1.1rem 2.1rem}

/* Hero: deeper, richer */
.hero{background:
  radial-gradient(1100px 460px at 82% -8%,rgba(231,206,134,.14),transparent 60%),
  radial-gradient(900px 500px at -10% 110%,rgba(23,178,162,.16),transparent 55%),
  linear-gradient(165deg,#0B5D53 0%,#0E8577 58%,#094F47 100%)}
.fourseasons-badge{background:rgba(255,255,255,.08);border-color:rgba(231,206,134,.38);letter-spacing:.02em}
.hero-card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.14);padding:1rem;border-radius:26px}
.hero-photo{border-radius:20px}

/* Trust bar: refined small caps */
.trustbar{background:#111312}
.trustbar .wrap{padding:1.15rem 22px;font-size:.8rem;gap:1.1rem 2.6rem}
.trustbar span{letter-spacing:.09em;text-transform:uppercase;font-weight:500;color:rgba(255,255,255,.72)}
.trustbar b{color:var(--gold-soft);font-weight:600}

/* Cards: hairline + soft elevation, calm hover */
.card,.svc-card,.quote,.blogcard,.team-card,.step,.price-col,.booking,.offer,.hoodlink{box-shadow:var(--shadow-soft)}
.card,.svc-card,.quote,.blogcard,.team-card,.step{border-color:var(--line);border-radius:20px}
.svc-card:hover,.blogcard:hover,.hoodlink:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);border-color:rgba(23,178,162,.35)}
.card{padding:1.9rem}
.svc-card{padding:1.9rem}
.bg-teal .card{box-shadow:none;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}

/* Icon chips: contained, refined (replaces bare emoji look) */
.card .ic,.svc-card .ic{width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,rgba(23,178,162,.10),rgba(231,206,134,.16));border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:1.35rem;margin-bottom:1rem}
.bg-teal .card .ic{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.16)}
.card h3,.svc-card h3{font-size:1.12rem}
.card p,.svc-card p{font-size:.94rem;line-height:1.65}

/* Offer: cleaner, premium */
.offer{border-radius:28px;border-color:var(--line);box-shadow:var(--shadow-lift)}
.offer-head{padding:2.2rem 2.2rem 1.8rem;background:linear-gradient(150deg,#12A192,#0B6B5F)}
.offer-head .ribbon{background:linear-gradient(135deg,#E7CE86,#C79A3B);letter-spacing:.14em;font-size:.68rem;padding:.4rem .95rem}
.stack{padding:1.6rem 2rem}
.stack li{padding:1rem 0}
.offer-foot{padding:1.8rem 2rem 2.3rem}

/* Pricing: cleaner rows */
.price-col{border-radius:22px;border-color:var(--line)}
.price-col.feat{border-color:rgba(23,178,162,.45);box-shadow:var(--shadow-lift)}
.prow .cost b{font-weight:700}
.tag{letter-spacing:.08em;font-size:.66rem}
.fineprint{font-size:.82rem;line-height:1.8}

/* Guarantee: gold hairline elegance */
.guarantee{border-width:1px;border-color:rgba(199,154,59,.5);border-radius:26px;box-shadow:var(--shadow-soft);padding:3rem 2.6rem 2.6rem}
.guarantee .seal{box-shadow:0 12px 28px -10px rgba(199,154,59,.55)}
.g-two .gcard{border-radius:16px}

/* Quotes: elegant */
.quote{padding:1.8rem}
.quote .stars{font-size:.85rem;letter-spacing:3px}
.quote p{font-size:.95rem;line-height:1.7}
.quote .who{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600}

/* Stats: refined */
.stat .n{font-weight:700}
.stat .l{letter-spacing:.06em;text-transform:uppercase;font-size:.72rem;font-weight:500}

/* Gallery + report: premium imagery */
.gallery figure{border-radius:20px;box-shadow:var(--shadow-soft)}
.gallery figcaption{font-size:.8rem;letter-spacing:.05em;text-transform:uppercase;padding:.65rem .9rem}
.report-phones img{border-radius:30px;box-shadow:0 1px 2px rgba(15,23,22,.06),0 30px 70px -30px rgba(10,92,82,.45)}

/* Team */
.team-card{padding:1.7rem 1.4rem}
.team-photo{width:104px;height:104px;border:3px solid #fff;box-shadow:0 8px 22px -10px rgba(15,23,22,.25)}
.team-card .role{letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}

/* FAQ: hairline clean */
details{border-radius:16px;border-color:var(--line);box-shadow:var(--shadow-soft);margin-bottom:.9rem}
details summary{padding:1.2rem 1.5rem;font-size:.98rem}
details .a{padding:0 1.5rem 1.3rem;line-height:1.7}

/* Booking */
.booking{border-radius:26px;padding:2rem}
.booktabs button{font-weight:600;font-size:.92rem}

/* Footer: deep + gold accents */
footer{background:#101211;padding:4rem 0 2.2rem}
footer h4{letter-spacing:.02em}
footer a{color:#D9C089}
.foot-bottom{letter-spacing:.03em;font-size:.78rem}
.socials a{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}

/* Blog hero + article polish */
.blog-hero{background:linear-gradient(165deg,#0B5D53,#0E8577 60%,#094F47)}
.blogcard .meta{letter-spacing:.12em;font-size:.7rem}
.cta-band{border-radius:22px;box-shadow:var(--shadow-soft)}

/* Mobile CTA: refined */
.mobile-cta{background:rgba(16,18,17,.94);border-top:1px solid rgba(255,255,255,.08)}

/* Inline SVG icon system (replaces emoji everywhere) */
.i{width:1em;height:1em;display:inline-block;vertical-align:-0.14em;flex:none}
.trustbar span .i{width:15px;height:15px;color:var(--gold-soft)}
.card .ic .i,.svc-card .ic .i{width:26px;height:26px;color:var(--teal-deep)}
.bg-teal .card .ic .i{color:var(--gold-soft)}
.fourseasons-badge .i{width:15px;height:15px;color:var(--gold-soft)}
.guarantee .seal .i{width:34px;height:34px;color:#241c04}
.mini span .i{width:15px;height:15px;vertical-align:-0.18em;margin-right:.15em;color:var(--teal-deep)}
.btn .i{width:17px;height:17px;vertical-align:-0.22em;margin-right:.3em}
footer .brand .i{width:20px;height:20px;vertical-align:-0.15em;margin-right:.2em;color:var(--gold-soft)}
footer p .i{width:15px;height:15px;vertical-align:-0.14em;margin-right:.3em;color:var(--gold-soft)}
.blogcard .thumb .i,.post-ic .i{width:34px;height:34px;color:var(--teal-deep)}
.post-ic{width:60px;height:60px;border-radius:16px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;margin-bottom:.6rem}
.post-ic .i{color:#fff}
.eyebrow .i{width:13px;height:13px;color:var(--gold)}
.hero-sub .i,.hero-cta .btn .i{width:15px;height:15px}
.sig .i{width:16px;height:16px;vertical-align:-0.16em;color:var(--gold)}
.socials a{padding:9px}
.socials a .i{width:18px;height:18px}
h1 .i{width:.85em;height:.85em}

/* Pricing column header icons */
.price-col .ph h3{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.price-col .ph h3 .i{width:22px;height:22px;color:var(--teal-deep);flex:none}

/* Price legend (explains crossed-out vs bold pricing) */
.price-legend{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;justify-content:center;margin:0 auto 2rem;max-width:640px;font-size:.85rem;color:var(--muted);text-align:center}
.price-legend b{color:var(--teal-deep)}
.price-legend s{color:var(--muted)}

/* Add-ons list (was one jumbled paragraph) */
.addon-list{list-style:none;padding:0;margin:0 0 1.2rem;display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem 1.6rem;max-width:640px;margin-left:auto;margin-right:auto}
@media(max-width:620px){.addon-list{grid-template-columns:1fr}}
.addon-list li{font-size:.9rem;color:var(--ink-soft);display:flex;justify-content:space-between;gap:.6rem;border-bottom:1px dashed var(--line);padding:.5rem 0}
.addon-list li b{color:var(--teal-deep);white-space:nowrap}

/* Cancellation grace note */
.grace-note{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem;font-size:.9rem;color:var(--ink-soft);max-width:640px;margin:1rem auto 0}

/* ============================================================
   Dropdown reliability, mobile nav, centered grids, mobile polish
   ============================================================ */

/* Services dropdown: hover bridge (padding, not margin, so there is no
   dead gap) + JS "open" class with a close delay so it can be clicked. */
.nav-dd-menu{margin-top:0;padding-top:.5rem;background:transparent;border:none;box-shadow:none;min-width:240px}
.nav-dd-menu > a{background:var(--paper)}
.nav-dd-menu::before{content:"";position:absolute;top:.5rem;left:0;right:0;bottom:0;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lift);z-index:-1}
.nav-dd:hover .nav-dd-menu,.nav-dd.open .nav-dd-menu{display:block}
.nav-dd-menu a{position:relative;background:transparent}

/* Mobile menu toggle + panel (hidden on desktop) */
.navToggle{display:none;background:transparent;border:1px solid var(--line);border-radius:12px;padding:.5rem;cursor:pointer;color:var(--ink);line-height:0}
.navToggle svg{width:24px;height:24px}
.mobileMenu{display:none;flex-direction:column;border-top:1px solid var(--line);background:var(--cream);padding:.5rem 22px 1rem}
.mobileMenu a{padding:.85rem .2rem;font-weight:600;color:var(--ink);border-bottom:1px solid var(--line);font-size:1rem}
.mobileMenu a:last-child{border-bottom:none}
.mobileMenu a.mm-cta{margin-top:.6rem;border:none;background:var(--teal-deep);color:#fff;border-radius:999px;text-align:center;font-weight:700;padding:.85rem}
.mobileMenu a.mm-cta + a.mm-cta{margin-top:.5rem;background:var(--gold);color:#2a2000}
body.menuOpen .mobileMenu{display:flex}

/* Centered grids: flex-wrap centers a short last row instead of
   stranding one card on the left. */
.svc-grid,.team-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:1.3rem}
.svc-grid > *{flex:1 1 290px;max-width:360px}
.team-grid > *{flex:1 1 220px;max-width:270px}
.grid3{justify-items:stretch}
@media(min-width:821px){
  .grid3{display:flex;flex-wrap:wrap;justify-content:center}
  .grid3 > *{flex:1 1 300px;max-width:360px}
}

/* ---------------- Mobile layout ---------------- */
@media(max-width:860px){
  .navToggle{display:block}
  .nav-links{display:none}            /* toggle + panel take over */
  .nav-inner{padding:.7rem 18px}
  .brand span:last-child{font-size:1.1rem}
  .brand img{height:38px}
}
@media(max-width:760px){
  .wrap{padding:0 18px}
  section{padding:2.8rem 0}
  h1{font-size:clamp(1.9rem,7.6vw,2.5rem)}
  h2{font-size:clamp(1.45rem,5.6vw,1.9rem)}
  .lead-in{margin-bottom:2rem}
  .hero .wrap{padding:2.2rem 18px 2.6rem}
  .hero .lede{max-width:none;font-size:1.02rem}
  .hero-cta{gap:.6rem;margin:1.4rem 0 1rem}
  .hero-cta .btn{width:100%}
  .hero-card{padding:.7rem;border-radius:20px}
  .hero-photo{aspect-ratio:4/3}
  .hero-sub{font-size:.84rem;line-height:1.9}
  .trustbar .wrap{gap:.7rem 1.4rem;padding:.9rem 18px;font-size:.72rem}
  .price-legend{flex-direction:column;gap:.4rem;text-align:center;align-items:center}
  .offer-head,.stack,.offer-foot{padding-left:1.2rem;padding-right:1.2rem}
  .guarantee{padding:2.4rem 1.3rem 1.8rem}
  .booking{padding:1.1rem;border-radius:20px}
  .booktabs{flex-direction:column;border-radius:16px}
  .booktabs button{border-radius:12px}
  .report-grid{gap:1.4rem}
  .report-phones img{width:min(46%,168px)}
  .card,.svc-card{padding:1.5rem}
  .about-photo{max-width:340px;margin:0 auto}
  .foot-grid{gap:1.6rem}
  .foot-bottom{flex-direction:column;gap:.5rem}
  details summary{padding:1rem 1.1rem;font-size:.95rem}
  details .a{padding:0 1.1rem 1.1rem}
  .addon-list li{font-size:.88rem}
}

/* ---------------- Mobile: centre the short blocks ----------------
   On one column everything stacks against the left edge and the page loses
   its centre line. These are the blocks short enough to centre safely: cards,
   steps, quotes, the footer columns and the trust bar.

   Long form text is deliberately NOT centred. FAQ answers, blog articles and
   the offer stack rows stay left aligned, because centred paragraphs are
   measurably harder to read and the stack rows are label-and-value pairs that
   only line up on the left. */
@media(max-width:760px){
  .card,.svc-card,.step,.quote,.hoodlink,.foot-grid > div{text-align:center}
  .svc-card .btn{align-self:center}
  .step::before{left:50%;transform:translateX(-50%)}   /* keep the number badge over the middle */
  .socials{justify-content:center}
  .foot-bottom{text-align:center;align-items:center;justify-content:center}
  .trustbar .wrap{text-align:center}
  .offer-head,.offer-foot{text-align:center}
  .contact-grid > *{text-align:center}
  .contact-grid .socials{justify-content:center}
}
/* Never let anything push the page sideways on a phone. */
/* Do NOT put overflow-x (hidden or clip) on html/body here:
   - overflow:hidden makes an ancestor the scroll container, which breaks the
     sticky header;
   - overflow-x:clip propagates to the viewport and computes overflow-y to
     clip as well, which freezes scrolling entirely.
   The real overflow causes (unwrappable badge, nowrap headline, grid
   min-content floor) are fixed above, so no band-aid is needed. */
html,body{max-width:100%}
img,svg,iframe,.tidycal-embed{max-width:100%}

/* Call / Text button pair: sits side by side, full width on phones */
.cta-split{display:flex;gap:.6rem}
.cta-split .btn{flex:1 1 auto}
@media(max-width:760px){
  .cta-split{width:100%}
  .hero-cta .cta-split .btn{width:auto}
}
.mobile-cta .btn{padding:.85rem .6rem;font-size:.9rem}

/* ---- Overflow root causes (grid blowout on small screens) ----
   Grid/flex items default to a min-content floor, so any unwrappable child
   (an inline-flex pill, a nowrap span) can push the whole column wider than
   the phone. Let those children wrap and let the tracks actually shrink. */
.hero-grid > *,.empathy > *,.report-grid > *,.about > *,.price-tabs > *,
.svc-grid > *,.grid3 > *,.team-grid > *,.steps > *,.quotes > *{min-width:0}
.fourseasons-badge{flex-wrap:wrap;max-width:100%}
.hero h1 .u{white-space:normal}
.hero h1,.hero .lede,.hero-sub{overflow-wrap:break-word}
@media(max-width:760px){
  .fourseasons-badge{font-size:.74rem;padding:.45rem .8rem;line-height:1.5}
  .hero-cta .btn-primary{font-size:1rem;padding:1rem 1.2rem}
  .cta-split .btn{padding:.9rem .6rem}
}

/* Pricing legend: explains crossed-out vs bold pricing */
.price-legend{max-width:760px;gap:.7rem 1.4rem;align-items:flex-start}
.price-legend span{display:flex;gap:.45rem;align-items:baseline;flex-wrap:wrap;justify-content:center}
.price-legend .lg{color:var(--ink);font-weight:700}
.price-legend s{color:var(--muted)}

/* ---- Mobile pass, all page types ---- */
@media(max-width:760px){
  /* legend reads as two stacked lines, centred with the rest of the column */
  .price-legend{flex-direction:column;align-items:center;text-align:center;gap:.55rem;margin-bottom:1.6rem}
  .price-legend span{justify-content:center}

  /* blog + inner page heroes */
  .blog-hero{padding:2.4rem 0}
  .blog-hero h1{font-size:clamp(1.75rem,7vw,2.2rem)}
  .breadcrumb{font-size:.8rem}
  .article,.prose{font-size:1rem}
  .prose h2{font-size:1.3rem;margin:1.6rem 0 .5rem}

  /* about + team */
  .about{gap:1.4rem}
  .team-grid{gap:1rem}
  .team-card{padding:1.4rem 1rem}
  .team-photo{width:92px;height:92px}

  /* services + contact + policies */
  .svc-grid,.grid3{gap:1rem}
  .svc-card .btn,.blogcard .btn{width:100%}
  .contact-grid{gap:1rem}
  .cta-band{padding:1.4rem 1.2rem}
  .hoodlinks{gap:.6rem}
  .hoodlink{padding:.8rem 1rem;font-size:.95rem}

  /* pricing tables stack cleanly */
  .price-col .ph{padding:1.1rem 1.1rem .2rem}
  .price-rows{padding:.3rem 1.1rem 1.1rem}
  .prow .top{flex-wrap:wrap;gap:.2rem}
  .prow .name{font-size:.98rem}
  .prow .cost{margin-left:auto}

  /* proof + gallery */
  .proof-nums{gap:.6rem;margin-bottom:2rem}
  .stat{padding:.8rem .4rem}
  .stat .l{font-size:.66rem}
  .gallery{gap:.7rem}
  .quotes{gap:1rem}
  .quote{padding:1.4rem}
}
@media(max-width:420px){
  .trustbar .wrap{font-size:.68rem;gap:.6rem 1rem}
  .mobile-cta .btn{font-size:.82rem;padding:.8rem .4rem}
  .proof-nums{grid-template-columns:1fr 1fr}
}

/* Machine readable pricing table.
   Visually hidden but present in the DOM and the accessibility tree, so
   crawlers and AI parsers get unambiguous rows instead of styled divs. */
.llm-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);border:0}
.llm-only table{width:auto}



/* ============================================================
   Scroll reveal + refined chrome
   Restraint is what reads as expensive: long easing, small travel,
   no bounce. Opacity and transform only, so nothing reflows (no CLS).
   The hidden state is applied only once JS is running, so if JS fails
   or is slow the content is simply visible.
   ============================================================ */
@media (prefers-reduced-motion: no-preference){
  html.reveal-ready .reveal{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1);
    transition-delay:var(--d,0ms);
  }
  html.reveal-ready .reveal.in{opacity:1;transform:none}
}

/* Sticky header settles into a softer, deeper state once you scroll */
header.nav{transition:background .35s ease, box-shadow .35s ease, border-color .35s ease}
header.nav.scrolled{
  background:rgba(250,249,246,.94);
  box-shadow:0 1px 0 rgba(15,23,22,.04), 0 14px 34px -22px rgba(15,23,22,.30);
  border-bottom-color:transparent;
}

/* Images settle in gently once decoded (hero excluded, it must paint instantly) */
@media (prefers-reduced-motion: no-preference){
  .gallery img,.about-photo img,.team-photo img,.report-phones img{
    transition:transform .7s cubic-bezier(.22,.61,.36,1), opacity .5s ease;
  }
  .about-photo:hover img{transform:scale(1.02)}
}
