:root{
  --blue:#1500B7;
  --blue-deep:#0A0752;
  --blue-mid:#241CC7;
  --green:#1FB855;
  --green-bright:#2ECC55;
  --gold:#FFD200;
  --gold-deep:#E0A800;
  --white:#FFFFFF;
  --ink:#0B0B22;
  --paper:#F6F7FC;
  --paper-deep:#ECEEF9;
  --grey:#6B6E8A;
  --shadow: 0 20px 45px -22px rgba(10,7,82,0.35);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', sans-serif;
  background:var(--paper);
  color:var(--ink);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  font-weight:400;
}
::selection{background:var(--gold); color:var(--ink);}
a{text-decoration:none; color:inherit;}
img{display:block; max-width:100%;}
h1,h2,h3{
  font-family:'Plus Jakarta Sans', sans-serif;
  font-weight:800;
  color:var(--blue-deep);
  line-height:1.15;
}
.container{max-width:1240px; margin:0 auto; padding:0 6vw;}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:'Plus Jakarta Sans', sans-serif;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:var(--green);
}
.eyebrow.on-dark{color:var(--gold);}
.eyebrow svg{width:16px; height:16px;}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:16px 32px;
  border-radius:100px;
  font-family:'Plus Jakarta Sans', sans-serif;
  font-weight:700;
  font-size:14.5px;
  cursor:pointer;
  transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, background .35s ease;
  border:none;
  white-space:nowrap;
}
.btn-gold{
  background:var(--gold);
  color:var(--blue-deep);
  box-shadow:0 14px 30px -10px rgba(255,210,0,0.55);
}
.btn-gold:hover{background:var(--gold-deep); transform:translateY(-3px);}
.btn-outline-light{
  background:transparent;
  color:var(--white);
  border:1.5px solid rgba(255,255,255,0.7);
}
.btn-outline-light:hover{background:rgba(255,255,255,0.12); transform:translateY(-3px);}
.btn-green{
  background:var(--green);
  color:var(--white);
  box-shadow:0 14px 30px -10px rgba(31,184,85,0.5);
}
.btn-green:hover{background:#189146; transform:translateY(-3px);}
.btn-outline-blue{
  background:transparent;
  border:1.5px solid var(--blue);
  color:var(--blue);
}
.btn-outline-blue:hover{background:var(--blue); color:var(--white); transform:translateY(-3px);}

.reveal{opacity:0; transform:translateY(26px); transition:opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1);}
.reveal.in{opacity:1; transform:translateY(0);}
.d1{transition-delay:.1s;} .d2{transition-delay:.2s;} .d3{transition-delay:.3s;} .d4{transition-delay:.4s;}

.paw-trail{display:flex; align-items:center; justify-content:center; gap:22px; opacity:.85;}
.paw-trail svg{width:20px; height:20px; fill:var(--gold);}
.paw-trail svg:nth-child(2){transform:translateY(-8px);}
.paw-trail svg:nth-child(4){transform:translateY(-8px);}

header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 6vw;
  background:rgba(10,7,82,0);
  transition:background .45s ease, padding .45s ease, box-shadow .45s ease;
}
header.scrolled{
  background:rgba(10,7,82,0.94);
  backdrop-filter:blur(14px);
  padding:12px 6vw;
  box-shadow:0 10px 30px -18px rgba(0,0,0,0.5);
}
.brand{display:flex; align-items:center; gap:12px;}
.brand-badge{
  width:46px; height:36px; border-radius:10px; overflow:hidden;
  box-shadow:0 6px 16px -6px rgba(0,0,0,0.4);
}
.brand-badge img{width:100%; height:100%; object-fit:cover;}
.brand-name{
  font-family:'Plus Jakarta Sans', sans-serif;
  font-weight:800;
  font-size:19px;
  color:var(--white);
}
.brand-name .amp{color:var(--gold);}
nav ul{list-style:none; display:flex; gap:34px; align-items:center;}
nav a{
  font-family:'Plus Jakarta Sans', sans-serif;
  font-size:13px; font-weight:600;
  color:var(--white);
  opacity:.88;
  position:relative;
  padding-bottom:3px;
}
nav a:not(.btn):hover{opacity:1;}
nav a:not(.btn)::after{
  content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px;
  background:var(--gold); transition:width .35s ease; border-radius:2px;
}
nav a:not(.btn):hover::after{width:100%;}
.menu-toggle{display:none;}

@media(max-width:900px){
  nav ul{
    position:fixed; top:0; right:-100%; height:100vh; width:80vw; max-width:340px;
    background:var(--blue-deep); flex-direction:column; justify-content:center; gap:32px;
    transition:right .5s cubic-bezier(.22,1,.36,1);
    box-shadow:-20px 0 50px rgba(0,0,0,0.3);
    padding:0 44px;
  }
  nav ul.open{right:0;}
  .menu-toggle{
    display:flex; flex-direction:column; gap:5px; cursor:pointer; z-index:110;
    background:none; border:none; padding:6px;
  }
  .menu-toggle span{width:24px; height:2px; background:var(--white); border-radius:2px; transition:.35s;}
  .menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .menu-toggle.open span:nth-child(2){opacity:0;}
  .menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}

.hero{
  position:relative;
  min-height:100vh;
  display:flex; align-items:center;
  padding:150px 6vw 90px;
  background:
    radial-gradient(ellipse 60% 55% at 15% 15%, rgba(31,184,85,0.35), transparent 60%),
    radial-gradient(ellipse 55% 50% at 90% 85%, rgba(255,210,0,0.18), transparent 60%),
    linear-gradient(160deg, var(--blue-deep) 0%, var(--blue) 60%, var(--blue-mid) 100%);
  overflow:hidden;
}
.hero-grid{
  display:grid; grid-template-columns:1.05fr 0.95fr; gap:6vw; align-items:center;
  max-width:1280px; margin:0 auto; width:100%; position:relative; z-index:2;
}
.hero-copy .eyebrow{margin-bottom:20px;}
.hero h1{
  color:var(--white);
  font-size:clamp(36px,4.4vw,58px);
  max-width:11.5ch;
}
.hero p.sub{
  margin-top:24px; color:#D6D6F5; font-size:16.5px; line-height:1.75; max-width:42ch; font-weight:300;
}
.hero-actions{margin-top:38px; display:flex; gap:16px; flex-wrap:wrap;}
.hero-tag{
  margin-top:30px; display:inline-flex; align-items:center; gap:10px;
  background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.18);
  padding:10px 18px; border-radius:100px; color:var(--white); font-size:12.5px; font-weight:600;
  font-family:'Plus Jakarta Sans', sans-serif; letter-spacing:.5px;
}
.hero-tag svg{width:15px; height:15px; fill:var(--gold);}
.hero-visual{position:relative;}
.hero-visual .frame{
  position:relative; z-index:2; border-radius:24px; overflow:hidden;
  box-shadow:var(--shadow); border:6px solid rgba(255,255,255,0.15);
  background:linear-gradient(180deg, #f1f3fb 0%, #e8ebf5 100%);
}
.hero-visual .frame img{
  width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center top;
  transition:transform 1.2s cubic-bezier(.22,1,.36,1);
  filter:saturate(1.15) contrast(1.08) brightness(1.05);
}
.hero-visual:hover .frame img{transform:scale(1.06);}
.hero-visual .blob{
  position:absolute; z-index:1; width:100%; aspect-ratio:1/1; border-radius:44% 56% 60% 40%/50% 45% 55% 50%;
  background:radial-gradient(circle at 35% 20%, rgba(255,255,255,0.26), rgba(31,184,85,0.12) 30%, rgba(31,184,85,0.08) 52%, transparent 72%);
  top:-4%; left:-2%; opacity:.75; filter:blur(8px);
  box-shadow:0 0 40px rgba(31,184,85,0.12);
}
.hero-visual .float-card{
  position:absolute; z-index:3; bottom:-8%; right:-6%;
  background:var(--white); border-radius:16px; padding:16px 20px;
  box-shadow:var(--shadow);
  display:flex; align-items:center; gap:12px;
}
.hero-visual .float-card .ic{
  width:40px; height:40px; border-radius:50%; background:var(--paper-deep);
  display:flex; align-items:center; justify-content:center;
}
.hero-visual .float-card .ic svg{width:20px; height:20px; stroke:var(--green);}
.hero-visual .float-card b{display:block; font-family:'Plus Jakarta Sans',sans-serif; font-size:14px; color:var(--blue-deep);}
.hero-visual .float-card span{font-size:11.5px; color:var(--grey);}

@media(max-width:900px){
  .hero{padding:130px 6vw 70px; min-height:auto;}
  .hero-grid{grid-template-columns:1fr; gap:54px;}
  .hero h1{max-width:none;}
  .hero-visual{order:-1; max-width:340px; margin:0 auto;}
}

.section-head{text-align:center; max-width:640px; margin:0 auto 60px;}
.section-head h2{font-size:clamp(28px,3.4vw,42px); margin-top:16px;}
.section-head p{margin-top:16px; color:var(--grey); font-size:15.5px; line-height:1.7;}

.services{padding:120px 0 100px;}
.services-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:26px;}
.service-card{
  background:var(--white); border-radius:20px; overflow:hidden;
  box-shadow:0 18px 40px -28px rgba(10,7,82,0.35);
  transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease;
}
.service-card:hover{transform:translateY(-10px); box-shadow:0 28px 50px -24px rgba(10,7,82,0.4);}
.service-card .ph{position:relative; aspect-ratio:1/1; overflow:hidden;}
.service-card .ph img{width:100%; height:100%; object-fit:cover; transition:transform .9s cubic-bezier(.22,1,.36,1);}
.service-card:hover .ph img{transform:scale(1.1);}
.service-card .ic-badge{
  position:absolute; bottom:-22px; left:20px; z-index:2;
  width:52px; height:52px; border-radius:14px;
  background:var(--green); display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 20px -6px rgba(31,184,85,0.6);
}
.service-card .ic-badge svg{width:24px; height:24px; stroke:var(--white); fill:none;}
.service-card .info{padding:38px 22px 26px;}
.service-card h3{font-size:18px; color:var(--blue-deep);}
.service-card p{margin-top:10px; font-size:13.5px; color:var(--grey); line-height:1.65; min-height:58px;}
.service-card .more{
  margin-top:16px; display:inline-flex; align-items:center; gap:6px;
  font-family:'Plus Jakarta Sans',sans-serif; font-size:12px; font-weight:700; letter-spacing:.6px;
  text-transform:uppercase; color:var(--blue);
}
.service-card .more svg{width:13px; height:13px; transition:transform .3s ease;}
.service-card:hover .more svg{transform:translateX(4px);}

@media(max-width:1000px){.services-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.services-grid{grid-template-columns:1fr; max-width:380px; margin:0 auto;}}

.whyus{padding:110px 0; background:var(--paper-deep);}
.whyus-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:6vw; align-items:center;}
.whyus-visual{position:relative;}
.whyus-visual img{border-radius:22px; box-shadow:var(--shadow); width:100%; aspect-ratio:4/5; object-fit:cover;}
.whyus-visual .ring{
  position:absolute; width:130px; height:130px; border-radius:50%;
  border:10px solid var(--gold); opacity:.9; top:-30px; right:-30px; z-index:-1;
}
.whyus-copy h2{font-size:clamp(28px,3.4vw,40px);}
.whyus-copy > p{margin-top:18px; color:var(--grey); font-size:15.5px; line-height:1.75; max-width:52ch;}
.diff-grid{display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-top:44px;}
.diff{display:flex; gap:16px; align-items:flex-start;}
.diff .ic{
  flex:none; width:46px; height:46px; border-radius:12px; background:var(--white);
  display:flex; align-items:center; justify-content:center; box-shadow:0 10px 22px -12px rgba(10,7,82,0.3);
}
.diff .ic svg{width:21px; height:21px; stroke:var(--blue); fill:none;}
.diff h3{font-size:15.5px; color:var(--blue-deep);}
.diff p{margin-top:5px; font-size:13px; color:var(--grey); line-height:1.6;}

@media(max-width:900px){
  .whyus-grid{grid-template-columns:1fr; gap:50px;}
  .whyus-visual{max-width:360px; margin:0 auto;}
  .diff-grid{grid-template-columns:1fr;}
}

.transform{padding:120px 0;}
.ba-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.ba-card{
  border-radius:20px; overflow:hidden; box-shadow:0 18px 40px -26px rgba(10,7,82,0.35);
  background:var(--white);
  transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.ba-card:hover{transform:translateY(-8px);}
.ba-imgs{display:grid; grid-template-columns:1fr 1fr; position:relative;}
.ba-imgs .half{position:relative; aspect-ratio:1/1; overflow:hidden; background:#f5f5f5;}
.ba-imgs img{width:100%; height:100%; object-fit:contain; padding:8px; transition:transform .9s cubic-bezier(.22,1,.36,1);}
.ba-card:hover .ba-imgs img{transform:scale(1.08);}
.ba-imgs .tag{
  position:absolute; top:12px; left:12px; z-index:2;
  font-family:'Plus Jakarta Sans',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:1px;
  text-transform:uppercase; padding:5px 12px; border-radius:100px;
}
.ba-imgs .half.before .tag{background:rgba(11,11,34,0.65); color:#fff;}
.ba-imgs .half.after .tag{background:var(--green); color:#fff;}
.ba-imgs::after{
  content:''; position:absolute; left:50%; top:0; bottom:0; width:3px;
  background:var(--gold); transform:translateX(-50%); z-index:3;
}
.ba-card .cap{padding:18px 20px; text-align:center; font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; color:var(--blue-deep); font-size:14px;}

@media(max-width:900px){.ba-grid{grid-template-columns:1fr; max-width:420px; margin:0 auto;}}

.experience{
  position:relative; padding:130px 0; text-align:center; overflow:hidden;
  background:linear-gradient(160deg, var(--blue-deep), var(--blue) 70%);
}
.experience::before{
  content:''; position:absolute; inset:0;
  background-image:var(--exp-bg);
  background-size:cover; background-position:center;
  opacity:.16; mix-blend-mode:luminosity;
}
.experience::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(160deg, rgba(10,7,82,0.92), rgba(21,0,183,0.85));
}
.experience .container{position:relative; z-index:2;}
.experience h2{color:var(--white); font-size:clamp(30px,4vw,46px); margin-top:18px;}
.experience p{color:#D6D6F5; max-width:560px; margin:20px auto 0; font-size:16px; line-height:1.75;}
.experience .btn{margin-top:38px;}
.experience .paw-trail{margin-bottom:6px;}

.testimonials{padding:120px 0;}
.t-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.t-card{
  background:var(--white); border-radius:20px; padding:32px 28px;
  box-shadow:0 18px 40px -28px rgba(10,7,82,0.3);
  transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.t-card:hover{transform:translateY(-8px);}
.t-head{display:flex; align-items:center; gap:14px;}
.t-head img{width:56px; height:56px; border-radius:50%; object-fit:cover; border:3px solid var(--paper-deep);}
.t-name{font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:15px; color:var(--blue-deep);}
.t-pet{font-size:12px; color:var(--grey);}
.stars{margin-top:14px; display:flex; gap:3px;}
.stars svg{width:15px; height:15px; fill:var(--gold);}
.t-card p{margin-top:14px; font-size:14px; line-height:1.7; color:var(--ink); font-style:italic;}

@media(max-width:900px){.t-grid{grid-template-columns:1fr; max-width:420px; margin:0 auto;}}

.contact{padding:120px 0; background:var(--paper-deep);}
.contact-box{
  background:linear-gradient(135deg, var(--blue-deep), var(--blue));
  border-radius:28px; padding:70px 6vw; text-align:center; position:relative; overflow:hidden;
}
.contact-box::before{
  content:''; position:absolute; width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,210,0,0.25), transparent 70%);
  top:-120px; right:-100px;
}
.contact-box::after{
  content:''; position:absolute; width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle, rgba(31,184,85,0.3), transparent 70%);
  bottom:-100px; left:-80px;
}
.contact-box > *{position:relative; z-index:2;}
.contact-box h2{color:var(--white); font-size:clamp(28px,3.6vw,42px);}
.contact-box p{color:#D6D6F5; margin-top:16px; font-size:15.5px;}
.phone-pill{
  margin-top:32px; display:inline-flex; align-items:center; gap:12px;
  background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.25);
  padding:16px 30px; border-radius:100px; color:var(--white);
  font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:20px; letter-spacing:.5px;
}
.phone-pill svg{width:20px; height:20px; fill:var(--gold);}
.contact-box .btn{margin-top:34px; padding:19px 42px; font-size:15.5px;}

.location{padding:120px 0 20px; background:var(--paper);}
.location-grid{display:grid; grid-template-columns:1.3fr .7fr; gap:30px; align-items:stretch; margin-top:20px;}
.map-card{
  background:var(--white); border-radius:24px; overflow:hidden; box-shadow:var(--shadow);
  border:1px solid rgba(21,0,183,0.06);
  min-height:360px;
}
.map-card iframe{width:100%; height:100%; min-height:360px; border:0; display:block;}
.loc-info{display:flex; align-items:stretch;}
.info-box{
  width:100%; background:linear-gradient(135deg, rgba(21,0,183,0.06), rgba(31,184,85,0.08));
  border:1px solid rgba(21,0,183,0.08); border-radius:24px; padding:30px 28px; box-shadow:0 18px 40px -28px rgba(10,7,82,0.25);
}
.info-box .eyebrow{margin-bottom:18px;}
.info-box h3{font-size:clamp(22px,2vw,32px); margin-bottom:14px;}
.info-box p{font-size:15px; line-height:1.75; color:var(--grey); margin-bottom:24px;}
.google-reviews{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:32px;}
.review-card{
  background:var(--white); border-radius:20px; padding:26px 22px; box-shadow:0 18px 40px -28px rgba(10,7,82,0.28);
  border:1px solid rgba(10,7,82,0.04);
}
.review-card .stars{margin:0 0 18px; display:flex; gap:4px;}
.review-card .stars svg{width:16px; height:16px; fill:var(--gold);}
.review-card p{font-size:14px; line-height:1.75; color:var(--ink); font-style:italic; margin-bottom:14px;}
.review-card span{font-size:12px; color:var(--grey); font-weight:600; letter-spacing:.5px; text-transform:uppercase;}

footer{background:var(--blue-deep); color:#B9B7E3; padding:66px 0 30px;}
.footer-top{display:flex; justify-content:space-between; flex-wrap:wrap; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,0.1);}
.footer-brand{display:flex; align-items:center; gap:14px;}
.footer-brand .brand-badge{width:50px; height:40px;}
.footer-brand-text b{display:block; color:var(--white); font-family:'Plus Jakarta Sans',sans-serif; font-size:16px;}
.footer-brand-text span{font-size:12.5px; color:#B9B7E3;}
footer nav ul{display:flex; gap:28px; flex-wrap:wrap; list-style:none;}
footer nav a{font-size:12.5px; font-weight:600; font-family:'Plus Jakarta Sans',sans-serif; color:#B9B7E3;}
footer nav a:hover{color:var(--gold);}
.footer-contact{text-align:right; font-size:13px;}
.footer-contact b{color:var(--white); display:block; margin-bottom:4px;}
.footer-social{display:flex; justify-content:center; padding-top:24px;}
.footer-social a{
  width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12); color:var(--white);
  transition:transform .3s ease, background .3s ease;
}
.footer-social a:hover{transform:translateY(-3px); background:rgba(255,255,255,0.14);}
.footer-social svg{width:20px; height:20px; display:block;}
.footer-bottom{padding-top:28px; text-align:center; font-size:13px; color:#8F8CC4;}

@media(max-width:900px){
  .location-grid{grid-template-columns:1fr;}
  .google-reviews{grid-template-columns:1fr;}
}

@media(max-width:700px){
  .footer-top{flex-direction:column;}
  .footer-contact{text-align:left;}
}

.wa-float{
  position:fixed; bottom:26px; right:26px; z-index:200;
  width:60px; height:60px; border-radius:50%;
  background:#25D366; display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px -8px rgba(37,211,102,0.6);
  transition:transform .35s ease;
}
.wa-float:hover{transform:scale(1.08);}
.wa-float svg{width:28px; height:28px; fill:#fff;}
.wa-float .pulse{position:absolute; inset:0; border-radius:50%; background:#25D366; animation:pulse 2.4s ease-out infinite; z-index:-1;}
@keyframes pulse{0%{transform:scale(1); opacity:.55;} 100%{transform:scale(1.9); opacity:0;}}
@media(max-width:600px){.wa-float{width:54px; height:54px; bottom:18px; right:18px;}}

@media (prefers-reduced-motion: reduce){*{animation:none !important; transition:none !important;} .reveal{opacity:1; transform:none;}}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}