/* welcome.html page layout. Shared values live in tokens.css. */
*{box-sizing:border-box}body{margin:0;background:var(--color-palette-faf7fc);color:var(--color-palette-352b45);font-family:var(--font-system)}main{max-width:1080px;margin:auto;padding:48px 24px}header{font-size:var(--text-14);color:var(--color-palette-81758d);margin-bottom:48px}.hero{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:44px}h1{font-size:clamp(var(--text-30),4vw,var(--text-48));line-height:1.12;letter-spacing:-1.5px;margin:12px 0 22px}p{font-size:var(--text-16);line-height:1.75;color:var(--color-palette-796e83)}.tag{font-size:var(--text-12);letter-spacing:2px;text-transform:uppercase;color:var(--color-palette-9771ad)}.illustration{width:100%;border-radius:28px;box-shadow:0 20px 60px var(--color-palette-45325818)}.sections{margin-top:48px}.sections h2{font-size:var(--text-20)}.card{display:flex;gap:20px;align-items:center;background:var(--color-surface);border:1px solid var(--color-palette-ece5ef);border-radius:22px;padding:22px;color:inherit;text-decoration:none;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-3px);box-shadow:0 14px 35px var(--color-palette-45325810)}.card img{width:82px;height:82px;object-fit:contain}.card h3{margin:0 0 6px;font-size:var(--text-20)}.card p{margin:0;font-size:var(--text-14)}.arrow{margin-left:auto;font-size:var(--text-26);color:var(--color-palette-9973ae)}.enter{display:inline-block;margin-top:18px;color:var(--color-palette-71508c);text-decoration:none;border-bottom:1px solid var(--color-palette-ceb9de);padding-bottom:5px}footer{margin-top:40px;font-size:var(--text-12);color:var(--color-palette-a295ad)}@media(max-width:700px){main{padding:28px 20px}header{margin-bottom:30px}.hero{grid-template-columns:1fr;gap:24px}.sections{margin-top:30px}.card{padding:16px;gap:12px}.card img{width:64px;height:64px}}@media(prefers-reduced-motion:reduce){.card{transition:none}}header{display:flex;align-items:center;gap:14px}.home-logo{width:64px;height:64px;object-fit:cover;border-radius:16px}.subtitle{margin-top:-12px;font-size:var(--text-20)}
header{position:sticky;top:0;z-index:100;background:var(--color-page)}.music-controls{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;margin:-24px 0 28px;font-size:var(--text-12);color:var(--color-palette-796e83)}.music-controls button{font:inherit;padding:8px 12px;border:1px solid var(--color-palette-ece5ef);border-radius:var(--radius-control);background:var(--color-palette-f1eaf5);color:var(--color-palette-71508c);cursor:pointer}.music-controls label{display:flex;align-items:center;gap:8px}.music-controls input{width:90px;accent-color:var(--color-palette-9771ad)}.music-controls span{font-size:var(--text-11)}@media(max-width:700px){.music-controls{margin:-8px 0 24px}}main{padding-top:44px}header{margin-bottom:44px}h1{margin-top:10px;margin-bottom:19px}.sections{margin-top:44px}@media(max-width:700px){main{padding-top:26px}header{margin-bottom:27px}.sections{margin-top:28px}}