/* Pet Tomorrow: the happy companions edition. */
:root{--ink:#183f35;--paper:#f7f7f1;--peach:#f8bf91;--sage:#dce7d5;--radius:28px}
body{font-size:16px}
h1,h2,h3,.brand-name,.btn,.pill{font-family:"Trebuchet MS","Arial Rounded MT Bold",Arial,sans-serif}
h1,h2,h3{letter-spacing:-.045em}
.topbar{font-size:12px;letter-spacing:.025em;padding:8px 16px}
.header-inner{min-height:94px;gap:18px}
.brand{gap:10px}
.brand-mark{width:72px;height:72px;object-fit:contain;flex-shrink:0;clip-path:circle(45.3% at 50% 49.5%)}
.brand-name{font-size:23px;letter-spacing:-1px;line-height:1.05;font-weight:800}
.brand-name>span{color:#547248}
.brand-name small{font:400 12px/1.3 Arial,sans-serif;letter-spacing:.03em;margin-top:6px}
.main-nav{gap:20px}
.main-nav a{font-size:14px}
.robots-nav{color:var(--ink)}
.header-actions .shortcut{display:none!important}
.hero{grid-template-columns:1fr 1.06fr;gap:36px;padding:42px 0 46px;min-height:535px}
.hero-copy .eyebrow{display:inline-flex;background:var(--sage);padding:8px 13px;border-radius:40px;font-size:12px;letter-spacing:.05em;margin-bottom:21px}
.hero h1{font-size:clamp(46px,5.4vw,72px);line-height:1.07;font-weight:800}
.hero em{font-family:inherit;font-style:normal;font-weight:800;color:#6a8358;letter-spacing:inherit}
.hero-copy>p{font-size:17px;max-width:460px;margin-top:22px;line-height:1.7}
.hero-actions{gap:10px;margin-top:25px}
.hero-actions .btn,.hero-actions .pill{font-size:15px;min-height:50px;padding:14px 20px}
.hero-footnote{font-size:13px;line-height:1.6;margin-top:22px;align-items:flex-start}
.hero-footnote svg{margin-top:2px;flex-shrink:0}
.companion-scene{position:relative;isolation:isolate;border:1px solid #cbd9c5;border-radius:100px 32px 32px 32px;background:#e8efdf;overflow:hidden;min-width:0;padding:26px 20px 18px;box-shadow:0 12px 0 #dce7d560}
.scene-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-left:23px;position:relative;z-index:2}
.scene-heading p{font-size:13px;font-weight:700;color:#426044}
.scene-heading svg{width:25px;height:25px;color:#7b905e}
.mascot-stage{position:relative;height:320px;isolation:isolate;touch-action:pan-y}
.stage-halo{position:absolute;inset:6% 9% 8%;border-radius:50%;background:linear-gradient(160deg,#f9fbf2,#e0eaca);border:1px solid #ffffffaa;z-index:-1}
.stage-orbit{position:absolute;inset:15% 3% 9%;border:1px dashed #94ab8160;border-radius:50%;transform:rotate(-12deg);z-index:-1}
.mascot{position:absolute;aspect-ratio:1;bottom:1%;padding:0;border:0;background:transparent;border-radius:36%;-webkit-tap-highlight-color:transparent;transition:transform .7s cubic-bezier(.25,.65,.3,1);transform:translate(var(--step-x,0px),var(--step-y,0px)) rotate(var(--tilt,0deg));cursor:pointer;mix-blend-mode:multiply}
.mascot:focus-visible{outline:3px solid #527047;outline-offset:-12px}
.mascot-dog{width:55%;left:-4%;z-index:3;--sprite-y:0%}
.mascot-cat{width:47%;right:-3%;bottom:1%;z-index:4;--sprite-y:50%}
.mascot-robot{width:36%;left:34%;bottom:14%;z-index:2;--sprite-y:100%}
.mascot-sprite{display:block;width:100%;height:100%;background-image:url('./assets/companions.webp');background-size:400% 300%;background-position:var(--sprite-x,0%) var(--sprite-y);background-repeat:no-repeat;pointer-events:none;filter:contrast(1.1) brightness(1.04)}
.mascot[data-frame="blink"]{--sprite-x:33.333333%}
.mascot[data-frame="look"]{--sprite-x:66.666667%}
.mascot[data-frame="step"]{--sprite-x:100%}
.mascot[data-mirror="true"] .mascot-sprite{transform:scaleX(-1)}
.mascot.is-greeting{--step-y:-7px;--tilt:-4deg}
.mascot-cat.is-greeting{--tilt:5deg}
.companion-scene.is-resting .mascot{transition:none;--step-x:0px!important;--step-y:0px!important;--tilt:0deg!important}
.scene-caption{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #ccd9c3;padding:15px 2px 0}
.scene-caption>p{font-size:12px;line-height:1.5;color:#52634c;max-width:170px}
.scene-controls{display:flex;gap:7px;align-items:center;flex-shrink:0}
.scene-hello{min-height:42px;font-size:13px;padding:10px 15px;background:var(--peach);color:var(--ink);border-radius:30px;font-weight:700}
.scene-motion{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:10px 12px;font-size:12px;border:1px solid #c7d5bd;border-radius:30px;background:#f7faf2}
.scene-motion svg{width:14px;height:14px}
.js-enabled .scene-motion{display:inline-flex}
.scene-status{position:absolute;left:50%;top:4px;transform:translateX(-50%);background:#fffef6f2;color:var(--ink);border:1px solid #d2dcc9;padding:8px 14px;border-radius:25px;font-size:12px;white-space:nowrap;z-index:6;opacity:0;transition:opacity .2s;pointer-events:none}
.scene-status.is-visible{opacity:1}
.robot-section{border-radius:36px;background:#183f35;border-color:#183f35;padding:34px;margin-bottom:36px}
.robot-intro h2{font-size:clamp(32px,3.5vw,46px)}
.robot-intro p{font-size:16px;max-width:670px;line-height:1.65}
.robot-intro .eyebrow{font-size:12px;line-height:1.5;letter-spacing:.06em}
.robot-intro-side{font-size:13px}
.robot-intro-side strong{font-size:30px}
.robot-group-heading span{font-size:12px;line-height:1.5}
.robot-card{border-radius:24px}
.robot-card .product-brand{font-size:12px;letter-spacing:.05em}
.robot-card .product-title{font-size:19px;line-height:1.25}
.robot-card .product-price{font-size:27px;letter-spacing:-.03em}
.robot-card .product-description{font-size:14px;line-height:1.65}
.robot-card .extra-cost,.robot-card .robot-specs,.robot-card .seller-label{font-size:12px;line-height:1.6}
.robot-card .product-price small{display:block;font-size:12px;margin:5px 0 0;letter-spacing:0}
.robot-card .product-actions{flex-wrap:wrap}
.robot-card .product-actions .btn{font-size:14px;min-height:44px}
.robot-card .compare-label{font-size:12px}
.brand-strip{padding:22px 0}
.brand-strip>span{font-size:12px;max-width:150px}
.wordmarks{gap:13px;flex-wrap:wrap}
.wordmarks button{font-size:21px}
.section{padding:48px 0}
.section-heading p{font-size:16px;line-height:1.6}
.eyebrow{font-size:12px;letter-spacing:.08em;line-height:1.5}
.category-grid{gap:12px}
.category{font-size:14px;border-radius:25px;padding:22px 10px;min-height:155px;border-color:#d5ddcf;box-shadow:0 4px 0 #dce7d526}
.category:first-child{background:var(--ink)}
.category>span{width:54px;height:54px;border-radius:18px}
.category:nth-child(2n)>span{border-radius:50% 50% 42% 42%}
.catalogue{padding-top:12px}
.filter-panel{border-radius:25px;padding:22px}
.field{font-size:12px;letter-spacing:.02em}
select{font-size:14px;min-height:44px}
.search input{font-size:16px;min-height:50px}
.result-row,.text-button{font-size:14px}
.price-disclaimer{font-size:13px;line-height:1.65}
.product-card{border-radius:25px;box-shadow:0 5px 0 #dce7d530}
.product-body{padding:20px 17px}
.product-brand{font-size:12px;letter-spacing:.08em;line-height:1.4}
.product-title{font-size:19px;line-height:1.25;min-height:48px}
.product-description{font-size:14px;line-height:1.65}
.product-price{font-size:27px;letter-spacing:-.025em}
.product-price small{font-size:12px;line-height:1.5}
.product-card .product-price small{display:block;margin-left:0}
.extra-cost,.seller-label,.compare-label{font-size:12px;line-height:1.55}
.product-actions{flex-wrap:wrap;gap:10px}
.product-actions .btn{font-size:14px;min-height:44px}
.flag{font-size:12px;line-height:1.3}
.save-button{width:40px;height:40px;min-height:40px;min-width:40px}
.load-row p{font-size:13px}
.finder-banner{border-radius:38px}
.finder-copy h2{font-size:38px;max-width:430px}
.finder-copy p{font-size:16px;line-height:1.7}
.finder-art{background:#315743}
.finder-brand-art{width:min(82%,340px);height:auto;position:relative;z-index:1;clip-path:circle(45.3% at 50% 49.5%)}
.finder-art:before{width:310px;height:310px}
.finder-art:after{display:none}
.bubble{font-size:13px;padding:12px 16px}
.bubble.one{top:25px;left:15px}
.bubble.two{bottom:23px;right:15px}
.bubble.three{display:none}
.how-item{border-radius:26px;background:#fffdf8;padding:27px}
.how-item p{font-size:16px;line-height:1.7}
.step-number,.guide-link{font-size:13px}
.faq summary{font-size:16px}
.faq details p{font-size:15px;line-height:1.7}
.footer .brand-mark{width:84px;height:84px}
.footer-copy,.footer-links{font-size:14px;line-height:1.7}
.footer-fine{font-size:12px;line-height:1.6}
.dialog-top p{font-size:12px}.detail p{font-size:16px}.detail .source-note{font-size:13px!important}
.detail-checks p,.legal p{font-size:15px}.comparison-table{font-size:14px}
.comparison-table th[scope=row],.quiz-heading,.quiz-back{font-size:13px}
@media(min-width:1400px){.mascot-stage{height:355px}}
@media(max-width:1120px){.header-inner{gap:12px}.brand-mark{width:62px;height:62px}.brand-name{font-size:21px}.main-nav{gap:14px}.hero{gap:22px}.mascot-stage{height:290px}.scene-caption{flex-wrap:wrap}.scene-caption>p{max-width:none}.scene-controls{margin-left:auto}.companion-scene{padding:22px 12px 16px}.scene-heading{padding-left:24px}.category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.header-actions .saved-label{display:none}.header-actions .pill{padding:9px 13px}.hero h1{font-size:50px}.main-nav a{font-size:13px}.hero-actions .btn,.hero-actions .pill{font-size:14px;padding:13px 17px}.mascot-stage{height:270px}.scene-caption{justify-content:center;gap:10px}.scene-caption>p{text-align:center;width:100%}.scene-controls{margin:auto}.scene-heading p{font-size:12px}.companion-scene{border-top-left-radius:74px}}
@media(max-width:800px){.header-inner{min-height:82px}.hero{grid-template-columns:1fr;gap:30px;padding:35px 0 36px;min-height:0}.hero-copy{text-align:left;max-width:610px}.hero h1{font-size:clamp(43px,8vw,61px)}.hero-copy>p{max-width:560px;margin-top:18px}.hero-actions{justify-content:flex-start}.hero-copy .eyebrow{margin-bottom:17px}.hero-footnote{justify-content:flex-start;margin-top:18px}.companion-scene{width:100%;max-width:610px;margin:auto;border-radius:80px 30px 30px;padding:24px 22px 18px}.mascot-stage{height:330px}.scene-caption{flex-wrap:nowrap;justify-content:space-between}.scene-caption>p{text-align:left;width:auto;max-width:200px}.scene-controls{margin:0}.scene-heading{padding-left:20px}.scene-heading p{font-size:13px}.main-nav.open{justify-content:flex-start;padding:8px 0 16px;gap:22px}.main-nav a{font-size:14px}.robot-intro{gap:22px}.robot-section{padding:26px}.robot-intro p{font-size:16px}.robot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-heading p{font-size:14px}.section{padding:38px 0}.how-grid{gap:14px}.how-item{padding:21px}.how-item p{font-size:15px}}
@media(max-width:600px){.wrap{width:calc(100% - 32px)}.topbar{font-size:12px}.header-inner{gap:8px;min-height:80px}.brand{gap:6px}.brand-mark{width:55px;height:55px}.brand-name{font-size:20px;letter-spacing:-.6px}.brand-name small{font-size:12px;letter-spacing:0;margin-top:4px}.header-actions{gap:6px}.header-actions .pill{min-height:42px;padding:9px;gap:5px}.header-actions .counter{font-size:12px;min-width:18px;padding:0}.header-actions .pill>svg{width:19px;height:19px}.header-actions .menu-toggle{width:42px;min-width:42px;min-height:42px}.hero{padding-top:28px;gap:24px}.hero-copy .eyebrow{font-size:12px}.hero h1{font-size:clamp(40px,10.3vw,55px)}.hero-copy>p{font-size:16px;line-height:1.65}.hero-actions{gap:9px}.hero-actions .btn,.hero-actions .pill{min-height:47px;font-size:14px;padding:13px 17px}.hero-footnote{font-size:12px}.companion-scene{padding:22px 13px 16px;border-radius:64px 27px 27px}.mascot-stage{height:clamp(235px,70vw,310px)}.scene-heading{padding-left:17px}.scene-caption{gap:9px}.scene-caption>p{max-width:132px;font-size:12px}.scene-controls{gap:6px}.scene-hello{font-size:12px;padding:10px 13px}.scene-motion{width:42px;padding:10px}.scene-motion-label{display:none}.scene-status{font-size:12px;padding:7px 11px;top:12px}.robot-section{padding:26px 17px;border-radius:29px}.robot-intro h2{font-size:36px}.robot-intro .eyebrow{font-size:12px}.robot-intro p{font-size:15px}.robot-intro-side strong{font-size:28px}.robot-grid{grid-template-columns:1fr}.robot-group-heading{flex-wrap:wrap;gap:10px}.robot-card .product-body{padding:20px}.robot-card .product-media{height:245px}.robot-card .product-title{font-size:22px;min-height:0}.robot-card .product-price{font-size:29px}.robot-card .product-description{font-size:15px}.robot-card .robot-specs,.robot-card .extra-cost{font-size:13px}.robot-card .product-actions .btn{font-size:15px}.robot-card .compare-label{font-size:13px}.brand-strip{gap:15px}.brand-strip>span{max-width:none}.wordmarks{gap:10px 18px;justify-content:flex-start;flex-basis:100%}.wordmarks button{font-size:21px}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.category{font-size:14px;min-height:132px;gap:12px;padding:19px 12px}.category>span{width:47px;height:47px}.section-heading{align-items:flex-start;gap:16px}.section-heading h2{font-size:33px}.section-heading p{font-size:14px}.catalogue>.section-heading{flex-wrap:wrap}.filter-panel{padding:17px}.filter-top{flex-wrap:wrap}.filter-top .search{flex-basis:100%}.filter-top>.pill{font-size:14px;min-height:42px}.filter-row{grid-template-columns:1fr 1fr;gap:17px 12px}.field{font-size:12px}.result-row{font-size:14px;gap:12px}.price-disclaimer{font-size:12px;line-height:1.7}.product-grid{grid-template-columns:1fr;gap:22px}.product-media{height:260px}.product-body{padding:22px}.product-title{font-size:22px;min-height:0}.product-description{font-size:16px;min-height:0}.product-price{font-size:30px;margin-top:15px}.product-price small{font-size:13px}.extra-cost{font-size:13px;min-height:0;margin-bottom:18px}.product-actions .btn{font-size:15px;min-height:46px}.compare-label{font-size:13px}.seller-label{font-size:12px}.product-brand{font-size:12px}.flag{font-size:12px}.finder-banner{grid-template-columns:1fr;border-radius:30px}.finder-copy{padding:29px 25px}.finder-copy h2{font-size:34px}.finder-copy p{font-size:16px}.finder-art{display:grid;min-height:260px}.finder-brand-art{width:235px}.finder-art:before{width:240px;height:240px}.bubble.one{top:18px;left:15px}.bubble.two{right:15px;bottom:18px}.how-grid{grid-template-columns:1fr}.how-item{padding:25px}.how-item p{font-size:16px}.faq>h2{text-align:left;font-size:33px}.faq summary{font-size:16px}.faq details p{font-size:15px}.footer .brand-mark{width:65px;height:65px}.footer .brand-name{font-size:23px}.footer-fine{font-size:12px;gap:18px}.dialog-content{padding:21px}.detail-grid{gap:24px}.quiz-option{font-size:15px}}
@media(max-width:350px){.wrap{width:calc(100% - 24px)}.header-actions .pill{display:none}.brand-mark{width:52px;height:52px}.hero h1{font-size:40px}.scene-caption>p{max-width:114px}.scene-hello{padding:10px}.mascot-stage{height:222px}.companion-scene{padding-inline:10px}.product-media{height:230px}.robot-intro h2{font-size:33px}.product-body{padding:20px}}
@media(prefers-reduced-motion:reduce){.mascot{transform:none!important}.js-enabled .scene-motion{display:none}.scene-status{transition:none}}