:root{
  --bg0:#02040a;

  --accent:#016bec;
  --accent-rgb: 1,107,236;

  --accent2:#35b7ff;
  --accent2-rgb: 53,183,255;

  --text:#e9eefc;
  --topbar-h:72px;
  --radius:16px;

  --globe-bottom: 0px;
  --globe-gap: 0px;

  --cards-col: 680px;

  --font-head: "Unbounded", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
}

*{ box-sizing:border-box; }

html, body{
  height:auto;
  min-height:100%;
  margin:0;
  overflow-x:hidden;
  overflow-y:auto;
  scroll-behavior:smooth;
  background: radial-gradient(1200px 800px at 50% 35%, #041226 0%, var(--bg0) 55%, #010208 100%);
  font-family: var(--font-body);
  color: var(--text);
}

html{
  scroll-padding-top: calc(var(--topbar-h) + 14px);
}

/* =========================================================
   SCROLLBAR
   ========================================================= */

html{
  scrollbar-gutter: auto !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) transparent;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar{
  width: 8px;
  height: 8px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track{
  background: transparent;
  border: 0;
  box-shadow: none;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.18);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
  box-shadow: none;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover{
  background: rgba(255,255,255,.28);
  border: 2px solid transparent;
  background-clip: padding-box;
}

html::-webkit-scrollbar-thumb:active,
body::-webkit-scrollbar-thumb:active{
  background: rgba(255,255,255,.34);
}

html::-webkit-scrollbar-corner,
body::-webkit-scrollbar-corner{
  background: transparent;
}

/* ===== PRELOADER ===== */
.preloader{
  position: fixed;
  inset: 0;
  z-index: 9999;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  gap: 12px;
  text-align: center;

  pointer-events: none;

  background:
    radial-gradient(900px 600px at 50% 40%, rgba(var(--accent-rgb), .10), transparent 60%),
    radial-gradient(800px 520px at 30% 75%, rgba(var(--accent2-rgb), .08), transparent 62%),
    radial-gradient(1200px 900px at 50% 60%, rgba(0,0,0,.55), rgba(0,0,0,.88));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  transition: opacity .46s ease, transform .46s ease;
  opacity: 1;
}

.preloader--hide{ opacity: 0; transform: scale(1.02); }

.preloader__core{
  position: relative;
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  margin: 0 auto;
  filter: drop-shadow(0 0 18px rgba(var(--accent-rgb), .22));
}

.preloader__ring{
  width: 78px;
  height: 78px;
  border-radius: 999px;
  background:
    conic-gradient(
      from 180deg,
      rgba(var(--accent-rgb), 0) 0%,
      rgba(var(--accent-rgb), .95) 14%,
      rgba(var(--accent-rgb), 0) 34%,
      rgba(var(--accent2-rgb), .85) 55%,
      rgba(var(--accent-rgb), 0) 80%,
      rgba(var(--accent-rgb), 0) 100%
    );
  -webkit-mask: radial-gradient(circle, transparent 56%, #000 57%);
          mask: radial-gradient(circle, transparent 56%, #000 57%);
  animation: preSpin .82s linear infinite;
}

.preloader__ring::before{
  content:"";
  position:absolute;
  inset: 10px;
  border-radius: 999px;
  border: 1px solid rgba(var(--accent-rgb), .22);
  box-shadow: 0 0 24px rgba(var(--accent-rgb), .12), inset 0 0 22px rgba(var(--accent-rgb), .10);
}

.preloader__spark{
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 18px rgba(var(--accent-rgb), .70), 0 0 36px rgba(var(--accent-rgb), .34);
  animation: preOrbit 1.05s linear infinite;
}

@keyframes preSpin{ to { transform: rotate(360deg); } }
@keyframes preOrbit{
  0%{ transform: rotate(0deg) translateX(32px) rotate(0deg); opacity: .95; }
  70%{ opacity: .75; }
  100%{ transform: rotate(360deg) translateX(32px) rotate(-360deg); opacity: .95; }
}

.preloader__label{
  font-size: 12px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 900;
  color: rgba(233,238,252,.92);
  text-shadow: 0 10px 28px rgba(0,0,0,.70), 0 0 18px rgba(var(--accent-rgb), .16);
  user-select: none;
}

.preloader__dots{ display:inline-block; width:1.6em; margin-left:2px; }
.preloader__dots::after{ content:""; animation: preDots 1.15s steps(4,end) infinite; }
@keyframes preDots{
  0%{content:"";} 25%{content:".";} 50%{content:"..";} 75%{content:"...";} 100%{content:"";}
}

/* ===== BACKGROUND ===== */
#globe{
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

#globe::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,0) 48%,
    rgba(0,0,0,0.35) 72%,
    rgba(0,0,0,0.88) 100%
  );
}

#globe canvas{
  display:block;
  width:100% !important;
  height:100% !important;
  filter: drop-shadow(0 0 10px rgba(var(--accent-rgb),.22)) drop-shadow(0 0 26px rgba(var(--accent-rgb),.12));
}

.spacefx{
  position: fixed;
  inset: 0;
  z-index: 2;
  pointer-events:none;
  opacity: .75;
  mix-blend-mode: screen;
}

.spacefx::before{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(circle at 12% 18%, rgba(var(--accent-rgb),.18), transparent 38%),
    radial-gradient(circle at 82% 64%, rgba(var(--accent2-rgb),.14), transparent 40%),
    radial-gradient(circle at 55% 30%, rgba(var(--accent-rgb),.10), transparent 44%),
    radial-gradient(circle at 20% 70%, rgba(255,255,255,.08) 0 1px, transparent 2px),
    radial-gradient(circle at 40% 20%, rgba(255,255,255,.06) 0 1px, transparent 2px),
    radial-gradient(circle at 75% 35%, rgba(255,255,255,.07) 0 1px, transparent 2px),
    radial-gradient(circle at 88% 78%, rgba(255,255,255,.05) 0 1px, transparent 2px),
    radial-gradient(circle at 10% 45%, rgba(255,255,255,.06) 0 1px, transparent 2px);
  filter: blur(.2px);
  animation: spaceDrift 24s linear infinite;
  opacity:.9;
}

.spacefx::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 420px at 70% 25%, rgba(var(--accent-rgb),.10), transparent 58%),
    radial-gradient(520px 360px at 30% 80%, rgba(var(--accent2-rgb),.08), transparent 62%);
  animation: spacePulse 6.5s ease-in-out infinite;
  opacity:.8;
}

@keyframes spaceDrift{
  0%{ transform: translate3d(-2%,-2%,0) rotate(0.001deg); }
  50%{ transform: translate3d( 2%, 1%,0) rotate(0.001deg); }
  100%{ transform: translate3d(-2%,-2%,0) rotate(0.001deg); }
}
@keyframes spacePulse{
  0%,100%{ opacity:.55; transform:scale(1); }
  50%{ opacity:.95; transform:scale(1.02); }
}

body::before{
  content:"";
  position: fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(900px 600px at 50% 35%, rgba(var(--accent-rgb),.07), transparent 55%),
    radial-gradient(1200px 900px at 50% 60%, rgba(var(--accent2-rgb),.04), transparent 60%);
  mix-blend-mode: screen;
  opacity: .85;
  z-index: 1;
}

body::after{
  content:"";
  position: fixed;
  inset:0;
  pointer-events:none;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,.02) 0px,
    rgba(255,255,255,.02) 1px,
    rgba(0,0,0,0) 3px,
    rgba(0,0,0,0) 6px
  );
  opacity:.06;
  z-index: 1;
}

.meteors{
  position: fixed;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: .85;
  mix-blend-mode: screen;
}

#globe, .spacefx, .meteors{
  transition: opacity .35s ease, filter .35s ease;
  will-change: opacity, filter;
}
html.bg-off #globe,
html.bg-off .spacefx,
html.bg-off .meteors{
  opacity: 0;
  filter: blur(10px);
  pointer-events: none;
}

/* ===== TOPBAR ===== */
.topbar{
  height: var(--topbar-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 0 22px;

  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;

  background-color: transparent;
  border-bottom: 1px solid transparent;

  transition: background-color .2s ease, border-color .2s ease, backdrop-filter .2s ease;
}

.topbar.is-scrolled{
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
}

.brand{
  display:flex;
  align-items:center;
  text-decoration:none;
  white-space: nowrap;
  filter: drop-shadow(0 10px 28px rgba(0,0,0,.65));
}

.brand img{
  display:block;
  width: clamp(140px, 15vw, 260px);
  height: auto;
  object-fit: contain;
}

.nav{
  display:flex;
  align-items:center;
  gap: 22px;
  text-shadow: 0 10px 28px rgba(0,0,0,.65);
  transform: none;
}

.nav a{
  text-decoration:none;
  color: rgba(233,238,252,.86);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .12em;
  padding: 10px 6px;
  position: relative;
  transition: .18s ease;
}

.nav a:hover{ color:#fff; }

.nav a::after{
  content:"";
  position:absolute;
  left:6px; right:6px; bottom:7px;
  height:2px;
  background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb),.92), transparent);
  opacity:0;
  transform: translateY(3px);
  transition: .18s ease;
}

.nav a:hover::after{ opacity:1; transform:translateY(0); }

.nav a.active,
.nav a[aria-current="page"]{
  color:#fff;
}

.nav a.active::after,
.nav a[aria-current="page"]::after{
  opacity:1;
  transform:translateY(0);
}

.lang{
  display:flex;
  align-items:center;
  font-size: 15px;
  gap: 8px;
  white-space: nowrap;
  text-shadow: 0 10px 28px rgba(0,0,0,.65);
}

.lang button{
  border:0;
  background: transparent;
  color: rgba(233,238,252,.85);
  font-size: 12px;
  letter-spacing:.08em;
  text-transform: uppercase;
  padding: 8px 10px;
  border-radius: 10px;
  cursor: pointer;
  transition: .15s ease;
}

.lang button:hover{ color:#fff; background: rgba(255,255,255,.06); }

.lang button.active{
  color:#031225;
  background: linear-gradient(180deg, rgba(var(--accent-rgb),.96), rgba(var(--accent2-rgb),.90));
  box-shadow: 0 0 18px rgba(var(--accent-rgb),.22);
}

@media (min-width: 981px){
  .topbar{
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 0 clamp(34px, 4.4vw, 88px);
  }

  .brand{
    justify-self: start;
    opacity: .98;
  }

  .nav{
    justify-self: end;
    margin-right: clamp(16px, 2.5vw, 72px);
    gap: clamp(20px, 1.8vw, 42px);
    transform: none;
  }

  .nav a{
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 9px 2px;
    color: rgba(255,255,255,.92);
  }

  .lang{
    justify-self: end;
    gap: 0;
    align-items: center;
  }

  .lang button{
    position: relative;
    padding: 0 2px;
    border-radius: 0;
    background: transparent !important;
    font-size: 17px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .02em;
    color: rgba(255,255,255,.90);
  }

  .lang button + button{
    margin-left: 6px;
    padding-left: 10px;
  }

  .lang button + button::before{
    content: "/";
    position: absolute;
    left: -2px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255,255,255,.52);
    pointer-events: none;
    font-weight: 600;
  }

  .lang button:hover{
    color:#fff;
    background: transparent !important;
  }

  .lang button.active{
    color: var(--accent);
    background: transparent !important;
    box-shadow: none;
    text-shadow: 0 0 10px rgba(var(--accent-rgb), .18);
  }
}

.burger{
  display:none;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.35);
  color:#fff;
  border-radius: 12px;
  padding: 10px 12px;
  cursor: pointer;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.burger__label{ font-weight:800; letter-spacing:.08em; margin-right: 10px; }

.drawer{
  position: fixed;
  top: var(--topbar-h);
  right: 14px;
  width: min(320px, calc(100% - 28px));
  border-radius: 16px;
  background: rgb(4 18 44 / 84%);
  border: 1px solid rgb(1 107 236);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 18px 60px rgb(1 107 236 / 38%);
  padding: 10px;
  display:none;
  z-index: 55;
}
.drawer.open{ display:block; }

.drawer a{
  display:block;
  text-decoration:none;
  color: rgb(153 214 255);
  padding: 12px 12px;
  border-radius: 12px;
  font-size: 12px;
  letter-spacing:.10em;
  text-transform: uppercase;
}
.drawer a:hover{ background: rgba(255,255,255,.06); color:#fff; }

.drawer a.active,
.drawer a[aria-current="page"]{
  background: linear-gradient(180deg, rgba(var(--accent-rgb), .18), rgba(var(--accent2-rgb), .10));
  color:#fff;
  box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb), .28);
}

.section,
.service-section-wrapper{
  scroll-margin-top: calc(var(--topbar-h) + 14px);
}

.drawer__spacer{ height: 10px; }
.drawer__langs{ display:flex; gap:8px; padding: 0 6px 6px; }
.drawer__langbtn{
  flex:1;
  border: 1px solid rgb(1 107 236);
  background:rgba(255,255,255,.06);
  color:#fff;
  border-radius:12px;
  padding:10px;
  cursor:pointer;
}

/* ===== SECTIONS ===== */
.sections{ padding-top: var(--topbar-h); }

.section{
  padding: 0px 22px;
  scroll-margin-top: calc(var(--topbar-h) + 12px);
}

/* HOME */
.section--home{
  padding-top: 0;
  pointer-events: none;
}
.section--home .homeCards,
.section--home .homeCards *{
  pointer-events: auto;
}

.home__inner{
  min-height: calc(100vh - var(--topbar-h));
  display:flex;
  align-items:center;
  justify-content:center;
}

.wrap{
  width: 100%;
  display:grid;
  grid-template-columns: 1fr var(--cards-col);
  align-items: center;
  gap: 28px;
}

.homeCards{
  width:100%;
  max-width: 700px;
  justify-self:end;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap: 18px;
}

.homeCards__logo{
  width:100%;
  display:flex;
  justify-content:center;
  margin-bottom: 8px;
  animation: logoFloat 6s ease-in-out infinite;
  filter: drop-shadow(0 0 18px rgba(var(--accent-rgb),.18)) drop-shadow(0 0 36px rgba(var(--accent2-rgb),.08));
}

.homeCards__logo img{
  width:min(100%, 620px);
  height:auto;
  display:block;
  object-fit:contain;
}

.cards{
  width: 100%;
  max-width: 560px;
  justify-self: end;
  align-self:flex-end;
  display:flex;
  flex-direction: column;
  gap: 18px;
}

.card{
  position: relative;
  min-height: 116px;
  padding: 24px 120px 24px 28px;
  border-radius: 22px;
  overflow: hidden;
  isolation: isolate;
  display:flex;
  align-items:center;

  background:
    linear-gradient(180deg, rgba(5,16,42,.58), rgba(2,8,24,.34)),
    radial-gradient(circle at 18% 22%, rgba(74,192,255,.08), transparent 34%),
    radial-gradient(circle at 84% 76%, rgba(74,192,255,.10), transparent 38%);

  border: 1px solid rgba(115, 213, 255, .24);
  box-shadow:
    inset 0 0 0 1px rgba(195,235,255,.03),
    inset 0 0 28px rgba(43,160,255,.05),
    0 10px 32px rgba(0,0,0,.28),
    0 0 14px rgba(53,166,255,.08);
  animation: cardFloat 6s ease-in-out infinite;
}

.card:nth-child(2){ animation-delay: .7s; }
.card:nth-child(3){ animation-delay: 1.4s; }

.card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  box-shadow: inset 0 0 20px rgba(90,210,255,.06), 0 0 22px rgba(90,210,255,.06), 0 0 46px rgba(90,210,255,.04);
}

.card__shine{
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background: linear-gradient(100deg, transparent 0%, transparent 34%, rgba(165,240,255,.03) 44%, rgba(165,240,255,.13) 50%, rgba(165,240,255,.03) 56%, transparent 66%, transparent 100%);
  transform: translateX(-70%);
  animation: cardShine 5.8s ease-in-out infinite;
  mix-blend-mode: screen;
}

.card .t{ position: relative; z-index: 2; max-width: 100%; }
.card .t .top{
  font-size: clamp(16px, 1.2vw, 24px);
  letter-spacing:.02em;
  text-transform: uppercase;
  color: rgba(233,238,252,.9);
  font-weight: 900;
  line-height: 1.1;
}
.card .t .accent{
  margin-top: 8px;
  font-size: clamp(14px, .95vw, 20px);
  letter-spacing:.04em;
  text-transform: uppercase;
  font-weight: 900;
  color: var(--accent2);
  text-shadow: 0 0 18px rgba(var(--accent-rgb),.16);
}

.icon{
  position: absolute;
  z-index: 2;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 88px;
  height: 88px;
  display:grid;
  place-items:center;
  flex: 0 0 auto;
}

.icon::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: 22px;
}

.icon::after{
  content:"";
  position:absolute;
  right:-12px;
  bottom:-10px;
  width:48px;
  height:48px;
  background: radial-gradient(circle, rgba(var(--accent2-rgb),.34), transparent 70%);
  filter: blur(10px);
}

.icon img{
  position:relative;
  z-index:1;
  width: 85px;
  height: 85px;
  object-fit: contain;
  filter: brightness(1.12) drop-shadow(0 0 6px rgba(70,200,255,.36)) drop-shadow(0 0 14px rgba(70,200,255,.20));
  animation: iconPulse 2.8s ease-in-out infinite;
}

/* SECOND SCREENS */
.section--about,
.section--results,
.section--info{
  background:
    radial-gradient(900px 600px at 30% 20%, rgba(var(--accent-rgb), .08), transparent 60%),
    radial-gradient(900px 600px at 80% 70%, rgba(var(--accent2-rgb), .06), transparent 62%),
    rgba(0,0,0,.92);
}

.stat{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
  padding: 14px 14px;
  position: relative;
  overflow: hidden;
}

.stat::before{
  content:"";
  position:absolute;
  inset:-1px;
  background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb),.14), transparent);
  transform: translateX(-60%);
  animation: sheen 3.2s ease-in-out infinite;
  opacity:.7;
  pointer-events:none;
}

@keyframes sheen{
  0%,60%{ transform: translateX(-60%); }
  100%{ transform: translateX(60%); }
}

@keyframes cardShine{
  0%,100%{ transform: translateX(-70%); opacity: .25; }
  50%{ transform: translateX(70%); opacity: .85; }
}

@keyframes cardFloat{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-4px); }
}

@keyframes iconPulse{
  0%,100%{ transform: scale(1); opacity: .95; }
  50%{ transform: scale(1.04); opacity: 1; }
}

@keyframes logoFloat{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-6px); }
}

.stat__n{
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 22px;
  color: var(--accent);
  text-shadow: 0 0 18px rgba(var(--accent-rgb),.16);
}

.stat__t{
  margin-top: 6px;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(233,238,252,.78);
}

.sectionBox{ max-width: 1180px; margin: 0 auto; padding: 34px 0 90px; }
.sectionTitle{
  font-family: var(--font-head);
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin: 0 0 12px;
  font-size: clamp(22px, 2.2vw, 34px);
}
.sectionText{ margin:0; color: rgba(233,238,252,.82); line-height: 1.6; max-width: 72ch; }

#err{
  position: fixed; left: 18px; bottom: 18px; right: 18px;
  padding: 12px 14px; border-radius: 12px;
  background: rgba(220,60,60,.14); border: 1px solid rgba(220,60,60,.35);
  color: #ffd3d3; display:none; white-space: pre-wrap;
  backdrop-filter: blur(10px);
  z-index: 60;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 980px){
  .wrap{ grid-template-columns: 1fr; }
  .homeCards{ justify-self:center; max-width: 620px; }
  .homeCards__logo img{ width:min(100%, 500px); }
  .cards{ width: min(560px, 100%); justify-self: center; max-width: none; align-self:center; }
  .nav{ transform:none; }

  .about__inner{ grid-template-columns: 1fr; }
  .about__bgword{ inset:auto -12% -22% auto; }
  .aboutStats{ grid-template-columns: 1fr; }
}

@media (max-width: 680px){
  :root{
    --globe-bottom: calc(330px + env(safe-area-inset-bottom));
    --globe-gap: 18px;
  }

  .nav{ display:none; }
  .burger{ display:inline-flex; align-items:center; gap:10px; }
  .topbar{ padding: 0 14px; }

  .wrap{
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
    align-items: end;
    gap: 12px;
  }

  .home__inner{
    align-items: flex-end;
    padding-bottom: calc(var(--globe-gap) + env(safe-area-inset-bottom));
  }

  .homeCards{
    width:100%;
    max-width: 100%;
    gap: 12px;
  }

  .homeCards__logo{ margin-bottom: 2px; }
  .homeCards__logo img{ width:min(100%, 360px); }

  .cards{
    width: 100%;
    max-width: 520px;
    justify-self: center;
    align-self: end;
    padding-bottom: calc(env(safe-area-inset-bottom) + 8px);
    gap: 10px;
    transform: none;
  }

  .card{ min-height: 84px; padding: 14px 82px 14px 16px; border-radius: 16px; }
  .icon{ width: 60px; height:60px; right:10px; }
  .icon img{ width: 38px; height:38px; }
  .card .t .top{ font-size: 13px; }
  .card .t .accent{ font-size: 12px; margin-top: 6px; }
}

@media (max-width: 680px){
  body{ position: relative; }

  #globe, .spacefx, .meteors{
    position: absolute;
    inset: auto;
    top: 0; left: 0; right: 0;
    height: 100dvh;
  }
  @supports not (height: 100dvh){
    #globe, .spacefx, .meteors{ height: 100vh; }
  }

  body::before,
  body::after{
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 100dvh;
  }
  @supports not (height: 100dvh){
    body::before, body::after{ height: 100vh; }
  }
}

@media (max-width: 520px){
  .lang{ display:none; }
}

/* =========================================================
   ABOUT / BUY section
   ========================================================= */

.service-section-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #000;
  isolation: isolate;
}

.service-section-wrapper::before,
.service-section-wrapper::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  z-index: 20;
  pointer-events: none;
}

.service-section-wrapper::before {
  top: 0;
  height: clamp(28px, 5vw, 96px);
  background: linear-gradient(180deg, rgba(0,0,0,.96), rgba(0,0,0,0));
}

.service-section-wrapper::after {
  bottom: 0;
  height: clamp(28px, 5vw, 96px);
  background: linear-gradient(0deg, rgba(0,0,0,.96), rgba(0,0,0,0));
}

.service-section {
  position: relative;
  height: 100vh;
  min-height: 760px;
  display: flex;
  width: auto;
  padding: clamp(14px, 2.4vw, 44px) clamp(16px, 6.9vw, 132px) 0;
  box-sizing: border-box;
}

/* DOLL */
.service-section__doll {
  position: absolute;
  z-index: 2;
  width: min(56vw, 1080px);
  height: min(56vw, 1080px);
  right: max(-7vw, -140px);
  top: max(-1.2vw, -18px);
  pointer-events: none;
  will-change: transform, opacity;
  transform: translateZ(0);
  animation: dollFloatWrap 9s ease-in-out infinite;
}

.service-section__doll-bg {
  position: absolute;
  inset: 0;
  background-image: url("../img/about.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
  filter: saturate(1.04) contrast(1.03);
  transform-origin: center bottom;
  will-change: transform, filter;
  transform: translateZ(0);
  animation: dollFloatInner 9s ease-in-out infinite, dollGlowPulse 4.8s ease-in-out infinite;
}

.service-section__doll::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,.86) 0%,
      rgba(0,0,0,.56) 18%,
      rgba(0,0,0,.22) 34%,
      rgba(0,0,0,.05) 48%,
      rgba(0,0,0,0) 58%
    ),
    linear-gradient(180deg,
      rgba(0,0,0,.00) 44%,
      rgba(0,0,0,.62) 88%,
      rgba(0,0,0,.92) 100%
    );
}

.service-section__doll::before {
  content: "";
  position: absolute;
  inset: 8% 4% 10% 12%;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(45% 35% at 68% 38%, rgba(1,107,236,.14), transparent 75%),
    radial-gradient(35% 28% at 75% 58%, rgba(53,183,255,.10), transparent 78%);
  filter: blur(40px);
  animation: dollAuraPulse 5.4s ease-in-out infinite;
}

/* TOP TITLES */
.top-titles {
  position: absolute;
  top: clamp(8px, 1.2vw, 28px);
  left: clamp(16px, 6.9vw, 132px);
  display: flex;
  gap: clamp(12px, 2.4vw, 54px);
  z-index: 8;
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
  text-transform: uppercase;
  line-height: 1;
}

.top-titles span {
  font-family: var(--font-head, "Unbounded", sans-serif);
  font-weight: 800;
  font-size: clamp(78px, 9vw, 188px);
  line-height: .82;
  letter-spacing: .02em;
  color: rgba(255,255,255,.05);
  opacity: .95;
}

.top-titles .green {
  color: #016bec;
  opacity: 1;
  text-shadow:
    0 0 18px rgba(1,107,236,.22),
    0 0 50px rgba(53,183,255,.12);
}

/* =========================================================
   LIST AREA — ИСПРАВЛЕНО
   ========================================================= */

.service-section .list {
  position: absolute;
  z-index: 10;
  top: clamp(150px, 12vw, 240px);
  left: clamp(16px, 5vw, 96px);

  width: min(60vw, 980px);
  max-width: calc(100vw - 380px);

  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr);
  grid-template-rows: auto auto auto;
  gap: 16px;
  align-items: stretch;
}

.service-section .list::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  left: 14%;
  top: 8%;
  width: min(18vw, 360px);
  height: min(18vw, 360px);
  background: #016bec;
  opacity: .12;
  filter: blur(110px);
}

/* =========================================================
   ITEMS — ИСПРАВЛЕНО
   ========================================================= */

.service-section .list .item {
  position: relative;
  z-index: 1;
  overflow: hidden;
  isolation: isolate;

  text-align: center;
  padding: 20px 20px 18px;
  min-height: 150px;
  background: linear-gradient(180deg, rgb(3 10 24 / 27%), rgb(2 8 20 / 38%));
  border: 1px solid rgba(255,255,255,.045);
  border-radius: 20px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  box-shadow:
    0 16px 40px rgba(0,0,0,.34),
    inset 0 0 0 1px rgba(255,255,255,.012);
}

.service-section .list .item::before {
  content: "";
  position: absolute;
  inset: -1px;
  pointer-events: none;
  opacity: .58;
  background:
    radial-gradient(320px 160px at 18% 14%, rgba(1,107,236,.12), transparent 72%),
    radial-gradient(380px 200px at 84% 86%, rgba(53,183,255,.07), transparent 76%);
}

.service-section .list .item:nth-child(1) {
  min-height: 206px;
}

.service-section .list .item:nth-child(3) {
  min-height: 158px;
}

.service-section .list .item--long {
  grid-column: 2;
  grid-row: 1 / 3;
  min-height: 330px;
  padding: 26px 24px;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.service-section .list .item--icon{
  padding-top: 26px;
}

.service-section .list .item__icon{
  position: relative;
  z-index: 1;
  width: clamp(54px, 5.1vw, 78px);
  aspect-ratio: 1 / 1;
  margin: 0 auto 12px;
  display:grid;
  place-items:center;
  flex: 0 0 auto;
}

.service-section .list .item__icon img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display:block;
  filter: drop-shadow(0 0 10px rgba(53,183,255,.18)) drop-shadow(0 0 28px rgba(1,107,236,.12));
}

.service-section .list .item--long .item__icon{
  width: clamp(58px, 5.4vw, 84px);
  margin-bottom: 14px;
}

.service-section .list .item__content{
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
}

.service-section .list .item__title {
  position: relative;
  z-index: 1;
  margin-bottom: 8px;
  font-family: var(--font-body, "Inter", sans-serif);
  font-weight: 700;
  font-size: clamp(16px, 1vw, 20px);
  line-height: 1.15;
  color: #4fc0ff;
}

.service-section .list .item__text {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  max-width: 92%;
  font-family: var(--font-body, "Inter", sans-serif);
  font-weight: 500;
  font-size: clamp(13px, .9vw, 16px);
  line-height: 1.45;
  color: rgba(236,242,238,.95);
  text-wrap: balance;
}

.service-section .list .item--long .item__text{
  max-width: 100%;
}

.service-section .list .item__text b,
.service-section .list .item__text strong {
  color: #fff;
  font-weight: 800;
}

/* BUTTON */
.list-button {
  grid-column: 1;
  grid-row: 3;
  align-self: start;

  margin-top: 2px;
  width: 100%;
  min-height: 72px;
  padding: 8px 10px 8px 22px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;

  border-radius: 999px;
  text-decoration: none;
  text-transform: uppercase;

  color: #eff6ff;
  background: rgba(3, 18, 42, .58);
  border: 1.2px solid rgba(255,255,255,.82);

  box-shadow:
    0 14px 38px rgba(0,0,0,.34),
    inset 0 0 0 1px rgba(1,107,236,.10);

  transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.list-button:hover {
  transform: translateY(-1px);
  background: rgba(4, 22, 52, .64);
  box-shadow:
    0 18px 52px rgba(0,0,0,.42),
    0 0 22px rgba(1,107,236,.14),
    inset 0 0 0 1px rgba(53,183,255,.14);
}

.list-button__text {
  min-width: 0;
  font-family: var(--font-body, "Inter", sans-serif);
  font-weight: 800;
  font-size: clamp(15px, 1.02vw, 19px);
  line-height: 1.06;
  letter-spacing: .01em;
}

.list-button__icon {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  min-width: 56px;
  min-height: 56px;
  border-radius: 50%;
  display: grid;
  place-items: center;

  font-size: 30px;
  line-height: 1;
  color: #031225;
  background: #016bec;

  box-shadow:
    0 0 18px rgba(1,107,236,.24),
    inset 0 0 0 1px rgba(255,255,255,.10);

  transition: transform .16s ease;
}

.list-button:hover .list-button__icon {
  transform: translateY(-1px) scale(1.03);
}

/* ANIMATIONS */
@keyframes dollFloatWrap {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50%      { transform: translate3d(-6px, -8px, 0); }
}

@keyframes dollFloatInner {
  0%, 100% { transform: scale(1) translateY(0); }
  50%      { transform: scale(1.018) translateY(-4px); }
}

@keyframes dollGlowPulse {
  0%, 100% { filter: saturate(1.04) contrast(1.03) brightness(1); }
  50%      { filter: saturate(1.08) contrast(1.05) brightness(1.03); }
}

@keyframes dollAuraPulse {
  0%, 100% { opacity: .85; transform: scale(1); }
  50%      { opacity: 1; transform: scale(1.04); }
}

@keyframes dollFloatWrapMobile {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50%      { transform: translate3d(0, -4px, 0); }
}

@keyframes dollFloatInnerMobile {
  0%, 100% { transform: scale(1) translateY(0); }
  50%      { transform: scale(1.01) translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
  .service-section__doll,
  .service-section__doll-bg,
  .service-section__doll::before {
    animation: none !important;
  }
}

/* LARGE DESKTOP */
@media (min-width: 1600px) {
  .service-section {
    min-height: 820px;
  }

  .service-section .list {
    top: 12.2vw;
    width: min(57vw, 980px);
    max-width: calc(100vw - 430px);
    gap: 14px;
  }

  .service-section__doll {
    width: min(53vw, 1040px);
    height: min(53vw, 1040px);
    right: max(-4.2vw, -86px);
    top: 0.1vw;
  }
}

/* TABLET / landscape-ish */
@media (max-width: 1180px) and (min-aspect-ratio: 2/3) {
  .service-section {
    min-height: 700px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .top-titles {
    top: 12px;
    left: 20px;
    gap: 18px;
  }

  .top-titles span {
    font-size: clamp(66px, 9vw, 110px);
  }

  .service-section__doll {
    width: min(52vw, 640px);
    height: min(74vw, 860px);
    right: -6vw;
    top: 0;
    overflow: hidden;
  }

  .service-section__doll-bg {
    background-size: contain;
    background-position: center bottom;
  }

  .service-section__doll::after {
    background:
      linear-gradient(90deg,
        rgba(0,0,0,.78) 0%,
        rgba(0,0,0,.42) 20%,
        rgba(0,0,0,.10) 38%,
        rgba(0,0,0,0) 55%
      ),
      linear-gradient(180deg,
        rgba(0,0,0,0) 48%,
        rgba(0,0,0,.52) 88%,
        rgba(0,0,0,.82) 100%
      );
  }

  .service-section .list {
    top: 160px;
    left: 20px;
    width: min(68vw, 760px);
    max-width: calc(100vw - 300px);
    gap: 12px;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr);
  }

  .service-section .list .item {
    border-radius: 14px;
    padding: 16px;
  }

  .service-section .list .item:nth-child(1) {
    min-height: 150px;
  }

  .service-section .list .item:nth-child(3) {
    min-height: 120px;
  }

  .service-section .list .item--long {
    min-height: 290px;
    padding: 20px 18px;
  }

  .service-section .list .item__icon{
    width: clamp(52px, 5vw, 70px);
    margin-bottom: 10px;
  }

  .service-section .list .item--long .item__icon{
    width: clamp(56px, 5.4vw, 78px);
    margin-bottom: 12px;
  }

  .service-section .list .item__title {
    font-size: 14px;
    margin-bottom: 6px;
  }

  .service-section .list .item__text {
    font-size: 13px;
    line-height: 1.4;
    max-width: 96%;
  }

  .list-button {
    min-height: 58px;
    padding: 6px 8px 6px 14px;
  }

  .list-button__text {
    font-size: 14px;
  }

  .list-button__icon {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    font-size: 22px;
  }
}

/* MOBILE / portrait */
@media screen and (max-aspect-ratio: 2/3) {
  .service-section {
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 6px 12px 0;
  }

  .top-titles {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    gap: 10px;
    overflow: hidden;
    z-index: 8;
    transform: none;
    margin: 0 0 4px;
    padding-left: 2px;
  }

  .top-titles span {
    font-size: clamp(44px, 16vw, 78px);
    line-height: .86;
    color: rgba(255,255,255,.07);
  }

  .service-section__doll {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    right: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;

    margin-top: 0;
    margin-bottom: -2px;

    animation: dollFloatWrapMobile 7.5s ease-in-out infinite;
  }

  .service-section__doll-bg {
    background-size: contain;
    background-position: center bottom;
    transform-origin: center bottom;
    transform: translateZ(0);
    animation:
      dollFloatInnerMobile 7.5s ease-in-out infinite,
      dollGlowPulse 4.8s ease-in-out infinite;
  }

  .service-section__doll::before {
    inset: 8% 5% 10% 8%;
    filter: blur(22px);
    opacity: .95;
  }

  .service-section__doll::after {
    background:
      linear-gradient(180deg,
        rgba(0,0,0,.00) 58%,
        rgba(0,0,0,.46) 86%,
        rgba(0,0,0,.82) 100%
      ),
      linear-gradient(90deg,
        rgba(0,0,0,.08) 0%,
        rgba(0,0,0,.00) 16%,
        rgba(0,0,0,.00) 84%,
        rgba(0,0,0,.08) 100%
      );
  }

  .service-section .list {
    position: static;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 10;
    margin-top: 0;
  }

  .service-section .list::after {
    left: 8%;
    top: 16%;
    width: 80vw;
    height: 80vw;
    opacity: .25;
    filter: blur(24vw);
  }

  .service-section .list .item {
    min-height: auto !important;
    width: auto;
    border-radius: 14px;
    padding: 14px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  .service-section .list .item--long {
    min-height: auto;
    display: block;
    padding: 14px;
  }

  .service-section .list .item__icon{
    width: 62px;
    margin-bottom: 10px;
  }

  .service-section .list .item--long .item__icon{
    width: 66px;
    margin-bottom: 12px;
  }

  .service-section .list .item__title {
    font-size: 14px;
    margin-bottom: 6px;
  }

  .service-section .list .item__text {
    font-size: 14px;
    line-height: 1.45;
    max-width: 100%;
  }

  .list-button {
    width: 100%;
    min-height: 58px;
    padding: 6px 8px 6px 14px;
    margin-top: 0;
  }

  .list-button__text {
    font-size: 14px;
    line-height: 1.08;
  }

  .list-button__icon {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    font-size: 22px;
  }
}


/* PRELOADER: SOLAR SYSTEM + % */
.preloader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  background:
    radial-gradient(900px 650px at 50% 34%, rgba(45,124,255,.18) 0%, rgba(2,4,10,.95) 52%, rgba(1,2,8,1) 100%),
    radial-gradient(580px 420px at 50% 38%, rgba(255,185,58,.12) 0%, rgba(255,185,58,0) 68%),
    #030814;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.preloader--hide{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition: opacity .45s ease, visibility .45s ease;
}

.preloader .loader-wrap{
  --ldr:#49b7ff;
  --ldr2:#0b71ff;
  --warm:#ffb347;
  --warm2:#ff7a18;
  width:min(620px, 94vw);
  min-height:430px;
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  filter: drop-shadow(0 18px 44px rgba(1,107,236,.18));
}

.preloader .solar-loader__scene{
  position:relative;
  width:min(420px, 86vw);
  aspect-ratio:1 / 1;
  display:grid;
  place-items:center;
  margin-inline:auto;
}

.preloader .solar-loader__scene::before{
  content:"";
  position:absolute;
  inset:8%;
  border-radius:50%;
  background: radial-gradient(circle, rgba(50,114,255,.08) 0%, rgba(50,114,255,0) 72%);
  filter: blur(10px);
}

.preloader .solar-loader__sun{
  position:relative;
  z-index:5;
  width:74px;
  height:74px;
  border-radius:50%;
  background: radial-gradient(circle at 32% 30%, #fff6c9 0%, #ffe48e 18%, #ffc444 38%, #ff9f1c 62%, #ff6b18 100%);
  box-shadow:
    0 0 24px rgba(255,196,68,.9),
    0 0 56px rgba(255,145,34,.42),
    0 0 110px rgba(255,145,34,.18),
    inset -10px -12px 18px rgba(171,69,0,.34),
    inset 8px 8px 14px rgba(255,255,255,.32);
  animation: solarSunPulse 3.6s ease-in-out infinite;
}

.preloader .solar-loader__sun::before,
.preloader .solar-loader__sun::after{
  content:"";
  position:absolute;
  inset:-14px;
  border-radius:50%;
  border:1px solid rgba(255,196,68,.18);
}

.preloader .solar-loader__sun::after{
  inset:-26px;
  border-color: rgba(255,145,34,.10);
}

.preloader .solar-loader__orbit{
  position:absolute;
  top:50%;
  left:50%;
  border-radius:50%;
  border:1px solid rgba(120,170,255,.12);
  transform: translate(-50%, -50%);
  animation: solarSpin linear infinite;
}

.preloader .orbit-1{ width:108px; height:108px; animation-duration: 4.5s; }
.preloader .orbit-2{ width:144px; height:144px; animation-duration: 7s; }
.preloader .orbit-3{ width:182px; height:182px; animation-duration: 9.5s; }
.preloader .orbit-4{ width:220px; height:220px; animation-duration: 12s; }
.preloader .orbit-5{ width:264px; height:264px; animation-duration: 18s; }
.preloader .orbit-6{ width:308px; height:308px; animation-duration: 22s; }
.preloader .orbit-7{ width:346px; height:346px; animation-duration: 27s; }
.preloader .orbit-8{ width:382px; height:382px; animation-duration: 31s; }
.preloader .orbit-9{ width:410px; height:410px; animation-duration: 36s; }

.preloader .solar-loader__planet{
  position:absolute;
  top:50%;
  left:100%;
  border-radius:50%;
  transform: translate(-50%, -50%);
  box-shadow: inset -3px -4px 6px rgba(0,0,0,.3), inset 2px 2px 4px rgba(255,255,255,.2);
}

.preloader .mercury{ width:7px; height:7px; background: radial-gradient(circle at 30% 30%, #d8d6d1 0%, #a7a39b 52%, #635c58 100%); }
.preloader .venus{ width:10px; height:10px; background: radial-gradient(circle at 32% 30%, #ffe1a6 0%, #efb25c 45%, #9c5d1a 100%); }
.preloader .earth{ width:11px; height:11px; background: radial-gradient(circle at 32% 28%, #9fe6ff 0%, #44a8ff 35%, #1d63d7 65%, #0d2d69 100%); }
.preloader .earth i{ position:absolute; inset:0; display:block; }
.preloader .earth i::before,
.preloader .earth i::after{
  content:"";
  position:absolute;
  background:#5be082;
  border-radius:50%;
}
.preloader .earth i::before{ width:4px; height:2px; left:2px; top:3px; transform: rotate(-12deg); }
.preloader .earth i::after{ width:3px; height:2px; right:2px; bottom:3px; transform: rotate(16deg); }
.preloader .mars{ width:9px; height:9px; background: radial-gradient(circle at 30% 30%, #ff9c74 0%, #db5c2f 48%, #7a2714 100%); }
.preloader .jupiter{ width:20px; height:20px; background: linear-gradient(180deg, #d6b58a 0%, #f2e0c0 18%, #c89d68 36%, #f0e4d2 54%, #ae7e52 70%, #6f4a31 100%); }
.preloader .saturn{ width:18px; height:18px; background: radial-gradient(circle at 35% 30%, #efe1bf 0%, #cba56b 48%, #8c6239 100%); }
.preloader .saturn b{
  position:absolute;
  inset:-6px;
  display:block;
  border-radius:50%;
  border:2px solid rgba(228,204,160,.85);
  transform: rotate(-24deg) scaleX(1.55) scaleY(.48);
  box-shadow: 0 0 10px rgba(255,214,163,.18);
}
.preloader .uranus{ width:14px; height:14px; background: radial-gradient(circle at 32% 28%, #d7fdff 0%, #76e9ff 42%, #2c9dd8 100%); }
.preloader .neptune{ width:14px; height:14px; background: radial-gradient(circle at 32% 28%, #7db9ff 0%, #325cff 44%, #111f73 100%); }
.preloader .pluto{ width:6px; height:6px; background: radial-gradient(circle at 30% 30%, #e5d7da 0%, #9d8890 58%, #5c4b55 100%); }

.preloader .solar-loader__star{
  position:absolute;
  border-radius:50%;
  background: rgba(255,255,255,.9);
  box-shadow: 0 0 8px rgba(135,196,255,.25);
  animation: solarTwinkle 2.8s ease-in-out infinite;
}
.preloader .star-1{ width:3px; height:3px; top:16%; left:18%; animation-delay:-.2s; }
.preloader .star-2{ width:4px; height:4px; top:22%; right:18%; animation-delay:-1s; }
.preloader .star-3{ width:3px; height:3px; bottom:19%; left:14%; animation-delay:-1.6s; }
.preloader .star-4{ width:2px; height:2px; bottom:16%; right:22%; animation-delay:-.8s; }
.preloader .star-5{ width:4px; height:4px; top:50%; left:8%; animation-delay:-2s; }

.preloader .bar{
  height:6px;
  width:min(340px, 76vw);
  margin:24px 0 16px;
  position:relative;
  border-radius:999px;
  background: rgba(255,255,255,.10);
  overflow:hidden;
}

.preloader .bar__fill{
  height:100%;
  width:0%;
  border-radius:inherit;
  background: linear-gradient(90deg, var(--ldr2), var(--ldr));
  box-shadow: 0 0 22px rgba(30,167,255,.35);
  transition: width .12s linear;
}

.preloader .text{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:10px;
  color: #ffc76a;
  font-size:18px;
  font-weight:700;
  text-align:center;
  letter-spacing:3px;
  text-transform:uppercase;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  text-shadow: 0 0 18px rgba(255,164,43,.12);
}

.preloader .text .pct{
  color: rgba(255,255,255,.96);
  letter-spacing:1px;
  font-weight:800;
}

.preloader .hint{
  margin-top:10px;
  text-align:center;
  font: 600 12px/12px Inter, system-ui, sans-serif;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255,255,255,.34);
}

@keyframes solarSpin{ to{ transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes solarSunPulse{
  0%,100%{ transform: scale(1); filter: brightness(1); }
  50%{ transform: scale(1.06); filter: brightness(1.08); }
}
@keyframes solarTwinkle{
  0%,100%{ opacity:.28; transform: scale(.8); }
  50%{ opacity:1; transform: scale(1.35); }
}

@media (max-width: 768px){
  .preloader .loader-wrap{
    width:min(420px, 94vw);
    min-height:360px;
  }

  .preloader .solar-loader__scene{
    width:min(330px, 86vw);
  }

  .preloader .solar-loader__sun{
    width:58px;
    height:58px;
  }

  .preloader .orbit-1{ width:86px; height:86px; }
  .preloader .orbit-2{ width:112px; height:112px; }
  .preloader .orbit-3{ width:140px; height:140px; }
  .preloader .orbit-4{ width:170px; height:170px; }
  .preloader .orbit-5{ width:204px; height:204px; }
  .preloader .orbit-6{ width:238px; height:238px; }
  .preloader .orbit-7{ width:268px; height:268px; }
  .preloader .orbit-8{ width:294px; height:294px; }
  .preloader .orbit-9{ width:316px; height:316px; }

  .preloader .bar{ width:min(280px, 76vw); margin:20px 0 14px; }
  .preloader .text{ font-size:15px; letter-spacing:2px; }
  .preloader .hint{ font-size:11px; letter-spacing:.16em; }
}


/* =========================================================
   ABOUT DETAILS
   ========================================================= */

.about-details {
  position: relative;
  z-index: 10;
  padding: 12px clamp(16px, 6.9vw, 132px) 96px;
}

.about-details__container {
  width: min(100%, 1120px);
  margin: 0 auto;
}

.about-details__intro {
  margin: 0;
  max-width: 920px;
  font-size: clamp(15px, 1.05vw, 19px);
  line-height: 1.8;
  color: rgba(233, 238, 252, 0.94);
  text-wrap: pretty;
}

.about-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-top: 34px;
}

.about-block {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 26px 26px 24px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(3, 10, 24, 0.48), rgba(2, 8, 20, 0.7));
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow:
    0 18px 44px rgba(0, 0, 0, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.about-block::before {
  content: "";
  position: absolute;
  inset: -1px;
  pointer-events: none;
  background:
    radial-gradient(320px 180px at 12% 18%, rgba(1, 107, 236, 0.14), transparent 68%),
    radial-gradient(360px 220px at 88% 84%, rgba(53, 183, 255, 0.08), transparent 72%);
  opacity: 0.85;
}

.about-block--wide {
  margin-top: 24px;
}

.about-block h3,
.about-cta h3 {
  position: relative;
  z-index: 1;
  margin: 0 0 18px;
  padding-left: 16px;
  border-left: 3px solid var(--accent);
  font-family: var(--font-head, "Unbounded", sans-serif);
  font-size: clamp(16px, 1.05vw, 20px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #4fc0ff;
}

.about-block p,
.about-cta p {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: clamp(14px, 0.95vw, 17px);
  line-height: 1.75;
  color: rgba(236, 242, 238, 0.95);
}

.about-list {
  position: relative;
  z-index: 1;
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}

.about-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: clamp(14px, 0.94vw, 17px);
  line-height: 1.7;
  color: rgba(236, 242, 238, 0.95);
}

.about-list li::before {
  content: "⚡";
  flex: 0 0 18px;
  width: 18px;
  color: #4fc0ff;
  font-size: 15px;
  line-height: 1.35;
  text-align: center;
  text-shadow: 0 0 14px rgba(53, 183, 255, 0.3);
}

.about-list b,
.about-list strong {
  color: #ffffff;
  font-weight: 800;
}

.about-cta {
  margin-top: 28px;
  padding: 30px 28px;
  text-align: center;
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(0, 212, 255, 0.08), rgba(1, 107, 236, 0.06)),
    rgba(4, 10, 20, 0.7);
  border: 1px solid rgba(0, 212, 255, 0.18);
  box-shadow:
    0 18px 44px rgba(0, 0, 0, 0.34),
    inset 0 0 40px rgba(53, 183, 255, 0.03);
}

.about-cta h3 {
  display: inline-block;
  border-left: none;
  padding-left: 0;
  margin-bottom: 10px;
}

.contact-link {
  color: #5dc7ff;
  text-decoration: none;
  font-weight: 800;
  border-bottom: 1px dashed rgba(93, 199, 255, 0.8);
  transition: color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease;
}

.contact-link:hover {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.95);
}

@media (max-width: 1100px) {
  .about-details {
    padding-top: 0;
  }
}

@media (max-width: 900px) {
  .about-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .about-details {
    padding: 6px 16px 70px;
  }

  .about-block {
    padding: 22px 18px 20px;
    border-radius: 20px;
  }

  .about-cta {
    padding: 24px 18px;
    border-radius: 20px;
  }

  .about-details__intro {
    font-size: 15px;
    line-height: 1.7;
  }
}


.about-why-split {
  display: grid;
  grid-template-columns: minmax(320px, 480px) minmax(460px, 1fr);
  align-items: center;
  gap: clamp(28px, 4vw, 64px);
  margin-top: 40px;
}

.about-why-visual {
  position: relative;
  min-height: clamp(420px, 46vw, 620px);
  max-width: 520px;
  width: 100%;
  margin: 0 auto;
  border-radius: 28px;
  overflow: hidden;
  isolation: isolate;
}

.about-why-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  z-index: 0;
}

.about-why-visual__aura {
  position: absolute;
  inset: 10% 8% 8% 8%;
  animation: aboutWhyAura 5.5s ease-in-out infinite;
  z-index: 0;
}

.about-why-visual__image {
  position: absolute;
  inset: 0;
  background-image: url("../img/about_2.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
  transform-origin: center bottom;
  animation: aboutWhyFloat 8.5s ease-in-out infinite, dollGlowPulse 4.8s ease-in-out infinite;
  filter: saturate(1.04) contrast(1.03);
  z-index: 2;
}

.about-why-visual__image::after {
  content: "";
  position: absolute;
  inset: 0;
 // background: linear-gradient(90deg, rgba(0,0,0,.36), rgba(0,0,0,0) 34%, rgba(0,0,0,.18) 100%);
}

.about-why-visual__orb {
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  z-index: 1;
  filter: blur(2px);
}

.about-block--why-text {
  min-height: auto;
  padding: 30px 32px 28px;
}

.about-block--why-text .about-list--why {
  gap: 18px;
}

.about-block--why-text .about-list--why li {
  margin-bottom: 0;
}

@keyframes aboutWhyFloat {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(-4px, -10px, 0) scale(1.02); }
}

@keyframes aboutWhyAura {
  0%, 100% { opacity: .85; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}

@keyframes aboutWhyOrb1 {
  0%, 100% { transform: translate3d(0,0,0); opacity: .75; }
  50% { transform: translate3d(8px,-12px,0); opacity: 1; }
}

@keyframes aboutWhyOrb2 {
  0%, 100% { transform: translate3d(0,0,0); opacity: .68; }
  50% { transform: translate3d(-10px,10px,0); opacity: 1; }
}

@media (max-width: 980px) {
  .about-why-split {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .about-why-visual {
    min-height: 360px;
    max-width: 520px;
    width: 100%;
    margin: 0 auto;
  }

  .about-block--why-text {
    width: 100%;
  }
}

@media (max-width: 640px) {
  .about-why-visual {
    min-height: 300px;
    border-radius: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .about-why-visual__aura,
  .about-why-visual__image,
  .about-why-visual__orb {
    animation: none !important;
  }
}


/* =========================================================
   VACANCIES
   ========================================================= */

.vacancies-section {
  position: relative;
  padding: 0 clamp(16px, 2vw, 22px) 90px;
  background:
    radial-gradient(820px 520px at 20% 15%, rgba(var(--accent-rgb), .08), transparent 60%),
    radial-gradient(900px 560px at 86% 28%, rgba(var(--accent2-rgb), .08), transparent 62%),
    rgba(0, 0, 0, .82);
}

.vacancies-shell {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding-top: clamp(112px, 11vw, 188px);
}

.top-titles--vacancies {
  position: absolute;
  top: 0;
  left: 0;
}

.top-titles--vacancies .green {
  color: #39b8ff;
  text-shadow:
    0 0 18px rgba(57, 184, 255, .25),
    0 0 54px rgba(1, 107, 236, .14);
}

.vacancies-box {
  position: relative;
  z-index: 2;
  padding: clamp(22px, 2.4vw, 34px);
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(5, 14, 34, .72), rgba(3, 10, 24, .88)),
    radial-gradient(circle at 18% 16%, rgba(73, 193, 255, .08), transparent 28%),
    radial-gradient(circle at 82% 86%, rgba(1, 107, 236, .10), transparent 34%);
  border: 1px solid rgba(115, 213, 255, .16);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, .34),
    inset 0 0 0 1px rgba(255, 255, 255, .03),
    inset 0 0 42px rgba(53, 183, 255, .04);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.vacancies-intro {
  margin: 0 0 26px;
  max-width: 860px;
  font-size: clamp(14px, 1vw, 17px);
  line-height: 1.75;
  color: rgba(233, 238, 252, .86);
}

.vacancies-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
}

.vacancy-card {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(5, 16, 42, .56), rgba(3, 10, 24, .82)),
    radial-gradient(circle at 14% 16%, rgba(73, 193, 255, .08), transparent 28%);
  border: 1px solid rgba(115, 213, 255, .18);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.02),
    0 18px 44px rgba(0,0,0,.24);
}

.vacancy-card::before {
  content: "";
  position: absolute;
  inset: -1px;
  pointer-events: none;
  background:
    radial-gradient(320px 180px at 10% 12%, rgba(73,193,255,.09), transparent 72%),
    radial-gradient(360px 220px at 90% 88%, rgba(1,107,236,.08), transparent 72%);
  opacity: .9;
}

.vacancy-card[open] {
  border-color: rgba(115, 213, 255, .34);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.03),
    0 18px 44px rgba(0,0,0,.24),
    0 0 24px rgba(53,183,255,.08);
}

.vacancy-card__summary {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  list-style: none;
  cursor: pointer;
  padding: 22px 24px;
}

.vacancy-card__summary::-webkit-details-marker {
  display: none;
}

.vacancy-card__summary::after {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(115, 213, 255, .44), rgba(115, 213, 255, .10));
}

.vacancy-card__title {
  display: block;
  font-family: var(--font-head, "Unbounded", sans-serif);
  font-size: clamp(15px, 1vw, 19px);
  font-weight: 700;
  line-height: 1.35;
  color: #eef7ff;
}

.vacancy-card__icon {
  position: relative;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(115, 213, 255, .18);
  background: linear-gradient(180deg, rgba(10, 26, 56, .9), rgba(4, 12, 30, .9));
  box-shadow: inset 0 0 18px rgba(53,183,255,.05);
}

.vacancy-card__icon::before,
.vacancy-card__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: #39b8ff;
  border-radius: 999px;
  transform: translate(-50%, -50%);
  transition: transform .25s ease, opacity .25s ease;
  box-shadow: 0 0 12px rgba(57, 184, 255, .4);
}

.vacancy-card__icon::before {
  width: 14px;
  height: 2px;
}

.vacancy-card__icon::after {
  width: 2px;
  height: 14px;
}

.vacancy-card[open] .vacancy-card__icon::after {
  transform: translate(-50%, -50%) scaleY(0);
  opacity: 0;
}

.vacancy-card__body {
  position: relative;
  z-index: 1;
  padding: 22px 24px 24px;
}

.vacancy-card__body p {
  margin: 0 0 18px;
  font-size: 14px;
  line-height: 1.75;
  color: rgba(233, 238, 252, .9);
}

.vacancy-card__group + .vacancy-card__group {
  margin-top: 18px;
}

.vacancy-card__group h3 {
  margin: 0 0 10px;
  padding-left: 14px;
  border-left: 3px solid #39b8ff;
  font-family: var(--font-head, "Unbounded", sans-serif);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #74d1ff;
}

.vacancy-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.vacancy-card__list li {
  position: relative;
  padding-left: 18px;
  font-size: 14px;
  line-height: 1.7;
  color: rgba(233, 238, 252, .92);
}

.vacancy-card__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(180deg, #65d9ff, #016bec);
  box-shadow: 0 0 12px rgba(73, 193, 255, .45);
}

.vacancy-card__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 196px;
  margin-top: 22px;
  padding: 13px 24px;
  border-radius: 14px;
  text-decoration: none;
  font-family: var(--font-head, "Unbounded", sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #eef7ff;
  background: linear-gradient(180deg, rgba(57,184,255,.20), rgba(1,107,236,.26));
  border: 1px solid rgba(115, 213, 255, .32);
  box-shadow:
    inset 0 0 20px rgba(53,183,255,.06),
    0 10px 24px rgba(0,0,0,.24),
    0 0 18px rgba(53,183,255,.10);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, color .2s ease;
}

.vacancy-card__button:hover {
  transform: translateY(-2px);
  color: #ffffff;
  border-color: rgba(165, 230, 255, .5);
  box-shadow:
    inset 0 0 20px rgba(53,183,255,.08),
    0 12px 28px rgba(0,0,0,.28),
    0 0 24px rgba(53,183,255,.16);
}

@media (max-width: 980px) {
  .vacancies-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .vacancies-section {
    padding-bottom: 72px;
  }

  .vacancies-shell {
    padding-top: 92px;
  }

  .vacancies-box {
    padding: 18px;
    border-radius: 22px;
  }

  .top-titles--vacancies {
    left: 0;
  }

  .top-titles--vacancies span {
    font-size: clamp(44px, 11vw, 72px);
  }

  .vacancy-card__summary,
  .vacancy-card__body {
    padding-left: 18px;
    padding-right: 18px;
  }

  .vacancy-card__summary::after {
    left: 18px;
    right: 18px;
  }

  .vacancy-card__button {
    width: 100%;
    min-width: 0;
  }
}

/* =========================================================
   CONTACTS
   ========================================================= */

.contacts-section {
  position: relative;
  overflow: hidden;
  /*padding: 0 clamp(16px, 2vw, 22px) clamp(126px, 13vw, 168px);*/
  padding: 80px;
  background:
    radial-gradient(760px 440px at 18% 24%, rgba(var(--accent-rgb), .14), transparent 64%),
    radial-gradient(860px 520px at 88% 22%, rgba(var(--accent2-rgb), .11), transparent 62%),
    linear-gradient(180deg, rgba(2, 5, 14, .98) 0%, rgba(3, 10, 28, .98) 42%, rgba(4, 34, 88, .95) 100%);
}

.contacts-shell {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding-top: clamp(112px, 11vw, 188px);
}

.top-titles--contacts {
  position: absolute;
  top: 0;
  left: 0;
}

.top-titles--contacts .green {
  color: #39b8ff;
  text-shadow:
    0 0 18px rgba(57, 184, 255, .25),
    0 0 54px rgba(1, 107, 236, .14);
}

.contacts-layout {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 620px) minmax(320px, 1fr);
  align-items: center;
  gap: clamp(12px, 3vw, 52px);
}

.contacts-visual {
  position: relative;
  min-height: clamp(430px, 49vw, 720px);
}

.contacts-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("../img/contact2.png") left bottom / contain no-repeat;
  filter: drop-shadow(0 0 30px rgba(53, 183, 255, .10));
}

.contacts-actions {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  min-height: 100%;
  padding-left: 0;
  transform: translate(-128px, 26px);
}

.contacts-telegram {
  --tg-blue: #39b8ff;
  --tg-blue-deep: #0d6fff;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-width: min(100%, 432px);
  padding: 22px 40px;
  clip-path: polygon(18px 0%, 100% 0%, calc(100% - 18px) 100%, 0% 100%);
  text-decoration: none;
  background: transparent;
  border: 2px solid rgba(57, 184, 255, .96);
  color: var(--tg-blue);
  font-family: 'Orbitron', var(--font-head, "Unbounded", sans-serif);
  font-size: clamp(18px, 1.45vw, 24px);
  font-weight: 900;
  letter-spacing: .20em;
  text-transform: uppercase;
  box-shadow:
    0 0 8px rgba(57, 184, 255, .28),
    inset 0 0 10px rgba(57, 184, 255, .05);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition:
    background .3s ease,
    box-shadow .3s ease,
    transform .2s ease,
    letter-spacing .3s ease,
    color .3s ease,
    border-color .3s ease;
  animation: telegramFlicker 5s infinite;
}

.contacts-telegram::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(90deg, rgba(57, 184, 255, .20), rgba(13, 111, 255, .34));
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .34s ease;
  pointer-events: none;
}

.contacts-telegram::after {
  content: "";
  position: absolute;
  top: -12%;
  bottom: -12%;
  left: -40%;
  width: 26%;
  z-index: 0;
  opacity: 0;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.34), rgba(255,255,255,0));
  transform: skewX(-18deg) translateX(0);
  transition: transform .44s ease, opacity .28s ease;
  pointer-events: none;
}

.contacts-telegram:hover {
  background: rgba(57, 184, 255, .08);
  color: #ffffff;
  letter-spacing: .28em;
  border-color: rgba(57, 184, 255, 1);
  box-shadow:
    0 0 20px rgba(57, 184, 255, .72),
    0 0 50px rgba(13, 111, 255, .38),
    0 0 100px rgba(53, 183, 255, .16),
    inset 0 0 20px rgba(57, 184, 255, .12);
  transform: translateY(-2px);
}

.contacts-telegram:hover::before {
  transform: scaleX(1);
}

.contacts-telegram:hover::after {
  opacity: 1;
  transform: skewX(-18deg) translateX(560%);
}

.contacts-telegram:active {
  transform: translateY(1px) scale(.985);
}

.contacts-telegram:hover .contacts-telegram__icon {
  transform: translateY(-1px) scale(1.05);
  border-color: rgba(255,255,255,.38);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.08),
    0 0 18px rgba(57, 184, 255, .30),
    inset 0 0 14px rgba(255,255,255,.08);
}

.contacts-telegram:hover .contacts-telegram__icon svg {
  transform: translateX(2px);
}

.contacts-telegram:hover .contacts-telegram__text {
  text-shadow:
    0 0 8px #39b8ff,
    0 0 20px #39b8ff,
    0 0 40px #39b8ff;
}

.contacts-telegram__icon,
.contacts-telegram__text {
  position: relative;
  z-index: 1;
}

.contacts-telegram__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 62px;
  height: 62px;
  border: 1.5px solid rgba(57, 184, 255, .42);
  background: rgba(1, 12, 34, .30);
  clip-path: polygon(12px 0%, 100% 0%, calc(100% - 12px) 100%, 0% 100%);
  box-shadow:
    inset 0 0 12px rgba(57,184,255,.05),
    0 0 14px rgba(57,184,255,.10);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease, background .28s ease;
  animation: telegramIconFloat 4.6s ease-in-out infinite;
}

.contacts-telegram__icon svg {
  width: 30px;
  height: 30px;
  transition: transform .28s ease;
}

.contacts-telegram__text {
  text-shadow: 0 0 8px rgba(57, 184, 255, .18);
}

.contacts-marquee {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  overflow: hidden;
  pointer-events: none;
  border-top: 1px solid rgba(115, 213, 255, .10);
  background: linear-gradient(180deg, rgba(6, 16, 36, .16), rgba(6, 20, 56, .34));
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.contacts-marquee__track {
  display: flex;
  align-items: center;
  gap: clamp(44px, 5vw, 92px);
  width: max-content;
  padding: 18px 0;
  will-change: transform;
  animation: contactsMarquee 38s linear infinite;
}

.contacts-marquee__track span {
  font-family: var(--font-head, "Unbounded", sans-serif);
  font-weight: 800;
  font-size: clamp(28px, 4.1vw, 62px);
  line-height: .9;
  text-transform: uppercase;
  white-space: nowrap;
  color: rgba(255,255,255,.12);
  text-shadow: 0 0 22px rgba(53,183,255,.08);
}

@keyframes telegramFlicker {
  0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% { opacity: 1; }
  20%, 24%, 55% { opacity: .72; }
}

@keyframes telegramIconFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}

@keyframes contactsMarquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-33.333%); }
}

@media (max-width: 980px) {
  .contacts-layout {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .contacts-actions {
    justify-content: flex-start;
    transform: none;
  }
}

@media (max-width: 768px) {
  .contacts-section {
    padding-bottom: 108px;
  }

  .contacts-shell {
    padding-top: 92px;
  }

  .top-titles--contacts {
    left: 0;
  }

  .top-titles--contacts span {
    font-size: clamp(44px, 11vw, 72px);
  }

  .contacts-layout {
    gap: 18px;
  }

  .contacts-visual {
    min-height: clamp(360px, 96vw, 560px);
  }

  .contacts-visual::before {
    background-image: url("../img/contact_mobi.png");
    background-position: center top;
    background-size: contain;
  }

  .contacts-actions {
    justify-content: stretch;
  }

  .contacts-telegram {
    width: 100%;
    min-width: 0;
    padding: 18px 22px;
    font-size: clamp(16px, 5vw, 22px);
    letter-spacing: .14em;
    clip-path: polygon(14px 0%, 100% 0%, calc(100% - 14px) 100%, 0% 100%);
  }

  .contacts-telegram__icon {
    width: 54px;
    height: 54px;
    clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
  }

  .contacts-marquee__track {
    gap: 28px;
    padding: 16px 0;
    animation-duration: 42s;
  }

  .contacts-marquee__track span {
    font-size: clamp(22px, 8vw, 42px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .contacts-telegram,
  .contacts-telegram__icon,
  .contacts-marquee__track {
    animation: none !important;
  }

  .contacts-telegram::after {
    transition: none !important;
  }
}
