/* Pecan Grove Veterinary Hospital : site v2
   Editorial layout, Pecan Grove colors. */
:root{
  --bg:#fff7f3;
  --bg-2:#fff2ed;
  --card:#f6e7df;
  --card-2:#efdcd2;
  --sky:#eaf1f9;
  --mint:#eef4e3;
  --navy:#00325e;
  --ink:#03162a;
  --ink-2:#0a2440;
  --text:#43668c;
  --muted:#7f93ab;
  --accent:#6d3f79;
  --accent-2:#4a6ea8;
  --green:#8eaf53;
  --line:#e8d9d1;
  --line-dark:rgba(255,255,255,.14);
  --serif:'Cormorant Garamond','Times New Roman',serif;
  --sans:'Jost',system-ui,sans-serif;
  --r:16px;
  --r-sm:10px;
  --pad:clamp(16px,4vw,92px);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-weight:400;font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
p{margin:0 0 1.1em}
h1,h2,h3,h4{margin:0;font-weight:500;color:var(--navy)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;z-index:300;background:var(--ink);color:#fff;padding:.6rem 1rem}
.skip:focus{left:1rem;top:1rem}
.wrap{padding-left:var(--pad);padding-right:var(--pad);max-width:1600px;margin:0 auto}

/* Type */
.eyebrow{display:block;font-family:var(--sans);font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:1.1rem}
.eyebrow a{text-decoration:none}
.eyebrow a:hover{color:var(--accent)}
.h-xl,.h-l,.h-m,.h-s{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;text-wrap:balance}
.h-xl{font-size:clamp(2.5rem,5.6vw,6rem);line-height:.98;text-transform:uppercase;letter-spacing:.005em}
.h-l{font-size:clamp(2.3rem,4.3vw,4.4rem);line-height:1.02}
.h-m{font-size:clamp(1.8rem,2.8vw,2.8rem);line-height:1.08}
.h-s{font-size:clamp(1.35rem,1.8vw,1.75rem);line-height:1.15}
.grad{background:linear-gradient(100deg,var(--navy) 0%,var(--navy) 40%,#a3b5cb 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.on-dark .grad{background:linear-gradient(100deg,#fff 0%,#fff 40%,#8fa6c2 100%);-webkit-background-clip:text;background-clip:text}
.lead{font-size:1.08rem;line-height:1.7;color:var(--text)}
.small{font-size:.85rem}
.muted{color:var(--muted)}
.serif-link{font-family:var(--serif);font-size:1.7rem;color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;transition:color .2s}
.serif-link:hover{color:var(--navy)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-family:var(--sans);font-size:.72rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:#fff;background:var(--accent);border:1px solid var(--accent);border-radius:8px;padding:.85rem 1.25rem;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.btn svg{width:15px;height:15px}
.btn.ghost{background:transparent;color:var(--navy);border-color:rgba(0,50,94,.25)}
.btn.ghost:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn.light{background:#fff;color:var(--navy);border-color:#fff}
.btn.light:hover{background:var(--bg-2);border-color:var(--bg-2)}
.btn.glass{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn.glass:hover{background:#fff;color:var(--navy)}
.btn.sm{padding:.6rem .9rem;font-size:.66rem}
.btn-row{display:flex;gap:.6rem;flex-wrap:wrap}

/* ---------- Header ---------- */
.top{position:fixed;inset:0 0 auto 0;z-index:90;pointer-events:none;display:flex;justify-content:space-between;align-items:flex-start;padding:0 clamp(12px,2.3vw,33px)}
.top>*{pointer-events:auto}
.pill{margin-top:20px;display:inline-flex;align-items:center;gap:.55rem;font-family:var(--sans);font-size:.68rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--navy);background:rgba(255,242,237,.78);border:1px solid rgba(255,255,255,.6);border-radius:8px;padding:.62rem .8rem;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);cursor:pointer;transition:background .25s,color .25s}
.pill:hover{background:var(--navy);color:#fff}
.pill svg{width:16px;height:16px}
.logo-tab{position:absolute;left:50%;top:0;transform:translateX(-50%);background:rgba(255,247,243,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:0 0 16px 16px;padding:10px 22px 12px;box-shadow:0 10px 30px -18px rgba(3,22,42,.35);transition:padding .3s var(--ease)}
.logo-tab img{height:52px;width:auto;transition:height .3s var(--ease)}
.top.compact .logo-tab{padding:7px 18px 9px}
.top.compact .logo-tab img{height:40px}
.pill .lbl-short{display:none}
@media (max-width:640px){
  .pill{margin-top:14px;padding:.55rem .6rem}
  .pill .lbl{display:none}
  .logo-tab{padding:7px 14px 9px}
  .logo-tab img{height:38px}
}
.progress{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--accent);z-index:95}

/* ---------- Menu overlay ---------- */
.menu{position:fixed;inset:0;z-index:120;background:var(--bg);display:grid;grid-template-columns:1.15fr .85fr;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
.menu.open{opacity:1;visibility:visible}
.menu-main{padding:110px var(--pad) 40px;display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto}
.menu-main ol{list-style:none;margin:0;padding:0;counter-reset:m}
.menu-main li{counter-increment:m;overflow:hidden}
.menu-main li a{display:flex;align-items:baseline;gap:1.1rem;font-family:var(--serif);font-weight:500;font-size:clamp(2rem,4.6vw,4rem);line-height:1.12;color:var(--navy);text-decoration:none;transform:translateY(105%);transition:transform .7s var(--ease),color .25s}
.menu-main li a::before{content:"0" counter(m);font-family:var(--sans);font-size:.7rem;letter-spacing:.1em;color:var(--muted);transform:translateY(-1.4em)}
.menu-main li a:hover,.menu-main li a[aria-current="page"]{color:var(--accent)}
.menu.open .menu-main li a{transform:none}
.menu.open .menu-main li:nth-child(2) a{transition-delay:.04s}.menu.open .menu-main li:nth-child(3) a{transition-delay:.08s}.menu.open .menu-main li:nth-child(4) a{transition-delay:.12s}.menu.open .menu-main li:nth-child(5) a{transition-delay:.16s}.menu.open .menu-main li:nth-child(6) a{transition-delay:.2s}.menu.open .menu-main li:nth-child(7) a{transition-delay:.24s}
.menu-side{background:var(--ink);color:#c9d5e3;padding:110px var(--pad) 40px clamp(24px,4vw,64px);display:flex;flex-direction:column;gap:2rem;overflow-y:auto}
.menu-side h4{font-family:var(--sans);font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#7f93ab;margin-bottom:.9rem}
.menu-side ul{list-style:none;margin:0;padding:0;columns:2;column-gap:1.5rem}
.menu-side li{break-inside:avoid;margin-bottom:.45rem}
.menu-side a{color:#fff;text-decoration:none;font-size:.95rem}
.menu-side a:hover{color:#d9b8e2}
.menu-side .contact-lines{font-size:.95rem;line-height:1.7}
.menu-close{position:absolute;top:20px;right:clamp(12px,2.3vw,33px)}
.menu-brand{position:absolute;top:20px;left:clamp(12px,2.3vw,33px)}
@media (max-width:900px){
  .menu{grid-template-columns:1fr;overflow-y:auto}
  .menu-main{padding-top:90px}
  .menu-side{padding-top:40px}
  .menu-side ul{columns:1}
}

/* ---------- Hero ---------- */
.hero{position:relative;height:100svh;min-height:620px;overflow:hidden;background:var(--ink)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;transform:scale(1.08);transition:transform 2.4s var(--ease)}
.loaded .hero-img{transform:scale(1)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,22,42,.35) 0%,rgba(3,22,42,.15) 35%,rgba(3,22,42,.45) 100%)}
.hero-inner{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 var(--pad);color:#fff}
.hero h1{color:#fff;max-width:20ch}
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(.35em);filter:blur(6px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease),filter 1.2s var(--ease)}
.loaded .hero h1 .w{opacity:1;transform:none;filter:none}
.hero .sub{max-width:36rem;margin:1.6rem auto 0;font-size:1.05rem;color:rgba(255,255,255,.9);opacity:0;transition:opacity 1s .7s}
.loaded .hero .sub{opacity:1}
.scroll-ind{position:absolute;left:50%;bottom:clamp(108px,14vh,130px);transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:.8rem;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#fff}
.scroll-ind i{display:block;width:1px;height:40px;background:rgba(255,255,255,.35);position:relative;overflow:hidden}
.scroll-ind i::after{content:"";position:absolute;left:0;top:-40px;width:1px;height:40px;background:#fff;animation:drop 2.2s infinite var(--ease)}
@keyframes drop{to{top:40px}}

/* Overlap card under hero */
.overlap{position:relative;z-index:5;margin-top:-90px;padding:0 var(--pad)}
.overlap-card{max-width:910px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r);overflow:hidden;background:linear-gradient(135deg,#fff 0%,var(--bg-2) 100%);box-shadow:0 30px 60px -30px rgba(3,22,42,.35)}
.overlap-card .txt{padding:clamp(1.6rem,3.5vw,3rem);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.overlap-card .txt p{font-size:.92rem;max-width:30ch}
.overlap-card .img{min-height:260px;background:var(--card)}
.overlap-card .img img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.overlap{margin-top:-60px}.overlap-card{grid-template-columns:1fr}.overlap-card .img{min-height:200px;order:-1}}

/* ---------- Sections ---------- */
.sec{padding:clamp(70px,11vw,170px) 0}
.sec.tight{padding:clamp(50px,7vw,110px) 0}
.sec.alt{background:var(--bg-2)}
.sec.sky{background:var(--sky)}
.sec.mint{background:var(--mint)}
.head-row{display:grid;grid-template-columns:1fr auto;align-items:end;gap:2rem;margin-bottom:clamp(2rem,4vw,3.5rem)}
@media (max-width:760px){.head-row{grid-template-columns:1fr}}

/* Sticky split (left sticky title, right images) */
.split{display:grid;grid-template-columns:minmax(0,.9fr) 1px minmax(0,1.1fr);gap:clamp(24px,4vw,64px)}
.split .rule{background:var(--line)}
.split-left{position:sticky;top:110px;height:calc(100svh - 150px);min-height:440px;display:flex;flex-direction:column;justify-content:space-between}
.split-cap{min-height:6.5rem}
.split-cap .count{font-size:.72rem;letter-spacing:.14em;color:var(--muted);margin-bottom:.6rem;display:block}
.split-cap p{font-family:var(--serif);font-size:1.5rem;line-height:1.15;color:var(--navy);max-width:22ch;margin:0;transition:opacity .4s}
.split-right{display:flex;flex-direction:column;gap:clamp(24px,3vw,40px)}
.split-right figure{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;background:var(--card)}
.split-right figure img{width:100%;height:100%;object-fit:cover}
.split-text p{max-width:36rem}
@media (max-width:860px){
  .split{grid-template-columns:1fr}
  .split .rule{display:none}
  .split-left{position:static;height:auto;min-height:0;gap:2rem}
  .split-cap{display:none}
}

/* Image reveal */
.reveal-img{overflow:hidden}
.reveal-img img{transform:scale(1.12);transition:transform 1.6s var(--ease)}
.reveal-img.in img{transform:scale(1)}
.fade{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.fade.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}
.sweep{background-size:320% 100%;background-position:100% 0;transition:background-size 2s var(--ease),background-position 2s var(--ease)}
.sweep.in{background-size:100% 100%;background-position:0 0}
.no-js .sweep{background-size:100% 100%}
.no-js .fade{opacity:1;transform:none}
.no-js .reveal-img img{transform:none}

/* Quote + stats */
.qs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,120px);align-items:start;margin-top:clamp(3rem,7vw,7rem)}
.quote-card{position:relative;background:var(--card);border-radius:var(--r);padding:clamp(1.6rem,3vw,2.4rem);display:grid;grid-template-columns:1fr 140px;grid-template-areas:'q q' 'b p' 'w p';gap:1.2rem 1.6rem}
.quote-card blockquote{grid-area:b}
.quote-card .q{grid-area:q;font-family:var(--serif);font-size:4rem;line-height:.5;color:var(--accent);height:1.4rem}
.quote-card p{font-size:.95rem;color:var(--ink-2)}
.quote-card .who{grid-area:w;align-self:end}
.quote-card .who strong{display:block;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);font-weight:500}
.quote-card .who span{font-size:.88rem;color:var(--muted)}
.quote-card .portrait{grid-area:p;align-self:end;border-radius:var(--r-sm);overflow:hidden;aspect-ratio:4/5}
.quote-card .portrait img{width:100%;height:100%;object-fit:cover}
@media (max-width:560px){.quote-card{grid-template-columns:1fr 96px;grid-template-areas:'q q' 'b b' 'w p'}}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:3rem 2rem;padding-top:1rem}
.stat{border-left:1px solid var(--line);padding-left:clamp(1rem,2.3vw,2rem)}
.stat b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2.4rem,3.6vw,3.4rem);line-height:1;color:var(--navy);margin-bottom:.6rem}
.stat span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
@media (max-width:860px){.qs{grid-template-columns:1fr}}

/* Numbered feature columns */
.cols{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr)) auto;gap:0;margin-top:clamp(2.5rem,5vw,4rem)}
.col{border-left:1px solid var(--line);padding:0 clamp(1rem,2vw,1.8rem) .3rem}
.col .num{font-size:.68rem;letter-spacing:.12em;color:var(--muted);display:block;margin-bottom:.6rem}
.col h3{font-family:var(--serif);font-weight:500;font-size:1.45rem;line-height:1.15;color:var(--navy);margin-bottom:.5rem}
.col p{font-size:.92rem;margin:0}
.col-link{border-left:1px solid var(--line);padding:0 clamp(1rem,2vw,1.8rem);align-self:end}
@media (max-width:900px){.cols{grid-template-columns:1fr 1fr;gap:2rem 0}.col-link{grid-column:1/-1}}
@media (max-width:520px){.cols{grid-template-columns:1fr}}

/* Carousel (services) */
.carousel{position:relative}
.track{display:flex;gap:clamp(12px,1.4vw,20px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 var(--pad);scroll-padding:0 var(--pad);cursor:grab}
.track::-webkit-scrollbar{display:none}
.track.dragging{cursor:grabbing;scroll-snap-type:none}
.track.dragging a{pointer-events:none}
.slide{position:relative;flex:0 0 clamp(270px,30vw,460px);aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;scroll-snap-align:start;text-decoration:none;color:#fff;background:var(--ink)}
.slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.slide:hover img{transform:scale(1.05)}
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,22,42,0) 45%,rgba(3,22,42,.55) 100%)}
.slide .panel{position:absolute;left:14px;right:14px;bottom:14px;z-index:2;background:rgba(3,22,42,.42);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:1.1rem 1.2rem 1.15rem}
.slide .panel .num{font-size:.66rem;letter-spacing:.12em;color:rgba(255,255,255,.7)}
.slide h3{font-family:var(--serif);font-weight:500;font-size:1.6rem;line-height:1.1;color:#fff;margin:.25rem 0 .4rem}
.slide p{font-size:.85rem;color:rgba(255,255,255,.85);margin:0 0 .9rem}
.slide .btn{pointer-events:none}
.car-nav{display:flex;align-items:center;gap:.5rem;font-size:.72rem;letter-spacing:.12em;color:var(--muted)}
.car-nav button{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--navy);cursor:pointer;display:grid;place-items:center;transition:background .2s,color .2s}
.car-nav button:hover{background:var(--navy);color:#fff}
.car-nav button svg{width:16px;height:16px}
.on-dark .car-nav button{border-color:var(--line-dark);color:#fff}
.on-dark .car-nav button:hover{background:#fff;color:var(--navy)}

/* Wide image band */
.band{padding:0 var(--pad)}
.band figure{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:21/9;max-height:78vh;background:var(--card)}
.band img{width:100%;height:115%;object-fit:cover;will-change:transform}
@media (max-width:700px){.band figure{aspect-ratio:4/3}}

/* Tabs (feature list with image) */
.tabs{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,5vw,90px);align-items:center}
.tab-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.tab-list li{border-bottom:1px solid var(--line)}
.tab-list button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.15rem 0;font-family:var(--serif);font-size:clamp(1.3rem,1.9vw,1.75rem);line-height:1.2;color:var(--muted);transition:color .25s}
.tab-list button svg{width:18px;height:18px;opacity:0;transform:translateX(-6px);transition:.25s}
.tab-list button[aria-selected="true"],.tab-list button:hover{color:var(--navy)}
.tab-list button[aria-selected="true"] svg{opacity:1;transform:none;color:var(--accent)}
.tab-panel p{font-size:.95rem;max-width:34rem;margin:.2rem 0 1.1rem}
.tab-media{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:5/4;background:var(--card)}
.tab-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .7s var(--ease),transform 1.2s var(--ease)}
.tab-media img.on{opacity:1;transform:none}
@media (max-width:860px){.tabs{grid-template-columns:1fr}}

/* Dark feature card (book a visit) */
.feature-card{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r);overflow:hidden;max-width:1000px;margin:0 auto;background:var(--ink)}
.feature-card .txt{padding:clamp(1.8rem,4vw,3.4rem);color:#c9d5e3;display:flex;flex-direction:column;justify-content:center}
.feature-card .txt .h-m{color:#fff;margin-bottom:1rem}
.feature-card .txt p{font-size:.95rem}
.feature-card .img{min-height:340px;position:relative}
.feature-card .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.feature-card .line{font-size:.9rem;color:#fff;margin:.2rem 0 1.4rem}
.feature-card .line a{color:#fff}
.stores{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.4rem}
.stores a{display:block;transition:transform .2s,opacity .2s}
.stores a:hover{transform:translateY(-2px);opacity:.9}
.stores img{height:46px;width:auto;border-radius:8px}
@media (max-width:760px){.feature-card{grid-template-columns:1fr}.feature-card .img{min-height:260px;order:-1}}

/* FAQ */
.faq{border-top:1px solid var(--line);max-width:980px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:3rem 1fr 28px;gap:1rem;align-items:center;padding:1.4rem 0;font-family:var(--serif);font-size:clamp(1.3rem,1.9vw,1.7rem);line-height:1.2;color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .n{font-family:var(--sans);font-size:.68rem;letter-spacing:.12em;color:var(--muted)}
.faq summary .pm{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);position:relative;transition:transform .35s var(--ease),background .25s}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:1px;background:var(--navy);transform:translate(-50%,-50%)}
.faq summary .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq details[open] summary .pm{transform:rotate(45deg);background:var(--card)}
.faq .ans{padding:0 0 1.5rem 4rem;max-width:44rem;color:var(--text)}
@media (max-width:560px){.faq summary{grid-template-columns:1fr 28px}.faq summary .n{display:none}.faq .ans{padding-left:0}}

/* Blog cards */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
@media (max-width:900px){.posts{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.posts{grid-template-columns:1fr}}
.post{display:flex;flex-direction:column;text-decoration:none;color:var(--text)}
.post figure{margin:0 0 1.2rem;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;background:var(--card)}
.post figure img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.post:hover figure img{transform:scale(1.05)}
.post .tag{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.post h3{font-family:var(--serif);font-weight:500;font-size:1.6rem;line-height:1.12;color:var(--navy);margin:.45rem 0 .55rem;transition:color .2s}
.post:hover h3{color:var(--accent)}
.post p{font-size:.92rem;margin:0}

/* Page intro (inner pages) */
.intro{padding:clamp(108px,10vw,140px) 0 clamp(36px,4vw,60px)}
.intro-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(24px,5vw,90px);align-items:end}
.intro .lead{margin-bottom:1.6rem}
.intro-media{padding:0 var(--pad)}
.intro-media figure{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:21/9;background:var(--card)}
.intro-media figure img{width:100%;height:115%;object-fit:cover}
.intro-media.portrait figure{aspect-ratio:16/8}
.intro-media.portrait figure img{object-position:center 22%}
@media (max-width:860px){.intro-grid{grid-template-columns:1fr}.intro-media figure{aspect-ratio:4/3}}
.crumbs{display:flex;gap:.5rem;flex-wrap:wrap;list-style:none;margin:0 0 1.1rem;padding:0;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--accent)}
.crumbs li+li::before{content:"/";margin-right:.5rem;opacity:.6}

/* Article layout */
.article{display:grid;grid-template-columns:minmax(0,.62fr) 1px minmax(0,1.38fr);gap:clamp(24px,4vw,64px)}
.article .rule{background:var(--line)}
.aside{position:sticky;top:110px;align-self:start}
.aside h3{font-family:var(--sans);font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:1rem}
.aside ul{list-style:none;margin:0 0 2rem;padding:0}
.aside li a{display:block;padding:.38rem 0;text-decoration:none;font-family:var(--serif);font-size:1.22rem;line-height:1.25;color:var(--muted);transition:color .2s}
.aside li a:hover,.aside li a[aria-current="page"]{color:var(--navy)}
.aside li a[aria-current="page"]::before{content:"";display:inline-block;width:14px;height:1px;background:var(--accent);vertical-align:middle;margin-right:.5rem}
.aside .info{background:var(--card);border-radius:var(--r);padding:1.4rem}
.aside .info p{font-size:.9rem;margin:0 0 .7rem}
.aside .info strong{color:var(--navy);font-weight:500}
@media (max-width:900px){.article{grid-template-columns:1fr}.article .rule{display:none}.aside{position:static;order:2}}

.prose{max-width:46rem;font-size:1.02rem}
.prose>p:first-of-type{font-family:var(--serif);font-size:clamp(1.45rem,2vw,1.85rem);line-height:1.3;color:var(--navy)}
.prose h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.8rem,2.6vw,2.4rem);line-height:1.1;color:var(--navy);margin:2.8rem 0 1rem}
.prose h3{font-family:var(--serif);font-weight:500;font-size:1.5rem;color:var(--navy);margin:2rem 0 .8rem}
.prose a{color:var(--accent);text-underline-offset:.2em}
.prose ul{padding-left:1.1rem}
.prose li{margin-bottom:.4rem}
.prose ul.check-list{list-style:none;padding:0;margin:1.4rem 0 1.8rem;border-top:1px solid var(--line);counter-reset:c}
.prose ul.check-list li{counter-increment:c;display:grid;grid-template-columns:3rem 1fr;gap:.5rem;padding:.95rem 0;border-bottom:1px solid var(--line);margin:0}
.prose ul.check-list li::before{content:counter(c,decimal-leading-zero);font-size:.68rem;letter-spacing:.12em;color:var(--muted);padding-top:.35em}
.prose .callout{background:var(--card);border-radius:var(--r);padding:1.4rem 1.6rem;margin:2rem 0}
.prose .callout.warn{background:#fbe7e9}
.prose .callout p:last-child{margin:0}
.prose blockquote.quote{margin:2.2rem 0;padding:2rem;background:var(--card);border-radius:var(--r);font-family:var(--serif);font-size:1.4rem;line-height:1.35;color:var(--navy)}
.prose blockquote.quote p{margin:0 0 1rem}
.prose blockquote.quote cite{font-family:var(--sans);font-style:normal;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

/* Doctor block */
.doctor{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,6vw,110px);align-items:center}
.doctor figure{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--card);max-width:520px}
.doctor figure img{width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.doctor{grid-template-columns:1fr}}

/* Video cards */
.videos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,24px)}
@media (max-width:900px){.videos{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.videos{grid-template-columns:1fr}}
.video{border-radius:var(--r);overflow:hidden;background:var(--card)}
.video .screen{position:relative;aspect-ratio:16/10;background:var(--ink);overflow:hidden}
.video .screen img{width:100%;height:100%;object-fit:cover;opacity:.55}
.video .play{position:absolute;inset:0;display:grid;place-items:center}
.video .play span{width:62px;height:62px;border-radius:50%;background:rgba(255,255,255,.18);backdrop-filter:blur(8px);display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.35)}
.video .play svg{width:20px;height:20px;margin-left:3px}
.video .soon{position:absolute;top:12px;left:12px;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(255,255,255,.9);color:var(--navy);padding:.3rem .55rem;border-radius:6px}
.video .body{padding:1.2rem 1.3rem 1.4rem}
.video h3{font-family:var(--serif);font-weight:500;font-size:1.45rem;line-height:1.15;margin-bottom:.35rem}
.video p{font-size:.9rem;margin:0}

/* Contact info row */
.info-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.info-cols>div{border-left:1px solid var(--line);padding:0 clamp(1rem,2vw,1.8rem)}
.info-cols .k{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:.7rem}
.info-cols .v{font-family:var(--serif);font-size:1.45rem;line-height:1.25;color:var(--navy)}
.info-cols .v a{text-decoration:none}
.info-cols .v a:hover{color:var(--accent)}
.info-cols small{display:block;font-size:.88rem;color:var(--text);margin-top:.4rem}
@media (max-width:900px){.info-cols{grid-template-columns:1fr 1fr;gap:2rem 0}}
@media (max-width:520px){.info-cols{grid-template-columns:1fr}}
.map{border-radius:var(--r);overflow:hidden;aspect-ratio:21/8;background:var(--card);margin-top:clamp(2rem,4vw,3.5rem)}
.map iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.35) sepia(.08)}
@media (max-width:700px){.map{aspect-ratio:4/3}}

/* ---------- Dark contact + footer ---------- */
.dark{position:relative;background:var(--ink);color:#b7c6d8;overflow:hidden}
.dark::before{content:"";position:absolute;right:-12%;top:-8%;width:70%;aspect-ratio:1;background:url(images/bg-lines2.webp) center/contain no-repeat;opacity:.13;pointer-events:none}
.dark .wrap{position:relative}
.dark .h-l,.dark .h-m,.dark .h-s{color:#fff}
.dark .eyebrow{color:#7f93ab}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);gap:clamp(24px,4vw,70px);padding:clamp(70px,9vw,140px) 0 clamp(50px,7vw,100px)}
.contact-grid .rule{background:var(--line-dark)}
.person{display:grid;grid-template-columns:1fr 92px;gap:1rem;background:rgba(255,255,255,.06);border:1px solid var(--line-dark);border-radius:var(--r-sm);padding:1rem 1rem 1rem 1.2rem;max-width:400px;margin:1.6rem 0}
.person strong{display:block;color:#fff;font-weight:500}
.person span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#7f93ab}
.person p{font-size:.9rem;margin:.6rem 0 0}
.person a{color:#fff}
.person img{width:92px;height:110px;object-fit:cover;border-radius:8px}
.dl{display:grid;grid-template-columns:auto 1fr;gap:.55rem 1.4rem;font-size:.95rem;margin:0}
.dl dt{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#7f93ab;padding-top:.3em}
.dl dd{margin:0;color:#fff}
.dl a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.25)}
.dl a:hover{border-color:#fff}
.form{display:grid;gap:1.1rem}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.field{display:block}
.field span{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#7f93ab;margin-bottom:.35rem}
.field input,.field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.25);color:#fff;font-family:var(--sans);font-size:1rem;padding:.5rem 0;border-radius:0;transition:border-color .2s}
.field input:focus,.field textarea:focus{outline:none;border-color:#fff}
.field textarea{resize:vertical;min-height:80px}
.field input[type=date],.field input[type=time]{color-scheme:dark}
.form-note{font-size:.8rem;color:#7f93ab;margin:0}
.form-msg{font-size:.9rem;border-radius:8px;padding:.8rem 1rem}
.form-msg.err{background:rgba(220,80,90,.15);color:#ffd4d8}
.form-msg.ok{background:rgba(142,175,83,.16);color:#e3f0cc}
.light-form .field span{color:var(--muted)}
.light-form .field input,.light-form .field textarea{color:var(--navy);border-bottom-color:var(--line)}
.light-form .field input:focus,.light-form .field textarea:focus{border-color:var(--navy)}
.light-form .field input[type=date],.light-form .field input[type=time]{color-scheme:light}
.light-form .form-note{color:var(--muted)}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}.contact-grid .rule{display:none}.form .row{grid-template-columns:1fr}}

.foot{border-top:1px solid var(--line-dark);padding:clamp(50px,7vw,90px) 0 32px;text-align:center}
.foot-logo{display:inline-flex;flex-direction:column;align-items:center;gap:.8rem;text-decoration:none;margin-bottom:2.2rem}
.foot-logo img{width:74px;height:74px}
.foot-logo span{font-family:var(--serif);font-size:1.7rem;color:#fff;letter-spacing:.02em;line-height:1}
.foot-logo small{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:#7f93ab}
.foot-main{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 0;list-style:none;margin:0 0 1rem;padding:0}
.foot-main li{display:flex;align-items:center}
.foot-main li+li::before{content:"";width:4px;height:4px;border-radius:50%;background:#4b6584;margin:0 1rem}
.foot-main a{font-family:var(--serif);font-size:1.3rem;color:#d7e1ec;text-decoration:none}
.foot-main a:hover,.foot-main a[aria-current="page"]{color:#fff}
.foot-sub{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.4rem;list-style:none;margin:0 0 2.4rem;padding:0}
.foot-sub a{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#7f93ab;text-decoration:none}
.foot-sub a:hover{color:#fff}
.social{display:flex;justify-content:center;gap:.5rem;margin-bottom:2rem}
.social a{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-dark);display:grid;place-items:center;color:#fff;transition:background .2s,color .2s}
.social a:hover{background:#fff;color:var(--navy)}
.social a[hidden]{display:none}
.social svg{width:17px;height:17px}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem 1.4rem;font-size:.78rem;color:#6f86a1;border-top:1px solid var(--line-dark);padding-top:22px}
.foot-bottom a{color:#6f86a1;text-decoration:none}
.foot-bottom a:hover{color:#fff}
.foot-bottom nav{display:flex;gap:1.2rem}

/* Mobile action bar */
.mbar{display:none}
@media (max-width:700px){
  .mbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:80;padding:6px;border-radius:12px;background:rgba(255,247,243,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 12px 30px -12px rgba(3,22,42,.4);transform:translateY(140%);transition:transform .4s var(--ease)}
  .mbar.show{transform:none}
  .mbar .btn{padding:.8rem}
}

/* Appointment modal */
.modal{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:16px;background:rgba(3,22,42,.6);backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.modal.open{opacity:1;visibility:visible}
.modal-box{position:relative;width:min(560px,100%);max-height:calc(100svh - 32px);overflow-y:auto;background:var(--bg);border-radius:var(--r);padding:clamp(1.6rem,4vw,2.6rem);transform:translateY(16px);transition:transform .45s var(--ease)}
.modal.open .modal-box{transform:none}
.modal-x{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:transparent;cursor:pointer;color:var(--navy);display:grid;place-items:center}
.modal-x svg{width:16px;height:16px}
.modal .h-m{margin-bottom:.6rem}
.modal .thanks{text-align:center;padding:1rem 0}
.modal .thanks .h-m{margin:.4rem 0 .8rem}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .fade{opacity:1;transform:none}
  .reveal-img img,.hero-img{transform:none}
  .hero h1 .w{opacity:1;transform:none;filter:none}
  .hero .sub{opacity:1}
}

/* Services grid (non-carousel) */
.slide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
.slide-grid .slide{flex:none;width:auto}
@media (max-width:900px){.slide-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.slide-grid{grid-template-columns:1fr}}
@media (max-width:700px){
  .foot{padding-bottom:96px}
  .foot-main{flex-direction:column;align-items:center;gap:.35rem}
  .foot-main li+li::before{display:none}
  .foot-sub{flex-direction:column;gap:.5rem}
}
.social.light a{border-color:var(--line);color:var(--navy)}
.social.light a:hover{background:var(--navy);color:#fff}
.menu-logo{position:absolute;top:14px;left:var(--pad)}
.menu-logo img{height:46px;width:auto}
.top-left{display:flex;gap:6px;align-items:flex-start}
.pill.icon{padding:.62rem;justify-content:center}
.pill.emerg{background:#d93a3f;border-color:#d93a3f;color:#fff}
.pill.emerg:hover{background:#b52a2f;border-color:#b52a2f;color:#fff}
.pill.emerg svg{width:14px;height:14px}
@media (max-width:640px){
  .top-left{gap:5px}
  .pill.icon{padding:.55rem}
  .logo-tab{padding:6px 10px 8px}
  .logo-tab img{height:32px}
}
@media (max-width:380px){
  .top{padding:0 10px}
  .pill,.pill.icon{padding:.48rem}
  .top-left{gap:4px}
  .logo-tab{left:calc(50% + 14px);padding:6px 9px 8px}
  .logo-tab img{height:28px}
}

/* Service page template */
.svc-hero{padding:clamp(100px,8vw,118px) 0 clamp(50px,6vw,90px)}
.svc-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(30px,6vw,110px);align-items:center}
.svc-h1{margin-bottom:1.2rem}
.svc-lead{margin:1.6rem 0 2rem;max-width:34rem}
.svc-lead p{margin:0 0 .8em}
.arch{margin:0;border-radius:999px 999px var(--r) var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--card);width:min(100%,520px,calc((100svh - 150px) * .8));justify-self:end}
.arch img{width:100%;height:112%;object-fit:cover}
@media (max-width:860px){.svc-hero-grid{grid-template-columns:1fr}.arch{justify-self:center;max-width:420px}}
.num-list{list-style:none;margin:2rem 0 2rem;padding:0;border-top:1px solid var(--line)}
.num-list li{display:grid;grid-template-columns:3rem 1fr;gap:.5rem;padding:1.1rem 0;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:clamp(1.25rem,1.7vw,1.55rem);line-height:1.25;color:var(--navy)}
.num-list .num{font-family:var(--sans);font-size:.68rem;letter-spacing:.12em;color:var(--muted);padding-top:.5em}
.care{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,110px);align-items:center}
.care-text{margin:1.6rem 0 2rem;max-width:36rem}
.care figure{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--card);max-width:540px;justify-self:end;width:100%}
.care figure img{width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.care{grid-template-columns:1fr}.care figure{justify-self:start}}
.faq .ans .stores{margin-top:.2rem}

/* App phone mockup (frame from iPhone Mockup.ai) */
.device{position:relative;width:300px;aspect-ratio:800/1587;filter:drop-shadow(0 30px 40px rgba(27,53,84,.28)) drop-shadow(0 8px 14px rgba(27,53,84,.15))}
.d-frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.d-screen{position:absolute;left:5.85%;top:2.36%;width:88.4%;height:95.4%;border-radius:11%/5.2%;overflow:hidden;background:#f6f4ef;font-family:var(--sans);display:flex;flex-direction:column;z-index:1}
.d-status{position:relative;height:30px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 4% 0 7%;font-weight:500;font-size:.72rem;color:#111}
.d-time{width:13%;text-align:center}
.d-icons{display:flex;align-items:center;gap:4px;transform:scale(.7);transform-origin:right center}
.d-icons .sig{display:flex;align-items:flex-end;gap:1.5px;height:10px}
.d-icons .sig b{width:3px;background:#111;border-radius:1px}
.d-icons .sig b:nth-child(1){height:4px}.d-icons .sig b:nth-child(2){height:6px}.d-icons .sig b:nth-child(3){height:8px}.d-icons .sig b:nth-child(4){height:10px}
.d-icons .wifi{width:15px;height:11px;color:#111}
.d-icons .bat{position:relative;width:23px;height:11px;border:1.5px solid rgba(17,17,17,.4);border-radius:3.5px;padding:1px;display:block}
.d-icons .bat::after{content:"";position:absolute;right:-4px;top:3px;width:2px;height:4px;border-radius:0 2px 2px 0;background:rgba(17,17,17,.4)}
.d-icons .bat b{display:block;height:100%;width:80%;background:#111;border-radius:1.5px}
.d-app{flex:1;padding:8px 12px 0;display:flex;flex-direction:column;gap:10px;min-height:0}
.d-bar{display:flex;align-items:center;gap:9px;padding:2px 2px 4px}
.d-bar img{width:34px;height:34px;object-fit:contain;background:#fff;border-radius:10px;padding:3px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.d-bar div{flex:1;line-height:1.15}
.d-bar small{display:block;font-size:.66rem;color:var(--muted)}
.d-bar strong{font-family:var(--sans);font-size:.92rem;color:var(--navy)}
.d-avatar{width:32px;height:32px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--navy);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.d-avatar svg{width:16px;height:16px}
.d-hero{position:relative;border-radius:18px;padding:13px 14px;background:linear-gradient(135deg,var(--accent) 0%,#8f4592 100%);color:#f3e4f3;display:grid;gap:3px;font-size:.66rem;box-shadow:0 8px 18px -8px rgba(117,50,119,.6)}
.d-hero strong{font-family:var(--sans);color:#fff;font-size:.92rem;line-height:1.2}
.d-hero span{display:flex;align-items:center;gap:4px;font-size:.7rem;color:#fff}
.d-hero svg{width:12px;height:12px}
.d-hero em{position:absolute;right:11px;top:11px;font-style:normal;font-weight:500;font-size:.58rem;background:rgba(255,255,255,.2);padding:2px 7px;border-radius:999px;color:#fff}
.d-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.d-grid div{background:#fff;border-radius:14px;padding:9px 2px 7px;display:grid;justify-items:center;gap:4px;font-size:.6rem;font-weight:500;color:var(--navy);box-shadow:0 1px 3px rgba(0,0,0,.06)}
.d-grid svg{width:18px;height:18px;color:var(--accent-2)}
.d-card{background:#fff;border-radius:16px;padding:11px 13px;box-shadow:0 1px 3px rgba(0,0,0,.06);font-size:.68rem;color:var(--muted)}
.d-row{display:flex;justify-content:space-between;align-items:center}
.d-row strong{font-family:var(--sans);color:var(--navy);font-size:.85rem}
.d-prog{height:6px;border-radius:6px;background:#ebe8e0;margin-top:7px;overflow:hidden}
.d-prog i{display:block;height:100%;width:68%;border-radius:6px;background:linear-gradient(90deg,#7fb04a,var(--green))}
.d-remind{display:flex;gap:9px;align-items:center;line-height:1.25}
.d-remind strong{display:block;color:var(--ink);font-size:.74rem}
.d-remind small{font-size:.62rem}
.d-dot{width:9px;height:9px;border-radius:50%;background:#e8a33d;box-shadow:0 0 0 4px #fbefd9;flex-shrink:0}
.d-tabs{flex-shrink:0;display:flex;justify-content:space-around;padding:10px 18px 24px;background:rgba(255,255,255,.92);border-top:1px solid #ebe8e0}
.d-tabs span{color:#a3a9b0}
.d-tabs span.on{color:var(--accent)}
.d-tabs svg{width:20px;height:20px}
.d-home{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:104px;height:4px;border-radius:4px;background:#111}
.d-label{font-family:var(--sans);font-weight:500;font-size:.78rem;color:var(--navy);padding:0 2px;margin-bottom:-3px}
.d-pets{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.d-pets .d-card{display:flex;gap:7px;align-items:center;padding:9px;line-height:1.2}
.d-pets strong{display:block;color:var(--ink);font-size:.72rem}
.d-pets small{font-size:.58rem}
.d-pet{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:500;font-size:.72rem;flex-shrink:0}
.d-pet.p1{background:linear-gradient(135deg,#e0a64a,#c07f25)}
.d-pet.p2{background:linear-gradient(135deg,#6c8fb8,#3869a1)}
@media (max-width:420px){.device{width:250px}}
.feature-card .img.phone{display:grid;place-items:center;padding:clamp(2rem,4vw,3.4rem) 1rem;background:radial-gradient(circle at 50% 45%,#fff 0%,var(--sky) 55%,var(--bg-2) 100%)}
.feature-card .img.phone .device{width:clamp(220px,22vw,270px)}
@media (max-width:760px){.feature-card .img.phone{order:2}}

.feature-card .img.phone img{position:static;inset:auto;width:auto;height:auto;object-fit:contain}
.feature-card .img.phone .d-bar img{width:34px;height:34px}
.feature-card .img.phone .d-frame{position:absolute;inset:0;width:100%;height:100%}
.d-pets small{white-space:nowrap;font-size:.56rem}
.d-bar strong{white-space:nowrap;font-size:.86rem}
@media (max-width:420px){.feature-card .img.phone .device{width:262px}}

/* Breadcrumb bar (bottom of page, above contact) */
.crumb-bar{border-top:1px solid var(--line);background:var(--bg)}
.crumb-bar .wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:1.1rem;padding-bottom:1.1rem}
.crumb-bar .crumbs{margin:0}
.to-top{display:inline-flex;align-items:center;gap:.4rem;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-decoration:none;white-space:nowrap}
.to-top svg{width:13px;height:13px;transform:rotate(-90deg)}
.to-top:hover{color:var(--accent)}
@media (max-width:560px){.to-top{display:none}}

/* FAQ: centered block, equal side space */
.faq-wrap{max-width:980px;margin:0 auto}
.faq-head{text-align:center;margin-bottom:2.8rem}
.faq-head .lead{margin:1rem 0 0}
.faq-wrap .faq{max-width:none}
/* keep descenders visible on gradient headings */
.grad{padding-bottom:.12em}

/* Footer: real logo, services match menu width, app links */
.foot-logo{background:var(--bg);border-radius:16px;padding:14px 22px;gap:0}
.foot-logo img{width:auto;height:64px}
.foot-nav{display:inline-block;max-width:100%}
.foot-sub{width:0;min-width:100%;row-gap:.6rem}
.foot-app{display:flex;flex-direction:column;align-items:center;gap:.8rem;margin:0 0 2rem}
.foot-app span{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#7f93ab}
.foot-app .stores{justify-content:center;margin:0}
.foot-app .stores img{height:42px}
@media (max-width:700px){.foot-nav{display:block}.foot-sub{width:auto}}
.foot-logo{display:flex;width:fit-content;margin:0 auto 2.4rem}