:root { --ink:#2b2926; --paper:#fffdf8; --cream:#f5eee2; --accent:#b9654b; --accent-dark:#814332; --sage:#aab59a; --line:#ded4c5; --shadow:0 12px 32px rgba(67,47,28,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif; font-size:16px; line-height:1.8; }
a { color:inherit; } img { max-width:100%; } button,input,select,textarea { font:inherit; }
.skip-link { position:absolute; left:1rem; top:-5rem; z-index:10; background:var(--ink); color:white; padding:.6rem 1rem; } .skip-link:focus { top:1rem; }
.container { width:min(1120px, calc(100% - 2.5rem)); margin:auto; }.section { padding:5.5rem 0; }.section-tint { background:var(--cream); }.narrow { width:min(720px, 100%); margin:auto; }
.site-header { position:sticky; top:0; z-index:5; background:rgba(255,253,248,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(8px); }.header-inner { min-height:68px; display:flex; align-items:center; justify-content:space-between; gap:1rem; }.logo { text-decoration:none; font-weight:800; letter-spacing:.08em; }.logo::before { content:"●"; display:inline-block; color:var(--accent); margin-right:.35rem; font-size:.8em; }
.site-nav ul { display:flex; align-items:center; gap:.25rem; padding:0; margin:0; list-style:none; }.site-nav a { text-decoration:none; display:block; padding:.5rem .65rem; font-size:.82rem; font-weight:700; }.site-nav a[aria-current="page"] { color:var(--accent-dark); text-decoration:underline; text-underline-offset:5px; }.menu-toggle { display:none; min-height:44px; border:1px solid var(--ink); background:var(--paper); padding:.35rem .75rem; border-radius:.5rem; }
.hero { overflow:hidden; padding:clamp(4rem,10vw,8rem) 0 5rem; background:linear-gradient(135deg,#f5eee2 0%,#fffdf8 58%,#e9dfcc 100%); }.hero-grid { display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:3rem; }.eyebrow { margin:0 0:.3rem; color:var(--accent-dark); font-size:.84rem; font-weight:800; letter-spacing:.08em; }.hero h1,.page-hero h1 { margin:.2rem 0 1rem; font-size:clamp(2.3rem,6vw,4.8rem); line-height:1.22; letter-spacing:.04em; }.lead { font-size:1.1rem; max-width:38rem; }.button-row { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }.button { display:inline-flex; min-height:50px; padding:.65rem 1.2rem; border-radius:.45rem; align-items:center; justify-content:center; border:2px solid var(--accent-dark); background:var(--accent); color:white; font-weight:800; text-decoration:none; cursor:pointer; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-2px); background:var(--accent-dark); }.button-outline { background:transparent; color:var(--accent-dark); }.button-outline:hover { color:white; }
.hero-art { position:relative; min-height:290px; border-radius:45% 55% 48% 52% / 45% 43% 57% 55%; background:#d8c5a7; box-shadow:var(--shadow); }.hero-art::before { content:""; position:absolute; width:55%; height:48%; left:22%; top:13%; border-radius:50%; background:#fefcf7; box-shadow:inset 0 0 0 10px #b59b77; }.hero-art::after { content:"☀"; position:absolute; right:13%; top:10%; color:#d8953b; font-size:2.3rem; }.hero-art .cat-portrait { position:absolute; left:32%; bottom:10%; transform:scale(1.5); }
.section-heading { max-width:640px; margin-bottom:2.5rem; }.section-heading h2 { margin:.2rem 0; font-size:clamp(1.8rem,4vw,2.8rem); line-height:1.35; }.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }.info-card,.cat-card,.access-card,.notice { padding:1.5rem; border:1px solid var(--line); border-radius:1rem; background:white; }.info-card h3 { margin-top:0; }.icon { font-size:1.7rem; }
.cat-list { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }.cat-card { position:relative; overflow:hidden; }.cat-card h2 { margin:.2rem 0; }.cat-card p:last-child { margin-bottom:0; }.cat-portrait { width:130px; height:120px; position:relative; margin:0 auto 1rem; --fur:#d8a970; --fur-dark:#b97b53; }.cat-body { position:absolute; z-index:1; bottom:0; left:23px; width:86px; height:70px; border-radius:48% 48% 35% 35%; background:var(--fur); }.cat-face { position:absolute; z-index:2; left:25px; top:17px; width:80px; height:64px; border-radius:47% 47% 43% 43%; background:var(--fur); }.cat-ear { position:absolute; z-index:0; top:4px; width:31px; height:37px; border-radius:65% 10% 55% 10%; background:var(--fur-dark); }.ear-left { left:27px; transform:rotate(-25deg); }.ear-right { right:25px; transform:scaleX(-1) rotate(-25deg); }.cat-face i { position:absolute; top:29px; width:8px; height:10px; border-radius:50%; background:var(--ink); }.cat-face i:first-child { left:20px; }.cat-face i:nth-child(2) { right:20px; }.cat-face b { position:absolute; left:36px; top:41px; width:8px; height:5px; border-radius:50%; background:#8b5b58; }.cat-tail { position:absolute; z-index:0; right:7px; bottom:11px; width:39px; height:72px; border:13px solid var(--fur); border-left:0; border-bottom:0; border-radius:0 100% 0 0; transform:rotate(24deg); transform-origin:bottom left; animation:tail 2.4s ease-in-out infinite; }.black { --fur:#404042; --fur-dark:#2b2b2d; }.tabby { --fur:#a98560; --fur-dark:#76573f; }.calico { --fur:#e3c29d; --fur-dark:#b85e40; }.calico .cat-body::after { content:""; display:block; width:35px; height:42px; border-radius:50%; background:#514c48; margin:13px 0 0 20px; }.calico .cat-face::after { content:""; position:absolute; width:20px; height:25px; background:#514c48; border-radius:50%; left:6px; top:3px; }
.page-hero { padding:4rem 0 3.5rem; background:var(--cream); }.page-hero p { max-width:40rem; }.price-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }.price-list li { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.15rem .25rem; border-bottom:1px solid var(--line); }.price-list small { display:block; color:#625b53; }.price-list b { font-size:1.2rem; white-space:nowrap; }.two-col { display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; align-items:start; }.details { margin:0; }.details div { padding:1rem 0; border-bottom:1px solid var(--line); }.details dt { font-weight:800; }.details dd { margin:0; }.map-placeholder { min-height:300px; display:grid; place-items:center; padding:2rem; border-radius:1rem; color:#5d554b; text-align:center; background:repeating-linear-gradient(45deg,#e5dac8 0 1px,transparent 1px 22px),#f3ecdf; }
.cat-game { position:relative; max-width:520px; padding-top:4.5rem; margin:2.5rem auto 0; }.cat-blocked-link { width:100%; }.cat-blocked-link.is-blocked { filter:saturate(.7); }.button-cat { position:absolute; z-index:2; top:0; left:50%; width:135px; height:105px; padding:0; border:0; background:transparent; cursor:pointer; transform:translateX(-50%); transition:transform .6s cubic-bezier(.2,.9,.2,1); }.button-cat .cat-portrait { transform:scale(.9); margin:0; }.button-cat:focus-visible { outline:3px solid var(--ink); outline-offset:3px; border-radius:1rem; }.button-cat.moved { transform:translateX(120%) rotate(10deg); }.cat-message { min-height:1.8em; margin:.7rem 0 0; text-align:center; font-size:.9rem; font-weight:700; }.speech { display:inline-block; padding:.4rem .75rem; border-radius:1rem; background:white; box-shadow:0 3px 10px rgba(0,0,0,.08); }
.form-card { padding:clamp(1.2rem,4vw,2.5rem); border:1px solid var(--line); border-radius:1rem; background:#fff; box-shadow:var(--shadow); }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }.field { display:block; margin-bottom:1.1rem; font-weight:700; }.field input,.field select,.field textarea { display:block; width:100%; min-height:48px; padding:.65rem .75rem; margin-top:.3rem; border:1px solid #9b9186; border-radius:.4rem; background:white; color:var(--ink); }.field textarea { min-height:110px; resize:vertical; }.form-result { margin-top:1rem; padding:1rem; background:#e7f1e2; border-radius:.5rem; font-weight:700; }.site-footer { padding:2.5rem 0; color:#efe9df; background:#302c28; }.footer-inner { display:flex; justify-content:space-between; align-items:center; gap:1rem; }.footer-inner p { margin:0; font-size:.85rem; }.footer-links { display:flex; gap:1rem; }.footer-links a { color:inherit; }
@keyframes tail { 50% { transform:rotate(9deg); } } @media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } }
@media (max-width:760px) { .container { width:min(100% - 2rem, 1120px); }.menu-toggle { display:block; }.site-nav { display:none; position:absolute; top:68px; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--line); }.site-nav.is-open { display:block; }.site-nav ul { display:block; padding:.5rem 1rem 1rem; }.site-nav a { padding:.75rem; font-size:1rem; }.hero-grid,.two-col { grid-template-columns:1fr; gap:2rem; }.hero-art { min-height:230px; order:-1; }.grid-3,.cat-list { grid-template-columns:1fr; }.cat-card { display:grid; grid-template-columns:130px 1fr; align-items:center; gap:.6rem; }.cat-card .cat-portrait { margin:0; }.section { padding:4rem 0; }.form-row { grid-template-columns:1fr; gap:0; }.footer-inner { display:block; }.footer-links { margin-top:1rem; }.button-row .button { flex:1; }.page-hero { padding:3rem 0; } }