/*
Theme Name: WWW
Author: Indrek
Description: Bigeye demo
Version: 1.0
Text Domain: www
*/
:root {
  --base-font-size:1.125rem;
  --space-section:14px;
  --text-color:#192150;
  --xs-screen-max:820px;
  --field-anim:150ms cubic-bezier(.2,.8,0,1);
  --text-anim:150ms ease-in-out;
  --error-color:#ff0000;
}
@media (min-width: 820px) {
  :root { --space-section:64px; }
}
*, ::before, ::after { box-sizing:border-box; }
html {
  font-size:100%;
  line-height:1.15;
  -webkit-text-size-adjust:100%;
}
b, strong { font-weight:bolder; }
button, input, optgroup, select, textarea {
  font-family:inherit;
  font-size:100%;
  line-height:1.15;
  margin:0;
}
button, [type='button'], [type='reset'], [type='submit'] { -webkit-appearance:button; }
body {
  animation:gradientBg 15000ms ease-in-out infinite;
  background:#011B52;
  background:linear-gradient(135deg,#011B52,#0037A6,#011B52,#0037A6);
  background-size:400% 400%;
  color:var(--text-color);
  font-family:"Plus Jakarta Sans", sans-serif;
  font-optical-sizing:auto;
  font-size:var(--base-font-size);
  font-style:normal;
  font-weight:400;
  line-height:1.278;
  margin:0;
  min-height:100vh;
  will-change:background-position;
}
a {
  color:var(--text-color);
  text-decoration:none;
  transition:color var(--text-anim);
}
a:hover { color:#18204e; }
h1, h2 {
  letter-spacing:-3%;
  margin-block:1.36rem;
}
h1, .heading-style-1 {
  font-size:2.8rem;
  font-weight:300;
}
@media (min-width: 820px) {
  h1, .heading-style-1 { font-size:4rem; }
}
h1 span:first-child, .heading-style-1 span:first-child {
  display:block;
  font-weight:700;
}
h2 { font-size:2rem; }
p { margin:1rem 0 2rem; }
.container {
  max-width:1400px;
  margin-inline:auto;
  padding-inline:var(--space-section);
}
.layout--two-column {
  align-items:center;
  display:grid;
  grid-template-columns:1fr;
  min-height:100vh;
}
@media (min-width: 1024px) {
  .layout--two-column {
    grid-template-columns:1fr 1fr;
    gap:var(--space-section);
  }
}
.layout-content {
  display:flex;
  align-items:center;
  justify-content:center;
  padding-block:var(--space-section);
}
@media (min-width: 1024px) {
  .layout-content { padding-block:5vh; }
}
.layout-aside {
  align-items:center;
  display:none;
  height:100%;
  justify-content:center;
  position:relative;
}
@media (min-width: 1024px) {
  .layout-aside { display:flex; }
}
.layout-aside::before {
  background:url(assets/img/bg-matrix.png) no-repeat 50% 50%;
  background-size:120% auto;
  bottom:0;
  content:'';
  left:0;
  opacity:.2;
  position:absolute;
  right:0;
  top:0;
  z-index:-1;
}
.card {
  background:#fff;
  border-radius:28px;
  display:flex;
  flex-direction:column;
  gap:2rem;
  justify-content:space-between;
  padding:.2rem 1.5rem 2.7rem;
}
@media (min-width: 820px) {
  .card {
    min-height:55rem;
    padding-top:4rem;
    padding-inline:7.3rem;
  }
}
.card-footer {
  align-items:center;
  display:flex;
  justify-content:space-between;
  line-height:1;
}
.card article:has(.form-success.is-visible):first-child {
  align-content:center;
  flex:1;
}
.social-links {
  align-items:center;
  display:flex;
  gap:17px;
  list-style:none;
  margin:0;
  padding:0;
}
.social-links a {
  display:inline-flex;
  transition:scale var(--text-anim);
}
.social-links a:hover { scale:1.1; }
.eye svg { max-width:100%; }
.pupil {
  transform-box:fill-box;
  transform-origin:center;
  transition:transform 0.15s ease-out;
}
.enter {
  animation:scaleUp 0.9s cubic-bezier(0.22,1,0.36,1) forwards;
  opacity:0;
  transform:scale(0.9);
  will-change:opacity, transform;
}
.delay-1 { animation-delay:.2s; }
.delay-2 { animation-delay:.4s; }
@keyframes scaleUp {
  to {
    opacity:1;
    transform:scale(1);
  }
}
@keyframes gradientBg {
  0% { background-position:5% 40%; }
  20% { background-position:70% 10%; }
  40% { background-position:90% 70%; }
  60% { background-position:20% 90%; }
  80% { background-position:60% 30%; }
  100% { background-position:5% 40%; }
}