:root{--primary:#603b92;--primary-light:#eee5fb;--secondary:#c9e9fa;--text:#4c3567;--background:#f9fcff;--muted:#746582;--blue:#326ca3;--radius:30px}
*{box-sizing:border-box}
html{direction:rtl;scroll-behavior:smooth}
body{margin:0;background:var(--background);color:var(--text);font-family:Vazirmatn,Tahoma,Arial,sans-serif;font-size:16px;line-height:1.85;overflow-wrap:break-word}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
a:focus-visible{outline:3px solid var(--primary);outline-offset:6px}
main{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 0% 90%,#e7ddfb 0,transparent 48%),radial-gradient(ellipse at 100% 0%,#e4f3fc 0,transparent 38%)}
main::before{content:'';position:absolute;width:540px;height:380px;border-radius:40% 60% 70% 30%;background:linear-gradient(130deg,#e7d9fb,#d4eafa);left:-270px;top:-230px;z-index:-1}
.hero{max-width:1400px;min-height:92svh;margin:auto;padding:45px 64px 55px;display:grid;grid-template-columns:1.18fr 1fr;grid-template-areas:'intro pets' 'services pets';column-gap:46px;align-content:center;position:relative}
.intro{grid-area:intro;animation:fade-up .8s ease both}
.brand{display:inline-flex;align-items:center;gap:7px;color:var(--primary);margin-bottom:18px}
.brand img{width:99px;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply}
.brand>span{font-size:37px;font-weight:900;letter-spacing:-1.5px}
.eyebrow{font-size:14px;margin:0 0 10px;color:var(--primary);display:flex;align-items:center;gap:9px}
.eyebrow>span{width:7px;height:7px;border-radius:50%;background:#906cb5;box-shadow:0 0 0 5px #eee6f5}
h1{font-size:clamp(36px,3.5vw,53px);line-height:1.65;letter-spacing:-1.7px;font-weight:900;margin:0 0 12px;color:var(--primary)}
h1>span{color:var(--blue)}
.lead{font-size:17px;max-width:550px;color:var(--muted);margin:0 0 30px;line-height:2}
.pets{grid-area:pets;align-self:center;margin:70px -35px 0;position:relative;min-width:0;text-align:center}
.pets::before{content:'';position:absolute;inset:15% 2% 6%;border-radius:47% 53% 35% 65% / 57% 47% 53% 43%;background:linear-gradient(145deg,#e3f4fd,#e5d9f9);z-index:-1}
.pets>img{width:100%;aspect-ratio:1;object-fit:contain;animation:float 8s ease-in-out infinite}
figcaption{display:inline-flex;align-items:center;gap:10px;background:#ffffffd9;border:1px solid #fff;border-radius:50px;padding:8px 22px;font-size:14px;box-shadow:0 10px 35px #5c368511;transform:translateY(-12px)}
figcaption span{color:var(--primary);font-size:25px}
.services{grid-area:services;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;animation:fade-up .9s .1s ease both}
.service{padding:25px 23px 23px;border-radius:var(--radius);background:linear-gradient(145deg,#f1eafb,#eee5f8);border:1px solid #fff;box-shadow:0 12px 34px #5d3c8110;transition:transform .25s,box-shadow .25s;display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.service:hover{transform:translateY(-5px);box-shadow:0 17px 38px #5d3c811c}
.service.shop{background:linear-gradient(145deg,#e8f6ff,#dcf0fc)}
.service-icon{margin-bottom:12px;width:49px;height:49px}
h2{font-size:31px;line-height:1.65;color:var(--primary);margin:0;font-weight:900}
h2>span{display:block;font-size:16px;font-weight:700;letter-spacing:-.3px}
.service>p{font-size:14px;color:#675776;margin:8px 0 22px;line-height:1.95}
.button{display:flex;width:100%;min-height:47px;align-items:center;justify-content:space-between;gap:8px;padding:10px 15px;background:var(--primary);border-radius:14px;color:#fff;font-size:14px;font-weight:700;margin-top:auto;transition:background .2s,transform .2s}
.button:hover{background:#4f287e;transform:translateY(-2px)}
.shop .button{background:#326b9c}.shop .button:hover{background:#25547e}
.button span{font-family:Arial,sans-serif;font-size:22px;font-weight:400}
.ravian{font-size: 16px;font-weight: bold;color: #ED3237;}
.service .status{display:none;margin:14px 0 0;font-size:14px;color:var(--primary)}
.status:target{display:block;animation:fade-up .3s ease}
.decoration{position:absolute;pointer-events:none;opacity:.22;z-index:-1;animation:float 12s ease-in-out infinite}
.paw-one{left:9%;top:11%;transform:rotate(-20deg)}.paw-two{left:43%;bottom:8%;opacity:.12}
footer{text-align:center;padding:20px 24px 23px;background:#f9fcff;color:var(--muted);font-size:14px}
footer p{margin:0 0 4px}footer small{font-size:12px;color:#83748e}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes fade-up{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
@media(min-width:1600px){.hero{column-gap:75px}}
@media(max-width:1200px){.hero{padding:36px 40px 44px;column-gap:25px;grid-template-columns:1.3fr 1fr}.service{padding:22px 18px}.pets{margin-inline:-20px}h1{font-size:42px}}
@media(max-width:992px){.hero{padding:32px;column-gap:20px;grid-template-columns:1.4fr 1fr}h1{font-size:35px}.lead{font-size:16px}.services{gap:12px}.service{padding:20px 15px}.button{font-size:13px;padding-inline:11px}.brand{margin-bottom:14px}.brand img{width:85px}}
@media(max-width:768px){.hero{grid-template-columns:minmax(0,1fr);grid-template-areas:'intro' 'pets' 'services';padding:28px 28px 38px;min-height:auto}.intro{text-align:center}.brand{margin-bottom:20px}.eyebrow{justify-content:center}h1{font-size:39px;line-height:1.65}.desktop-break{display:none}.lead{margin:14px auto 0;max-width:460px}.pets{width:min(100%,390px);margin:20px auto 18px}.pets::before{inset:10% 3% 9%}.services{grid-template-columns:1fr;gap:18px;max-width:480px;width:100%;margin:auto}.service{padding:26px;align-items:center;text-align:center}.service>p{margin-bottom:20px}.button{font-size:15px;min-height:50px}.service-icon{width:54px;height:54px}h2{font-size:33px}h2>span{font-size:18px}.paw-one{width:40px;left:4%;top:22%}.paw-two{display:none}}
@media(max-width:576px){.hero{padding:23px 20px 32px}.brand img{width:82px}.brand>span{font-size:34px}h1{font-size:clamp(29px,8.1vw,38px);letter-spacing:-1px}.eyebrow{font-size:13px}.lead{font-size:15px;line-height:2}.pets{max-width:340px;margin-top:15px}figcaption{font-size:13px;padding:5px 18px}.service{border-radius:26px}footer{font-size:13px;padding-inline:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}