

/* ── VK EMAIL SIGNUP ─────────────────────────── */

.vk-em{background:#AAFF00;padding:84px 40px;position:relative;overflow:hidden}

.vk-em::before{content:'VK';position:absolute;right:-20px;top:50%;transform:translateY(-50%);font-family:'Bebas Neue',sans-serif;font-size:280px;color:rgba(0,0,0,.045);line-height:1;pointer-events:none;user-select:none}

.vk-em::after{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='.03'/%3E%3C/svg%3E");pointer-events:none;mix-blend-mode:multiply}

.vk-em__in{max-width:680px;margin:0 auto;text-align:center;position:relative;z-index:1}



/* ── eyebrow ── */

.vk-em__eye{display:inline-flex;align-items:center;gap:7px;background:rgba(0,0,0,.07);border:1px solid rgba(0,0,0,.1);padding:5px 15px;border-radius:20px;font-size:10px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:rgba(0,0,0,.5);margin-bottom:22px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

.vk-em__eye-icon{color:#000;font-size:13px;line-height:1}



/* ── heading ── */

.vk-em__title{font-family:'Bebas Neue',sans-serif;font-size:clamp(56px,10vw,90px);color:#000;letter-spacing:.02em;line-height:.88;margin:0 0 16px}

.vk-em__sub{font-size:14px;color:rgba(0,0,0,.55);font-weight:500;line-height:1.7;max-width:450px;margin:0 auto 36px}



/* ── form ── */

.vk-em__form-wrap{margin-bottom:20px}

.vk-em__form{display:flex;max-width:500px;margin:0 auto;border:1.5px solid rgba(0,0,0,.15);border-radius:8px;overflow:hidden;background:#000;transition:box-shadow .3s,border-color .3s}

.vk-em__form:focus-within{border-color:rgba(0,0,0,.3);box-shadow:0 8px 32px rgba(0,0,0,.12)}

.vk-em__inp{flex:1;background:transparent;border:none;padding:16px 20px;font-size:13px;color:#fff;outline:none;font-family:'Inter',sans-serif;min-width:0}

.vk-em__inp::placeholder{color:rgba(255,255,255,.3)}

.vk-em__btn{padding:16px 28px;background:#AAFF00;color:#000;font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;border:none;cursor:pointer;font-family:'Inter',sans-serif;transition:background .2s,letter-spacing .2s;white-space:nowrap;flex-shrink:0;position:relative}

.vk-em__btn::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:1px;background:rgba(170,255,0,.3)}

.vk-em__btn:hover{background:#d4ff66;letter-spacing:.14em}



/* ── perks ── */

.vk-em__perks{display:flex;align-items:center;justify-content:center;gap:22px;margin:0 0 14px;flex-wrap:wrap;list-style:none;padding:0}

.vk-em__perk{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:600;color:rgba(0,0,0,.5);letter-spacing:.02em}

.vk-em__perk-dot{width:5px;height:5px;background:rgba(0,0,0,.22);border-radius:50%;flex-shrink:0;display:block}



/* ── footer note ── */

.vk-em__note{font-size:10px;color:rgba(0,0,0,.3);font-weight:500;letter-spacing:.03em;margin:0}



/* ── success state ── */

.vk-em__ok{font-size:14px;font-weight:700;color:#000;padding:18px;background:rgba(0,0,0,.07);border:1px solid rgba(0,0,0,.1);border-radius:8px;text-align:center;max-width:500px;margin:0 auto}



/* ── responsive ── */

@media(max-width:600px){

  .vk-em{padding:60px 22px}

  .vk-em::before{font-size:160px;right:-10px}

  .vk-em__title{margin-bottom:12px}

  .vk-em__sub{margin-bottom:28px}

  .vk-em__form{flex-direction:column;border-radius:8px}

  .vk-em__inp{padding:15px 16px;border-bottom:1px solid rgba(255,255,255,.06)}

  .vk-em__btn{padding:15px 16px;text-align:center}

  .vk-em__btn::before{display:none}

  .vk-em__perks{gap:10px}

}

@media(prefers-reduced-motion:reduce){

  .vk-em__form,.vk-em__btn{transition:none !important}

}

