:root{--primary:#f3645e;--primary-strong:#ba4038;--accent:#ffb84d;--secondary-strong:#367a2b;--background:#fdf6e9;--surface:#fff;--text:#3a1f17;--muted:#6b5850;--border:#e5d8c6;--radius:16px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--background);color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:1rem;line-height:1.55}.sections-pending [data-section]{visibility:hidden}[hidden]{display:none!important}a{color:var(--primary-strong)}a:focus-visible,.button:focus-visible{outline:3px solid var(--text);outline-offset:2px}img{max-width:100%;height:auto}.skip{background:var(--surface);border-radius:8px;padding:8px 12px;position:absolute;top:8px;left:-999px}.skip:focus{left:8px}main,.site-header,.site-footer{max-width:960px;margin:0 auto;padding:0 16px}.site-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding-top:16px;padding-bottom:16px;display:flex}.brand{align-items:center;text-decoration:none;display:flex}.brand img{border-radius:12px;width:auto;height:120px;display:block}.site-header nav{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.site-header nav a:not(.button){color:var(--text);font-weight:600;text-decoration:none}h1{margin:8px 0 12px;font-size:clamp(1.9rem,6vw,2.8rem);line-height:1.15}h2{margin:0 0 12px;font-size:1.5rem}h3{margin:0 0 6px;font-size:1.15rem}.muted{color:var(--muted)}.lead{max-width:40ch;font-size:1.15rem}section{margin:40px 0}.hero{align-items:center;gap:24px;margin-top:16px;display:grid}.preview{background:var(--background) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' fill='%233a1f17' fill-opacity='0.06'%3E%3Cellipse cx='32' cy='38' rx='9' ry='7'/%3E%3Ccircle cx='22' cy='27' r='3.5'/%3E%3Ccircle cx='29' cy='22' r='3.5'/%3E%3Ccircle cx='36' cy='22' r='3.5'/%3E%3Ccircle cx='43' cy='27' r='3.5'/%3E%3C/svg%3E");border-radius:32px;justify-self:center;margin:0;padding:24px}.phone{aspect-ratio:540/1120;box-sizing:content-box;border:10px solid var(--text);background:var(--background);border-radius:36px;width:220px;overflow:hidden;box-shadow:0 12px 32px #3a1f172e}.screens{width:500%;height:100%;animation:12.4s ease-in-out 3 forwards preview;display:flex}.screens img{object-fit:cover;border-radius:0;flex:none;width:20%;height:100%}.preview:hover .screens{animation-play-state:paused}@keyframes preview{0%,20%{transform:translate(0)}25%,45%{transform:translate(-20%)}50%,70%{transform:translate(-40%)}75%,95%{transform:translate(-60%)}to{transform:translate(-80%)}}@media (prefers-reduced-motion:reduce){.screens{animation:none}}.button{border:1px solid var(--primary-strong);background:var(--primary-strong);color:#fff;border-radius:12px;justify-content:center;align-items:center;min-height:48px;padding:12px 20px;font-weight:700;text-decoration:none;display:inline-flex}.button.secondary{background:var(--surface);color:var(--text);border-color:var(--border)}.button.small{min-height:40px;padding:8px 14px}.stores{flex-wrap:wrap;gap:12px;margin:16px 0;display:flex}.store.soon{background:var(--surface);color:var(--text);border-color:var(--border);flex-direction:column;line-height:1.2}.store.soon small{color:var(--muted);font-weight:600}.android-test{margin-top:8px}.android-test p{max-width:46ch;margin:8px 0 0}.picnic{margin:32px 0}.picnic img{border-radius:var(--radius);border:1px solid var(--border);width:100%;height:auto;display:block}.picnic figcaption{text-align:center;color:var(--muted);margin-top:8px;font-weight:600}.features{gap:20px;display:grid}.feature{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);align-items:center;gap:16px;padding:20px;display:grid}.feature>img{border-radius:12px;justify-self:center;width:160px}.feature p{margin:0}.band{background:var(--accent);border-radius:var(--radius);padding:24px}.band p{margin:0 0 16px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px}.steps{counter-reset:step;padding-left:0;list-style:none}.steps li{counter-increment:step;margin-bottom:8px;padding-left:1.6em;position:relative}.steps li:before{content:counter(step) ".";position:absolute;left:0}.list{padding-left:1.2em}.downloads{gap:12px;padding:0;list-style:none;display:grid}.downloads a{font-weight:700}.shots{flex-wrap:wrap;gap:12px;display:flex}.shots img{border:1px solid var(--border);border-radius:12px;width:140px}.site-footer{border-top:1px solid var(--border);margin-top:48px;padding-top:24px;padding-bottom:32px}.pop-up{padding-top:64px;position:relative}.pop-up .stores{z-index:1;margin-top:0;position:relative}.pop-up-pet{width:96px;height:78px;position:absolute;top:-4px;left:24px;overflow:hidden}.pop-up-pet img{transition:transform .35s cubic-bezier(.34,1.56,.64,1);display:block;transform:translateY(28px)}.pop-up:hover .pop-up-pet img,.pop-up:focus-within .pop-up-pet img,.pop-up:active .pop-up-pet img{transform:translateY(1px)}.feature{position:relative}.side-peek{pointer-events:none;width:60px;height:106px;position:absolute;top:14px;left:calc(50% + 80px);overflow:hidden}.side-peek img{width:60px;height:106px;animation:7s ease-in-out 1.5s infinite side-peek;display:block;transform:translate(-100%)}@keyframes side-peek{0%,62%,to{transform:translate(-100%)}70%,92%{transform:translate(0)}}.home .site-footer{position:relative}.home .site-footer:before{content:"";pointer-events:none;background:url(/site/pets/pet-cat-sit-back.png) 50%/contain no-repeat;width:40px;height:92px;position:absolute;top:-53px;right:40px}.pair{margin-top:56px;display:inline-block;position:relative}.pair-pets{z-index:1;pointer-events:none;align-items:flex-end;width:max-content;display:flex;position:absolute;bottom:calc(100% - 6px);left:50%;transform:translate(-50%)}.pair-pets img{display:block}.look-up{align-items:flex-end;gap:12px;display:flex}.look-up img{flex:none;margin-bottom:8px}@media (width>=720px) and (width<=979px){.feature>div:has(.side-peek){align-self:end}}@media (prefers-reduced-motion:reduce){.pop-up-pet img{transition:none}.side-peek img{animation:none;transform:none}}.site-footer nav{flex-wrap:wrap;gap:16px;margin-bottom:12px;display:flex}@media (width>=720px){.brand img{height:150px}.hero{grid-template-columns:1.2fr 1fr}.phone{width:260px}.features{grid-template-columns:1fr 1fr}.feature{grid-template-columns:160px 1fr}.feature>div{position:relative}.side-peek{top:auto;bottom:calc(100% + 2px);left:-16px}}
