<style>
/* =================== Playful Paws — full custom layout =================== */
.theme-playful{--pf-ink:#2d2a54}
.theme-playful .vs{color:#5b5878;background:#fffdf9}
.theme-playful .vs-section{padding:96px 0}
.theme-playful h1,.theme-playful h2,.theme-playful h3,.theme-playful h4{font-family:var(--vs-font-h);letter-spacing:0;color:var(--pf-ink)}

/* ---- floating pill header ---- */
.pf-header{position:fixed;top:0;left:0;right:0;z-index:50;padding:16px 0;transition:.3s}
.pf-nav-wrap{display:flex;align-items:center;gap:22px;background:#fff;border-radius:60px;padding:12px 14px 12px 24px;
    box-shadow:0 18px 44px -24px rgba(45,42,84,.35);transition:.3s}
.pf-header.is-scrolled{padding:8px 0}
.pf-logo{display:flex;align-items:center;gap:11px;font-family:var(--vs-font-h);font-weight:800;font-size:22px;color:var(--pf-ink)}
.pf-logo img{height:42px}
.pf-logo-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:#fff;font-size:19px;
    background:linear-gradient(135deg,var(--vs-primary),var(--vs-accent))}
.pf-nav{display:flex;gap:4px;margin-left:auto}
.pf-nav a{font-family:var(--vs-font-h);font-weight:600;font-size:15px;color:#4a4870;padding:10px 16px;border-radius:40px;transition:.2s}
.pf-nav a:hover,.pf-nav a.is-active{color:#fff;background:var(--vs-primary)}
.pf-cta{display:inline-flex;align-items:center;gap:9px;background:var(--pf-ink);color:#fff;font-family:var(--vs-font-h);
    font-weight:700;padding:13px 26px;border-radius:40px;font-size:15px;transition:.3s}
.pf-cta:hover{background:var(--vs-primary);transform:translateY(-2px) rotate(-1deg)}
.pf-burger{display:none;background:none;border:0;font-size:24px;color:var(--pf-ink);cursor:pointer;margin-left:auto}

/* ---- buttons / type ---- */
.pf-btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--vs-font-h);font-weight:700;font-size:16px;
    padding:16px 34px;border-radius:50px;cursor:pointer;border:0;transition:.3s}
.pf-btn-primary{background:var(--vs-primary);color:#fff;box-shadow:0 16px 30px -14px var(--vs-primary)}
.pf-btn-primary:hover{transform:translateY(-3px) rotate(-1.5deg);box-shadow:0 24px 40px -16px var(--vs-primary)}
.pf-btn-light{background:#fff;color:var(--pf-ink);box-shadow:0 12px 26px -16px rgba(45,42,84,.5)}
.pf-btn-light:hover{transform:translateY(-3px) rotate(1.5deg)}
.pf-sticker{display:inline-block;font-family:var(--vs-font-h);font-weight:700;font-size:14px;color:var(--pf-ink);
    background:var(--vs-accent);padding:8px 18px;border-radius:40px;margin-bottom:18px;transform:rotate(-2deg)}
.pf-sticker-dark{background:color-mix(in srgb,var(--vs-primary) 16%,transparent);color:var(--vs-primary)}
.pf-h2{font-family:var(--vs-font-h);font-weight:800;font-size:clamp(32px,4.6vw,52px);line-height:1.08;margin-bottom:14px}
.pf-lead{font-size:18px;color:#6b6890;max-width:640px;margin:0 auto}
.pf-head{text-align:center;max-width:720px;margin:0 auto 56px}

/* ---- hero ---- */
.pf-hero{padding:170px 0 110px;position:relative;overflow:hidden;
    background:radial-gradient(60% 70% at 10% 10%, color-mix(in srgb,var(--vs-accent) 30%,transparent), transparent 55%),
               radial-gradient(50% 60% at 95% 90%, color-mix(in srgb,var(--vs-primary) 22%,transparent), transparent 55%),#fffdf9}
.pf-shape{position:absolute;font-size:60px;opacity:.5;z-index:0;filter:saturate(1.2)}
.pf-shape-1{top:120px;right:8%;animation:pf-bob 6s ease-in-out infinite}
.pf-shape-2{bottom:80px;left:6%;font-size:48px;animation:pf-bob 7s ease-in-out infinite reverse}
.pf-shape-3{top:40%;left:46%;font-size:34px;color:#ff6b6b;animation:pf-bob 5s ease-in-out infinite}
@keyframes pf-bob{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-16px) rotate(8deg)}}
.pf-hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr 1fr;gap:50px;align-items:center}
.pf-hero-title{font-family:var(--vs-font-h);font-weight:800;font-size:clamp(40px,6vw,72px);line-height:1.02;margin-bottom:20px}
.pf-hero-sub{font-size:20px;color:#5b5878;max-width:500px;margin-bottom:30px}
.pf-hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.pf-hero-media{position:relative}
.pf-blob{aspect-ratio:1;border-radius:48% 52% 42% 58%/55% 45% 55% 45%;overflow:hidden;border:10px solid #fff;
    box-shadow:0 50px 90px -40px rgba(45,42,84,.5);animation:pf-morph 10s ease-in-out infinite}
@keyframes pf-morph{0%,100%{border-radius:48% 52% 42% 58%/55% 45% 55% 45%}50%{border-radius:58% 42% 55% 45%/42% 58% 42% 58%}}
.pf-blob img{width:100%;height:100%;object-fit:cover}
.pf-blob-ph{width:100%;height:100%;display:grid;place-items:center;font-size:110px;color:#fff;background:linear-gradient(135deg,var(--vs-primary),var(--vs-accent))}
.pf-pill{position:absolute;background:#fff;color:var(--pf-ink);font-family:var(--vs-font-h);font-weight:700;font-size:14px;
    padding:12px 20px;border-radius:40px;box-shadow:0 20px 40px -18px rgba(45,42,84,.5)}
.pf-pill i{color:var(--vs-accent);margin-right:6px}
.pf-pill-1{top:30px;left:-18px;animation:pf-bob 6s ease-in-out infinite}
.pf-pill-2{bottom:40px;right:-18px;animation:pf-bob 7s ease-in-out infinite reverse}
.pf-pill-2 i{color:#ff6b6b}

/* ---- services ---- */
.pf-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.pf-card{background:#fff;border-radius:32px;padding:36px 30px;transition:.35s;border:2px solid transparent}
.pf-card:hover{transform:translateY(-10px) rotate(-1deg);border-color:var(--t);box-shadow:0 34px 60px -34px color-mix(in srgb,var(--t) 60%,transparent)}
.pf-card-icon{width:76px;height:76px;border-radius:26px;display:grid;place-items:center;font-size:30px;color:#fff;
    background:var(--t);margin-bottom:20px;transition:.35s;box-shadow:0 16px 28px -14px var(--t)}
.pf-card:hover .pf-card-icon{transform:rotate(-10deg) scale(1.1)}
.pf-card h3{font-family:var(--vs-font-h);font-weight:700;font-size:22px;margin-bottom:10px}
.pf-card p{color:#6b6890;font-size:15.5px}

/* ---- footer ---- */
.pf-footer{background:var(--pf-ink);color:#c9c6e6;padding-top:0;margin-top:90px}
.pf-footer-cta{position:relative;background:linear-gradient(120deg,var(--vs-primary),var(--vs-accent));border-radius:40px;
    text-align:center;padding:56px 40px;transform:translateY(-45px);overflow:hidden;box-shadow:0 40px 70px -36px rgba(255,107,107,.6)}
.pf-footer-cta .pf-shape{position:absolute;top:14px;right:30px;font-size:70px;opacity:.35}
.pf-footer-cta h2{color:#fff;font-size:clamp(26px,3.6vw,40px);margin-bottom:22px;max-width:680px;margin-inline:auto}
.pf-footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1.2fr;gap:40px;padding-bottom:46px}
.pf-footer-grid h4{color:#fff;font-size:17px;margin-bottom:16px}
.pf-footer-grid ul{list-style:none}.pf-footer-grid li{margin-bottom:11px;font-size:15px}
.pf-footer-grid a:hover{color:#fff}
.pf-footer-about{margin-top:14px;opacity:.82;line-height:1.8;max-width:280px}
.pf-footer-contact i{width:18px;color:var(--vs-accent)}
.pf-social{display:flex;gap:10px;margin-top:18px}
.pf-social a{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff;transition:.25s}
.pf-social a:hover{background:var(--vs-primary);transform:translateY(-3px) rotate(-6deg)}
.pf-footer-bar{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;font-size:13.5px}
.pf-footer-bar .vs-container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

/* ---- shared blocks tuned for playful (rounded + bold) ---- */
.theme-playful .vs-card,.theme-playful .vs-quote,.theme-playful .vs-acc-item,.theme-playful .vs-hours-wrap,
.theme-playful .vs-contact-form,.theme-playful .vs-gallery-item,.theme-playful .vs-about-media img{border-radius:30px}
.theme-playful .vs-member-photo{border-radius:50%}
.theme-playful .vs-btn{border-radius:50px}
.theme-playful .vs-cta-box{border-radius:40px}
.theme-playful .vs-stats{background:linear-gradient(120deg,var(--vs-secondary),var(--vs-primary))}
.theme-playful .vs-testimonials{background:#fff7ed}

/* ---- responsive ---- */
@media(max-width:1024px){
    .pf-hero-inner{grid-template-columns:1fr;gap:50px;text-align:center}
    .pf-hero-actions,.pf-head{justify-content:center}
    .pf-hero-media{max-width:430px;margin:0 auto;width:100%}
    .pf-cards{grid-template-columns:repeat(2,1fr)}
    .pf-footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
    .pf-nav,.pf-cta{display:none}
    .pf-burger{display:block}
    .pf-cards{grid-template-columns:1fr}
    .pf-footer-grid{grid-template-columns:1fr}
}
</style>
