@font-face{font-family:Fredoka;src:url(fonts/Fredoka.ttf);font-weight:300 700;font-display:swap}
@font-face{font-family:Titan;src:url(fonts/TitanOne-Regular.ttf);font-display:swap}
:root{--ink:#2b1d2e;--navy:#2b2d6e;--coral:#e04f6a;--cream:#fff6e8;--sun:#ffc94a;--mint:#6fe0c0;--pink:#ff8fb8;--sky:#62a8e8}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Fredoka,system-ui,sans-serif;color:var(--ink);background:var(--cream);line-height:1.55;font-size:18px}
a{color:inherit}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
header{position:sticky;top:0;background:rgba(255,246,232,.92);backdrop-filter:blur(8px);z-index:5;border-bottom:1px solid #f1e2cc}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
header .brand{display:flex;align-items:center;gap:10px;text-decoration:none}header .brand img{width:44px;height:44px;border-radius:50%}header .brand span{font-family:Titan;font-size:26px;color:var(--navy)}
nav a{margin-left:18px;text-decoration:none;font-weight:600;font-size:16px}
nav .lang{padding:4px 12px;border:2px solid var(--ink);border-radius:20px}
.hero{background:radial-gradient(circle at 70% 50%,#ffe7a8,#ffc2a8 70%);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:20px;padding:56px 22px}
.hero h1{font-family:Titan;font-weight:400;font-size:clamp(44px,7vw,84px);line-height:1;margin:0 0 14px;color:var(--navy)}
.hero h1 small{display:block;font-size:.55em;color:var(--coral)}
.hero p{font-size:21px;margin:0 0 22px}
.hero .fact{font-size:16px;background:#fff;display:inline-block;padding:6px 14px;border-radius:14px;margin-bottom:24px}
.hero img{width:100%;max-width:420px;justify-self:center;border-radius:50%;border:8px solid #fff;filter:drop-shadow(0 18px 30px rgba(120,40,40,.25))}
.btn{display:inline-block;padding:13px 22px;border-radius:30px;font-weight:700;text-decoration:none;margin:0 10px 10px 0;border:3px solid var(--ink)}
.btn.primary{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn.light{background:#fff}
section{padding:64px 0}
h2{font-family:Titan;font-weight:400;font-size:clamp(30px,4.4vw,44px);color:var(--navy);margin:0 0 18px}
.lead{font-size:20px;max-width:720px}
.ep{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center;background:#fff;border-radius:28px;padding:22px;box-shadow:0 10px 30px rgba(80,40,20,.08)}
.ep img{width:100%;border-radius:18px;display:block}
.tag{display:inline-block;background:var(--sun);border-radius:12px;padding:2px 10px;font-weight:700;font-size:14px}
.chars{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px}
.char{background:#fff;border-radius:24px;padding:18px;text-align:center;box-shadow:0 10px 30px rgba(80,40,20,.07)}
.char img{width:130px;height:130px;border-radius:50%}
.char h3{margin:10px 0 4px;font-size:22px}
.char p{margin:0;font-size:15px;color:#5b4a58}
.tips{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;counter-reset:t}
.tip{background:#fff;border-radius:22px;padding:20px;box-shadow:0 10px 30px rgba(80,40,20,.07)}
.tip h3{margin:0 0 6px;color:var(--coral)}
.book{background:var(--navy);color:#fff;border-radius:32px;padding:34px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.book h2{color:#fff}
.book .btn{background:var(--sun);border-color:var(--sun);color:var(--ink)}
.follow a{display:inline-block;margin:0 12px 12px 0;padding:10px 18px;background:#fff;border-radius:22px;text-decoration:none;font-weight:600;box-shadow:0 6px 18px rgba(80,40,20,.08)}
footer{padding:40px 0;font-size:14px;color:#6b5a66;border-top:1px solid #f1e2cc}
@media(max-width:760px){.chars{grid-template-columns:1fr 1fr}.char img{width:100px;height:100px}.hero .wrap,.ep,.book{grid-template-columns:1fr}.hero img{max-width:280px;order:-1}nav a:not(.lang){display:none}section{padding:44px 0}}