:root{
  --paper:#F7F6F3; --white:#FFFFFF; --stone:#ECEBE6; --line:#DCDBD4;
  --ink:#1B2622; --ink2:#56625C; --pine:#1F5444; --pine-deep:#123A2F; --mist:#DFEBE5; --apricot:#F4B183;
  color-scheme: light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif}
a{color:var(--pine)}
:focus-visible{outline:2px solid var(--pine);outline-offset:2px}
.wrap{max-width:960px;margin:0 auto;padding-inline:max(20px,env(safe-area-inset-left,0px)) max(20px,env(safe-area-inset-right,0px))}
header.nav{padding-block:20px}
header.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:700;font-size:20px}
.brand img{width:36px;height:36px;border-radius:9px}
nav.links{display:flex;gap:18px;font-size:15px}
nav.links a{text-decoration:none;color:var(--ink2)}
nav.links a:hover{color:var(--pine)}
h1,h2,h3{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;letter-spacing:-.02em;text-wrap:balance;margin:0}
.hero{padding-block:40px 64px;display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(40px,6vw,64px);line-height:1.02;font-weight:800}
.hero p{font-size:20px;color:var(--ink2);margin:18px 0 26px;max-width:32ch}
.badge{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--paper);border-radius:12px;padding:12px 20px;font-weight:600;text-decoration:none}
.badge small{display:block;font-weight:500;font-size:12px;opacity:.75}
.film{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;background:#0D1512;padding:14px 10px;border-radius:18px;position:relative}
.film::before,.film::after{content:"";position:absolute;left:10px;right:10px;height:6px;background:repeating-linear-gradient(90deg,var(--paper) 0 10px,transparent 10px 22px);opacity:.85}
.film::before{top:4px}.film::after{bottom:4px}
.film figure{margin:6px 0;display:grid;gap:6px}
.film img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:6px;display:block}
.film figcaption{color:#B9CEC5;font-size:12px;text-align:center;font-variant-numeric:tabular-nums}
.band{background:var(--pine-deep);color:#EAF2EE;padding-block:64px}
.band h2{color:#fff;font-size:clamp(28px,4vw,38px)}
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px;margin-top:32px}
.feats h3{font-size:19px;color:#fff;margin-bottom:6px}
.feats p{margin:0;color:#B9CEC5;font-size:16px}
.private{padding-block:64px;display:grid;gap:12px;max-width:640px}
.private h2{font-size:clamp(26px,3.5vw,34px)}
.private p{margin:0;color:var(--ink2)}
footer{border-top:1px solid var(--line);padding-block:28px;color:var(--ink2);font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between}
footer a{color:var(--ink2)}
.doc{padding-block:32px 72px;max-width:720px}
.doc h1{font-size:clamp(32px,5vw,44px);margin-bottom:6px}
.doc .date{color:var(--ink2);margin:0 0 28px}
.doc h2{font-size:22px;margin:32px 0 8px}
.doc p,.doc li{color:var(--ink)}
.doc .lead{font-size:19px;background:var(--mist);border-radius:14px;padding:16px 20px}
.mail{font-weight:600;user-select:all}
details{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin-bottom:10px}
summary{font-weight:600;cursor:pointer}
details p{margin:10px 0 0;color:var(--ink2)}
@media (max-width:720px){.hero{grid-template-columns:1fr;gap:32px;padding-block:16px 48px}nav.links{gap:12px}}