:root {
	--cream: #fffaf1;
	--cream-deep: #f5eddf;
	--sage: #a9bea4;
	--sage-deep: #50684f;
	--pink: #f3c9ca;
	--pink-soft: #fbe9e7;
	--peach: #f1b28f;
	--yellow: #f2d783;
	--ink: #3d4338;
	--muted: #6e7168;
	--line: #d9d6ca;
	--white: #ffffff;
	--container: 1180px;
	--wide: 1320px;
	--nav-height: 82px;
	--font: "Noto Sans TC", sans-serif;
	--radius-small: 10px;
	--radius-medium: 18px;
	--radius-large: 34px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body { margin: 0; background: var(--cream); color: var(--ink); font-family: var(--font); font-size: 17px; line-height: 1.8; overflow-x: hidden; }
body.menu-open { overflow: hidden; }

img { display: block; width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

button { font: inherit; color: inherit; }

figure { margin: 0; }

ul { margin: 0; padding: 0; list-style: none; }

p { margin: 0; }

h1, h2, h3 { margin: 0; font-weight: 700; letter-spacing: 0.01em; }
h1 { font-size: clamp(36px, 5vw, 64px); line-height: 1.17; }
h2 { font-size: clamp(30px, 3.5vw, 46px); line-height: 1.28; }
h3 { font-size: clamp(21px, 2vw, 29px); line-height: 1.4; }

.site-header { position: relative; min-height: 100vh; background: var(--cream); overflow: hidden; }
.site-header.is-scrolled .site-nav { background: rgba(255, 250, 241, 0.94); border-bottom-color: var(--line); }
.site-nav { position: fixed; z-index: 40; top: 0; left: 0; width: 100%; height: var(--nav-height); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 max(30px, calc((100vw - var(--wide)) / 2)); background: rgba(255, 250, 241, 0.76); border-bottom: 1px solid transparent; backdrop-filter: blur(12px); transition: background 0.25s ease, border-color 0.25s ease; }
.site-nav-left-list, .site-nav-right-list { display: flex; align-items: center; gap: 28px; }
.site-nav-right-list { justify-content: flex-end; }
.site-nav a { font-size: 15px; font-weight: 600; }
.site-nav a:hover, .site-nav a:focus-visible { color: var(--sage-deep); }
.site-brand { display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.1; padding: 0 34px; }
.site-brand-main { font-size: 21px; font-weight: 800; letter-spacing: 0.05em; }
.site-brand-sub { margin-top: 6px; font-size: 11px; color: var(--muted); letter-spacing: 0.18em; }
.site-menu-toggle { display: none; width: 46px; height: 46px; border: 1px solid var(--line); background: var(--cream); border-radius: 14px; align-items: center; justify-content: center; cursor: pointer; }
.site-menu-toggle-lines { position: relative; width: 19px; height: 12px; }
.site-menu-toggle-lines::before, .site-menu-toggle-lines::after { content: ""; position: absolute; left: 0; width: 19px; height: 2px; background: var(--ink); transition: transform 0.25s ease, top 0.25s ease; }
.site-menu-toggle-lines::before { top: 1px; }
.site-menu-toggle-lines::after { top: 9px; }
.site-menu-toggle.is-active .site-menu-toggle-lines::before { top: 5px; transform: rotate(45deg); }
.site-menu-toggle.is-active .site-menu-toggle-lines::after { top: 5px; transform: rotate(-45deg); }

.hero { min-height: 100vh; padding: calc(var(--nav-height) + 54px) max(32px, calc((100vw - var(--wide)) / 2)) 62px; display: grid; grid-template-columns: minmax(330px, 0.82fr) minmax(560px, 1.3fr); gap: 68px; align-items: center; }
.hero-copy { position: relative; z-index: 4; max-width: 520px; }
.hero-kicker { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 24px; font-size: 14px; font-weight: 700; color: var(--sage-deep); }
.hero-kicker::before { content: ""; width: 38px; height: 2px; background: var(--sage); }
.hero h1 { max-width: 9em; }
.hero-lead { max-width: 500px; margin-top: 24px; color: var(--muted); font-size: 18px; line-height: 1.9; }
.hero-actions-list { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.hero-primary-link, .hero-secondary-link { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 22px; border-radius: 14px; font-size: 15px; font-weight: 700; transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease; }
.hero-primary-link { background: var(--sage-deep); color: var(--white); }
.hero-secondary-link { border: 1px solid var(--ink); }
.hero-primary-link:hover, .hero-secondary-link:hover { transform: translateY(-2px); }
.hero-note { margin-top: 30px; padding-left: 18px; border-left: 3px solid var(--pink); font-size: 14px; color: var(--muted); }
.hero-gallery { position: relative; height: min(700px, 69vw); max-height: 690px; min-height: 560px; }
.hero-photo-main { position: absolute; right: 4%; top: 6%; width: 57%; height: 70%; overflow: hidden; border-radius: 44% 44% 24px 24px; background: var(--pink-soft); }
.hero-photo-main img { height: 100%; object-fit: cover; object-position: center 48%; }
.hero-photo-small { position: absolute; left: 2%; top: 12%; width: 35%; height: 39%; overflow: hidden; border-radius: 28px 28px 44% 44%; background: var(--white); transform: rotate(-3deg); }
.hero-photo-small img { height: 100%; object-fit: cover; object-position: center 40%; }
.hero-photo-town { position: absolute; left: 12%; bottom: 4%; width: 48%; height: 34%; overflow: hidden; border-radius: 24px 60px 24px 24px; background: var(--sage); }
.hero-photo-town img { height: 100%; object-fit: cover; object-position: center; }
.hero-photo-label { position: absolute; z-index: 2; padding: 9px 13px; background: var(--cream); border: 1px solid rgba(61, 67, 56, 0.15); border-radius: 10px; font-size: 13px; font-weight: 700; }
.hero-photo-main .hero-photo-label { left: 18px; bottom: 18px; }
.hero-photo-small .hero-photo-label { left: 14px; bottom: 14px; }
.hero-photo-town .hero-photo-label { right: 14px; bottom: 14px; }
.hero-memory { position: absolute; right: 0; bottom: 11%; z-index: 3; width: 29%; padding: 22px; background: var(--yellow); border-radius: 18px 18px 18px 42px; transform: rotate(2deg); }
.hero-memory strong { display: block; margin-bottom: 7px; font-size: 16px; }
.hero-memory span { display: block; font-size: 13px; line-height: 1.65; color: #625b3b; }
.hero-paw-path { position: absolute; left: 45%; top: 2%; width: 13px; height: 13px; border-radius: 50%; background: var(--pink); box-shadow: 31px 25px 0 -1px var(--pink), 51px 59px 0 -2px var(--pink), 71px 94px 0 -2px var(--pink); opacity: 0.8; }
main > section { position: relative; }

.section-shell { width: min(var(--container), calc(100% - 64px)); margin: 0 auto; }
.section-heading { max-width: 720px; }
.section-heading p { max-width: 610px; margin-top: 18px; color: var(--muted); }
.section-kicker { display: block; margin-bottom: 11px; color: var(--sage-deep); font-size: 14px; font-weight: 700; }

.reveal { opacity: 0; clip-path: inset(0 0 12% 0); transform: translateY(12px); transition: opacity 0.65s ease, clip-path 0.75s ease, transform 0.65s ease; }
.reveal.is-visible { opacity: 1; clip-path: inset(0 0 0 0); transform: none; }

#pet-dex { padding: 118px 0 130px; background: var(--pink-soft); }
#pet-dex .section-shell { width: min(var(--wide), calc(100% - 64px)); }
#pet-dex .dex-head { display: grid; grid-template-columns: minmax(300px, 0.8fr) minmax(430px, 1.1fr); gap: 100px; align-items: end; }
#pet-dex .dex-intro { max-width: 530px; color: var(--muted); }
#pet-dex .pet-list { display: grid; grid-template-columns: 1.15fr 0.86fr 0.96fr; gap: 24px; align-items: start; margin-top: 62px; }
#pet-dex .pet-item { position: relative; }
#pet-dex .pet-item:nth-child(2) { margin-top: 78px; }
#pet-dex .pet-item:nth-child(3) { margin-top: 28px; }
#pet-dex .pet-figure { overflow: hidden; background: var(--white); }
#pet-dex .pet-item:nth-child(1) .pet-figure { border-radius: 34px 86px 34px 34px; }
#pet-dex .pet-item:nth-child(2) .pet-figure { border-radius: 70px 24px 70px 24px; }
#pet-dex .pet-item:nth-child(3) .pet-figure { border-radius: 24px 24px 82px 24px; }
#pet-dex .pet-figure img { aspect-ratio: 4/5; object-fit: cover; }
#pet-dex .pet-item:nth-child(1) .pet-figure img { object-position: center 45%; }
#pet-dex .pet-item:nth-child(2) .pet-figure img { object-position: center 34%; }
#pet-dex .pet-item:nth-child(3) .pet-figure img { object-position: center 42%; }
#pet-dex .pet-meta { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 18px 4px 0; }
#pet-dex .pet-meta strong { font-size: 19px; }
#pet-dex .pet-meta span { max-width: 16em; color: var(--muted); font-size: 14px; text-align: right; }

#care { padding: 132px 0; background: var(--cream); }
#care .care-layout { display: grid; grid-template-columns: minmax(420px, 1fr) minmax(390px, 0.82fr); gap: 96px; align-items: center; }
#care .care-media { position: relative; }
#care .care-media-frame { overflow: hidden; border-radius: 30px 30px 110px 30px; }
#care .care-media-frame img { aspect-ratio: 4/5; object-fit: cover; object-position: center 38%; }
#care .care-caption { position: absolute; right: -28px; bottom: 46px; width: 230px; padding: 20px 22px; background: var(--sage); border-radius: 18px 18px 18px 44px; color: #273327; }
#care .care-caption strong { display: block; margin-bottom: 5px; font-size: 16px; }
#care .care-caption span { display: block; font-size: 13px; line-height: 1.65; }
#care .care-copy { max-width: 520px; }
#care .care-copy > p { margin-top: 20px; color: var(--muted); }
#care .care-list { margin-top: 39px; border-top: 1px solid var(--line); }
#care .care-item { display: grid; grid-template-columns: 88px 1fr; gap: 25px; padding: 23px 0; border-bottom: 1px solid var(--line); }
#care .care-item span { font-size: 14px; font-weight: 700; color: var(--sage-deep); }
#care .care-item p { font-size: 16px; color: var(--muted); }

#home { padding: 128px 0 142px; background: #dfe9da; }
#home .home-heading { display: grid; grid-template-columns: 1fr 0.8fr; gap: 70px; align-items: end; margin-bottom: 52px; }
#home .home-heading p { max-width: 540px; color: #586453; }
#home .room-board { position: relative; min-height: 670px; overflow: hidden; border-radius: 38px; background: #cad8c2; }
#home .room-board img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
#home .room-board::after { content: ""; position: absolute; inset: 0; background: linear-gradient( 90deg, rgba(44, 61, 42, 0.17), rgba(44, 61, 42, 0) 52%, rgba(255, 249, 238, 0.12) ); }
#home .room-label-list { position: absolute; z-index: 2; inset: 0; }
#home .room-label-item { position: absolute; padding: 12px 15px; background: rgba(255, 250, 241, 0.93); border: 1px solid rgba(61, 67, 56, 0.16); border-radius: 13px; font-size: 14px; font-weight: 700; }
#home .room-label-item::after { content: ""; position: absolute; width: 11px; height: 11px; background: var(--peach); border: 3px solid var(--cream); border-radius: 50%; }
#home .room-label-item:nth-child(1) { left: 7%; top: 18%; }
#home .room-label-item:nth-child(1)::after { right: -34px; top: 50%; }
#home .room-label-item:nth-child(2) { right: 8%; top: 34%; }
#home .room-label-item:nth-child(2)::after { left: -34px; top: 50%; }
#home .room-label-item:nth-child(3) { left: 31%; bottom: 12%; }
#home .room-label-item:nth-child(3)::after { left: 50%; top: -34px; }
#home .room-note { position: absolute; z-index: 3; left: 42px; bottom: 38px; max-width: 300px; padding: 22px 24px; background: var(--pink-soft); border-radius: 14px 42px 14px 14px; }
#home .room-note strong { display: block; margin-bottom: 6px; font-size: 17px; }
#home .room-note p { font-size: 14px; color: var(--muted); }

#town { padding: 126px 0 136px; background: var(--cream); }
#town .town-top { display: grid; grid-template-columns: 0.76fr 1fr; gap: 92px; align-items: end; margin-bottom: 48px; }
#town .town-top p { max-width: 590px; color: var(--muted); }
#town .town-panorama { position: relative; overflow: hidden; border-radius: 82px 28px 28px 28px; }
#town .town-panorama img { aspect-ratio: 21/9; min-height: 410px; object-fit: cover; object-position: center 48%; }
#town .town-panorama::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(51, 59, 47, 0.5), transparent 52%); }
#town .town-overlay { position: absolute; z-index: 2; left: 34px; right: 34px; bottom: 28px; display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; color: var(--white); }
#town .town-overlay strong { max-width: 10em; font-size: clamp(24px, 3vw, 40px); line-height: 1.3; }
#town .town-overlay p { max-width: 410px; font-size: 15px; line-height: 1.75; text-align: right; }
#town .town-stop-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 38px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
#town .town-stop-item { padding: 27px 28px 29px; border-right: 1px solid var(--line); }
#town .town-stop-item:last-child { border-right: 0; }
#town .town-stop-item span { display: block; margin-bottom: 9px; font-size: 13px; font-weight: 700; color: var(--sage-deep); }
#town .town-stop-item strong { display: block; font-size: 18px; }
#town .town-stop-item p { margin-top: 6px; color: var(--muted); font-size: 14px; line-height: 1.7; }

#style { padding: 128px 0 144px; background: #f4d9d7; }
#style .style-layout { display: grid; grid-template-columns: minmax(280px, 0.62fr) minmax(640px, 1.38fr); gap: 76px; align-items: center; }
#style .style-copy { max-width: 440px; }
#style .style-copy p { margin-top: 20px; color: #6d5d5c; }
#style .style-tag-list { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
#style .style-tag-item { padding: 8px 13px; border: 1px solid rgba(77, 60, 59, 0.26); border-radius: 10px; font-size: 13px; font-weight: 600; }
#style .wardrobe-list { display: grid; grid-template-columns: 0.87fr 1.13fr; gap: 24px; align-items: end; }
#style .wardrobe-item { position: relative; }
#style .wardrobe-item:first-child { margin-bottom: 72px; }
#style .wardrobe-photo { overflow: hidden; background: var(--white); }
#style .wardrobe-item:first-child .wardrobe-photo { border-radius: 24px 66px 24px 24px; }
#style .wardrobe-item:last-child .wardrobe-photo { border-radius: 64px 24px 64px 24px; }
#style .wardrobe-photo img { aspect-ratio: 4/5; object-fit: cover; }
#style .wardrobe-item:first-child .wardrobe-photo img { object-position: center 45%; }
#style .wardrobe-item:last-child .wardrobe-photo img { object-position: center 40%; }
#style .wardrobe-label { display: flex; justify-content: space-between; gap: 18px; padding-top: 15px; font-size: 14px; }
#style .wardrobe-label span { color: #745f5e; }

#events { padding: 124px 0 132px; background: var(--cream); }
#events .event-layout { display: grid; grid-template-columns: minmax(370px, 0.85fr) minmax(530px, 1.15fr); gap: 90px; align-items: start; }
#events .event-sticky { position: sticky; top: 118px; }
#events .event-sticky p { max-width: 460px; margin-top: 18px; color: var(--muted); }
#events .event-photo { margin-top: 34px; overflow: hidden; border-radius: 24px 74px 24px 24px; }
#events .event-photo img { aspect-ratio: 5/4; object-fit: cover; object-position: center; }
#events .event-board { border-top: 2px solid var(--ink); }
#events .event-item { display: grid; grid-template-columns: 130px 1fr; gap: 34px; padding: 30px 0; border-bottom: 1px solid var(--line); }
#events .event-type { font-size: 13px; font-weight: 700; color: var(--sage-deep); }
#events .event-item h3 { font-size: 22px; }
#events .event-item p { max-width: 530px; margin-top: 8px; color: var(--muted); font-size: 15px; }
#events .event-link { display: inline-flex; margin-top: 15px; padding-bottom: 2px; border-bottom: 1px solid var(--ink); font-size: 14px; font-weight: 700; }

#closing { padding: 0 0 90px; background: var(--cream); }
#closing .closing-panel { width: min(var(--wide), calc(100% - 48px)); margin: 0 auto; display: grid; grid-template-columns: 1fr 0.72fr; gap: 60px; align-items: end; padding: 68px 70px; background: var(--yellow); border-radius: 30px 90px 30px 30px; }
#closing .closing-copy { max-width: 680px; }
#closing .closing-copy p { max-width: 590px; margin-top: 19px; color: #625b3b; }
#closing .closing-action { display: flex; justify-content: flex-end; align-items: center; }
#closing .closing-link { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 24px; background: var(--ink); color: var(--cream); border-radius: 14px; font-size: 15px; font-weight: 700; }

footer { background: var(--ink); color: #f6f1e5; }
footer .footer-shell { width: min(var(--wide), calc(100% - 64px)); margin: 0 auto; padding: 62px 0 38px; }
footer .footer-top { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 70px; align-items: end; padding-bottom: 45px; border-bottom: 1px solid rgba(255, 255, 255, 0.18); }
footer .footer-brand { font-size: clamp(30px, 5vw, 64px); font-weight: 800; line-height: 1.15; letter-spacing: 0.03em; }
footer .footer-message { max-width: 480px; color: #cfd1c8; }
footer .footer-nav-list { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px 24px; margin-top: 24px; }
footer .footer-nav-list a { font-size: 14px; color: #f6f1e5; }
footer .footer-bottom { display: flex; justify-content: space-between; gap: 30px; padding-top: 27px; color: #bfc1b7; font-size: 13px; }
footer .footer-bottom p:last-child { text-align: right; }

@media (max-width: 1280px) {
	:root { --container: 1060px; --wide: 1160px; }
	.site-nav { padding-left: 34px; padding-right: 34px; }
	.site-nav-left-list, .site-nav-right-list { gap: 20px; }
	.hero { gap: 38px; padding-left: 44px; padding-right: 44px; }
	.hero-gallery { min-height: 530px; }
	#pet-dex .dex-head { gap: 60px; }
	#care .care-layout { gap: 68px; }
	#home .room-board { min-height: 610px; }
	#style .style-layout { gap: 52px; }
	#events .event-layout { gap: 60px; }
}
@media (max-width: 960px) {
	:root { --nav-height: 72px; }
	body { font-size: 16px; }
	.site-nav { grid-template-columns: 1fr auto; padding: 0 28px; }
	.site-brand { align-items: flex-start; padding: 0; }
	.site-brand-main { font-size: 19px; }
	.site-brand-sub { font-size: 10px; }
	.site-menu-toggle { display: flex; }
	.site-nav-left-list, .site-nav-right-list { position: fixed; left: 0; width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding: 0 28px; background: var(--cream); opacity: 0; visibility: hidden; transform: translateY(-12px); transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease; }
	.site-nav-left-list { top: var(--nav-height); padding-top: 24px; }
	.site-nav-right-list { top: calc(var(--nav-height) + 156px); padding-bottom: 28px; border-bottom: 1px solid var(--line); }
	.site-nav-left-list a, .site-nav-right-list a { display: block; width: 100%; padding: 10px 0; font-size: 16px; }
	.site-nav-left-list.is-active, .site-nav-right-list.is-active { opacity: 1; visibility: visible; transform: none; }
	.hero { min-height: auto; grid-template-columns: 1fr; padding: calc(var(--nav-height) + 56px) 42px 80px; }
	.hero-copy { max-width: 660px; }
	.hero-gallery { width: min(760px, 100%); height: 650px; margin: 8px auto 0; }
	#pet-dex .dex-head { grid-template-columns: 1fr; gap: 20px; }
	#pet-dex .pet-list { grid-template-columns: 1.1fr 0.9fr; gap: 24px; }
	#pet-dex .pet-item:nth-child(2) { margin-top: 60px; }
	#pet-dex .pet-item:nth-child(3) { grid-column: 1/-1; width: 58%; margin: 0 0 0 auto; }
	#care .care-layout { grid-template-columns: 1fr; gap: 70px; }
	#care .care-media { width: min(610px, 88%); }
	#care .care-copy { margin-left: auto; }
	#home .home-heading { grid-template-columns: 1fr; gap: 20px; }
	#home .room-board { min-height: 560px; }
	#town .town-top { grid-template-columns: 1fr; gap: 20px; }
	#town .town-panorama img { aspect-ratio: 16/9; }
	#style .style-layout { grid-template-columns: 1fr; gap: 58px; }
	#style .style-copy { max-width: 650px; }
	#style .wardrobe-list { width: min(760px, 100%); margin-left: auto; }
	#events .event-layout { grid-template-columns: 1fr; gap: 62px; }
	#events .event-sticky { position: relative; top: auto; display: grid; grid-template-columns: 1fr 0.9fr; gap: 38px; align-items: end; }
	#events .event-photo { margin-top: 0; }
	#closing .closing-panel { grid-template-columns: 1fr; padding: 58px 52px; }
	#closing .closing-action { justify-content: flex-start; }
	footer .footer-top { grid-template-columns: 1fr; }
	footer .footer-nav-list { justify-content: flex-start; }
}
@media (max-width: 768px) {
	.section-shell { width: min(100% - 40px, var(--container)); }
	.hero { padding-left: 22px; padding-right: 22px; }
	.hero h1 { max-width: 8.6em; }
	.hero-lead { font-size: 17px; }
	.hero-gallery { height: 580px; min-height: 0; }
	.hero-photo-main { right: 0; width: 61%; height: 65%; }
	.hero-photo-small { left: 0; width: 40%; height: 37%; }
	.hero-photo-town { left: 5%; width: 56%; height: 31%; }
	.hero-memory { right: 1%; bottom: 8%; width: 37%; }
	#pet-dex { padding: 92px 0 105px; }
	#pet-dex .section-shell { width: calc(100% - 40px); }
	#pet-dex .pet-list { display: flex; overflow-x: auto; gap: 18px; margin-right: -20px; padding-right: 20px; scroll-snap-type: x mandatory; }
	#pet-dex .pet-item, #pet-dex .pet-item:nth-child(2), #pet-dex .pet-item:nth-child(3) { flex: 0 0 74%; width: auto; margin-top: 0; margin-left: 0; scroll-snap-align: start; }
	#care { padding: 104px 0; }
	#care .care-media { width: 90%; }
	#care .care-caption { right: -10%; bottom: 28px; }
	#home { padding: 102px 0 114px; }
	#home .room-board { min-height: 500px; border-radius: 26px; }
	#home .room-note { left: 24px; bottom: 22px; }
	#home .room-label-item:nth-child(1) { left: 4%; top: 14%; }
	#home .room-label-item:nth-child(2) { right: 4%; top: 32%; }
	#home .room-label-item:nth-child(3) { display: none; }
	#town { padding: 102px 0 112px; }
	#town .town-panorama { border-radius: 48px 22px 22px 22px; }
	#town .town-panorama img { min-height: 430px; aspect-ratio: auto; }
	#town .town-overlay { left: 24px; right: 24px; bottom: 24px; display: block; }
	#town .town-overlay p { margin-top: 12px; text-align: left; }
	#town .town-stop-list { grid-template-columns: 1fr; }
	#town .town-stop-item { border-right: 0; border-bottom: 1px solid var(--line); }
	#town .town-stop-item:last-child { border-bottom: 0; }
	#style { padding: 102px 0 116px; }
	#style .wardrobe-list { grid-template-columns: 1fr 1fr; gap: 16px; }
	#style .wardrobe-item:first-child { margin-bottom: 44px; }
	#events { padding: 100px 0 108px; }
	#events .event-sticky { grid-template-columns: 1fr; }
	#events .event-photo { width: 78%; margin-left: auto; }
	#events .event-item { grid-template-columns: 100px 1fr; gap: 24px; }
	#closing { padding-bottom: 64px; }
	#closing .closing-panel { width: calc(100% - 32px); padding: 48px 34px; border-radius: 24px 62px 24px 24px; }
	footer .footer-shell { width: calc(100% - 40px); }
	footer .footer-bottom { flex-direction: column; }
	footer .footer-bottom p:last-child { text-align: left; }
}
@media (max-width: 500px) {
	:root { --nav-height: 66px; }
	.site-nav { padding: 0 18px; }
	.site-menu-toggle { width: 42px; height: 42px; border-radius: 12px; }
	.site-brand-sub { display: none; }
	.hero { padding: calc(var(--nav-height) + 42px) 18px 64px; }
	.hero h1 { font-size: 36px; line-height: 1.22; }
	.hero-kicker { margin-bottom: 18px; }
	.hero-lead { margin-top: 20px; font-size: 16px; }
	.hero-actions-list { display: grid; grid-template-columns: 1fr; margin-top: 28px; }
	.hero-primary-link, .hero-secondary-link { width: 100%; }
	.hero-note { margin-top: 24px; }
	.hero-gallery { height: 500px; margin-top: 10px; }
	.hero-photo-main { right: 0; top: 4%; width: 68%; height: 61%; border-radius: 38% 38% 18px 18px; }
	.hero-photo-small { left: 0; top: 12%; width: 38%; height: 32%; border-radius: 18px 18px 42% 42%; }
	.hero-photo-town { left: 0; bottom: 4%; width: 62%; height: 29%; border-radius: 18px 42px 18px 18px; }
	.hero-memory { right: 0; bottom: 2%; width: 44%; padding: 16px; }
	.hero-memory span { font-size: 12px; }
	.hero-photo-label { padding: 7px 9px; font-size: 11px; }
	.hero-paw-path { display: none; }
	.section-shell { width: calc(100% - 32px); }
	.section-heading h2 { font-size: 32px; }
	#pet-dex { padding: 78px 0 84px; }
	#pet-dex .section-shell { width: calc(100% - 32px); }
	#pet-dex .pet-list { margin-right: -16px; padding-right: 16px; }
	#pet-dex .pet-item, #pet-dex .pet-item:nth-child(2), #pet-dex .pet-item:nth-child(3) { flex-basis: 84%; }
	#pet-dex .pet-meta { display: block; }
	#pet-dex .pet-meta span { display: block; margin-top: 4px; text-align: left; }
	#care { padding: 84px 0; }
	#care .care-media { width: 100%; padding-bottom: 70px; }
	#care .care-caption { right: 10px; bottom: 20px; width: 210px; }
	#care .care-item { grid-template-columns: 1fr; gap: 4px; padding: 19px 0; }
	#home { padding: 84px 0 92px; }
	#home .room-board { min-height: 500px; }
	#home .room-board img { object-position: 58% center; }
	#home .room-label-list { position: absolute; left: 16px; right: 16px; top: 16px; bottom: auto; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
	#home .room-label-item, #home .room-label-item:nth-child(1), #home .room-label-item:nth-child(2), #home .room-label-item:nth-child(3) { position: relative; display: inline-block; left: auto; right: auto; top: auto; bottom: auto; }
	#home .room-label-item::after { display: none; }
	#home .room-note { left: 16px; right: 16px; bottom: 16px; max-width: none; }
	#town { padding: 84px 0 92px; }
	#town .town-panorama img { min-height: 480px; object-position: 54% center; }
	#town .town-overlay { left: 18px; right: 18px; bottom: 18px; }
	#town .town-stop-item { padding-left: 5px; padding-right: 5px; }
	#style { padding: 84px 0 94px; }
	#style .wardrobe-list { display: flex; overflow-x: auto; margin-right: -16px; padding-right: 16px; scroll-snap-type: x mandatory; }
	#style .wardrobe-item, #style .wardrobe-item:first-child { flex: 0 0 82%; margin-bottom: 0; scroll-snap-align: start; }
	#events { padding: 84px 0 94px; }
	#events .event-photo { width: 100%; }
	#events .event-item { grid-template-columns: 1fr; gap: 7px; padding: 24px 0; }
	#closing .closing-panel { padding: 40px 24px; }
	#closing .closing-copy h2 { font-size: 32px; }
	footer .footer-shell { padding-top: 48px; }
	footer .footer-brand { font-size: 38px; }
	footer .footer-nav-list { display: grid; grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition: none !important; animation: none !important; }
	.reveal { opacity: 1; clip-path: none; transform: none; }
}