*{margin:0;padding:0;box-sizing:border-box}
:root{--ent:cubic-bezier(0.16,1,0.3,1);--ovl:cubic-bezier(0.76,0,0.24,1)}
html,body{overflow-x:hidden;background:#000}
body{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:#fff;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.font-instrument{font-family:'Instrument Serif',serif;font-weight:400}

#header{position:fixed;top:0;left:0;width:100%;z-index:50;background:transparent;transition:all .5s}
#header.scrolled{background:rgba(0,0,0,.8);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.bar{max-width:1440px;margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:12px;font-size:1.25rem;font-weight:600;letter-spacing:-.025em;z-index:50}
.logo img{width:32px;height:32px;border-radius:50%}
.pill{display:none;align-items:center;gap:8px;padding:8px 20px;border-radius:9999px;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.9);font-size:.875rem;transition:background .15s}
.pill:hover{background:rgba(255,255,255,.1)}
.right{display:none;align-items:center;gap:16px}
.flower{width:28px;height:28px;color:rgba(255,255,255,.9)}
.burger{width:32px;height:32px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;z-index:50}
.burger span{display:block;width:24px;height:2px;background:#fff;transition:transform .5s var(--ovl)}
.burger.open span:first-child{transform:rotate(45deg) translateY(4px)}
.burger.open span:last-child{transform:rotate(-45deg) translateY(-4px)}

.langs{display:flex;align-items:center;gap:4px;font-size:.875rem}
.langs button{padding:4px 8px;border-radius:9999px;color:rgba(255,255,255,.6);transition:all .15s}
.langs button:hover{color:#fff}
.langs button.on{color:#fff;background:rgba(255,255,255,.15)}

.reveal-nav{opacity:0;transform:translateY(-16px);transition:opacity .7s var(--ent),transform .7s var(--ent);transition-delay:0ms}
.mounted .reveal-nav{opacity:1;transform:none;transition-delay:var(--d)}
.reveal-hero{opacity:0;transform:translateY(32px);transition:opacity .9s var(--ent),transform .9s var(--ent);transition-delay:0ms}
.hero-on .reveal-hero{opacity:1;transform:none;transition-delay:var(--d)}
.mounted .burger.reveal-nav,.mounted .logo.reveal-nav{transition-property:opacity,transform}

#overlay{position:fixed;inset:0;z-index:40;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .7s var(--ovl),visibility .7s var(--ovl)}
#overlay.open{opacity:1;visibility:visible}
#overlay nav{display:flex;flex-direction:column;align-items:center;gap:32px}
.olink{font-family:'Instrument Serif',serif;font-size:2.25rem;line-height:1.1;opacity:0;transform:translateY(24px);transition:opacity .6s var(--ovl),transform .6s var(--ovl),color .15s;transition-delay:0ms}
.olink:hover{opacity:.6!important}
#overlay.open .olink{opacity:1;transform:none}
.contacts{margin-top:48px;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:.875rem;color:rgba(240,224,224,.8);opacity:0;transform:translateY(24px);transition:opacity .6s var(--ovl),transform .6s var(--ovl)}
#overlay.open .contacts{opacity:1;transform:none;transition-delay:500ms}
.contacts a:hover{color:#fff}
.mobile-langs{margin-top:16px}

.hero{position:relative;width:100%;height:100vh;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.video-wrap{position:absolute;inset:0;transform:scale(1.05);opacity:0;transition:transform 1.4s var(--ent),opacity 1.4s var(--ent)}
.hero-on .video-wrap{transform:scale(1);opacity:1}
.video-wrap video{width:100%;height:100%;object-fit:cover}
.fg{position:relative;z-index:10;text-align:center;padding:0 24px 64px;max-width:56rem;margin:0 auto}
h1{font-size:2.5rem;line-height:.95;margin-bottom:20px;color:#fff}
.sm-br{display:none}
.sub{color:rgba(255,255,255,.7);font-size:1rem;margin:0 auto 32px;max-width:28rem}
.cta{display:inline-block;padding:14px 32px;background:#F0E0E0;color:#6B3A3F;font-size:.875rem;font-weight:500;border-radius:9999px;transition:background .15s,opacity .15s,transform .9s var(--ent)}
.cta:hover{background:rgba(240,224,224,.9)}
.sound{position:fixed;bottom:20px;right:20px;z-index:30;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.4);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.9)}
.sound:hover{background:rgba(255,255,255,.1)}
.sound svg{width:16px;height:16px}

@media(min-width:640px){h1{font-size:3rem}.sm-br{display:inline}}
@media(min-width:768px){
 .bar{padding:0 40px;height:80px}
 .logo{font-size:1.5rem}.logo img{width:36px;height:36px}
 .pill{display:flex}.right{display:flex}.burger{display:none}
 .mobile-langs{display:none}
 .olink{font-size:3.75rem}
 .fg{padding-bottom:96px}
 h1{font-size:3.75rem;margin-bottom:24px}
 .sub{font-size:1.125rem;margin-bottom:40px}
 .cta{font-size:1rem}
}
@media(min-width:1024px){h1{font-size:4.5rem}}
@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}
