:root {
  --ink:#302319;
  --cream:#fffaf0;
  --yellow:#ffd84f;
  --orange:#ff9e45;
  --coral:#ff9b8e;
  --mint:#bfe8c0;
  --blue:#b9ddf6;
  --purple:#c9b8ed;
  --line:#e9dcc9;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:1180px; overflow-x:hidden; color:var(--ink); background:#fffdf8; font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif; }
h1,h2,h3,.brand,.button,.nav-button { font-family:"YouYuan","Arial Rounded MT Bold","Microsoft YaHei",sans-serif; }
a { color:inherit; text-decoration:none; }
img { display:block; }

.site-header { position:fixed; z-index:100; top:18px; left:0; width:100%; transition:.3s; }
.nav-shell { width:1180px; height:66px; margin:auto; padding:0 11px 0 15px; display:flex; align-items:center; border:1px solid rgba(48,35,25,.08); border-radius:21px; background:rgba(255,253,248,.82); box-shadow:0 12px 40px rgba(74,48,19,.08); backdrop-filter:blur(18px); transition:.3s; }
.site-header.scrolled { top:9px; }
.site-header.scrolled .nav-shell { box-shadow:0 12px 38px rgba(64,43,19,.14); }
.brand { display:flex; align-items:center; gap:10px; font-size:20px; font-weight:900; letter-spacing:1px; }
.brand img { width:43px; height:43px; border:2px solid white; border-radius:14px; object-fit:cover; box-shadow:0 5px 12px rgba(92,58,0,.15); }
.nav-links { height:100%; margin-left:132px; display:flex; align-items:center; gap:38px; }
.nav-links a { position:relative; display:flex; align-items:center; height:100%; color:#73675d; font-size:14px; transition:.2s; }
.nav-links a:hover,.nav-links a.active { color:var(--ink); font-weight:800; }
.nav-links a.active:after { content:""; position:absolute; left:50%; bottom:12px; width:16px; height:4px; border-radius:5px; background:var(--yellow); transform:translateX(-50%) rotate(-3deg); }
.nav-button { display:flex; align-items:center; gap:15px; margin-left:auto; padding:10px 11px 10px 18px; border:2px solid var(--ink); border-radius:14px; background:var(--yellow); font-size:13px; font-weight:900; box-shadow:3px 3px 0 var(--ink); transition:.2s; }
.nav-button b { display:grid; width:28px; height:28px; place-items:center; border-radius:9px; background:var(--ink); color:white; font-size:15px; }
.nav-button:hover { transform:translate(-1px,-1px); box-shadow:5px 5px 0 var(--ink); }

.hero { position:relative; height:800px; overflow:hidden; background:linear-gradient(120deg,#fffdf9 0%,#fff9e9 50%,#ffe785 100%); }
.hero:before { content:""; position:absolute; right:-210px; top:-330px; width:780px; height:780px; border:110px solid rgba(255,255,255,.23); border-radius:50%; }
.hero:after { content:""; position:absolute; left:-120px; bottom:-245px; width:420px; height:420px; border:65px solid rgba(255,216,79,.16); border-radius:50%; }
.hero-shell { position:relative; z-index:4; width:1180px; height:100%; margin:auto; }
.hero-copy-block { position:absolute; top:143px; left:0; width:650px; }
.hero-kicker { display:flex; align-items:center; gap:13px; margin:0 0 22px; font-size:12px; font-weight:800; letter-spacing:1px; }
.hero-kicker span { padding:7px 11px; border:1.5px solid var(--ink); border-radius:20px; background:white; font-size:9px; letter-spacing:1.5px; transform:rotate(-2deg); }
.hero-kicker b { color:#856d39; }
.hero h1 { margin:0; font-size:70px; line-height:1.08; letter-spacing:-4px; text-shadow:3px 4px 0 white; }
.hero h1 em { position:relative; z-index:1; color:#ff8a37; font-style:normal; }
.hero h1 em:after { content:""; position:absolute; z-index:-1; left:-4px; right:-8px; bottom:5px; height:17px; border-radius:50%; background:rgba(255,216,79,.7); transform:rotate(-2deg); }
.hero h1 i { color:#ff9b8e; font-style:normal; }
.hero-intro { margin:24px 0 27px; color:#6e6257; font-size:16px; line-height:1.9; }
.hero-actions { display:flex; align-items:center; gap:14px; }
.button { display:inline-flex; align-items:center; gap:19px; padding:14px 22px; border:2px solid var(--ink); border-radius:14px; font-size:14px; font-weight:900; transition:.2s; }
.button-dark { background:var(--ink); color:white; box-shadow:5px 5px 0 var(--yellow); }
.button-dark:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 var(--yellow); }
.button-light { border-color:#d7c9b5; background:rgba(255,255,255,.72); }
.button-light i { display:grid; width:25px; height:25px; place-items:center; border-radius:50%; background:#ffe8aa; color:#ff8a37; font-style:normal; font-size:9px; }
.button-light:hover { border-color:var(--ink); background:white; }
.hero-bottom { display:flex; align-items:center; gap:24px; margin-top:34px; }
.pet-friends { display:flex; align-items:center; gap:11px; }
.friend-faces { display:flex; }
.friend-faces span { display:grid; width:35px; height:35px; place-items:center; margin-left:-8px; border:2px solid white; border-radius:50%; background:#fff0bd; font-size:17px; }
.friend-faces span:first-child { margin-left:0; }
.friend-faces span:nth-child(2) { background:#dceefa; }.friend-faces span:nth-child(3) { background:#fbded9; }.friend-faces span:nth-child(4) { background:#ddefd9; }
.pet-friends p,.hero-code-card p { display:flex; flex-direction:column; gap:3px; margin:0; }
.pet-friends strong { font-size:11px; }.pet-friends small { color:#8d8073; font-size:9px; }
.hero-code-card { position:relative; display:flex; align-items:center; gap:10px; padding:7px 12px 7px 7px; border:2px solid var(--ink); border-radius:15px; background:rgba(255,255,255,.9); box-shadow:4px 5px 0 var(--ink); transform:rotate(-1deg); animation:codeFloat 4.2s .5s ease-in-out infinite; }
.hero-code-card:after { content:"扫码玩"; position:absolute; top:-11px; right:10px; padding:2px 6px; border:1.5px solid var(--ink); border-radius:7px; background:var(--coral); font-size:8px; font-weight:900; transform:rotate(4deg); }
.hero-code-frame { position:relative; flex:none; width:120px; height:120px; overflow:hidden; padding:3px; border:1px solid #ead9bd; border-radius:12px; background:white; }
.hero-code-frame>img { width:100%; height:100%; border-radius:6px; object-fit:cover; }
.hero-code-frame>img[data-mini-code] { position:relative; z-index:2; display:none; }
.hero-code-frame.has-code>img[data-mini-code] { display:block; }
.hero-code-frame.has-code .code-fallback { display:none; }
.hero-code-card strong { font-size:13px; }.hero-code-card p span { color:#8a7a67; font-size:9px; }
.scan-arrow { position:absolute; right:-16px; bottom:-12px; font-size:17px; transform:rotate(-10deg); }

.hero-stage { position:absolute; z-index:2; top:91px; right:-35px; width:535px; height:640px; }
.stage-blob { position:absolute; top:70px; left:42px; width:445px; height:445px; border-radius:42% 58% 60% 40% / 50% 38% 62% 50%; background:linear-gradient(145deg,#ffd84f,#ffc644); box-shadow:inset 0 0 0 22px rgba(255,255,255,.16); animation:blobMorph 9s ease-in-out infinite; }
.stage-blob:after { content:""; position:absolute; inset:35px; border:2px dashed rgba(48,35,25,.13); border-radius:inherit; }
.mascot-card { position:absolute; z-index:4; top:97px; left:105px; width:330px; height:392px; will-change:transform; animation:mascotFloat 4.8s ease-in-out infinite; }
.mascot-card>img { width:320px; height:320px; border:5px solid var(--ink); border-radius:50%; object-fit:cover; box-shadow:12px 15px 0 var(--ink),0 25px 50px rgba(93,61,8,.2); transform:rotate(2deg); }
.mascot-bubble { position:absolute; z-index:2; top:-21px; right:-23px; padding:12px 16px; border:2px solid var(--ink); border-radius:18px 18px 18px 4px; background:white; font-size:13px; font-weight:900; box-shadow:4px 4px 0 var(--ink); transform:rotate(3deg); animation:bubbleBounce 2.8s ease-in-out infinite; }
.mascot-label { position:absolute; left:94px; bottom:22px; padding:10px 18px; border:2px solid var(--ink); border-radius:20px; background:white; font-size:12px; font-weight:900; letter-spacing:1px; box-shadow:4px 5px 0 var(--ink); transform:rotate(-3deg); }
.mascot-label b { color:#f2766d; }
.brand-badge { position:absolute; z-index:5; top:105px; left:17px; display:grid; width:72px; height:72px; place-items:center; border:2px solid var(--ink); border-radius:50%; background:#fff4d4; text-align:center; font-size:8px; font-weight:800; line-height:1.3; box-shadow:4px 5px 0 var(--ink); transform:rotate(-12deg); }
.brand-badge b { font-size:13px; }
.float-card { position:absolute; z-index:6; display:flex; align-items:center; gap:9px; padding:10px 13px; border:2px solid var(--ink); border-radius:14px; background:white; box-shadow:4px 5px 0 var(--ink); will-change:transform; }
.float-card p { display:flex; flex-direction:column; gap:3px; margin:0; }.float-card strong { font-size:10px; }.float-card small { color:#8d8074; font-size:7px; }
.float-icon { display:grid; width:30px; height:30px; place-items:center; border-radius:9px; font-size:13px; font-weight:900; }
.mint { background:#d9f1d6; color:#3e994b; }.coral { background:#ffe0da; color:#ed766b; }.purple { background:#e7dff7; color:#775cba; }
.care-card { top:280px; left:0; animation:cardLeft 3.8s ease-in-out infinite; }
.diary-card { right:-5px; bottom:146px; animation:cardRight 4.2s .4s ease-in-out infinite; }
.hero-orbit { position:absolute; border:2px dashed rgba(77,49,7,.075); border-radius:50%; pointer-events:none; }
.orbit-one { right:9%; top:106px; width:535px; height:535px; animation:slowSpin 25s linear infinite; }
.orbit-two { right:17%; top:185px; width:360px; height:360px; animation:slowSpin 20s reverse linear infinite; }
.hero-sticker { position:absolute; z-index:5; pointer-events:none; }
.sticker-star { left:47%; top:145px; color:#ffad36; font-size:28px; animation:twinkle 2.5s infinite; }
.sticker-heart { left:4%; bottom:155px; color:#ff9b8e; font-size:24px; transform:rotate(-15deg); animation:bubbleBounce 3s .5s infinite; }
.hero-scroll { position:absolute; z-index:5; left:50%; bottom:18px; display:flex; align-items:center; gap:9px; color:#806e5e; font-size:9px; letter-spacing:2px; transform:translateX(-50%); }
.hero-scroll span { width:32px; height:1px; background:#9f8a74; }

.marquee { overflow:hidden; height:70px; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); background:var(--yellow); transform:rotate(-1deg) scale(1.02); }
.marquee-track { display:flex; align-items:center; width:max-content; height:100%; gap:38px; font-family:"YouYuan","Microsoft YaHei",sans-serif; font-size:22px; font-weight:900; animation:marquee 22s linear infinite; }
.marquee-track span { white-space:nowrap; }.marquee-track b { font-size:18px; }

.section { width:1180px; margin:auto; padding:115px 0; }
.features { position:relative; isolation:isolate; padding-top:100px; padding-bottom:105px; }
.features:before { content:""; position:absolute; z-index:-2; top:22px; bottom:22px; left:50%; width:100vw; background:radial-gradient(circle at 8% 20%,rgba(255,216,79,.16) 0 135px,transparent 136px),radial-gradient(circle at 92% 76%,rgba(185,221,246,.18) 0 170px,transparent 171px),linear-gradient(180deg,#fffdf8 0%,#fff8e9 48%,#fffdf8 100%); transform:translateX(-50%); }
.features:after { content:"🐾"; position:absolute; z-index:-1; right:-78px; top:118px; color:#8f765d; opacity:.035; filter:grayscale(1); font-size:230px; transform:rotate(18deg); pointer-events:none; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:46px; }
.section-heading h2,.community-copy h2,.manifesto-copy h2,.mini-program-copy h2 { margin:0; font-size:43px; line-height:1.25; letter-spacing:-2px; }
.section-heading>p { margin:0 20px 4px 0; color:#776b60; font-size:14px; line-height:1.9; }
.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 15px; color:#93721b; font-size:10px; font-weight:900; letter-spacing:2px; }
.eyebrow span { width:31px; height:3px; border-radius:4px; background:var(--yellow); }
.bento-grid { display:grid; grid-template-columns:1.35fr .65fr; grid-template-rows:340px 300px; gap:18px; }
.bento-card { position:relative; overflow:hidden; padding:31px; border:2px solid var(--ink); border-radius:26px; box-shadow:6px 7px 0 var(--ink); transition:.28s; }
.bento-card:hover { transform:translateY(-6px) rotate(-.4deg); box-shadow:9px 12px 0 var(--ink); }
.bento-card.diary { background:#fff0b5; }.bento-card.care { background:#dff1d9; }.bento-card.community { background:#dceef9; }.bento-card.ai { background:#f1e9ff; }
.card-number { position:absolute; top:23px; right:27px; font-size:12px; font-weight:900; opacity:.4; }
.bento-copy { position:relative; z-index:3; width:47%; }
.category { font-size:8px; font-weight:900; letter-spacing:1.6px; opacity:.58; }
.bento-copy h3 { margin:10px 0 10px; font-size:27px; }
.bento-copy p { margin:0; color:#675d54; font-size:12px; line-height:1.75; }
.diary-ui { position:absolute; right:29px; bottom:-18px; width:300px; padding:11px; border:2px solid var(--ink); border-radius:24px 24px 0 0; background:white; box-shadow:7px 8px 0 var(--ink); transform:rotate(3deg); }
.diary-photo { position:relative; height:205px; overflow:hidden; border-radius:16px; background:linear-gradient(145deg,#cbe9c5,#ffe0b7); }
.diary-photo>img { width:100%; height:100%; object-fit:cover; object-position:center 38%; transition:transform .5s ease; }
.bento-card.diary:hover .diary-photo>img { transform:scale(1.04); }
.diary-photo span { position:absolute; left:12px; top:12px; padding:6px 9px; border-radius:12px; background:white; font-size:9px; font-weight:800; }
.diary-info { display:flex; align-items:center; gap:8px; padding:12px 5px 5px; font-size:9px; }.diary-info span { color:#8d8075; }.diary-info i { margin-left:auto; color:#ee746c; font-style:normal; }
.care .bento-copy,.ai .bento-copy { width:100%; }
.care-ring { position:absolute; right:24px; bottom:58px; display:flex; width:135px; height:135px; flex-direction:column; align-items:center; justify-content:center; border:15px solid rgba(255,255,255,.72); border-top-color:#70ba76; border-radius:50%; transform:rotate(18deg); }
.care-ring span,.care-ring small { transform:rotate(-18deg); }.care-ring b { font-size:27px; }.care-ring small { margin-top:4px; font-size:7px; }
.care-tags { position:absolute; left:31px; bottom:24px; display:flex; gap:7px; }.care-tags span { padding:6px 8px; border-radius:10px; background:rgba(255,255,255,.7); font-size:8px; }
.community-faces { position:absolute; right:31px; bottom:63px; display:flex; }.community-faces span,.community-faces i { display:grid; width:61px; height:61px; place-items:center; margin-left:-10px; border:3px solid white; border-radius:50%; background:#fff0b7; font-size:27px; font-style:normal; }.community-faces span:nth-child(2) { background:#f8deda; }.community-faces span:nth-child(3) { background:#e3dafa; }.community-faces span:nth-child(4) { background:#dcefd9; }.community-faces i { background:var(--ink); color:white; font-size:13px; font-weight:900; }
.location-pill { position:absolute; right:37px; bottom:21px; padding:8px 13px; border:1.5px solid var(--ink); border-radius:15px; background:white; font-size:9px; font-weight:800; transform:rotate(-2deg); }
.chat-ui { position:absolute; left:31px; right:31px; bottom:25px; display:flex; flex-direction:column; gap:8px; }
.chat-line { padding:9px 11px; border-radius:13px; font-size:9px; }.chat-line.question { align-self:flex-end; background:white; }.chat-line.answer { display:flex; align-items:center; gap:8px; background:rgba(255,255,255,.62); }.chat-line img { width:27px; height:27px; border-radius:8px; }

.community-section { overflow:hidden; padding:115px 0; background:#fff4d4; }
.community-shell { width:1180px; margin:auto; display:flex; align-items:center; gap:105px; }
.community-visual { position:relative; flex:none; width:550px; height:550px; }
.community-blob { position:absolute; left:40px; top:55px; width:450px; height:430px; border-radius:50% 40% 54% 46%; background:var(--yellow); transform:rotate(-7deg); }
.community-blob:after { content:""; position:absolute; inset:20px; border:2px dashed rgba(48,35,25,.14); border-radius:inherit; }
.moment-card { position:absolute; z-index:3; padding:11px; border:2px solid var(--ink); border-radius:21px; background:white; box-shadow:7px 9px 0 var(--ink); }
.moment-main { left:68px; top:39px; width:295px; transform:rotate(-5deg); animation:photoFloat 5s ease-in-out infinite; }
.moment-small { right:8px; bottom:27px; width:202px; transform:rotate(7deg); animation:photoFloatSmall 5s .6s ease-in-out infinite; }
.moment-photo { position:relative; height:280px; overflow:hidden; border-radius:14px; }.moment-photo.dog { background:linear-gradient(145deg,#cbeac8,#ffe2b2); }.moment-photo.cat { height:165px; background:linear-gradient(145deg,#d5e8fa,#f5d7d2); }
.moment-photo>img { width:100%; height:100%; object-fit:cover; transition:transform .55s ease; }
.moment-photo.dog>img { object-position:center 44%; }
.moment-photo.cat>img { object-position:center 38%; }
.moment-card:hover .moment-photo>img { transform:scale(1.035); }
.moment-photo span { position:absolute; right:9px; top:13px; color:white; font-family:"Comic Sans MS",sans-serif; font-size:11px; font-weight:900; transform:rotate(8deg); }
.moment-card p { display:flex; flex-direction:column; gap:5px; margin:11px 4px 5px; }.moment-card strong { font-size:11px; }.moment-card small { color:#94877b; font-size:8px; }
.moment-actions { position:absolute; right:15px; bottom:15px; display:flex; gap:8px; color:#d4766d; font-size:8px; }
.map-tag { position:absolute; z-index:5; left:0; bottom:90px; padding:11px 15px; border:2px solid var(--ink); border-radius:20px; background:var(--ink); color:white; font-size:10px; box-shadow:4px 5px 0 var(--coral); animation:bubbleBounce 3s infinite; }
.visual-doodle { position:absolute; right:6px; top:67px; color:#967217; font-family:"Comic Sans MS",sans-serif; font-size:11px; font-weight:900; line-height:1.2; transform:rotate(10deg); }
.community-copy { width:485px; }
.community-copy h2 { font-size:45px; }
.community-intro { margin:22px 0 30px; color:#73685e; font-size:14px; line-height:1.9; }
.life-list { border-top:1px solid #ddcc9d; }
.life-list>div { display:flex; align-items:center; gap:17px; padding:17px 4px; border-bottom:1px solid #ddcc9d; transition:.2s; }
.life-list>div:hover { padding-left:10px; }
.life-list b { color:#ac871e; font-size:10px; }
.life-list p { display:flex; flex:1; flex-direction:column; gap:4px; margin:0; }.life-list strong { font-size:13px; }.life-list span { color:#8a7d70; font-size:9px; }.life-list i { font-style:normal; }

.manifesto { padding:110px 0; }
.manifesto-card { position:relative; min-height:390px; overflow:hidden; display:flex; align-items:center; gap:48px; padding:50px 58px; border:2px solid var(--ink); border-radius:32px; background:var(--yellow); box-shadow:8px 10px 0 var(--ink); }
.manifesto-card:before { content:""; position:absolute; right:-170px; bottom:-190px; width:480px; height:480px; border:70px solid rgba(255,255,255,.25); border-radius:50%; }
.manifesto-logo { position:relative; flex:none; width:250px; height:250px; padding:10px; border:3px solid var(--ink); border-radius:50%; background:white; box-shadow:8px 10px 0 var(--ink); transform:rotate(-3deg); }
.manifesto-logo img { width:100%; height:100%; border-radius:50%; object-fit:cover; }
.manifesto-copy { position:relative; width:435px; }
.manifesto-copy h2 { font-size:38px; }.manifesto-copy>p:last-child { margin:17px 0 0; color:#6c571d; font-size:12px; line-height:1.85; }
.manifesto-copy .eyebrow { color:#6e5310; }.manifesto-copy .eyebrow span { background:white; }
.manifesto-quote { position:relative; width:270px; font-family:"YouYuan","Microsoft YaHei",sans-serif; text-align:center; transform:rotate(3deg); }
.manifesto-quote span,.manifesto-quote i { position:absolute; color:rgba(255,255,255,.75); font-family:Georgia,serif; font-size:80px; font-style:normal; }.manifesto-quote span { left:-6px; top:-50px; }.manifesto-quote i { right:-4px; bottom:-78px; }
.manifesto-quote strong { font-size:21px; line-height:1.7; }.manifesto-quote em { color:#ef744f; font-style:normal; font-size:28px; text-shadow:2px 2px 0 white; }
.manifesto-star { position:absolute; color:white; font-size:25px; animation:twinkle 2.5s infinite; }.manifesto-star.one { left:31px; top:34px; }.manifesto-star.two { right:33px; top:35px; animation-delay:.8s; }

.mini-program { position:relative; overflow:hidden; background:#c9b8ed; }
.mini-program:before,.mini-program:after { content:""; position:absolute; border:35px solid rgba(255,255,255,.2); border-radius:50%; }.mini-program:before { left:-80px; top:-100px; width:200px; height:200px; }.mini-program:after { right:-70px; bottom:-130px; width:240px; height:240px; }
.mini-program-shell { position:relative; z-index:2; width:1180px; min-height:440px; margin:auto; display:flex; align-items:center; justify-content:center; gap:160px; }
.mini-program-copy { position:relative; width:535px; }
.mini-program-copy h2 { margin:19px 0 14px; font-size:42px; text-shadow:3px 3px 0 rgba(255,255,255,.6); }
.mini-program-copy>p { margin:0; color:#57476f; font-size:14px; }
.mini-label { display:inline-block; padding:7px 11px; border:2px solid var(--ink); border-radius:18px; background:#fff; font-size:9px; font-weight:900; letter-spacing:1.4px; transform:rotate(-2deg); }
.mini-pets { position:absolute; right:-25px; top:11px; display:flex; flex-direction:column; gap:5px; }.mini-pets span { display:grid; width:43px; height:43px; place-items:center; border:2px solid var(--ink); border-radius:50%; background:white; font-size:20px; box-shadow:3px 4px 0 var(--ink); animation:bubbleBounce 3s infinite; }.mini-pets span:nth-child(2) { margin-left:35px; animation-delay:.4s; }.mini-pets span:nth-child(3) { animation-delay:.8s; }
.code-card { position:relative; width:260px; padding:17px 17px 20px; border:3px solid var(--ink); border-radius:25px; background:white; text-align:center; box-shadow:9px 10px 0 var(--ink); transform:rotate(2deg); animation:photoFloatSmall 5s ease-in-out infinite; }
.code-card>.tape { position:absolute; z-index:4; top:-15px; left:87px; width:82px; height:28px; background:rgba(255,216,79,.8); transform:rotate(-4deg); }
.code-card>strong { display:block; margin-top:12px; font-size:13px; }
.code-frame { position:relative; width:220px; height:220px; overflow:hidden; border:2px dashed #a68acc; border-radius:18px; background:#faf7ff; }
.code-frame>img { display:none; width:100%; height:100%; object-fit:cover; }.code-frame.has-code>img { display:block; }.code-frame.has-code .code-placeholder { display:none; }
.code-placeholder { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; color:#826ba1; }
.code-placeholder img { width:75px; height:75px; border:3px solid white; border-radius:50%; box-shadow:0 5px 15px rgba(60,36,91,.15); }.code-placeholder strong { color:var(--ink); }.code-placeholder small { font-size:9px; }

footer { background:#2d241d; color:#f9f2e8; }
.footer-main { width:1180px; min-height:178px; margin:auto; display:flex; align-items:center; }
.footer-brand { width:245px; }.footer-brand img { border-color:white; }
.footer-main>p { padding-left:36px; border-left:1px solid #5a4d40; color:#bfb2a4; font-size:12px; line-height:1.8; }
.footer-links { display:flex; gap:38px; margin-left:auto; color:#d9cec2; font-size:12px; }.footer-links a:hover { color:var(--yellow); }
.footer-bottom { width:1180px; height:62px; margin:auto; display:flex; align-items:center; border-top:1px solid #4a3e33; color:#988a7d; font-size:11px; }
.filing { display:flex; align-items:center; gap:12px; margin-left:auto; }.filing i { width:1px; height:11px; background:#5a4d40; }.filing a:hover { color:#d8cabc; }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s,transform .7s; }.reveal.visible { opacity:1; transform:none; }
@keyframes blobMorph { 0%,100% { border-radius:42% 58% 60% 40% / 50% 38% 62% 50%; transform:rotate(0); } 50% { border-radius:56% 44% 40% 60% / 42% 56% 44% 58%; transform:rotate(4deg); } }
@keyframes mascotFloat { 0%,100% { transform:translateY(0) rotate(0); } 50% { transform:translateY(-11px) rotate(1deg); } }
@keyframes bubbleBounce { 0%,100% { transform:translateY(0) rotate(3deg); } 50% { transform:translateY(-7px) rotate(0); } }
@keyframes cardLeft { 0%,100% { transform:translateY(0) rotate(-4deg); } 50% { transform:translateY(-9px) rotate(-1deg); } }
@keyframes cardRight { 0%,100% { transform:translateY(0) rotate(4deg); } 50% { transform:translateY(-8px) rotate(7deg); } }
@keyframes codeFloat { 0%,100% { transform:rotate(-1deg) translateY(0); } 50% { transform:rotate(1deg) translateY(-4px); } }
@keyframes photoFloat { 0%,100% { transform:rotate(-5deg) translateY(0); } 50% { transform:rotate(-3deg) translateY(-7px); } }
@keyframes photoFloatSmall { 0%,100% { transform:rotate(7deg) translateY(0); } 50% { transform:rotate(5deg) translateY(-8px); } }
@keyframes twinkle { 0%,100% { transform:scale(.8) rotate(-10deg); opacity:.5; } 50% { transform:scale(1.25) rotate(14deg); opacity:1; } }
@keyframes slowSpin { to { transform:rotate(360deg); } }
@keyframes marquee { to { transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.reveal { opacity:1; transform:none; transition:none; } *,*:before,*:after { animation:none!important; } }