:root{
  --deep:#0A0B3A; --gold:#D4AE68; --mist:#AEB5DC;
  --ease:cubic-bezier(.16,.84,.44,1);
}
*{box-sizing:border-box}
html{height:100%;background:#0A0B3A;overscroll-behavior-y:none}
body{height:100%}
body{margin:0;display:grid;place-items:center;padding:30px 22px;overflow-x:hidden;overscroll-behavior-y:none;
  background:linear-gradient(180deg,#0A0B3A 0%,#0D0E44 46%,#0A0B3A 100%);
  color:#fff;font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif}
body::before{content:"";position:fixed;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,rgba(212,174,104,.6),rgba(212,174,104,0) 62%)}
.box{width:100%;max-width:430px}

/* ---- znak OMAM ---- */
.brand{height:46px;width:auto;margin:0 0 32px}
.omam{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.omam .cl{font-size:.62rem;font-weight:700;letter-spacing:.2em;text-transform:lowercase;
  color:rgba(211,215,240,.34);white-space:nowrap;transition:color .45s ease}
.omam:hover .cl,.omam:focus-visible .cl{color:#EDEFF8}
.mk{position:relative;display:block;width:34px;height:33px;flex:none;
  transition:transform .55s cubic-bezier(.22,1.25,.36,1)}
.mk i{position:absolute;inset:0;background-repeat:no-repeat;background-position:center;background-size:contain}
.mk .fig{opacity:.5;transition:opacity .45s ease;background-image:url("../images/graphic-1cd794325d.png")}
.omam:hover .fig{opacity:1}
.mk .st{opacity:0;transform:scale(.2) rotate(-40deg);
  transition:opacity .35s ease,transform .6s cubic-bezier(.22,1.35,.4,1)}
.mk .s1{background-image:url("../images/graphic-fc91b4f782.png");transform-origin:42% 9%}
.mk .s2{background-image:url("../images/graphic-12a16685c5.png");transform-origin:78% 33%;animation-delay:.9s}
.mk .s3{background-image:url("../images/graphic-fc91b4f782.png");animation:none;transform:translate(-26%,52%) scale(.34) rotate(-12deg)}
.mk .s4{background-image:url("../images/graphic-12a16685c5.png");animation:none;transform:translate(24%,-16%) scale(.42) rotate(14deg)}
.omam:hover .st{animation:none;opacity:1}
.omam:hover .s1{transform:none}
.omam:hover .s2{transform:none;transition-delay:.07s}
.omam:hover .s3{transform:translate(-26%,52%) scale(.34) rotate(0deg);transition-delay:.14s}
.omam:hover .s4{transform:translate(24%,-16%) scale(.42) rotate(0deg);transition-delay:.21s}
/* ---- tresc ---- */
h1{position:relative;margin:0 0 12px;font-family:'Newsreader',Georgia,serif;font-weight:400;
  font-size:clamp(1.7rem,6.4vw,2.2rem);line-height:1.14;letter-spacing:-.02em;
  -webkit-mask-image:linear-gradient(96deg,#000 46%,rgba(0,0,0,.35) 52%,transparent 58%);
          mask-image:linear-gradient(96deg,#000 46%,rgba(0,0,0,.35) 52%,transparent 58%);
  -webkit-mask-size:300% 100%;mask-size:300% 100%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  animation:wipe 1.25s cubic-bezier(.32,.06,.16,1) .18s both}
h1 em{font-style:italic;color:#F0DFB8}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
p.lead{margin:0 0 28px;color:var(--mist);font-size:.98rem;line-height:1.65;
  animation:rise .9s var(--ease) .5s both}
form{animation:rise .9s var(--ease) .64s both}
label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin-bottom:9px}
.row{display:flex;gap:10px}
input{flex:1;min-width:0;padding:16px;border-radius:14px;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.22);color:#fff;font-size:1rem;font-family:inherit;
  transition:border-color .3s ease,background .3s ease}
input:focus{outline:0;border-color:var(--gold);background:rgba(255,255,255,.11)}
input::placeholder{color:#7F87B8;letter-spacing:.2em}
button{padding:16px 24px;border:0;border-radius:14px;background:var(--gold);color:#231A05;
  font-family:inherit;font-weight:800;font-size:1rem;cursor:pointer;white-space:nowrap;
  transition:transform .3s var(--ease),background .3s ease}
button:hover{background:#E4C489;transform:translateY(-2px)}
button:disabled{opacity:.5;cursor:progress;transform:none}
.msg{margin:16px 0 0;font-size:.9rem;min-height:1.35em;color:#F0B8B8}
.msg.work{color:var(--mist)}
.foot{margin-top:38px;padding-top:20px;border-top:1px solid rgba(255,255,255,.09);
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-size:.78rem;color:#6E77A8;animation:rise .9s var(--ease) .8s both}
.foot a{text-decoration:none}
body.go{animation:out .45s ease forwards}
@keyframes out{to{opacity:0;transform:translateY(-10px)}}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  h1{-webkit-mask-image:none;mask-image:none}
}
