/* First-screen revision following the owner's review. */
:root{--action-pink:#FF8DBB;--action-border:#FF8DBB}
.button,.button.outlined{background:#fff;color:var(--action-pink);border:1px solid var(--action-border)}
.button:hover,.button.outlined:hover{background:#F9FAFB;color:var(--action-pink);border-color:var(--action-border);transform:none}
.diary-tabs button[aria-selected=true],.device-tabs button[aria-selected=true]{background:#fff;color:var(--action-pink);border:1px solid var(--action-border)}
.hero{grid-template-columns:minmax(0,1.16fr) minmax(0,1fr);gap:38px;min-height:760px;padding-block:58px 66px}
.hero h1{margin-bottom:48px;font-size:clamp(45px,4.35vw,65px);line-height:1.06;letter-spacing:-2.1px}
.hero-title-line{display:block}
.hero-title-end{white-space:nowrap}
.hero-functions{margin-bottom:46px;gap:17px 18px}
.hero-actions{gap:25px}
.hero-actions .text-link,.hero-actions .text-link:hover{text-decoration:none}
.hero-actions .text-link:hover{color:var(--action-pink)}
.access-note{margin-top:23px}
.hero-art{height:600px;min-width:0}
.hero-art .sun-disc{width:95%;height:440px;left:0;top:108px;transform:rotate(-10deg)}
.hero-art .phone-front{width:246px;height:475px;left:7px;top:83px;transform:rotate(-5deg)}
.hero-art .phone-back{width:238px;height:465px;right:9px;top:145px;transform:rotate(6deg)}
.hero-art .art-caption{font-size:16px;font-weight:500;border:1px solid #FF8DBB;border-radius:14px;padding:11px 17px;box-shadow:none;transform:none;background:white;line-height:1.3}
.hero-art .caption-one{left:7px;top:22px;bottom:auto;right:auto}
.hero-art .caption-two{right:6px;top:83px;bottom:auto;left:auto}
.hero-art .star-one{right:5px;top:0;font-size:62px}
.feature-intro{padding-top:75px}
@media(min-width:1500px){.hero-art{margin-left:0}}
@media(max-width:1100px) and (min-width:801px){.hero{gap:25px;padding-block:45px 55px;min-height:710px}.hero h1{font-size:51px;letter-spacing:-1.8px}.hero-functions{font-size:16px;gap:16px 12px}.hero-art{height:570px}.hero-art .phone-front{width:215px;height:432px;top:93px;left:2px}.hero-art .phone-back{width:208px;height:425px;right:8px;top:155px}.hero-art .art-caption{font-size:14px;padding:10px 13px}.hero-art .caption-one{left:2px;top:30px}.hero-art .caption-two{right:0;top:94px}.hero-art .sun-disc{height:410px;top:115px}}
@media(max-width:800px){.hero{grid-template-columns:minmax(0,1fr);gap:42px;min-height:0;padding-block:48px 40px}.hero h1{font-size:57px;letter-spacing:-1.8px;margin-bottom:40px}.hero-functions{margin-bottom:38px}.hero-art{width:min(490px,100%);height:600px}.hero-art .phone-front{width:245px;height:475px;left:16px;top:85px}.hero-art .phone-back{width:237px;height:465px;right:12px;top:145px}.hero-art .sun-disc{width:90%;height:440px;left:4%;top:110px}.hero-art .caption-one{left:16px;top:25px}.hero-art .caption-two{right:8px;top:86px}.feature-intro{padding-top:55px}}
@media(max-width:560px){.hero{padding-top:36px;gap:30px}.hero h1{font-size:42px;letter-spacing:-1.3px;margin-bottom:36px}.hero-functions{font-size:15px;gap:17px 10px;margin-bottom:35px}.hero-actions{gap:22px}.access-note{margin-top:21px}.hero-art{width:min(355px,100%);height:475px}.hero-art .phone-front{width:182px;height:360px;left:13px;top:72px;transform:rotate(-4deg)}.hero-art .phone-back{width:178px;height:350px;right:14px;top:126px;transform:rotate(5deg)}.hero-art .art-caption{font-size:12px;padding:9px 11px;border-radius:11px}.hero-art .caption-one{left:13px;top:20px}.hero-art .caption-two{right:8px;top:76px}.hero-art .sun-disc{width:84%;height:310px;left:7%;top:110px;transform:rotate(-8deg)}.hero-art .star-one{font-size:44px;right:14px;top:10px}.feature-intro{padding-top:30px}}
@media(max-width:360px){.hero h1{font-size:34px;letter-spacing:-1px}.hero-functions{font-size:13px;gap:16px 8px}.hero-art{height:440px}.hero-art .phone-front{width:158px;height:322px;left:10px;top:72px}.hero-art .phone-back{width:154px;height:310px;right:9px;top:130px}.hero-art .caption-one{left:7px}.hero-art .caption-two{right:0;top:82px}.hero-art .sun-disc{height:280px}.hero-art .art-caption{font-size:11px;padding:8px 9px}}
@media(max-width:560px){.final-inner h2 .underlined{display:block;width:fit-content;max-width:100%;margin:4px auto 0}}

/* Same interaction as PetVitals .j-button.j-primary; no movement on hover. */
.button,.button.outlined{transition:background-color .2s;transform:none}