@font-face{font-family:'Caveat';font-weight:700;font-style:normal;font-display:swap;src:url(caveat-cyr.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Caveat';font-weight:700;font-style:normal;font-display:swap;src:url(caveat-lat.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:'Neucha';font-weight:400;font-style:normal;font-display:swap;src:url(neucha-cyr.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Neucha';font-weight:400;font-style:normal;font-display:swap;src:url(neucha-lat.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122}
:root{--bg:#F0E5D0;--surface:#F9F2E4;--ink:#2E2B28;--muted:#5E5140;--line:#D0BF9F;--accent:#3F5F85;--btn:#6B4A35;--btn-hover:#3F6A9A;--solid:#E8DAC0}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
body{font-family:'Neucha','Segoe Print','Comic Sans MS',cursive;font-size:18px;line-height:1.6;color:var(--ink);background:var(--bg) url(pattern.svg);background-size:480px 480px;overflow-x:clip}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
header{position:relative;background:var(--solid)}
header .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:22px;padding-bottom:22px}
header::after{content:"";position:absolute;left:0;right:0;bottom:16px;height:6px;pointer-events:none;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='6'><rect x='0.5' y='2.4' width='8' height='2.2' rx='1.1' fill='%23000' fill-opacity='.18'/><rect x='0' y='1.6' width='8' height='2.2' rx='1.1' fill='%237A5238'/><rect x='0.8' y='1.8' width='6.4' height='0.7' rx='.35' fill='%23fff' fill-opacity='.35'/></svg>") repeat-x 0 0}
.logo{font-family:'Caveat','Segoe Print','Comic Sans MS',cursive;font-weight:700;font-size:38px;line-height:1.15;color:var(--ink);text-decoration:none;display:block}
.logo small{display:block;font-family:'Neucha','Segoe Print',cursive;font-weight:400;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:2px;line-height:1.3}
nav a{color:var(--muted);text-decoration:none;font-size:14px;margin-left:26px}
nav a:hover,nav a.cur{color:var(--ink)}
main{padding:44px 0 20px}
h1,h2{font-family:'Caveat','Segoe Print','Comic Sans MS',cursive;font-weight:700;letter-spacing:0;text-align:center}
h1{font-size:clamp(40px,6vw,64px);line-height:1.1}
h2{font-size:clamp(34px,4.8vw,50px);line-height:1.15}
.lead{text-align:center;color:var(--muted);max-width:560px;margin:10px auto 0}
.jump{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:26px 0 8px}
.btn{display:inline-block;background:var(--btn);color:#fff;text-decoration:none;font-size:16px;padding:12px 26px;border-radius:2px;outline:1px dashed rgba(255,255,255,.55);outline-offset:-5px;transition:background .2s}
.btn:hover{background:var(--btn-hover)}
.album{padding:48px 0 8px;scroll-margin-top:12px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:26px}
.tile{position:relative;aspect-ratio:1/1;background:var(--surface);overflow:hidden;box-shadow:0 0 0 4px var(--surface),0 4px 12px rgba(60,40,20,.15)}
.tile img{width:100%;height:100%;object-fit:cover;display:block}
.tile .n{position:absolute;top:8px;left:8px;min-width:32px;height:32px;padding:0 6px;background:#fff;color:var(--ink);font-family:'Neucha',sans-serif;font-size:18px;line-height:32px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.soon{text-align:center;color:var(--muted);margin-top:20px}
.back{text-align:center;margin:46px 0 10px}
footer{margin-top:40px;padding:28px 0;text-align:center;color:var(--muted);font-size:14px;border-top:1px solid var(--line)}
@media(max-width:900px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){header .wrap{flex-wrap:wrap;gap:10px 16px}nav a{margin-left:0;margin-right:16px}}
@media(max-width:560px){.grid{grid-template-columns:repeat(2,1fr);gap:10px}.logo{font-size:30px}.wrap{padding:0 16px}}

/* меню в шапке крупнее */
header nav a{font-size:19px}
@media(max-width:760px){header nav a{font-size:17px}}

@media(max-width:760px){header .wrap{flex-direction:column;align-items:flex-start;gap:10px}header nav{display:flex;flex-wrap:nowrap;gap:0 16px;white-space:nowrap}header nav a{margin:0;white-space:nowrap;font-size:16px}}