#home-draft .hs-services{max-width:1440px;margin:0 auto 80px;padding:0 65px;font-family:'HD DIN',Tahoma,sans-serif;scroll-margin-top:100px}
#home-draft .hs-services h2{margin:0 0 36px;text-align:center;color:#660099;font-size:32px;line-height:1.2;font-weight:500}
#home-draft .hs-tabs{display:flex;width:max-content;max-width:100%;margin:0 auto 40px;border-radius:30px;background:#f6f6f6}
#home-draft .hs-tabs button{min-width:170px;padding:10px 24px;min-height:40px;border:0;border-radius:30px;background:transparent;color:#252128;font:400 16px/1.2 'HD DIN',sans-serif;cursor:pointer}
#home-draft .hs-tabs button[aria-selected=true]{background:#660099;color:#fff}
#home-draft .hs-services [hidden]{display:none!important}
#home-draft .hs-rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:20px 0;margin:-20px 0;overscroll-behavior-x:contain}
#home-draft .hs-rail::-webkit-scrollbar{display:none}
#home-draft .hs-card{flex:0 0 calc((100% - 48px)/4);min-width:0;display:flex;flex-direction:column;align-items:center;padding:28px 20px 36px;scroll-snap-align:start;background:#fff;border-radius:12px;box-shadow:0 3px 20px #0000000a;border:1px solid #f5f4f6;text-align:center}
#home-draft .hs-card img{display:block;width:100%;height:220px;object-fit:contain;border-radius:6px}
#home-draft .hs-card h3{margin:22px 0 24px;min-height:50px;color:#363238;font-size:22px;font-weight:400;line-height:1.15}
#home-draft .hs-card a{margin-top:auto;border:2px solid #660099;border-radius:30px;padding:10px 24px;color:#660099;text-decoration:none;font-size:16px;line-height:1.4;white-space:nowrap}
#home-draft .hs-card a:hover{background:#660099;color:#fff}
#home-draft .hs-navigation{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:26px;min-height:44px}
#home-draft .hs-navigation>button{padding:0;border:0;background:none;color:#660099;font:300 34px/1 'HD DIN',sans-serif;width:32px;height:44px;cursor:pointer}
#home-draft .hs-navigation>button:disabled{color:#bbb;cursor:default}
#home-draft .hs-progress{width:min(40%,430px);height:6px;background:#f4f3f5;border-radius:9px;margin-left:24px;overflow:hidden}
#home-draft .hs-progress span{display:block;height:100%;width:25%;background:#660099;border-radius:9px}
#home-draft .hs-services :focus-visible{outline:2px solid #660099;outline-offset:4px}
#home-draft .hs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:1439px){#home-draft .hs-services{padding-inline:30px}#home-draft .hs-card{flex-basis:calc((100% - 48px)/3.4)}}
@media(max-width:767px){#home-draft .hs-services{padding-inline:16px;margin-bottom:48px;scroll-margin-top:75px}#home-draft .hs-services h2{font-size:28px;margin-bottom:24px}#home-draft .hs-tabs{width:100%;max-width:380px;margin-bottom:28px}#home-draft .hs-tabs button{min-width:0;flex:1;padding:11px 10px;font-size:15px;min-height:44px}#home-draft .hs-card{flex-basis:78%;max-width:300px;padding:22px 20px 28px}#home-draft .hs-card img{height:190px}#home-draft .hs-card h3{font-size:21px;margin-top:18px}#home-draft .hs-progress{width:50%;margin-left:8px}#home-draft .hs-navigation{margin-top:18px}}
#home-draft .hs-card{position:relative} #home-draft .hs-services{overflow:clip}
/* Reference-style discrete pagination and one-card swipe positions. */
#home-draft .hs-card{flex:0 0 298px;max-width:none}
#home-draft .hs-rail{cursor:grab;touch-action:pan-y;user-select:none}
#home-draft .hs-rail.is-dragging{cursor:grabbing}
#home-draft .hs-rail img,#home-draft .hs-rail a{-webkit-user-drag:none}
#home-draft .hs-navigation{gap:16px;max-width:570px;margin:22px auto 0}
#home-draft .hs-navigation>button{flex:0 0 28px;display:flex;align-items:center;justify-content:center}
#home-draft .hs-navigation svg{width:10px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
#home-draft .hs-pages{display:flex;flex:1;gap:10px;margin-left:38px;min-width:0}
#home-draft .hs-pages button{position:relative;flex:1;min-width:0;height:6px;padding:0;border:0;border-radius:6px;background:#f4f3f5;cursor:pointer}
#home-draft .hs-pages button::after{content:'';position:absolute;inset:-18px 0}
#home-draft .hs-pages button.is-active{background:#660099}
@media(max-width:767px){#home-draft .hs-card{flex-basis:min(82vw,298px)}#home-draft .hs-navigation{gap:8px}#home-draft .hs-pages{gap:8px;margin-left:12px}}
/* Service cards: quiet lavender-grey surfaces and reference image fade. */
#home-draft .hs-card{background:#f6f5f7;border:1px solid transparent;border-radius:16px;box-shadow:0 3px 14px rgba(42,27,61,.025);transition:background-color .3s ease,box-shadow .3s ease,border-color .3s ease}
#home-draft .hs-card h3{font-weight:500;color:#363238;line-height:1.2}
#home-draft .hs-card img{transition:opacity .3s ease}
#home-draft .hs-card a{background:transparent;font-weight:500;transition:background-color .3s ease,color .3s ease}
#home-draft .hs-card:focus-within{background:#efedf5;border-color:#d8cbe5;box-shadow:0 5px 20px rgba(66,34,89,.07)}
@media(hover:hover) and (pointer:fine){#home-draft .hs-card:hover{background:#efedf5;box-shadow:0 5px 20px rgba(66,34,89,.07)}#home-draft .hs-card:hover img{opacity:.5}}
@media(prefers-reduced-motion:reduce){#home-draft .hs-card,#home-draft .hs-card img,#home-draft .hs-card a{transition:none}}
/* Only the inserted image fades; the card surface and text stay unchanged. */
#home-draft .hs-card:focus-within{background:#f6f5f7;border-color:transparent;box-shadow:0 3px 14px rgba(42,27,61,.025)}
@media(hover:hover) and (pointer:fine){#home-draft .hs-card:hover{background:#f6f5f7;box-shadow:0 3px 14px rgba(42,27,61,.025)}#home-draft .hs-card:hover img{opacity:.5}}
@keyframes hs-swipe-hint{0%,50%,100%{transform:translateX(0)}25%{transform:translateX(-20px)}}
@media(max-width:767px) and (prefers-reduced-motion:no-preference){#home-draft .hs-rail.has-swipe-hint .hs-card{animation:hs-swipe-hint 4s linear infinite}}
/* Royal Canin reference: DINPro regular, 20/22 on mobile. */
#home-draft .hs-card h3{font-family:'HD DIN',Tahoma,sans-serif;font-weight:400;font-size:20px;line-height:22px;letter-spacing:normal}
/* Cutout product photographs keep their original silhouette and colour. */
#home-draft .hs-card img.hs-product-cutout{height:220px;object-fit:contain;object-position:center;border-radius:0;filter:drop-shadow(0 7px 6px rgba(42,32,25,.14));opacity:1}
@media(max-width:767px){#home-draft .hs-card img.hs-product-cutout{height:190px}}
@media(hover:hover) and (pointer:fine){#home-draft .hs-card:hover img.hs-product-cutout{opacity:1}}
#home-draft .hs-card img{filter:drop-shadow(0 7px 6px rgba(42,32,25,.14))}
#home-draft .hs-photo-preview{position:relative;display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;color:#660099}
#home-draft .hs-magnifier{position:absolute;right:1px;bottom:0;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fff;box-shadow:0 2px 7px #38234712}
#home-draft .hs-magnifier svg{width:17px;height:17px}
#home-draft .hs-photo-preview img{transition:transform .25s ease;opacity:1!important}
@media(hover:hover){#home-draft .hs-photo-preview:hover img{transform:scale(1.035)}}
.hs-viewer{position:fixed;inset:0;margin:auto;padding:48px 24px 20px;border:0;border-radius:18px;background:#f6f5f7;max-width:92vw;max-height:92dvh;box-sizing:border-box;overflow:auto;color:#382347}
.hs-viewer::backdrop{background:rgba(20,16,25,.72)}
.hs-viewer>img{display:block;max-width:80vw;max-height:72dvh;width:auto;height:auto;object-fit:contain;margin:auto;filter:drop-shadow(0 10px 10px #20182022)}
.hs-viewer>p{text-align:center;font:18px/1.3 'HD DIN',sans-serif;margin:16px 0 0}
.hs-viewer-close{position:absolute;right:10px;top:8px;border:0;border-radius:50%;width:36px;height:36px;background:#fff;color:#382347;font:28px/1 sans-serif;cursor:pointer}
.hs-viewer[open]{animation:hs-viewer-in .18s ease-out}
@keyframes hs-viewer-in{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.hs-viewer[open]{animation:none}#home-draft .hs-photo-preview img{transition:none}}
/* Subtle product enlargement, without an image viewer. */
#home-draft .hs-card img{transition:transform .28s ease;opacity:1!important}
@media(hover:hover) and (pointer:fine){#home-draft .hs-card:hover img{transform:scale(1.045)}}
@media(prefers-reduced-motion:reduce){#home-draft .hs-card img{transition:none}}
#home-draft .hs-comparison{position:relative;width:100%;height:auto;aspect-ratio:2/3;flex-shrink:0;border-radius:6px;overflow:hidden;filter:drop-shadow(0 7px 6px rgba(42,32,25,.14))}
#home-draft .hs-comparison img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:none;transform:none!important;transition:none}
#home-draft .hs-comparison .hs-before{clip-path:inset(0 0 0 100%);animation:hs-before-wipe 10s ease-in-out infinite;animation-play-state:paused}
#home-draft .hs-comparison span{position:absolute;bottom:8px;padding:3px 7px;border-radius:10px;background:#fffffff0;color:#382347;font:12px/1.2 'HD DIN',sans-serif}
#home-draft .hs-after-label{left:6px;animation:hs-after-label 10s linear infinite;animation-play-state:paused}
#home-draft .hs-before-label{right:6px;opacity:0;animation:hs-before-label 10s linear infinite;animation-play-state:paused}
#home-draft .hs-comparison.is-visible .hs-before,#home-draft .hs-comparison.is-visible span{animation-play-state:running}
@keyframes hs-before-wipe{0%,20%,100%{clip-path:inset(0 0 0 100%)}35%,48%{clip-path:inset(0 0 0 50%)}63%,80%{clip-path:inset(0 0 0 0)}}
@keyframes hs-after-label{0%,48%,100%{opacity:1}62%,82%{opacity:0}}
@keyframes hs-before-label{0%,20%,100%{opacity:0}32%,82%{opacity:1}}

@media(prefers-reduced-motion:reduce){#home-draft .hs-comparison .hs-before{animation:none;clip-path:inset(0 0 0 50%)}#home-draft .hs-comparison span{animation:none;opacity:1}}

/* Larger service previews and matching hover for the before/after pair. */
#home-draft .hs-card>img,#home-draft .hs-card img.hs-product-cutout{height:320px}
#home-draft .hs-comparison{transition:transform .28s ease;transform-origin:center}
@media(hover:hover) and (pointer:fine){#home-draft .hs-card:hover .hs-comparison{transform:scale(1.045)}}
@media(max-width:767px){#home-draft .hs-card>img,#home-draft .hs-card img.hs-product-cutout{height:280px}}
@media(prefers-reduced-motion:reduce){#home-draft .hs-comparison{transition:none}}
/* Comparison is intentional: hover on desktop, tap on touch screens. */
#home-draft .hs-comparison{cursor:pointer}
#home-draft .hs-comparison .hs-before{animation:none;clip-path:inset(0 0 0 100%);transition:clip-path .85s ease-in-out}
#home-draft .hs-comparison.show-before .hs-before{clip-path:inset(0)}
#home-draft .hs-comparison .hs-after-label,#home-draft .hs-comparison .hs-before-label{animation:none;transition:opacity .25s;bottom:42px}
#home-draft .hs-comparison .hs-after-label{opacity:1}
#home-draft .hs-comparison .hs-before-label{opacity:0}
#home-draft .hs-comparison.show-before .hs-after-label{opacity:0}
#home-draft .hs-comparison.show-before .hs-before-label{opacity:1}
#home-draft .hs-comparison .hs-compare-hint{left:50%;bottom:9px;transform:translateX(-50%);white-space:nowrap;padding:7px 12px;font-size:13px;box-shadow:0 2px 9px #0002;pointer-events:none}
@media(prefers-reduced-motion:reduce){#home-draft .hs-comparison .hs-before{transition:none}}