:root { --orange:#ff6b1a; --orange-light:#ff9a4d; --blue:#084bda; --blue-dark:#062a78; --cream:#fff8ef; --ink:#10172b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:Arial, "PingFang SC", sans-serif; }
a { color:inherit; text-decoration:none; }
.shell { width:min(1180px, calc(100% - 48px)); margin:0 auto; }
.hero { min-height:100vh; position:relative; overflow:hidden; color:white; background:linear-gradient(118deg,#063fb8 0%,#0752df 50%,#032f9b 100%); isolation:isolate; }
.hero:before { content:""; position:absolute; inset:0; z-index:-2; opacity:.16; background-image:radial-gradient(circle at center,white 1px,transparent 1px); background-size:24px 24px; mask-image:linear-gradient(90deg,#000,transparent 62%); }
.nav { height:98px; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:8; }
.brand { display:flex; align-items:center; gap:10px; font-weight:900; font-size:20px; letter-spacing:-.5px; }
.brand>span:last-child span { color:#ff8d39; }
.brand-mark { width:39px; height:39px; display:grid; place-items:center; color:var(--orange); border:2px solid rgba(255,255,255,.7); border-radius:13px 13px 16px 16px; transform:rotate(-7deg); background:white; box-shadow:0 6px 20px rgba(0,0,0,.12); }
.brand-mark span { transform:rotate(7deg); font-size:24px; }
.brand-img { width:48px; height:48px; display:grid; place-items:center; overflow:hidden; border-radius:50%; background:white; border:2px solid rgba(255,255,255,.8); box-shadow:0 5px 18px rgba(0,0,0,.15); transform:rotate(-7deg); }
.brand-img img { width:100%; height:100%; object-fit:cover; display:block; transform:rotate(7deg); }
.nav-links { display:flex; align-items:center; gap:36px; color:#dfe9ff; font-size:14px; font-weight:700; }
.nav-links a { position:relative; }
.nav-links a:after { content:""; position:absolute; height:2px; left:0; right:100%; bottom:-7px; background:#ff8b36; transition:.25s ease; }
.nav-links a:hover:after { right:0; }
.nav-cta { padding:13px 19px; border:1px solid rgba(255,255,255,.38); border-radius:99px; font-weight:800; font-size:14px; background:rgba(255,255,255,.09); backdrop-filter:blur(12px); transition:.2s; }
.nav-cta:hover { transform:translateY(-2px); background:white; color:var(--blue); }
.hero-content { min-height:calc(100vh - 146px); padding:72px 0 145px; display:grid; grid-template-columns:.92fr 1.08fr; align-items:center; gap:20px; }
.hero-copy { position:relative; z-index:3; }
.eyebrow { display:flex; align-items:center; gap:10px; width:max-content; margin-bottom:22px; font-size:13px; font-weight:800; letter-spacing:2.2px; color:#cdddff; }
.eyebrow i { width:26px; height:2px; background:var(--orange); box-shadow:11px -4px 0 -1px var(--orange); }
h1 { margin:0; font-size:clamp(58px,7vw,100px); line-height:.94; letter-spacing:-6px; font-weight:950; }
h1 em { color:#ff7a24; font-style:normal; position:relative; display:inline-block; text-shadow:0 10px 40px rgba(0,0,0,.14); }
h1 em:after { content:""; position:absolute; height:8px; border-radius:100%; background:#ff9b54; left:5px; right:0; bottom:-11px; transform:rotate(-2deg); }
.hero-copy>p { max-width:480px; margin:34px 0 30px; color:#dce8ff; font-size:18px; line-height:1.8; }
.hero-actions { display:flex; gap:14px; }
.btn { min-height:54px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; gap:13px; border-radius:18px; font-size:15px; font-weight:900; transition:.25s cubic-bezier(.2,.8,.2,1); }
.btn:hover { transform:translateY(-4px); }
.btn-orange { background:var(--orange); color:white; box-shadow:0 16px 38px rgba(255,89,10,.35); }
.btn-ghost { border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.06); }
.play { width:28px; height:28px; display:grid; place-items:center; padding-left:2px; background:white; color:var(--blue); font-size:10px; border-radius:50%; }
.hero-proof { display:flex; align-items:center; gap:15px; margin-top:42px; }
.avatar-stack { display:flex; }
.avatar-stack span { width:34px; height:34px; display:grid; place-items:center; margin-left:-7px; border-radius:50%; background:white; border:2px solid #1f61df; font-size:18px; }
.avatar-stack span:first-child { margin-left:0; }
.hero-proof b { display:block; font-size:15px; }.hero-proof small { color:#b8cafa; font-size:11px; }
.rating { color:#ffad66; font-size:11px; letter-spacing:2px; border-left:1px solid rgba(255,255,255,.3); padding-left:14px; }
.hero-visual { position:relative; height:620px; }
.image-frame { position:absolute; width:540px; height:590px; right:-20px; top:10px; overflow:hidden; border-radius:46% 46% 33% 33% / 30% 30% 25% 25%; border:8px solid rgba(255,255,255,.13); box-shadow:0 40px 90px rgba(0,17,73,.5); transform:rotate(2deg); background:#0b56df; }
.image-frame img { width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.08) contrast(1.02); }
.blue-wash { position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,76,218,.02),rgba(6,42,120,.2)); }
.float-card { position:absolute; z-index:3; display:flex; background:rgba(255,255,255,.95); color:var(--ink); box-shadow:0 20px 45px rgba(1,29,98,.28); backdrop-filter:blur(12px); animation:float 4s ease-in-out infinite; }
.health-card { left:3px; top:118px; padding:15px 20px 15px 14px; gap:11px; align-items:center; border-radius:17px; transform:rotate(-5deg); }
.icon-circle { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:#dce8ff; color:var(--blue); font-weight:900; }
.float-card b,.float-card small { display:block; }.float-card b { font-size:14px; }.float-card small { margin-top:4px; font-size:10px; color:#78829b; }
.puppy-card { right:-10px; bottom:60px; display:grid; grid-template-columns:auto auto; gap:1px 10px; padding:15px 19px; border-radius:17px; transform:rotate(4deg); animation-delay:-2s; }
.puppy-card span { color:var(--orange); font-size:9px; font-weight:900; }.puppy-card b { font-size:13px; }.puppy-card strong { color:var(--blue); font-size:31px; grid-row:2 / 4; }.puppy-card small { align-self:end; }
.hero-orbit { position:absolute; z-index:-1; border:1px solid rgba(255,255,255,.15); border-radius:50%; }.orbit-one { width:680px; height:680px; right:-180px; top:60px; }.orbit-two { width:440px; height:440px; right:-45px; top:180px; }
.paw { position:absolute; color:#ff8d39; font-size:17px; animation:spin 9s linear infinite; }.paw-one { top:40px; left:70px; }.paw-two { bottom:105px; left:54px; font-size:11px; }
.marquee { position:absolute; z-index:6; left:-2%; right:-2%; bottom:18px; height:58px; display:flex; align-items:center; overflow:hidden; background:#ff6b1a; transform:rotate(-1.2deg); box-shadow:0 -6px 20px rgba(2,33,116,.2); }
.marquee div { width:max-content; white-space:nowrap; font-weight:950; font-size:18px; letter-spacing:2px; animation:marquee 18s linear infinite; }.marquee span { color:#073baf; margin:0 24px; }
@keyframes float { 0%,100%{ translate:0 0 } 50%{ translate:0 -12px } }
@keyframes spin { to{ rotate:360deg } }
@keyframes marquee { to{ transform:translateX(-50%) } }
@media (max-width:900px){ .nav-links{display:none}.hero-content{grid-template-columns:1fr;padding-top:45px}.hero-visual{height:510px}.image-frame{width:min(520px,90vw);height:500px;right:0}.hero-copy{padding-top:30px}.hero-content{min-height:auto} }
@media (max-width:600px){ .shell{width:min(100% - 28px,1180px)}.nav{height:78px}.nav-cta{display:none}.brand{font-size:18px}.hero-content{padding:46px 0 120px}h1{font-size:55px;letter-spacing:-4px}.hero-copy>p{font-size:15px;margin:29px 0 25px}.hero-actions{flex-wrap:wrap}.btn{min-height:50px;padding:0 19px}.hero-proof{margin-top:30px;gap:10px}.rating{display:none}.hero-visual{height:430px;margin-top:25px}.image-frame{width:92%;height:420px;right:0}.health-card{top:60px;left:-5px}.puppy-card{right:-2px;bottom:24px}.marquee{height:50px}.marquee div{font-size:15px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

button,input,select { font:inherit; }
button { cursor:pointer; }
.section { padding:120px 0; }
.kicker { display:block; margin-bottom:17px; color:var(--blue); font-size:11px; font-weight:950; letter-spacing:3px; }
.kicker.light { color:#84aaff; }
h2 { margin:0; font-size:clamp(42px,5vw,66px); line-height:1.1; letter-spacing:-3.5px; font-weight:950; }
h2 em { color:var(--orange); font-style:normal; }
[data-reveal] { opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
[data-reveal].revealed { opacity:1; transform:none; }
.menu-toggle { display:none; width:42px; height:42px; border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.08); border-radius:12px; position:relative; }
.menu-toggle i { position:absolute; width:18px; height:2px; background:white; left:11px; top:16px; transition:.2s; }.menu-toggle i:last-child { top:23px; }.menu-toggle.active i:first-child { transform:translateY(3px) rotate(45deg); }.menu-toggle.active i:last-child { transform:translateY(-4px) rotate(-45deg); }
.trust-strip { min-height:150px; display:flex; align-items:center; justify-content:space-between; padding:32px 4%; background:white; border-radius:28px; box-shadow:0 22px 70px rgba(24,34,65,.08); position:relative; margin-top:-23px; z-index:8; }
.trust-strip>div { display:flex; align-items:center; gap:17px; }.trust-strip strong { color:var(--blue); font-size:39px; letter-spacing:-2px; }.trust-strip sup { font-size:14px; color:var(--orange); margin-left:2px; }.trust-strip span { max-width:70px; color:#667085; font-size:13px; line-height:1.5; }.trust-strip>i { width:1px; height:50px; background:#e6e9f0; }
.dogs-section { background:var(--cream); overflow:hidden; }
.section-head,.voices-head { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:54px; }
.filter-tabs { display:flex; padding:5px; background:#f1e8dc; border-radius:99px; }
.filter-tabs button { border:0; padding:11px 17px; color:#7d7368; background:transparent; font-size:12px; font-weight:800; border-radius:99px; transition:.25s; }.filter-tabs button.active { color:white; background:var(--blue); box-shadow:0 7px 18px rgba(8,75,218,.23); }
.dog-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; min-height:450px; }
.dog-card { min-width:0; padding:10px 10px 17px; border:1px solid #ece4da; border-radius:25px; background:white; box-shadow:0 16px 40px rgba(29,39,65,.05); transition-property:opacity,transform,box-shadow; }
.dog-card:hover { transform:translateY(-10px); box-shadow:0 28px 55px rgba(22,39,83,.14); }
.dog-photo { height:330px; overflow:hidden; position:relative; border-radius:19px; background:#e8e8e8; }
.dog-photo:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 65%,rgba(3,19,57,.24)); pointer-events:none; }
.dog-photo img { width:100%; height:100%; object-fit:cover; display:block; transition:.6s ease; }.dog-card:hover .dog-photo img { transform:scale(1.06); }
.dog-tag { position:absolute; left:12px; top:12px; z-index:2; padding:8px 11px; border-radius:99px; background:rgba(255,255,255,.9); color:var(--blue); font-size:10px; font-weight:900; backdrop-filter:blur(8px); }
.dog-photo button { position:absolute; z-index:2; right:12px; top:12px; width:34px; height:34px; display:grid; place-items:center; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.9); color:var(--orange); font-size:19px; transition:.2s; }.dog-photo button:hover { transform:scale(1.1); background:var(--orange); color:white; }
.dog-info { display:flex; justify-content:space-between; align-items:end; padding:19px 7px 15px; }.dog-info small { color:#8c94a6; font-size:10px; font-weight:800; }.dog-info h3 { margin:5px 0 0; font-size:25px; letter-spacing:-1px; }.dog-meta { display:flex; gap:5px; }.dog-meta span { padding:6px 8px; background:#f4f6fb; border-radius:8px; font-size:10px; color:#65708a; }
.dog-card>a { display:flex; justify-content:space-between; margin:0 7px; padding-top:14px; border-top:1px solid #eceff5; color:var(--blue); font-size:11px; font-weight:900; }.dog-card>a span { transition:.2s; }.dog-card:hover>a span { transform:translate(2px,-2px); }
.dog-card.filtered-out { display:none; }
.center-action { text-align:center; margin-top:45px; }.text-link { display:inline-flex; align-items:center; gap:18px; color:var(--blue); font-size:13px; font-weight:900; border-bottom:1px solid #a6bbed; padding-bottom:7px; }.text-link span { color:var(--orange); }
.story { background:white; overflow:hidden; }
.story-grid { display:grid; grid-template-columns:1.06fr .94fr; gap:100px; align-items:center; }
.story-visual { position:relative; min-height:630px; }
.story-image { position:absolute; width:88%; height:590px; left:3%; top:0; border-radius:36px 130px 36px 36px; overflow:hidden; transform:rotate(-2.5deg); box-shadow:0 30px 60px rgba(34,47,81,.17); }.story-image img { width:100%; height:100%; object-fit:cover; }
.story-image:after { content:""; position:absolute; inset:0; background:linear-gradient(120deg,rgba(8,75,218,.06),transparent 55%); }
.story-stamp { position:absolute; right:2%; top:36px; width:130px; height:130px; display:grid; place-items:center; align-content:center; padding:14px; text-align:center; color:white; background:var(--orange); border-radius:50%; transform:rotate(8deg); box-shadow:0 15px 30px rgba(255,107,26,.3); }.story-stamp span { font-size:8px; letter-spacing:1.8px; }.story-stamp b { font-size:43px; line-height:1; }.story-stamp small { font-size:7px; line-height:1.3; }
.scribble { position:absolute; left:-5px; bottom:5px; color:var(--blue); font-size:24px; font-weight:900; line-height:1.1; transform:rotate(-9deg); letter-spacing:-1px; text-shadow:3px 3px 0 #d9e4ff; }
.story-copy h2 { font-size:clamp(42px,4.4vw,63px); }.story-copy>p { color:#6c7280; font-size:15px; line-height:1.9; }.story-copy .lead { margin:30px 0 8px; color:var(--ink); font-weight:900; font-size:17px; }
.quote { display:flex; gap:15px; margin:27px 0; padding:19px 22px; border-left:3px solid var(--orange); background:#fff8f2; }.quote>span { color:var(--orange); font-size:43px; line-height:.9; font-family:Georgia,serif; }.quote p { margin:0; color:#333b50; font-size:14px; font-weight:800; line-height:1.65; }
.btn-blue { color:white; background:var(--blue); box-shadow:0 14px 32px rgba(8,75,218,.22); }
.care { position:relative; overflow:hidden; color:white; background:#062b81; }
.care:before { content:""; position:absolute; inset:0; opacity:.17; background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px); background-size:44px 44px; mask-image:linear-gradient(120deg,#000,transparent 68%); }
.care-glow { position:absolute; width:600px; height:600px; right:-180px; top:-200px; border-radius:50%; background:#075cf5; filter:blur(100px); opacity:.55; }
.care .shell { position:relative; }.care-head { max-width:650px; }.care-head h2 em { color:#ff8b37; }.care-head p { max-width:530px; color:#b9cef6; line-height:1.8; font-size:15px; }
.care-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:52px; }
.care-card { min-height:320px; padding:24px; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.15); border-radius:22px; background:rgba(255,255,255,.07); backdrop-filter:blur(8px); transition-property:opacity,transform,background,border-color; }
.care-card:hover { background:rgba(255,255,255,.13); border-color:rgba(255,139,55,.7); transform:translateY(-7px); }.care-card>small { color:#87aefc; font-weight:800; }.care-icon { width:61px; height:61px; display:grid; place-items:center; margin:35px 0 25px; border-radius:18px; background:#ff7425; color:white; font-size:17px; font-weight:950; box-shadow:0 12px 25px rgba(255,95,15,.22); }.care-card h3 { margin:0 0 12px; font-size:20px; }.care-card p { margin:0; color:#acc1eb; font-size:12px; line-height:1.8; }.card-arrow { position:absolute; right:22px; top:21px; color:#8eabe5; }
.process { margin-top:55px; min-height:68px; display:flex; align-items:center; justify-content:center; gap:28px; padding:15px; border:1px solid rgba(255,255,255,.1); border-radius:18px; background:rgba(0,21,72,.25); color:#dde8ff; font-size:12px; font-weight:800; }.process i { color:var(--orange); font-style:normal; }
.voices { background:#f5f8ff; }.voices-head>p { color:#7a8294; line-height:1.8; font-size:13px; }.voice-grid { display:grid; grid-template-columns:.82fr 1.15fr .9fr; gap:18px; align-items:stretch; }
.voice-photo { height:430px; position:relative; overflow:hidden; border-radius:26px; transform:rotate(-1.5deg); }.voice-photo img { width:100%; height:100%; object-fit:cover; }.voice-photo:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 60%,rgba(0,20,80,.65)); }.voice-photo span { position:absolute; z-index:2; left:22px; bottom:20px; color:white; font-size:10px; font-weight:900; letter-spacing:1.5px; }
.testimonial { min-height:430px; display:flex; flex-direction:column; justify-content:space-between; padding:40px; border-radius:26px; color:white; box-shadow:0 23px 46px rgba(4,39,123,.15); }.testimonial.blue { background:var(--blue); }.testimonial.orange { background:var(--orange); transform:rotate(1.5deg); }.stars { color:#ffae70; font-size:13px; letter-spacing:4px; }.testimonial blockquote { margin:20px 0; font-size:clamp(20px,2vw,27px); font-weight:850; line-height:1.65; letter-spacing:-.6px; }.person { display:flex; align-items:center; gap:12px; padding-top:20px; border-top:1px solid rgba(255,255,255,.2); }.person>span { width:42px; height:42px; display:grid; place-items:center; color:var(--blue); background:white; border-radius:50%; font-weight:900; }.person b,.person small { display:block; }.person b { font-size:12px; }.person small { margin-top:5px; color:rgba(255,255,255,.65); font-size:9px; }.big-mark { font-size:70px; font-family:Georgia,serif; line-height:.6; opacity:.45; }
.contact { background:white; }.contact-card { min-height:530px; padding:75px 7%; display:grid; grid-template-columns:1fr .85fr; gap:90px; align-items:center; position:relative; overflow:hidden; color:white; border-radius:36px; background:linear-gradient(130deg,#0739a8,#0756e5); box-shadow:0 35px 80px rgba(7,62,167,.22); }.contact-card:before { content:""; position:absolute; width:420px; height:420px; left:-210px; bottom:-250px; border:55px solid rgba(255,255,255,.08); border-radius:50%; }.contact-copy { position:relative; z-index:2; }.contact-copy p { max-width:470px; color:#c9d9fb; line-height:1.8; }.contact-badges { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }.contact-badges span { padding:8px 12px; border-radius:99px; background:rgba(255,255,255,.1); color:#e8efff; font-size:10px; }
.contact form { display:grid; grid-template-columns:1fr 1fr; gap:14px; position:relative; z-index:2; padding:28px; border-radius:24px; color:var(--ink); background:white; box-shadow:0 22px 50px rgba(0,25,91,.2); }.contact label { display:grid; gap:7px; color:#565f72; font-size:10px; font-weight:900; }.contact label:nth-child(3) { grid-column:1/-1; }.contact input,.contact select { width:100%; height:47px; padding:0 13px; border:1px solid #e2e7f0; outline:0; border-radius:11px; color:#283248; background:#f8faff; font-size:12px; }.contact input:focus,.contact select:focus { border-color:var(--blue); box-shadow:0 0 0 3px #dfe8ff; }.contact form button { grid-column:1/-1; border:0; }.contact form>small { grid-column:1/-1; text-align:center; color:#9ba3b1; font-size:8px; }.contact-dots { position:absolute; right:-20px; top:10px; width:190px; height:190px; opacity:.16; background-image:radial-gradient(white 2px,transparent 2px); background-size:18px 18px; transform:rotate(18deg); }
footer { padding:80px 0 25px; color:#d7e2fa; background:#031d59; }.footer-main { display:flex; justify-content:space-between; gap:70px; padding-bottom:65px; }.footer-brand { width:max-content; color:white; }.footer-main>div>p { margin-top:22px; color:#8298c4; font-size:12px; line-height:1.8; }.footer-links { display:flex; gap:90px; }.footer-links>div { display:flex; flex-direction:column; gap:13px; min-width:120px; }.footer-links b { margin-bottom:7px; color:white; font-size:12px; }.footer-links a,.footer-links span { color:#8ba0c8; font-size:11px; transition:.2s; }.footer-links a:hover { color:#ff8b37; }.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:22px; border-top:1px solid rgba(255,255,255,.1); color:#657ba7; font-size:9px; }.footer-bottom a { color:#9aadd2; }
.footer-social { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:32px 0 40px; margin-top:55px; border-top:1px solid rgba(255,255,255,.08); }.footer-social b { color:white; font-size:14px; font-weight:900; letter-spacing:.5px; }.social-icons { display:flex; gap:14px; }.social { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; color:white; cursor:pointer; transition:transform .25s ease, box-shadow .25s ease; box-shadow:0 8px 18px rgba(0,0,0,.18); }.social:hover { transform:translateY(-5px) scale(1.08); box-shadow:0 14px 26px rgba(0,0,0,.28); }.social svg { width:22px; height:22px; }.social.douyin { background:#000; }.social.xhs { background:#FF2442; }.social.sph { background:#07C160; }.social.ks { background:#FF4906; }
.toast { position:fixed; z-index:99; right:25px; bottom:25px; display:flex; gap:12px; align-items:center; padding:16px 20px; border-radius:15px; color:var(--ink); background:white; box-shadow:0 18px 55px rgba(3,22,72,.25); opacity:0; transform:translateY(30px); pointer-events:none; transition:.35s ease; }.toast.show { opacity:1; transform:none; }.toast>span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:white; background:var(--orange); font-weight:900; }.toast b,.toast small { display:block; }.toast b { font-size:13px; }.toast small { margin-top:3px; color:#7c8494; font-size:9px; }

@media (max-width:1200px){.dog-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1050px){.dog-grid{grid-template-columns:repeat(2,1fr)}.care-grid{grid-template-columns:repeat(2,1fr)}.story-grid{gap:55px}.voice-grid{grid-template-columns:1fr 1fr}.voice-grid .orange{grid-column:1/-1;min-height:300px}.contact-card{gap:40px;padding:60px 5%}}
@media (max-width:700px){.menu-toggle{display:block}.nav-links{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:10px;border-radius:18px;background:rgba(3,32,102,.96);backdrop-filter:blur(18px);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.25s}.nav-links.open{opacity:1;visibility:visible;transform:none}.nav-links a{padding:14px}.trust-strip{margin-top:20px}.story-grid{grid-template-columns:1fr}.story-copy{max-width:650px}.contact-card{grid-template-columns:1fr}.contact-copy{max-width:600px}.footer-main{flex-direction:column}.footer-social{flex-direction:column;gap:20px}.social{width:42px;height:42px}.social svg{width:20px;height:20px}.section{padding:90px 0}}
@media (max-width:700px){h2{font-size:41px;letter-spacing:-2.5px}.trust-strip{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:30px}.trust-strip>i{display:none}.trust-strip>div{gap:11px}.trust-strip strong{font-size:31px}.section-head,.voices-head{align-items:flex-start;flex-direction:column;margin-bottom:38px}.filter-tabs{max-width:100%;overflow:auto}.dog-grid{grid-template-columns:repeat(2,1fr)}.dog-photo{height:320px}.story-visual{min-height:460px}.story-image{height:430px}.story-stamp{width:100px;height:100px}.story-stamp b{font-size:34px}.care-grid{grid-template-columns:1fr}.care-card{min-height:270px}.process{flex-wrap:wrap;gap:12px 17px}.process i:nth-of-type(even){display:none}.voice-grid{grid-template-columns:1fr}.voice-grid .orange{grid-column:auto}.testimonial,.voice-photo{min-height:360px;height:auto;padding:30px}.contact-card{width:calc(100% - 28px);padding:50px 22px;border-radius:27px}.contact form{grid-template-columns:1fr;padding:20px}.contact label:nth-child(3){grid-column:auto}.contact form button,.contact form>small{grid-column:auto}.footer-links{gap:35px;flex-wrap:wrap}.footer-bottom{align-items:flex-start;flex-direction:column}.section{padding:75px 0}}
@media (max-width:420px){.dog-photo{height:340px}.hero-proof small{font-size:9px}.contact-badges{gap:5px}.contact-badges span{font-size:9px}.story-visual{min-height:400px}.story-image{height:380px}.section{padding:64px 0}}