@property --bubble-spin { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
:root {
  --ink:#17242b; --cream:#fff8ee; --coral:#ff786d; --mint:#7be3c5; --violet:#a88bff; --sky:#80d8ff;
  --line:rgba(23,36,43,.13); --muted:rgba(23,36,43,.63); --white:rgba(255,255,255,.72);
  --display:ui-rounded,"Arial Rounded MT Bold","Trebuchet MS",sans-serif;
  --sans:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.16,1,.3,1); --spring:cubic-bezier(.2,1.5,.45,1);
}
body{background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.55;-webkit-font-smoothing:antialiased}
header{position:sticky;z-index:70;top:0;background:rgba(255,248,238,.76);border-bottom:1px solid var(--line);backdrop-filter:blur(22px) saturate(1.25)}
.nav{display:flex;align-items:center;gap:2rem;min-height:76px}.brand{display:inline-flex;align-items:center;gap:.7rem}.brand strong{font:850 .82rem/.85 var(--display);letter-spacing:-.03em;text-transform:uppercase}
.brand-mark{position:relative;display:block;width:42px;aspect-ratio:1;border-radius:44% 56% 52% 48%;background:linear-gradient(145deg,var(--coral),#ff9b7f);box-shadow:inset 0 1px rgba(255,255,255,.55),0 9px 24px rgba(255,120,109,.24);transform:rotate(-8deg)}
.brand-mark i{position:absolute;width:7px;aspect-ratio:1;border-radius:50%;background:#fff}.brand-mark i:nth-child(1){left:8px;top:9px}.brand-mark i:nth-child(2){left:18px;top:5px}.brand-mark i:nth-child(3){right:7px;top:11px}.brand-mark i:nth-child(4){width:17px;left:13px;bottom:8px;border-radius:55% 55% 45% 45%}
.nav nav{display:flex;gap:1.7rem;margin-left:auto}.nav nav a{font-size:.78rem;font-weight:750;transition:color 180ms ease}.nav nav a:hover{color:#8f61f4}.book-link{display:flex;gap:.8rem;align-items:center;padding:.66rem 1rem;border:1px solid var(--ink);border-radius:999px;font-size:.75rem;font-weight:800;transition:transform 300ms var(--spring),background 220ms ease,color 220ms ease}.book-link b{transition:transform 300ms var(--spring)}.book-link:hover{background:var(--ink);color:white;transform:translateY(-2px)}.book-link:hover b{transform:rotate(45deg)}
.hero{position:relative;isolation:isolate;min-height:min(850px,calc(100svh - 126px));display:grid;align-items:center;overflow:hidden;background:linear-gradient(135deg,#fff8ee 0%,#f0fbf8 48%,#f4eeff 100%)}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background-image:radial-gradient(circle,rgba(23,36,43,.12) 1px,transparent 1.5px);background-size:24px 24px;mask-image:linear-gradient(120deg,transparent,black 38%,transparent 86%);opacity:.34}
.liquid-field{position:absolute;inset:0;z-index:-1}.liquid-field i{position:absolute;border-radius:50%;filter:blur(1px);mix-blend-mode:multiply;animation:bubble-drift 11s var(--ease) infinite alternate}.liquid-field i::after{content:"";position:absolute;inset:8%;border-radius:inherit;border:1px solid rgba(255,255,255,.52);box-shadow:inset 12px 14px 26px rgba(255,255,255,.42),inset -12px -15px 28px rgba(82,37,126,.12),0 22px 70px rgba(90,55,142,.11)}
.liquid-field i:nth-child(1){width:28rem;aspect-ratio:1;right:-8rem;top:-9rem;background:linear-gradient(145deg,rgba(168,139,255,.55),rgba(128,216,255,.25));animation-delay:-2s}.liquid-field i:nth-child(2){width:14rem;aspect-ratio:1;left:-5rem;bottom:3%;background:rgba(255,120,109,.32);animation-delay:-7s}.liquid-field i:nth-child(3){width:8rem;aspect-ratio:1;left:42%;top:9%;background:rgba(123,227,197,.34);animation-delay:-4s}.liquid-field i:nth-child(4){width:5rem;aspect-ratio:1;right:43%;bottom:10%;background:rgba(128,216,255,.3);animation-delay:-9s}.liquid-field i:nth-child(5){width:3rem;aspect-ratio:1;left:8%;top:18%;background:rgba(168,139,255,.34);animation-delay:-1s}
.hero-layout{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:clamp(2rem,7vw,7rem);padding-block:clamp(5rem,11vh,8rem)}.hero-copy{animation:copy-pop 1s .08s var(--ease) both}.kicker{margin:0 0 1rem;color:#7d57d8;font-size:.68rem;font-weight:850;letter-spacing:.17em;text-transform:uppercase}.hero h1{max-width:10ch;margin:0;font:850 clamp(3.8rem,7vw,7.1rem)/.88 var(--display);letter-spacing:-.075em;text-wrap:balance}.hero h1 em{position:relative;color:#7047d7;font-style:normal;white-space:nowrap}.hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:-.05em;height:.13em;border-radius:99px;background:linear-gradient(90deg,var(--coral),var(--violet),var(--mint));transform:scaleX(0);transform-origin:left;animation:underline-swish .9s 1s var(--ease) forwards}.intro{max-width:34rem;margin:1.7rem 0 2rem;color:var(--muted);font-size:clamp(1rem,1.5vw,1.18rem)}
.actions{display:flex;flex-wrap:wrap;gap:.7rem}.pill{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:.85rem 1.25rem;overflow:hidden;border:1px solid transparent;border-radius:999px;font-size:.78rem;font-weight:850;transition:transform 300ms var(--spring),box-shadow 300ms ease,background 200ms ease}.pill::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.45),transparent 75%);transform:translateX(-120%);transition:transform 700ms var(--ease)}.pill:hover::before{transform:translateX(120%)}.pill:hover{transform:translateY(-3px) scale(1.015)}.pill:active{transform:scale(.97)}.pill-dark{background:var(--ink);color:white;box-shadow:0 16px 36px rgba(23,36,43,.16)}.pill-glass{border-color:var(--line);background:rgba(255,255,255,.46);backdrop-filter:blur(12px)}.social-proof{display:flex;align-items:center;gap:.9rem;margin-top:2rem}.faces{display:flex}.faces i{display:grid;place-items:center;width:34px;aspect-ratio:1;margin-left:-8px;border:3px solid var(--cream);border-radius:50%;background:var(--coral);color:white;font-style:normal;font-weight:850}.faces i:first-child{margin:0;background:var(--violet)}.faces i:last-child{background:var(--mint);color:var(--ink)}.social-proof p{margin:0;font-size:.74rem;line-height:1.3}.social-proof b{font-size:.9rem}.social-proof small{color:var(--muted)}
.pet-stage{position:relative;min-height:530px;perspective:1300px;animation:stage-pop 1.15s .28s var(--ease) both}.halo{position:absolute;border:1px solid rgba(86,61,143,.16);border-radius:50%}.halo::before{content:"";position:absolute;width:13px;aspect-ratio:1;border-radius:50%;background:var(--coral);box-shadow:0 0 28px 7px rgba(255,120,109,.45)}.halo-a{inset:3% -4% 9% 3%;transform:rotateX(65deg) rotateZ(-18deg);animation:halo-pulse 5.5s ease-in-out infinite}.halo-a::before{left:10%;top:80%}.halo-b{inset:13% 8% 1% 12%;transform:rotateX(62deg) rotateZ(35deg);animation:halo-pulse 5.5s -2.7s ease-in-out infinite reverse}.halo-b::before{right:10%;top:15%;background:var(--mint);box-shadow:0 0 28px 7px rgba(123,227,197,.45)}
/* preserve-3d keeps the card's portrait and labels on separate tactile depth planes. */
.pet-card{position:absolute;inset:7% 10% 10% 10%;display:flex;flex-direction:column;padding:1.2rem;border:1px solid rgba(255,255,255,.58);border-radius:38px;background:linear-gradient(145deg,rgba(255,255,255,.74),rgba(255,255,255,.3));box-shadow:inset 0 1px rgba(255,255,255,.9),0 45px 100px rgba(70,40,105,.18);backdrop-filter:blur(18px) saturate(1.4);transform:rotateY(-8deg) rotateX(4deg);transform-style:preserve-3d;transition:transform 800ms var(--ease),box-shadow 500ms ease}.pet-stage:hover .pet-card{transform:rotateY(5deg) rotateX(-2deg) translateY(-10px);box-shadow:inset 0 1px rgba(255,255,255,.9),0 55px 120px rgba(70,40,105,.25)}.card-top,.card-bottom{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;padding:.35rem .35rem .7rem;font-size:.63rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;transform:translateZ(42px)}.card-top b{font-size:.8rem}.card-bottom{padding:.8rem .35rem .2rem;text-transform:none;letter-spacing:0}.card-bottom div{display:flex;flex-direction:column}.card-bottom small{color:var(--muted)}.card-bottom strong{font:850 1.2rem/1.1 var(--display)}.status{padding:.4rem .65rem;border-radius:999px;background:#dff9ee;color:#20765c;font-size:.62rem;text-transform:uppercase;letter-spacing:.1em}
.pet-portrait{position:relative;flex:1;overflow:hidden;border-radius:29px;background:conic-gradient(from var(--bubble-spin),#9ae8dc,#c7b0ff,#ff9f8f,#9ae8dc);animation:bubble-color 12s linear infinite;transform:translateZ(18px)}.pet-portrait::before{content:"";position:absolute;inset:9%;border-radius:50%;background:rgba(255,255,255,.54);box-shadow:inset 0 0 70px rgba(255,255,255,.72),0 0 0 1px rgba(255,255,255,.58);backdrop-filter:blur(18px)}.head{position:absolute;z-index:2;width:46%;aspect-ratio:1;left:27%;top:29%;border-radius:48% 48% 44% 44%;background:#fff7e9;box-shadow:inset 0 -18px 24px rgba(212,168,117,.16),0 20px 35px rgba(91,57,117,.14)}.ear{position:absolute;z-index:1;width:25%;height:32%;top:23%;border-radius:60% 60% 30% 30%;background:#f1d6b7;box-shadow:inset 0 -15px 20px rgba(137,88,73,.13)}.ear-left{left:19%;transform:rotate(-33deg)}.ear-right{right:19%;transform:rotate(33deg)}.eye{position:absolute;width:8%;aspect-ratio:1;top:43%;border-radius:50%;background:var(--ink);box-shadow:0 0 0 4px rgba(255,255,255,.8)}.eye-left{left:27%}.eye-right{right:27%}.nose{position:absolute;width:14%;height:10%;left:43%;top:62%;border-radius:55% 55% 48% 48%;background:var(--ink)}.shine{position:absolute;z-index:3;width:40%;height:150%;left:-55%;top:-25%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:rotate(18deg);animation:portrait-shine 5.5s 1.4s var(--ease) infinite}.float-tag{position:absolute;z-index:5;display:flex;align-items:center;gap:.55rem;padding:.72rem .85rem;border:1px solid rgba(255,255,255,.7);border-radius:999px;background:rgba(255,255,255,.72);box-shadow:0 14px 38px rgba(70,40,105,.13);backdrop-filter:blur(12px);font-size:.68rem;font-weight:800;animation:tag-float 4s ease-in-out infinite}.float-tag span{width:8px;aspect-ratio:1;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(255,120,109,.14)}.tag-one{left:-2%;top:22%}.tag-two{right:-3%;bottom:24%;animation-delay:-2s}.tag-two span{background:var(--mint);box-shadow:0 0 0 5px rgba(123,227,197,.16)}.scroll-note{position:absolute;left:50%;bottom:1.2rem;display:flex;align-items:center;gap:.6rem;transform:translateX(-50%);color:var(--muted);font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.scroll-note span{width:35px;height:1px;background:var(--ink);transform-origin:left;animation:scroll-line 2.4s var(--ease) infinite}
.services{padding:clamp(5rem,10vw,9rem) 0;background:#182a31;color:#f9f7f2}.section-title{display:grid;grid-template-columns:.7fr 1fr .7fr;align-items:end;gap:2rem;margin-bottom:3rem}.section-title>p{margin:0;color:var(--mint);font-size:.68rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.section-title h2,.care h2,.visit h2{margin:0;font:850 clamp(3rem,6vw,6rem)/.88 var(--display);letter-spacing:-.065em}.section-title>span{color:rgba(249,247,242,.62);font-size:.86rem}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;perspective:1200px}.service-card{position:relative;min-height:430px;display:flex;flex-direction:column;padding:1.5rem;border-radius:28px;color:var(--ink);overflow:hidden;transform-style:preserve-3d;transition:transform 550ms var(--ease),box-shadow 550ms ease}.service-card::after{content:"";position:absolute;inset:0;background:linear-gradient(130deg,rgba(255,255,255,.42),transparent 30% 72%,rgba(255,255,255,.2));mix-blend-mode:soft-light;pointer-events:none}.service-card:hover{transform:translateY(-14px) rotateX(3deg) rotateY(-2deg);box-shadow:0 35px 70px rgba(0,0,0,.24)}.service-card.coral{background:linear-gradient(145deg,#ff9b88,#ff6e70)}.service-card.violet{background:linear-gradient(145deg,#c2b0ff,#8a6cf1)}.service-card.mint{background:linear-gradient(145deg,#a2f0d8,#5dcdae)}.service-card>span{font-size:.62rem;font-weight:850;letter-spacing:.12em}.service-card h3{max-width:8ch;margin:auto 0 .75rem;font:850 clamp(2rem,3.8vw,3.5rem)/.9 var(--display);letter-spacing:-.05em}.service-card p{margin:0 0 1.3rem;font-size:.85rem;opacity:.7}.service-card a{font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.1em}.service-icon{position:absolute;right:1.3rem;top:1.3rem;width:105px;aspect-ratio:1;border:1px solid rgba(255,255,255,.4);border-radius:50%;background:rgba(255,255,255,.16);transform:translateZ(28px);transition:transform 600ms var(--spring)}.service-card:hover .service-icon{transform:translateZ(48px) rotate(12deg) scale(1.05)}.bubble-icon i{position:absolute;border:2px solid rgba(23,36,43,.65);border-radius:50%}.bubble-icon i:nth-child(1){width:35%;aspect-ratio:1;left:21%;top:36%}.bubble-icon i:nth-child(2){width:18%;aspect-ratio:1;right:20%;top:23%}.bubble-icon i:nth-child(3){width:10%;aspect-ratio:1;right:25%;bottom:20%}.cut-icon i{position:absolute;width:50%;height:2px;left:25%;top:50%;background:var(--ink);transform:rotate(40deg);transform-origin:center}.cut-icon i::before{content:"";position:absolute;width:15px;aspect-ratio:1;left:-10px;top:-7px;border:2px solid var(--ink);border-radius:50%}.cut-icon i:nth-child(2){transform:rotate(-40deg)}.paw-icon i{position:absolute;width:16%;aspect-ratio:1;border:2px solid var(--ink);border-radius:50%;top:25%}.paw-icon i:nth-child(1){left:22%}.paw-icon i:nth-child(2){left:42%;top:18%}.paw-icon i:nth-child(3){right:20%}.paw-icon i:nth-child(4){width:38%;height:29%;left:31%;top:49%;border-radius:50% 50% 42% 42%}
.care{padding:clamp(6rem,11vw,10rem) 0;background:#fff7ed}.care-grid{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:clamp(3rem,8vw,8rem)}.care-copy>p:not(.kicker){max-width:30rem;color:var(--muted);font-size:1rem}.text-link{display:inline-flex;align-items:center;gap:.8rem;margin-top:1rem;padding-bottom:.25rem;border-bottom:1px solid var(--ink);font-size:.8rem;font-weight:850}.text-link span{transition:transform 300ms var(--spring)}.text-link:hover span{transform:translate(4px,-4px)}.care-orbit{position:relative;min-height:560px}.care-orbit::before,.care-orbit::after{content:"";position:absolute;inset:13%;border:1px dashed rgba(23,36,43,.18);border-radius:50%;animation:orbit-spin 28s linear infinite}.care-orbit::after{inset:28%;border-style:solid;animation-direction:reverse;animation-duration:20s}.orbit-center{position:absolute;z-index:2;left:50%;top:50%;display:grid;place-items:center;width:225px;aspect-ratio:1;border-radius:50%;background:linear-gradient(145deg,var(--coral),#ff9a78);box-shadow:inset 0 1px rgba(255,255,255,.5),0 35px 70px rgba(255,120,109,.23);transform:translate(-50%,-50%);text-align:center}.orbit-center strong{font:850 3rem/.8 var(--display);letter-spacing:-.06em}.orbit-center span{font-size:.62rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.orbit-card{position:absolute;z-index:3;width:150px;aspect-ratio:1;display:flex;flex-direction:column;justify-content:space-between;padding:1.2rem;border:1px solid rgba(255,255,255,.65);border-radius:30px;background:rgba(255,255,255,.68);box-shadow:0 20px 50px rgba(41,32,57,.12);backdrop-filter:blur(14px);animation:orbit-card-float 5s ease-in-out infinite}.orbit-card b{color:#7b58d7;font-size:.65rem}.orbit-card span{font:850 1.1rem/1.05 var(--display)}.o-one{left:6%;top:12%}.o-two{right:3%;top:25%;animation-delay:-1.7s}.o-three{left:18%;bottom:5%;animation-delay:-3.4s}
.reviews{padding:5rem 0;background:#a98cf9;color:#1d1730}.review-wrap{display:grid;grid-template-columns:.55fr 1.45fr;align-items:center;gap:clamp(3rem,8vw,8rem)}.score{display:flex;flex-direction:column}.score>span{font-size:.65rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.score>strong{font:850 7rem/.9 var(--display);letter-spacing:-.09em}.score div{letter-spacing:.1em}.score div i{color:rgba(29,23,48,.22);font-style:normal}.score small{margin-top:.4rem;opacity:.66}.reviews blockquote{margin:0;font:850 clamp(2rem,4.2vw,4.3rem)/.98 var(--display);letter-spacing:-.045em}.reviews cite{display:block;margin-top:1.5rem;font:700 .65rem/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;opacity:.62}
.visit{padding:clamp(5rem,10vw,9rem) 0;background:#eafaf4}.visit-card{display:grid;grid-template-columns:1.2fr .8fr;border:1px solid var(--line);border-radius:34px;overflow:hidden;background:rgba(255,255,255,.55);box-shadow:0 35px 90px rgba(30,78,64,.09)}.visit-copy,.visit-hours{padding:clamp(2rem,5vw,4rem)}.visit-copy{position:relative;overflow:hidden}.visit-copy::after{content:"";position:absolute;width:19rem;aspect-ratio:1;right:-10rem;bottom:-11rem;border-radius:50%;background:radial-gradient(circle,var(--mint),transparent 68%);opacity:.55}.visit h2{font-size:clamp(2.8rem,5vw,5.1rem)}address{margin:1.5rem 0;color:var(--muted);font-style:normal}.visit-hours{display:flex;flex-direction:column;justify-content:center;background:#1a2c33;color:white}.visit-hours>span{color:var(--mint);font-size:.65rem;font-weight:850;letter-spacing:.15em;text-transform:uppercase}.visit-hours ul{list-style:none;margin:1.3rem 0;padding:0}.visit-hours li{display:flex;justify-content:space-between;gap:1rem;padding:1.1rem 0;border-top:1px solid rgba(255,255,255,.15)}.visit-hours li:last-child{border-bottom:1px solid rgba(255,255,255,.15)}.visit-hours b{font-size:.8rem}.visit-hours em{font:850 1.35rem/1 var(--display)}.visit-hours small{color:rgba(255,255,255,.56)}
footer{padding:3rem 0 2rem;background:#132229;color:white}.footer-row{display:grid;grid-template-columns:1.2fr .7fr .7fr;gap:2rem}.footer-row>div{display:flex;flex-direction:column;gap:.35rem}.footer-row>div b{color:var(--mint);font-size:.62rem;text-transform:uppercase;letter-spacing:.13em}.footer-row>div a{font-size:.82rem}.sticky-call{background:var(--ink);color:white}
@keyframes bubble-drift{0%{transform:translate3d(-10px,12px,0) scale(.96) rotate(-4deg)}45%{transform:translate3d(25px,-28px,0) scale(1.07) rotate(4deg)}100%{transform:translate3d(-15px,-5px,0) scale(1.01) rotate(-2deg)}}
@keyframes copy-pop{from{opacity:0;transform:translate3d(-30px,30px,0) scale(.97)}to{opacity:1;transform:none}}@keyframes stage-pop{from{opacity:0;transform:translate3d(45px,35px,0) rotate(4deg)}to{opacity:1;transform:none}}@keyframes underline-swish{to{transform:scaleX(1)}}@keyframes halo-pulse{0%,100%{opacity:.28;transform:rotateX(65deg) rotateZ(-18deg) scale(.94)}50%{opacity:.7;transform:rotateX(65deg) rotateZ(-8deg) scale(1.05)}}@keyframes bubble-color{to{--bubble-spin:360deg}}@keyframes portrait-shine{0%,55%,100%{transform:translateX(0) rotate(18deg)}75%{transform:translateX(480%) rotate(18deg)}}@keyframes tag-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-11px) rotate(1deg)}}@keyframes scroll-line{0%{transform:scaleX(.1);opacity:.3}50%{transform:scaleX(1);opacity:1}100%{transform:translateX(35px) scaleX(.1);opacity:0}}@keyframes orbit-spin{to{transform:rotate(360deg)}}@keyframes orbit-card-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-12px) rotate(2deg)}}
@media(max-width:900px){.nav nav{display:none}.book-link{margin-left:auto}.hero-layout,.care-grid{grid-template-columns:1fr}.hero-layout{padding-top:5rem}.pet-stage{max-width:580px;width:100%;margin-inline:auto}.section-title{grid-template-columns:1fr}.service-grid{grid-template-columns:1fr 1fr}.service-card:last-child{grid-column:1/-1}.care-copy{max-width:38rem}.review-wrap{grid-template-columns:1fr}}
@media(max-width:620px){.book-link{display:none}.hero h1{font-size:clamp(3.4rem,17vw,5.5rem)}.pet-stage{min-height:420px}.pet-card{inset:7% 4% 10%}.float-tag{font-size:.58rem}.tag-one{left:-1%}.tag-two{right:-1%}.section-title h2,.care h2,.visit h2{font-size:clamp(2.9rem,15vw,4.7rem)}.service-grid,.visit-card,.footer-row{grid-template-columns:1fr}.service-card:last-child{grid-column:auto}.care-orbit{min-height:470px;transform:scale(.85);margin-inline:-2rem}.review-wrap{gap:2rem}.score>strong{font-size:6rem}.reviews blockquote{font-size:2.2rem}.visit-card{border-radius:24px}}
