@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@400;600;700&family=Nunito:wght@400;600;800&display=swap');
*{box-sizing:border-box}body{margin:0;color:#35283b;background:#fff7fc;font-family:Nunito,Arial,sans-serif}
.site-header{height:76px;padding:0 7%;display:flex;align-items:center;justify-content:space-between;background:#fff;box-shadow:0 4px 20px #8e52741a;position:sticky;top:0;z-index:10}
.logo{font:700 30px Comfortaa;color:#f05c9b;text-decoration:none}.logo span{color:#9d6de0}
nav{display:flex;gap:26px}nav a{color:#594b61;text-decoration:none;font-weight:800}nav a:hover,nav a.active{color:#ef5896}
.hero{min-height:620px;padding:70px 9%;display:flex;align-items:center;justify-content:space-between;gap:50px;background:radial-gradient(circle at 75% 30%,#f9d8ed 0 13%,transparent 14%),linear-gradient(135deg,#fff8fc,#f5edff)}
.hero-copy{max-width:650px}.eyebrow{text-transform:uppercase;letter-spacing:3px;font-size:13px;font-weight:800;color:#c15b94}
h1,h2{font-family:Comfortaa,Arial,sans-serif}.hero h1{font-size:clamp(42px,6vw,76px);line-height:1.08;margin:12px 0}.hero h1 span{color:#ee5795}.hero p{font-size:19px;line-height:1.7;color:#6f6276}
.buttons{display:flex;gap:14px;margin-top:30px}.button{display:inline-block;padding:14px 22px;border-radius:18px;background:#ed5d9a;color:white;text-decoration:none;font-weight:800;box-shadow:0 10px 25px #ed5d9a44}.button.secondary{background:#fff;color:#9a64c9}
.hero-cat{width:320px;height:360px;position:relative;background:linear-gradient(#f6a5c8,#d795e7);border-radius:48% 48% 42% 42%;box-shadow:0 25px 60px #b55c9a33;transform:rotate(3deg)}
.cat-face{position:absolute;left:35px;right:35px;top:90px;height:185px;background:#fff0f8;border-radius:50%;box-shadow:inset 0 -12px #fbd7e9}
.cat-ear{position:absolute;width:105px;height:120px;background:#f6a5c8;top:25px}.cat-ear.left{left:25px;transform:rotate(-28deg);border-radius:20px 80px 10px 80px}.cat-ear.right{right:25px;transform:rotate(28deg);border-radius:80px 20px 80px 10px}
.eyes{display:flex;justify-content:space-around;padding:65px 55px 0}.eyes i{width:16px;height:24px;background:#4b3451;border-radius:50%}.mouth{text-align:center;font-size:32px;color:#d65a8f}.blush{position:absolute;width:38px;height:16px;background:#f5a1bd;border-radius:50%;left:52px;top:145px}.blush.r{left:auto;right:52px}.ribbon{position:absolute;bottom:28px;left:92px;background:#fff;padding:10px 18px;border-radius:20px;color:#d4528c;font-weight:800}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:70px 9%}.cards article,.character,.about-box,.facts div{background:white;border-radius:28px;padding:28px;box-shadow:0 15px 45px #77456c12}.icon{font-size:36px}.cards h2{margin:10px 0}.cards p{color:#746878;line-height:1.6}.cards a{color:#e25392;font-weight:800;text-decoration:none}
.page{padding:65px 9%;min-height:calc(100vh - 130px)}.page-title{max-width:700px;margin-bottom:45px}.page-title h1{font-size:54px;margin:10px 0}.page-title>p:last-child{font-size:18px;color:#766978}
.character-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.character{text-align:center}.character .avatar{height:180px;border-radius:22px;display:flex;align-items:center;justify-content:center;font-size:56px;margin-bottom:22px}.character.pink .avatar{background:#ffe1ef}.character.violet .avatar{background:#e8dcff}.character.blue .avatar{background:#dcecff}.character.mint .avatar{background:#d9f8ef}.character span{color:#a25d91;font-weight:800;font-size:14px}.character p{color:#756977;line-height:1.6}.character b{font-size:13px;color:#7c6590}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.art{min-height:260px;border-radius:28px;display:flex;align-items:end;padding:24px;overflow:hidden;position:relative;background-size:cover;box-shadow:0 15px 40px #77456c18}.art:before{content:'ฅ^•ﻌ•^ฅ';position:absolute;inset:20px;display:grid;place-items:center;font-size:70px;color:#ffffffaa}.art span{position:relative;background:#ffffffdf;padding:10px 14px;border-radius:15px;font-weight:800}.art small{font-weight:600;color:#7d6b7c}.art1{background:linear-gradient(135deg,#ffb4d2,#ffcde2)}.art2{background:linear-gradient(135deg,#b9a6ec,#8f83d0)}.art3{background:linear-gradient(135deg,#91d6ef,#b7e9ff)}.art4{background:linear-gradient(135deg,#9de1ca,#d9f8e8)}.art5{background:linear-gradient(135deg,#f4c3a5,#fbe4c5)}.art6{background:linear-gradient(135deg,#f3a9ca,#d9a8ed)}
.about-box{max-width:850px;line-height:1.8;color:#6d6170;font-size:18px}.about-box h2{color:#3e3045}.quote{margin-top:28px;padding:25px;border-left:5px solid #ed619d;background:#fff2f8;border-radius:0 18px 18px 0;color:#8b5071;font-weight:700}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:25px}.facts div{text-align:center}.facts b{display:block;font:700 42px Comfortaa;color:#e45a97}.facts span{color:#756978}
footer{text-align:center;padding:30px;background:#fff;color:#8b7b8e}
@media(max-width:900px){nav{gap:12px;font-size:14px}.hero{flex-direction:column;text-align:center}.hero-copy{max-width:none}.buttons{justify-content:center}.character-grid{grid-template-columns:repeat(2,1fr)}.gallery{grid-template-columns:repeat(2,1fr)}.cards{grid-template-columns:1fr}}
@media(max-width:600px){.site-header{height:auto;padding:18px 5%;flex-direction:column;gap:14px}nav{flex-wrap:wrap;justify-content:center}.hero{padding:45px 6%}.hero-cat{width:250px;height:290px}.cards,.page{padding:45px 6%}.character-grid,.gallery,.facts{grid-template-columns:1fr}.page-title h1{font-size:40px}}
