:root{--ink:#2a2140;--ink2:#3b2a55;--cream:#fff6e8;--gold:#ffb21f;--coral:#f26d5b;--teal:#3aa7b8;--mint:#8fe3c0;--paper:#fffdf8;--muted:#6b6180}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:'Fredoka',system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.55}
a{color:var(--teal)}img{max-width:100%;display:block}
.wrap{width:min(1120px,calc(100% - 32px));margin:0 auto}
header.top{position:sticky;top:0;z-index:20;background:rgba(42,33,64,.96);backdrop-filter:blur(8px);color:#fff}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px}
header.top .brand img{height:48px;width:auto}
nav.menu{display:flex;gap:6px;flex-wrap:wrap}
nav.menu a{color:#fff;text-decoration:none;font-weight:600;padding:8px 14px;border-radius:999px;transition:.2s}
nav.menu a:hover,nav.menu a.on{background:rgba(255,255,255,.14)}
.hero{background:radial-gradient(1200px 600px at 50% -10%,#4b3a73 0%,var(--ink) 60%,#1d1730 100%);color:#fff;text-align:center;padding:64px 0 72px;position:relative;overflow:hidden}
.hero img.logo{width:min(560px,86%);margin:0 auto 18px;filter:drop-shadow(0 14px 24px rgba(0,0,0,.35))}
.hero h1{font-size:clamp(1.4rem,3vw,2.1rem);font-weight:600;margin:0 0 10px;color:var(--cream)}
.hero p{max-width:640px;margin:0 auto 26px;color:#d9d2ea;font-size:1.1rem}
.btn{display:inline-block;background:var(--gold);color:var(--ink);text-decoration:none;font-weight:700;padding:14px 28px;border-radius:999px;box-shadow:0 6px 0 #c98400;transition:.15s}
.btn:hover{transform:translateY(-2px)}.btn.alt{background:#fff;box-shadow:0 6px 0 #cfc6e0}
.btn.sm{padding:10px 20px;font-size:.95rem;box-shadow:0 4px 0 #c98400}
.dots{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#ffffff22 2px,transparent 2px);background-size:34px 34px;opacity:.5}
section{padding:64px 0}section h2{font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 8px;text-align:center}
section p.lead{text-align:center;color:var(--muted);max-width:640px;margin:0 auto 36px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.card{background:#fff;border-radius:26px;padding:22px;box-shadow:0 10px 30px rgba(42,33,64,.10);border:3px solid transparent;transition:.2s;display:flex;flex-direction:column;gap:12px}
.card:hover{transform:translateY(-4px);border-color:var(--c)}
.card .head{display:flex;gap:16px;align-items:center}
.card .head img{width:92px;height:92px;border-radius:22px;box-shadow:0 6px 16px rgba(0,0,0,.18)}
.card h3{margin:0;font-size:1.3rem}.card .tag{display:inline-block;font-size:.8rem;font-weight:700;color:var(--ink);background:var(--c);padding:3px 10px;border-radius:999px;margin-top:4px}
.card p{margin:0;color:var(--muted);flex:1}
.card .shot{border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:#eee}
.card .shot img{width:100%;height:100%;object-fit:cover}
.card .acts{display:flex;gap:10px;flex-wrap:wrap}
.about{background:var(--cream)}
.about .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;margin-top:10px}
.about .box{background:#fff;border-radius:22px;padding:22px;box-shadow:0 8px 20px rgba(42,33,64,.08)}
.about .box b{display:block;font-size:1.15rem;margin-bottom:6px}.about .box span.ic{font-size:1.8rem;display:block;margin-bottom:8px}
.contact{text-align:center}.contact a.mail{font-size:1.4rem;font-weight:700;text-decoration:none;color:var(--coral)}
footer{background:var(--ink);color:#cfc6e0;padding:34px 0;font-size:.95rem}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
footer a{color:#fff;text-decoration:none;margin-right:18px}footer a:hover{text-decoration:underline}
.page{padding:48px 0 72px}.page h1{font-size:clamp(1.8rem,3.5vw,2.6rem);margin:0 0 6px}.page .date{color:var(--muted);margin-bottom:28px}
.page h2{font-size:1.35rem;margin:32px 0 8px}.page p,.page li{color:#3d3552;font-size:1.05rem}.page ul{padding-left:22px}
.doc{background:#fff;border-radius:26px;padding:clamp(22px,4vw,48px);box-shadow:0 10px 30px rgba(42,33,64,.08)}
.ghead{background:linear-gradient(135deg,var(--ink) 0%,var(--ink2) 100%);color:#fff;padding:56px 0 48px}
.ghead .wrap{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center}
.ghead img.icon{width:170px;height:170px;border-radius:38px;box-shadow:0 14px 30px rgba(0,0,0,.4)}
.ghead img.tlogo{max-height:150px;width:auto;margin-bottom:12px}
.ghead p{font-size:1.15rem;color:#e6e0f3;margin:0 0 20px;max-width:620px}
.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.shots img{border-radius:18px;box-shadow:0 10px 24px rgba(42,33,64,.15);width:100%;aspect-ratio:16/9;object-fit:cover}
.feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;list-style:none;padding:0;margin:0}
.feat li{background:#fff;border-radius:18px;padding:14px 16px 14px 48px;position:relative;box-shadow:0 6px 18px rgba(42,33,64,.08)}
.feat li:before{content:"★";position:absolute;left:16px;top:12px;color:var(--gold);font-size:1.3rem}
.desc p{font-size:1.08rem;max-width:860px;margin:0 auto 14px}
.more{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.more a{display:flex;align-items:center;gap:10px;background:#fff;border-radius:999px;padding:8px 16px 8px 8px;text-decoration:none;color:var(--ink);font-weight:600;box-shadow:0 6px 16px rgba(42,33,64,.1)}
.more a img{width:40px;height:40px;border-radius:12px}
@media (max-width:640px){header.top .wrap{height:auto;padding:10px 0;flex-direction:column}.ghead .wrap{grid-template-columns:1fr;text-align:center}.ghead img.icon{margin:0 auto}.ghead img.tlogo{margin:0 auto 12px}.hero{padding:44px 0 52px}}
